/* ===== STYLES RESPONSIVES POUR TOUS LES BOUTONS ===== */

/* Styles de base pour tous les boutons */
.btn {
    transition: all 0.3s ease;
    font-weight: 600;
}

/* Améliorations pour tablettes et petits écrans */
@media (max-width: 768px) {
    .btn {
        padding: 0.75rem 1rem !important;
        font-size: 1rem !important;
        min-height: 50px;
        line-height: 1.4;
    }
    
    /* Boutons avec icônes */
    .btn .fas,
    .btn .far,
    .btn .fab {
        font-size: 1.1rem !important;
        margin-right: 0.5rem !important;
    }
    
    /* Boutons de formulaires et actions principales */
    .btn-primary,
    .btn-success,
    .btn-danger,
    .btn-warning,
    .btn-info {
        font-size: 1.05rem !important;
        padding: 0.8rem 1.1rem !important;
        min-height: 52px;
    }
    
    /* Boutons larges (full width) */
    .btn.w-100 {
        padding: 0.85rem 1.2rem !important;
        font-size: 1.1rem !important;
        min-height: 55px;
    }
}

/* Pour les très petits écrans (smartphones en portrait) */
@media (max-width: 576px) {
    .btn {
        padding: 0.8rem 1rem !important;
        font-size: 1.05rem !important;
        min-height: 52px;
    }
    
    .btn-primary,
    .btn-success,
    .btn-danger,
    .btn-warning,
    .btn-info {
        font-size: 1.1rem !important;
        padding: 0.9rem 1.2rem !important;
        min-height: 55px;
    }
    
    .btn.w-100 {
        padding: 1rem 1.3rem !important;
        font-size: 1.15rem !important;
        min-height: 58px;
    }
    
    .btn .fas,
    .btn .far,
    .btn .fab {
        font-size: 1.2rem !important;
        margin-right: 0.6rem !important;
    }
}

/* Pour les écrans extrêmement petits */
@media (max-width: 400px) {
    .btn {
        padding: 0.85rem 1rem !important;
        font-size: 1rem !important;
        min-height: 50px;
    }
    
    .btn.w-100 {
        padding: 0.9rem 1rem !important;
        font-size: 1.05rem !important;
        min-height: 52px;
    }
}

/* ===== STYLES POUR LES SELECTS MOBILES ===== */
.mobile-select {
    max-width: 100%;
    word-wrap: break-word;
}

@media (max-width: 768px) {
    .form-select, 
    .form-control {
        font-size: 16px !important;
        max-width: 100%;
    }
    
    select.form-control {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
        background-repeat: no-repeat;
        background-position: right 0.75rem center;
        background-size: 16px 12px;
        padding-right: 2.5rem;
    }
}

/* ===== AMÉLIORATIONS TACTILES ===== */
@media (max-width: 768px) {
    .btn {
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
    }
    
    /* Effet de pression pour le tactile */
    .btn:active {
        transform: scale(0.98);
        transition: transform 0.1s ease;
    }
}

/* ===== CORRECTIONS SPÉCIFIQUES ===== */

/* S'assurer que la hauteur minimale ne casse pas l'affichage */
.btn-group .btn {
    min-height: auto !important;
}

/* Boutons dans les tables */
.table .btn {
    min-height: auto !important;
    padding: 0.375rem 0.75rem !important;
    font-size: 0.875rem !important;
}

/* Boutons de pagination */
.pagination .page-link {
    min-height: auto !important;
    padding: 0.5rem 0.75rem !important;
}

/* ===== COMPATIBILITÉ AVEC BOOTSTRAP SELECTPICKER ===== */
@media (max-width: 768px) {
    .bootstrap-select .btn {
        font-size: 16px !important;
        min-height: 50px;
        padding: 0.75rem 2.5rem 0.75rem 1rem !important;
    }
    
    .bootstrap-select .dropdown-toggle::after {
        margin-top: 0.5rem;
    }
}