/* 
   Color Override CSS - Nouvelle palette corail, chocolat, crème
   Assure la cohérence des couleurs sur toutes les pages
*/

/* ===== Variables globales nouvelles couleurs ===== */
:root {
    /* Couleurs principales */
    --primary-color: #f4a291 !important; /* Corail rosé */
    --secondary-color: #8b4513 !important; /* Chocolat */
    --accent-color: #f5e6d3 !important; /* Crème */
    --light-color: #faf7f4 !important; /* Blanc crème */
    --dark-color: #3e2723 !important; /* Chocolat foncé */
    
    /* Couleurs étendues */
    --chocolate-light: #d2b48c !important; /* Chocolat clair */
    --coral-dark: #e17866 !important; /* Corail foncé */
    --cream-dark: #e8d5c4 !important; /* Crème foncé */
    
    /* Gradients */
    --feminine-gradient: linear-gradient(135deg, #f4a291, #f5e6d3) !important;
    --chocolate-gradient: linear-gradient(135deg, #8b4513, #d2b48c) !important;
    --warm-gradient: linear-gradient(135deg, #f4a291, #e17866) !important;
    
    /* Suppression complète des oranges */
    --warning-color: #8b4513 !important; /* Remplace l'orange par chocolat */
}

/* ===== Override de toutes les couleurs orange restantes ===== */
.text-warning,
.badge-warning,
.btn-warning,
.alert-warning {
    color: #f5e6d3 !important;
    background-color: #8b4513 !important;
    border-color: #8b4513 !important;
}

/* ===== Harmonisation des boutons ===== */
.btn-primary {
    background: var(--feminine-gradient) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.btn-primary:hover,
.btn-primary:focus {
    background: var(--warm-gradient) !important;
    border-color: var(--coral-dark) !important;
}

.btn-secondary {
    background-color: var(--secondary-color) !important;
    border-color: var(--secondary-color) !important;
    color: var(--accent-color) !important;
}

.btn-secondary:hover,
.btn-secondary:focus {
    background-color: var(--chocolate-light) !important;
    border-color: var(--chocolate-light) !important;
}

/* ===== Harmonisation des liens ===== */
a {
    color: var(--primary-color) !important;
}

a:hover,
a:focus {
    color: var(--coral-dark) !important;
}

/* ===== Harmonisation des badges ===== */
.badge-primary {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.badge-secondary {
    background-color: var(--secondary-color) !important;
    color: var(--accent-color) !important;
}

/* ===== Harmonisation des éléments de formulaire ===== */
.form-control:focus,
.form-select:focus {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 0.2rem rgba(244, 162, 145, 0.25) !important;
}

.form-check-input:checked {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

/* ===== Harmonisation des cartes ===== */
.card {
    border-color: rgba(244, 162, 145, 0.2) !important;
}

.card-header {
    background-color: var(--accent-color) !important;
    border-bottom-color: rgba(244, 162, 145, 0.2) !important;
}

/* ===== Harmonisation des tableaux ===== */
.table-hover tbody tr:hover {
    background-color: rgba(244, 162, 145, 0.05) !important;
}

.table thead th {
    border-bottom-color: rgba(244, 162, 145, 0.2) !important;
}

/* ===== Harmonisation de la pagination ===== */
.page-link {
    color: var(--primary-color) !important;
    border-color: rgba(244, 162, 145, 0.2) !important;
}

.page-link:hover,
.page-link:focus {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.page-item.active .page-link {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

/* ===== Harmonisation des modals ===== */
.modal-header {
    background-color: var(--accent-color) !important;
    border-bottom-color: rgba(244, 162, 145, 0.2) !important;
}

.modal-footer {
    border-top-color: rgba(244, 162, 145, 0.2) !important;
}

/* ===== Harmonisation des alertes ===== */
.alert-info {
    color: var(--secondary-color) !important;
    background-color: rgba(244, 162, 145, 0.1) !important;
    border-color: rgba(244, 162, 145, 0.2) !important;
}

.alert-success {
    color: #155724 !important;
    background-color: #d4edda !important;
    border-color: #c3e6cb !important;
}

/* ===== Harmonisation des éléments de navigation ===== */
.navbar-brand {
    color: var(--primary-color) !important;
}

.nav-link {
    color: var(--dark-color) !important;
}

.nav-link:hover,
.nav-link:focus,
.nav-link.active {
    color: var(--primary-color) !important;
}

/* ===== Harmonisation du footer ===== */
footer {
    background-color: var(--light-color) !important;
    color: var(--dark-color) !important;
}

footer h5 {
    color: var(--primary-color) !important;
}

footer a {
    color: var(--dark-color) !important;
}

footer a:hover {
    color: var(--primary-color) !important;
}

/* ===== Harmonisation des icônes sociales ===== */
.social-icon,
.social-nav-icon {
    background: var(--feminine-gradient) !important;
    color: white !important;
}

.social-icon:hover,
.social-nav-icon:hover {
    background: var(--warm-gradient) !important;
    color: white !important;
}

/* ===== Spécifique aux rendez-vous ===== */
.appointment-type:hover {
    border-color: var(--primary-color) !important;
    background-color: rgba(244, 162, 145, 0.05) !important;
}

.appointment-type.selected {
    border-color: var(--primary-color) !important;
    background-color: rgba(244, 162, 145, 0.1) !important;
}

/* ===== Override pour les time slots ===== */
.time-slot:hover {
    border-color: var(--primary-color) !important;
    background-color: rgba(244, 162, 145, 0.05) !important;
}

.time-slot.selected {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

/* ===== Elements spéciaux avec nouvelle palette ===== */
.highlight-coral {
    background: linear-gradient(90deg, 
        rgba(244, 162, 145, 0) 0%,
        rgba(244, 162, 145, 0.3) 50%,
        rgba(244, 162, 145, 0) 100%);
}

.text-coral {
    color: var(--primary-color) !important;
}

.text-chocolate {
    color: var(--secondary-color) !important;
}

.text-cream {
    color: var(--accent-color) !important;
}

.bg-coral {
    background-color: var(--primary-color) !important;
}

.bg-chocolate {
    background-color: var(--secondary-color) !important;
}

.bg-cream {
    background-color: var(--accent-color) !important;
}

/* ===== Suppression des dernières traces d'orange ===== */
*[style*="#ffc107"] {
    color: var(--secondary-color) !important;
}

*[style*="#fd7e14"] {
    color: var(--secondary-color) !important;
}

*[style*="rgb(255, 193, 7)"] {
    color: var(--secondary-color) !important;
}

*[style*="rgb(253, 126, 20)"] {
    color: var(--secondary-color) !important;
}

/* ===== Animations avec nouvelles couleurs ===== */
@keyframes coral-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(244, 162, 145, 0.4);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(244, 162, 145, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(244, 162, 145, 0);
    }
}

.pulse-coral {
    animation: coral-pulse 2s infinite;
}

/* ===== Media queries pour responsive ===== */
@media (max-width: 768px) {
    :root {
        --primary-color: #f4a291 !important;
        --secondary-color: #8b4513 !important;
        --accent-color: #f5e6d3 !important;
    }
}