/* ============================================================
   Charte visuelle InviTek — thème clair médical (CLAUDE.md Section 8)
   Tokens définis une seule fois ici et réutilisés partout.
   ============================================================ */

:root {
    /* Palette InviTek */
    --ivt-primary: #0E7C7B;        /* Teal médical — boutons primaires, nav active, liens */
    --ivt-primary-dark: #0A5C5B;   /* Barre de navigation, titres, hover boutons */
    --ivt-secondary: #4A9EBC;      /* Bleu ciel clinique — boutons secondaires, onglets */
    --ivt-accent: #E8846B;         /* Corail doux — badges, CTA ponctuels */
    --ivt-success: #2E9E6B;        /* Statuts validés, paiements confirmés */
    --ivt-warning: #E6A23C;        /* Péremption, renouvellements cryo, seuils de stock */
    --ivt-danger: #C64545;         /* Avertissements médicaux critiques, annulations */
    --ivt-bg: #FAFBFC;             /* Fond général */
    --ivt-card-bg: #FFFFFF;        /* Cartes, formulaires, tableaux, modales */
    --ivt-bg-soft: #EEF5F5;        /* En-têtes de tableaux, zones de filtres */
    --ivt-border: #DCE4E8;         /* Séparateurs, contours de champs */
    --ivt-text: #2C3E45;           /* Corps de texte (jamais de noir pur) */
    --ivt-text-muted: #6B7C85;     /* Libellés, aides, métadonnées */

    /* Codes couleur cliniques réutilisables */
    --ivt-female: #B85C8A;
    --ivt-male: #4A7EBC;
    --ivt-embryo-transfer: var(--ivt-success);
    --ivt-embryo-freeze: var(--ivt-secondary);
    --ivt-embryo-discard: var(--ivt-text-muted);

    /* Surcharge des variables Bootstrap 5 */
    --bs-primary: var(--ivt-primary);
    --bs-primary-rgb: 14, 124, 123;
    --bs-secondary: var(--ivt-secondary);
    --bs-secondary-rgb: 74, 158, 188;
    --bs-success: var(--ivt-success);
    --bs-success-rgb: 46, 158, 107;
    --bs-warning: var(--ivt-warning);
    --bs-warning-rgb: 230, 162, 60;
    --bs-danger: var(--ivt-danger);
    --bs-danger-rgb: 198, 69, 69;
    --bs-body-bg: var(--ivt-bg);
    --bs-body-color: var(--ivt-text);
    --bs-border-color: var(--ivt-border);
    --bs-link-color: var(--ivt-primary);
    --bs-link-hover-color: var(--ivt-primary-dark);
}

/* --- Base : lisibilité clinique (8 h+/jour) --- */
html { font-size: 15.5px; }
body {
    background-color: var(--ivt-bg);
    color: var(--ivt-text);
    font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
}
h1, h2, h3, h4, h5 { color: var(--ivt-primary-dark); }
a { color: var(--ivt-primary); }
a:hover { color: var(--ivt-primary-dark); }

/* --- Navigation --- */
.navbar-invitek {
    background-color: var(--ivt-primary-dark);
}
.navbar-invitek .navbar-brand {
    color: #ffffff;
    font-weight: 600;
    letter-spacing: 0.5px;
}
.navbar-invitek .nav-link {
    color: rgba(255, 255, 255, 0.85);
}
.navbar-invitek .nav-link:hover,
.navbar-invitek .nav-link:focus {
    color: #ffffff;
}
.navbar-invitek .nav-link.active {
    color: #ffffff;
    border-bottom: 2px solid var(--ivt-accent);
}
.navbar-invitek .dropdown-menu {
    border-color: var(--ivt-border);
}

/* --- Boutons --- */
.btn-primary {
    --bs-btn-bg: var(--ivt-primary);
    --bs-btn-border-color: var(--ivt-primary);
    --bs-btn-hover-bg: var(--ivt-primary-dark);
    --bs-btn-hover-border-color: var(--ivt-primary-dark);
    --bs-btn-active-bg: var(--ivt-primary-dark);
    --bs-btn-active-border-color: var(--ivt-primary-dark);
}
.btn-secondary {
    --bs-btn-bg: var(--ivt-secondary);
    --bs-btn-border-color: var(--ivt-secondary);
    --bs-btn-hover-bg: #3D89A5;
    --bs-btn-hover-border-color: #3D89A5;
}
.btn-outline-primary {
    --bs-btn-color: var(--ivt-primary);
    --bs-btn-border-color: var(--ivt-primary);
    --bs-btn-hover-bg: var(--ivt-primary);
    --bs-btn-hover-border-color: var(--ivt-primary);
    --bs-btn-active-bg: var(--ivt-primary-dark);
}

/* --- Cartes --- */
.card {
    background-color: var(--ivt-card-bg);
    border-color: var(--ivt-border);
    box-shadow: 0 1px 3px rgba(44, 62, 69, 0.06);
}
.card-header {
    background-color: var(--ivt-bg-soft);
    border-bottom-color: var(--ivt-border);
    color: var(--ivt-primary-dark);
    font-weight: 600;
}

/* --- Tableaux --- */
.table thead th {
    background-color: var(--ivt-bg-soft);
    color: var(--ivt-primary-dark);
    border-bottom-color: var(--ivt-border);
    font-weight: 600;
}
.table td, .table th { border-color: var(--ivt-border); }
.table-hover tbody tr:hover { background-color: rgba(14, 124, 123, 0.04); }

/* --- Formulaires --- */
.form-control, .form-select {
    border-color: var(--ivt-border);
    color: var(--ivt-text);
}
.form-control:focus, .form-select:focus {
    border-color: var(--ivt-primary);
    box-shadow: 0 0 0 0.2rem rgba(14, 124, 123, 0.15);
}
.form-label { color: var(--ivt-text); font-weight: 500; }
.form-text { color: var(--ivt-text-muted); }
.form-check-input:checked {
    background-color: var(--ivt-primary);
    border-color: var(--ivt-primary);
}

/* --- Zone de filtres --- */
.filter-zone {
    background-color: var(--ivt-bg-soft);
    border: 1px solid var(--ivt-border);
    border-radius: 0.5rem;
    padding: 1rem;
}

/* --- Badges de statut --- */
.badge-status-active   { background-color: var(--ivt-success); color: #fff; }
.badge-status-pending  { background-color: var(--ivt-warning); color: #fff; }
.badge-status-cancelled{ background-color: var(--ivt-danger); color: #fff; }
.badge-status-neutral  { background-color: var(--ivt-text-muted); color: #fff; }
.badge-status-info     { background-color: var(--ivt-secondary); color: #fff; }
.badge-accent          { background-color: var(--ivt-accent); color: #fff; }
.badge-branch          { background-color: var(--ivt-bg-soft); color: var(--ivt-primary-dark); border: 1px solid var(--ivt-border); }

/* --- Bannière d'avertissement médical critique (ex. « PATIENT HÉPATITE B ») --- */
.medical-alert-banner {
    background-color: var(--ivt-danger);
    color: #ffffff;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    padding: 0.5rem 1rem;
    border-radius: 0.375rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* --- Cartes KPI des tableaux de bord --- */
.kpi-card {
    background-color: var(--ivt-card-bg);
    border: 1px solid var(--ivt-border);
    border-left: 4px solid var(--ivt-primary);
    border-radius: 0.5rem;
    padding: 1.25rem;
}
.kpi-card .kpi-value {
    font-size: 1.9rem;
    font-weight: 700;
    color: var(--ivt-primary-dark);
}
.kpi-card .kpi-label {
    color: var(--ivt-text-muted);
    font-size: 0.9rem;
}
.kpi-card.kpi-warning { border-left-color: var(--ivt-warning); }
.kpi-card.kpi-danger  { border-left-color: var(--ivt-danger); }
.kpi-card.kpi-success { border-left-color: var(--ivt-success); }
.kpi-card.kpi-accent  { border-left-color: var(--ivt-accent); }

/* --- Écran de connexion --- */
.auth-page {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(160deg, var(--ivt-bg-soft) 0%, var(--ivt-bg) 60%);
}
.auth-card {
    width: 100%;
    max-width: 420px;
    background: var(--ivt-card-bg);
    border: 1px solid var(--ivt-border);
    border-radius: 0.75rem;
    box-shadow: 0 6px 24px rgba(10, 92, 91, 0.10);
    padding: 2.25rem;
}
.auth-brand {
    color: var(--ivt-primary-dark);
    font-weight: 700;
    font-size: 1.6rem;
    letter-spacing: 0.5px;
}
.auth-brand span { color: var(--ivt-primary); }

/* --- Calendrier jour par ressource (Section 5.3) --- */
.cal-day {
    display: flex;
    gap: 0.5rem;
    overflow-x: auto;
    min-height: 640px;
}
.cal-gutter {
    position: relative;
    width: 56px;
    flex: 0 0 56px;
    margin-top: 52px; /* hauteur de l'entête de colonne */
    height: 640px;
}
.cal-gutter-hour {
    position: absolute;
    right: 6px;
    transform: translateY(-50%);
    font-size: 0.75rem;
    color: var(--ivt-text-muted);
}
.cal-col {
    flex: 1 1 0;
    min-width: 190px;
    display: flex;
    flex-direction: column;
}
.cal-col-header {
    height: 52px;
    padding: 0.35rem 0.5rem;
    background: var(--ivt-bg-soft);
    border: 1px solid var(--ivt-border);
    border-radius: 0.4rem 0.4rem 0 0;
    font-weight: 600;
    color: var(--ivt-primary-dark);
    font-size: 0.9rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.cal-col-body {
    position: relative;
    height: 640px;
    border: 1px solid var(--ivt-border);
    border-top: none;
    border-radius: 0 0 0.4rem 0.4rem;
    background: repeating-linear-gradient(
        to bottom,
        transparent 0, transparent calc(10% - 1px),
        var(--ivt-border) calc(10% - 1px), var(--ivt-border) 10%);
    background-color: #F3F5F6; /* hors horaires = grisé */
}
.cal-open {
    position: absolute;
    left: 0; right: 0;
    background: #FFFFFF;
    pointer-events: none;
}
.cal-slot {
    position: absolute;
    left: 0; right: 0;
    z-index: 1;
}
.cal-slot:hover { background: rgba(14, 124, 123, 0.08); }
.cal-appt {
    position: absolute;
    left: 3px; right: 3px;
    z-index: 2;
    display: block;
    padding: 2px 6px;
    border-radius: 0.3rem;
    border-left: 4px solid var(--ivt-primary);
    background: #E7F2F2;
    color: var(--ivt-text);
    font-size: 0.78rem;
    line-height: 1.2;
    overflow: hidden;
    text-decoration: none;
}
.cal-appt:hover { filter: brightness(0.96); color: var(--ivt-text); }
.cal-appt-scheduled { border-left-color: var(--ivt-text-muted); background: #F0F2F3; }
.cal-appt-confirmed { border-left-color: var(--ivt-secondary); background: #E9F3F8; }
.cal-appt-approved  { border-left-color: var(--ivt-success); background: #E8F5EF; }
.cal-appt-completed { border-left-color: var(--ivt-primary-dark); background: #E7F2F2; }
.cal-appt-cancelled { border-left-color: var(--ivt-danger); background: #F9ECEC; text-decoration: line-through; }
.cal-appt-noshow    { border-left-color: var(--ivt-warning); background: #FBF3E4; }

/* --- Divers --- */
.text-muted, .text-secondary-ivt { color: var(--ivt-text-muted) !important; }
.page-title { color: var(--ivt-primary-dark); margin-bottom: 1rem; }
footer.app-footer {
    color: var(--ivt-text-muted);
    border-top: 1px solid var(--ivt-border);
    font-size: 0.85rem;
}