/* Vue d'ensemble exécutive Opella. Ce fichier reste isolé du reste de l'application. */
#view-dashboard>.page-heading{position:relative;min-height:172px;margin:-2px 0 0;padding:30px 34px 54px;border:0;border-radius:22px;overflow:hidden;background:linear-gradient(125deg,#052c19 0%,#0b4730 62%,#153c34 100%);color:#fff;box-shadow:0 18px 45px rgba(4,43,11,.16)}
#view-dashboard>.page-heading:before,#view-dashboard>.page-heading:after{content:"";position:absolute;border-radius:50%;pointer-events:none}
#view-dashboard>.page-heading:before{width:340px;height:340px;right:-110px;top:-220px;border:55px solid rgba(255,255,255,.055)}
#view-dashboard>.page-heading:after{width:170px;height:170px;right:245px;bottom:-135px;background:rgba(201,164,83,.14)}
#view-dashboard>.page-heading>div,#view-dashboard>.page-heading>.heading-actions{position:relative;z-index:1}
#view-dashboard>.page-heading .date-label{color:#d5c08b;letter-spacing:.16em}
#view-dashboard>.page-heading h1{margin:8px 0 5px;font-size:clamp(28px,3vw,42px);letter-spacing:-.035em}
#view-dashboard>.page-heading p{max-width:650px;color:rgba(255,255,255,.72);font-size:14px}
#view-dashboard>.page-heading .button{border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.1);color:#fff;backdrop-filter:blur(8px)}
#view-dashboard>.page-heading .button.dark{border-color:#d6bb79;background:#d6bb79;color:#173225}
#view-dashboard .bi-filters{position:relative;z-index:2;margin:-34px 20px 22px;padding:15px 18px;border-color:rgba(4,43,11,.09);border-radius:15px;background:rgba(255,255,255,.96);box-shadow:0 14px 32px rgba(19,48,33,.12);backdrop-filter:blur(14px)}
#view-dashboard .bi-filters select,#view-dashboard .bi-filters>button{background:#f7f8f5}
#view-dashboard .bi-kpis{grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-flow:dense;gap:12px;margin-bottom:18px}
#view-dashboard .bi-kpi{min-height:112px;padding:16px 18px;border:0;border-radius:16px;background:#fff;text-align:left;box-shadow:0 7px 24px rgba(20,44,31,.07)}
#view-dashboard .bi-kpi:after{content:"";position:absolute;right:15px;bottom:15px;width:34px;height:34px;border-radius:11px;background:linear-gradient(135deg,rgba(4,43,11,.04),rgba(4,43,11,.12))}
#view-dashboard .bi-kpi>small{min-height:0;padding:0;text-align:left;text-transform:uppercase;letter-spacing:.07em;font-size:9px}
#view-dashboard .bi-kpi>strong{margin:10px 0 4px;font-size:32px;line-height:1}
#view-dashboard .bi-kpi>span:not(.bi-kpi-icon){max-width:85%;font-size:10px}
#view-dashboard .bi-kpi:nth-child(3){grid-column:1/7;grid-row:1;min-height:154px;padding:24px 26px;background:linear-gradient(125deg,#082f1d,#11523a);color:#fff;box-shadow:0 14px 34px rgba(4,43,11,.18)}
#view-dashboard .bi-kpi:nth-child(4){grid-column:7/13;grid-row:1;min-height:154px;padding:24px 26px;background:linear-gradient(125deg,#29254d,#514789);color:#fff;box-shadow:0 14px 34px rgba(54,47,106,.16)}
#view-dashboard .bi-kpi:nth-child(3)>small,#view-dashboard .bi-kpi:nth-child(3)>span,#view-dashboard .bi-kpi:nth-child(4)>small,#view-dashboard .bi-kpi:nth-child(4)>span{color:rgba(255,255,255,.72)}
#view-dashboard .bi-kpi:nth-child(3)>strong,#view-dashboard .bi-kpi:nth-child(4)>strong{font-size:46px}
#view-dashboard .bi-kpi:nth-child(3):after,#view-dashboard .bi-kpi:nth-child(4):after{width:76px;height:76px;right:24px;bottom:22px;border:14px solid rgba(255,255,255,.12);border-radius:50%;background:transparent}
#view-dashboard .bi-kpi:nth-child(1){grid-column:1/4;grid-row:2}#view-dashboard .bi-kpi:nth-child(2){grid-column:4/7;grid-row:2}#view-dashboard .bi-kpi:nth-child(5){grid-column:7/10;grid-row:2}#view-dashboard .bi-kpi:nth-child(6){grid-column:10/13;grid-row:2}
#view-dashboard .timeline-dashboard{position:relative;align-items:start;gap:16px}
#view-dashboard .timeline-dashboard:before{content:"";position:absolute;left:16.66%;right:16.66%;top:36px;height:2px;background:linear-gradient(90deg,#4f9b7e,#d59b4c,#528bc4);opacity:.45}
#view-dashboard .timeline-column{position:relative;align-self:start;height:auto;min-height:0;padding:20px;border:0;border-radius:17px;background:#fff;box-shadow:0 7px 25px rgba(20,44,31,.065)}
#view-dashboard .timeline-column>header{position:relative;z-index:1;padding-bottom:13px;border-bottom:1px solid var(--line)}
#view-dashboard .timeline-column>header>span{box-shadow:0 0 0 7px #fff}
#view-dashboard .timeline-column>div>button{padding:11px 5px;transition:.16s}
#view-dashboard .timeline-column button strong{font-size:12px;line-height:1.35}
#view-dashboard .timeline-column button small{font-size:10.5px;line-height:1.4}
#view-dashboard .timeline-column>div>button:hover{padding-left:10px;border-radius:9px;background:#f7f8f5}
#view-dashboard .timeline-charts{gap:16px;margin-top:16px}
#view-dashboard .timeline-charts .bi-card,#view-dashboard .timeline-risks{border:0;border-radius:18px;background:#fff;box-shadow:0 8px 28px rgba(20,44,31,.07)}
#view-dashboard .timeline-charts .bi-card{min-height:330px;padding:23px}
#view-dashboard .bi-card .panel-head{padding-bottom:14px;border-bottom:1px solid var(--line)}
#view-dashboard .bi-line-chart{height:225px}#view-dashboard .bi-line-chart polyline{filter:drop-shadow(0 4px 4px rgba(39,128,102,.16))}
#view-dashboard .future-load-chart span{height:23px;background:#f0f2ef}
#view-dashboard .future-load-chart i,#view-dashboard .future-load-chart b,#view-dashboard .future-load-chart em{border-radius:5px}
#view-dashboard .timeline-risks{padding:22px 24px}
#view-dashboard .timeline-risks #biAlerts>button{padding:10px 7px;border-radius:9px;transition:.16s}
#view-dashboard .timeline-risks #biAlerts>button:hover{background:#f7f8f5}
#view-dashboard .bi-filters label{font-size:11px}#view-dashboard .bi-filters select{font-size:12px;font-weight:650}
#view-dashboard .bi-kpi>small{font-size:10px}#view-dashboard .bi-kpi>span:not(.bi-kpi-icon){font-size:11px;line-height:1.4}
@media(max-width:1100px){#view-dashboard .bi-kpi:nth-child(3),#view-dashboard .bi-kpi:nth-child(4){grid-column:span 6;grid-row:auto}#view-dashboard .bi-kpi:nth-child(1),#view-dashboard .bi-kpi:nth-child(2),#view-dashboard .bi-kpi:nth-child(5),#view-dashboard .bi-kpi:nth-child(6){grid-column:span 6;grid-row:auto}#view-dashboard .timeline-dashboard:before{display:none}}
@media(max-width:650px){#view-dashboard>.page-heading{padding:24px 20px 46px;border-radius:16px}#view-dashboard .bi-filters{margin:-27px 8px 18px}#view-dashboard .bi-kpi:nth-child(n){grid-column:1/-1;grid-row:auto}#view-dashboard .bi-kpi:nth-child(3),#view-dashboard .bi-kpi:nth-child(4){min-height:135px}#view-dashboard .timeline-charts .bi-card{min-height:0}}

/* Bandeau et commandes restent deux blocs distincts, sans aucun chevauchement. */
#view-dashboard>.page-heading{min-height:0;margin:0;padding:25px 28px;border-radius:18px}
#view-dashboard .bi-filters{margin:14px 0 20px;padding:14px 16px;border:1px solid var(--line);border-radius:13px;box-shadow:0 5px 18px rgba(20,44,31,.055);backdrop-filter:none}
/* Les indicateurs stratégiques restent sobres et lisibles, sans aplats trop lourds. */
#view-dashboard .bi-kpi:nth-child(3){background:linear-gradient(135deg,#edf5f0,#f8faf8);color:#123323;border:1px solid #cddfd5;box-shadow:0 8px 24px rgba(20,74,48,.08)}
#view-dashboard .bi-kpi:nth-child(4){background:linear-gradient(135deg,#f1eff9,#faf9fd);color:#302b58;border:1px solid #dbd7ef;box-shadow:0 8px 24px rgba(54,47,106,.08)}
#view-dashboard .bi-kpi:nth-child(3)>small,#view-dashboard .bi-kpi:nth-child(3)>span{color:#61766a}
#view-dashboard .bi-kpi:nth-child(4)>small,#view-dashboard .bi-kpi:nth-child(4)>span{color:#716d8b}
#view-dashboard .bi-kpi:nth-child(3):after{border-color:rgba(23,104,67,.14)}#view-dashboard .bi-kpi:nth-child(4):after{border-color:rgba(81,71,137,.14)}
@media(max-width:650px){#view-dashboard>.page-heading{padding:22px 19px}#view-dashboard .bi-filters{margin:12px 0 17px}}

/* Chaque indicateur expose sa progression et ouvre seulement les données concernées. */
#view-dashboard .bi-kpi{padding-bottom:32px}
#view-dashboard .bi-kpi-progress{position:absolute;z-index:2;left:18px;right:18px;bottom:14px;height:6px;border-radius:999px;background:#e7ebe8;overflow:hidden}
#view-dashboard .bi-kpi-progress>b{display:block;height:100%;min-width:0;border-radius:inherit;background:#24765d;transition:width .25s ease}
#view-dashboard .bi-kpi.violet .bi-kpi-progress>b{background:#6559b8}#view-dashboard .bi-kpi.orange .bi-kpi-progress>b{background:#dd8f2d}#view-dashboard .bi-kpi.blue .bi-kpi-progress>b{background:#3187d6}
#view-dashboard .bi-kpi:nth-child(3),#view-dashboard .bi-kpi:nth-child(4){padding-bottom:38px}
.dashboard-metric-dialog{width:min(820px,calc(100vw - 28px));max-height:min(760px,90vh)}
.dashboard-metric-list{max-height:58vh;padding:5px 22px 18px;overflow:auto}
.dashboard-metric-list>button{width:100%;min-height:58px;padding:10px 8px;display:flex;align-items:center;justify-content:space-between;gap:15px;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--text);text-align:left;cursor:pointer}
.dashboard-metric-list>button:hover{padding-left:13px;border-radius:9px;background:var(--surface-2)}
.dashboard-metric-list strong,.dashboard-metric-list small{display:block}.dashboard-metric-list small{margin-top:4px;color:var(--muted)}.dashboard-metric-list button>b{color:#6258c4;white-space:nowrap}

/* Seuls les deux indicateurs stratégiques utilisent une progression circulaire. */
#view-dashboard .bi-kpi{padding:17px 18px;text-align:center}
#view-dashboard .bi-kpi>small,#view-dashboard .bi-kpi>span:not(.bi-kpi-icon){max-width:100%;text-align:center}
#view-dashboard .bi-kpi>strong{margin:10px auto 4px;text-align:center}
#view-dashboard .bi-kpi:after,#view-dashboard .bi-kpi-progress{display:none}
#view-dashboard .bi-kpi.strategic{min-height:190px;padding:18px 24px;display:grid;grid-template-rows:auto 1fr auto;justify-items:center;align-items:center}
#view-dashboard .bi-kpi-donut{--value:0;position:relative;width:96px;height:96px;margin:8px auto;display:grid;place-items:center;border-radius:50%;background:conic-gradient(#24765d calc(var(--value)*1%),#dce8e1 0);font-style:normal}
#view-dashboard .bi-kpi-donut:before{content:"";position:absolute;inset:11px;border-radius:50%;background:#f7faf8}
#view-dashboard .bi-kpi-donut>b{position:relative;z-index:1;color:#123323;font:800 24px Manrope}
#view-dashboard .bi-kpi:nth-child(4) .bi-kpi-donut{background:conic-gradient(#6559b8 calc(var(--value)*1%),#e3e0f1 0)}
#view-dashboard .bi-kpi:nth-child(4) .bi-kpi-donut:before{background:#f8f7fc}#view-dashboard .bi-kpi:nth-child(4) .bi-kpi-donut>b{color:#302b58}
/* Passé, maintenant et à venir forment un cadre unique, aligné et centré. */
#view-dashboard .timeline-dashboard{align-items:stretch;gap:0;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 8px 28px rgba(20,44,31,.07);overflow:hidden}
#view-dashboard .timeline-dashboard:before{display:none}
#view-dashboard .timeline-column{align-self:stretch;height:100%;border-radius:0;background:transparent;box-shadow:none}
#view-dashboard .timeline-column:not(:last-child){border-right:1px solid var(--line)}
#view-dashboard .timeline-column>header{justify-content:center;text-align:center}
#view-dashboard .timeline-column>div>button{text-align:center}#view-dashboard .timeline-column>div>button>span{flex:1}
@media(max-width:1000px){#view-dashboard .timeline-dashboard{gap:12px;border:0;background:transparent;box-shadow:none;overflow:visible}#view-dashboard .timeline-column{border:1px solid var(--line)!important;border-radius:16px;background:#fff;box-shadow:0 7px 25px rgba(20,44,31,.065)}}

#view-dashboard .bi-objective-summary{display:flex;align-items:baseline;justify-content:center;gap:7px;margin:3px 0 7px;text-align:center}
#view-dashboard .bi-objective-summary strong{color:#153426;font:800 20px Manrope,sans-serif}
#view-dashboard .bi-objective-summary span{color:var(--muted);font-size:10px}
