/* ================================================================
   LP2M SANTÉ — Feuille de style principale
   Même architecture que LP2M_Bar_Mngt (Fluent / M365)
   ================================================================ */

:root {
    --app-primary: var(--tenant-color, #0ea5e9);
    --lp2m-topbar-h: 56px;
    --lp2m-sidebar-w: 252px;
    --lp2m-accent: var(--app-primary);
    --lp2m-surface: #faf9f8;
    --lp2m-border: #e1dfdd;
    --lp2m-text: #323130;
    --lp2m-text-soft: #605e5c;
}

body { background: #f5f7fb; color: #1f2937; }

body.lp2m-app, body.lp2m-public {
    font-family: "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* ---- Cartes ------------------------------------------------------- */
.card { border: 0; border-radius: 14px; box-shadow: 0 6px 24px rgba(15,23,42,.07); }

/* ---- Métriques dashboard ----------------------------------------- */
.metric-card { min-height: 130px; position: relative; overflow: hidden; }
.metric-label { color: #64748b; font-size: .85rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.metric-value { font-size: clamp(1.2rem, 2.2vw, 2rem); font-weight: 800; margin-top: .4rem; }
.metric-icon { position: absolute; right: 18px; bottom: 14px; font-size: 2.8rem; opacity: .10; }

/* ---- Connexion ---------------------------------------------------- */
.login-page {
    min-height: 100vh;
    background: radial-gradient(circle at top left, #bae6fd, #f8fafc 42%, #e0f2fe);
    display: flex; align-items: center; justify-content: center;
}
.login-card { width: min(460px, calc(100vw - 30px)); }
.login-icon {
    width: 72px; height: 72px; margin: auto; border-radius: 20px;
    background: #e0f2fe; color: var(--app-primary);
    display: flex; align-items: center; justify-content: center; font-size: 2rem;
}

/* ================================================================
   TOPBAR
   ================================================================ */
.lp2m-topbar {
    position: fixed; inset: 0 0 auto 0;
    height: var(--lp2m-topbar-h);
    display: flex; align-items: center; gap: .75rem; padding: 0 .9rem;
    background: var(--lp2m-accent); color: #fff;
    z-index: 1045;
    box-shadow: 0 1.6px 3.6px rgba(0,0,0,.13), 0 .3px .9px rgba(0,0,0,.10);
}
.lp2m-burger { background: transparent; border: 0; color: #fff; font-size: 1.5rem; line-height: 1; padding: .1rem .35rem; cursor: pointer; }
.lp2m-brand { display: inline-flex; align-items: center; gap: .5rem; color: #fff; text-decoration: none; font-weight: 700; font-size: 1.05rem; }
.lp2m-brand i { font-size: 1.2rem; }
.lp2m-brand:hover { color: #fff; opacity: .9; }
.lp2m-topbar-right { margin-left: auto; display: flex; align-items: center; gap: .5rem; }
.lp2m-user { display: inline-flex; align-items: center; gap: .4rem; color: #fff; font-weight: 600; font-size: .9rem; max-width: 38vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lp2m-user i { font-size: 1.25rem; }
.lp2m-logout { background: rgba(255,255,255,.16); color: #fff; border: 1px solid rgba(255,255,255,.34); font-weight: 600; border-radius: 4px; }
.lp2m-logout:hover { background: rgba(255,255,255,.28); color: #fff; }

/* ================================================================
   SIDEBAR
   ================================================================ */
.lp2m-sidebar {
    position: fixed; top: var(--lp2m-topbar-h); left: 0; bottom: 0;
    width: var(--lp2m-sidebar-w);
    background: var(--lp2m-surface); border-right: 1px solid var(--lp2m-border);
    overflow-y: auto; overflow-x: hidden; z-index: 1040; padding: .5rem;
}
.lp2m-nav { display: flex; flex-direction: column; gap: 2px; }
.lp2m-nav-sep { font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--lp2m-text-soft); }
.lp2m-link {
    display: flex; align-items: center; gap: .65rem;
    padding: .52rem .7rem; border-radius: 6px;
    border-left: 3px solid transparent;
    color: #3b3a39; text-decoration: none;
    font-size: .91rem; font-weight: 500; white-space: nowrap;
    transition: background .12s;
}
.lp2m-link i { font-size: 1.05rem; color: var(--lp2m-accent); width: 1.25rem; text-align: center; flex: 0 0 auto; }
.lp2m-link span { overflow: hidden; text-overflow: ellipsis; }
.lp2m-link:hover { background: #f3f2f1; color: #201f1e; }
.lp2m-link.actif { background: #e0f2fe; color: var(--lp2m-accent); border-left-color: var(--lp2m-accent); font-weight: 600; }

/* ================================================================
   ZONE PRINCIPALE
   ================================================================ */
.lp2m-app main.lp2m-main {
    margin-top: var(--lp2m-topbar-h);
    padding: 1.25rem clamp(.85rem, 2vw, 2rem) 2rem;
    min-height: calc(100vh - var(--lp2m-topbar-h));
}
.lp2m-public main.lp2m-main { padding: 0; }
.lp2m-backdrop { display: none; }

@media (min-width: 992px) {
    .lp2m-app main.lp2m-main {
        margin-left: var(--lp2m-sidebar-w);
        max-width: calc(100vw - var(--lp2m-sidebar-w));
    }
}

@media (max-width: 991.98px) {
    .lp2m-sidebar {
        width: 272px;
        transform: translateX(-100%);
        transition: transform .22s ease;
        box-shadow: 2px 0 20px rgba(0,0,0,.20);
    }
    body.sidebar-open .lp2m-sidebar { transform: none; }
    body.sidebar-open .lp2m-backdrop {
        display: block; position: fixed;
        inset: var(--lp2m-topbar-h) 0 0 0;
        background: rgba(0,0,0,.38); z-index: 1035;
    }
    .lp2m-app main.lp2m-main { margin-left: 0; max-width: 100%; padding-bottom: 84px; }
}

/* ================================================================
   COMPOSANTS FLUENT
   ================================================================ */
body.lp2m-app .card, body.lp2m-public .card {
    border-radius: 8px; border: 1px solid var(--lp2m-border);
    box-shadow: 0 1.6px 3.6px rgba(0,0,0,.10), 0 .3px .9px rgba(0,0,0,.07);
}
body.lp2m-app .btn { border-radius: 4px; font-weight: 600; }
body.lp2m-app .btn-primary { background: var(--lp2m-accent); border-color: var(--lp2m-accent); }
body.lp2m-app .form-control, body.lp2m-app .form-select { border-radius: 4px; border-color: #8a8886; }
body.lp2m-app .form-control:focus, body.lp2m-app .form-select:focus { border-color: var(--lp2m-accent); box-shadow: 0 0 0 1px var(--lp2m-accent); }
body.lp2m-app .table > thead th { background: var(--lp2m-surface); color: var(--lp2m-text-soft); font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; }
.lp2m-app h1, .lp2m-app .h1 { font-size: clamp(1.35rem, 2.4vw, 2rem); }
.lp2m-app h2, .lp2m-app .h2 { font-size: clamp(1.1rem, 2vw, 1.55rem); }

/* ================================================================
   NAVIGATION MOBILE BAS (iPhone safe area)
   ================================================================ */
.mobile-bottom-nav {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 1040;
    display: flex;
    background: #fff; border-top: 1px solid #e2e8f0;
    box-shadow: 0 -4px 16px rgba(15,23,42,.08);
    padding-bottom: env(safe-area-inset-bottom, 0);
}
.mobile-bottom-nav a {
    flex: 1; display: flex; flex-direction: column; align-items: center;
    justify-content: center; gap: 2px; padding: 8px 2px 7px;
    color: #64748b; text-decoration: none; font-size: .68rem; font-weight: 700;
}
.mobile-bottom-nav a i { font-size: 1.25rem; }
.mobile-bottom-nav a.actif { color: var(--lp2m-accent); }
.mobile-bottom-nav a.mobile-nav-pos {
    color: #fff;
    background: var(--tenant-color, #0ea5e9);
    border-radius: 16px; margin: 6px 4px; padding: 6px 2px 5px;
    box-shadow: 0 6px 14px rgba(14,165,233,.35);
}

/* ================================================================
   RESPONSIVE MOBILE
   ================================================================ */
@media (max-width: 991.98px) {
    main.container-fluid { padding-left: 12px !important; padding-right: 12px !important; padding-bottom: 86px !important; }
    h1 { font-size: 1.4rem !important; }
    input, select, textarea { font-size: 16px !important; }
    .table .btn-sm { padding: .45rem .7rem; min-height: 40px; }
    .table-responsive { max-width: 100%; }
}

/* ================================================================
   FILE D'ATTENTE
   ================================================================ */
.file-numero { font-size: 1.6rem; font-weight: 900; color: var(--lp2m-accent); min-width: 48px; text-align: center; }
.file-card { border-left: 4px solid var(--lp2m-border); border-radius: 8px; padding: 14px; background: #fff; margin-bottom: 10px; }
.file-card.priorite-urgente { border-left-color: #f59e0b; }
.file-card.priorite-critique { border-left-color: #ef4444; }
.file-card.statut-appelé { background: #eff6ff; }
.file-card.statut-enconsultation { background: #f0fdf4; }
.file-card.statut-terminé { opacity: .55; }

/* ================================================================
   IMPRESSION
   ================================================================ */
@media print {
    .lp2m-topbar, .lp2m-sidebar, .lp2m-backdrop, .mobile-bottom-nav, .no-print { display: none !important; }
    .lp2m-app main.lp2m-main { margin: 0 !important; max-width: 100% !important; padding: 0 !important; }
}