/* =======================================
   STYLES GÉNÉRAUX ET UTILITAIRES
   ======================================= */

.rounded-4 {
    border-radius: 1rem !important;
}

.rounded-top-4 {
    border-top-left-radius: 1rem !important;
    border-top-right-radius: 1rem !important;
}

.rounded-bottom-4 {
    border-bottom-left-radius: 1rem !important;
    border-bottom-right-radius: 1rem !important;
}

.hover-card {
    transition: all 0.3s ease;
}

.hover-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.15) !important;
}

.lh-lg {
    line-height: 1.8;
}

.bg-gradient {
    background: linear-gradient(135deg, var(--bs-primary) 0%, #0056b3 100%);
}

/* =======================================
   BOUTONS DE RÉSEAUX SOCIAUX (UNIFORMISÉS)
   ======================================= */

/* 🇫🇷 Règle UNIFORME : TOUS LES BOUTONS SOCIAUX AURONT 45x45px */
.btn-icon-small {
    width: 45px;
    height: 45px;
    padding: 0;
    /* CORRECTION DU BOUTON OVALE : force le ratio 1:1 */
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
}
.btn-icon-small i { /* Définit la taille de l'icône (remplace fs-4) */
    font-size: 1rem;
}

.btn.rounded-circle:hover {
    transform: scale(1.1);
    transition: transform 0.2s ease;
}

/* 🇫🇷 Facebook : Couleur de fond et de survol (Logique Captmom) */
.btn-facebook-custom {
    background-color: #3b5998 !important; /* Force la couleur de fond */
    color: white;
}
.btn-facebook-custom i {
    color: white !important; /* Force la couleur blanche de l'icône */
}
.btn-facebook-custom:hover,
.btn-facebook-custom:hover i { /* Logique Captmom pour le survol du fond ET de l'icône */
    background-color: #1565c0 !important;
    color: white !important;
}

/* 🇫🇷 WhatsApp : Couleur de fond et de survol (Logique Captmom) */
.btn-whatsapp-custom {
    background-color: #25d366 !important; /* Force la couleur de fond */
    color: white;
}
.btn-whatsapp-custom i {
    color: white !important; /* Force la couleur blanche de l'icône */
}
.btn-whatsapp-custom:hover,
.btn-whatsapp-custom:hover i { /* Logique Captmom pour le survol du fond ET de l'icône */
    background-color: #128C7E !important;
    color: white !important;
}


/* =======================================
   COMPOSANTS ET MISE EN PAGE
   ======================================= */

.card-header {
    border-bottom: none !important;
}

.border-end {
    border-right: 1px solid #dee2e6 !important;
}

@media (max-width: 768px) {
    .border-end {
        border-right: none !important;
        border-bottom: 1px solid #dee2e6 !important;
        padding-bottom: 10px;
        margin-bottom: 10px;
    }
}

.min-vh-75 {
    min-height: 75vh;
}

.input-group .form-control:focus {
    box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25);
    border-color: #86b7fe;
}

/* Effets de transition pour les cartes et boutons (unifiés ici) */
.card {
    transition: transform 0.2s ease-in-out;
}

.btn:hover {
    transform: translateY(-1px);
    transition: all 0.2s ease;
}

.btn-outline-secondary {
    border-color: #ced4da !important;
}

.input-group-text {
    background-color: #f8f9fa !important;
}

/* Styles pour l'affichage des fichiers de leçon (cours_viewer.html) */
.file-viewer {
    border: 1px solid #ccc;
    border-radius: 8px;
    overflow: hidden;
    margin-top: 15px;
}
.file-viewer iframe {
    border: none;
}

.rounded-pill {
    border-radius: 50px !important;
}