/**
 * BI V2 — styles additionnels minimaux, complementaires a bi-dashboard.css
 * (jamais dupliques : couleurs, cartes, tableaux, tabs restent definis
 * la-bas). Ce fichier ne couvre que ce qui manquait pour le sprint de
 * fermeture P0 : Detail Drawer generalise, etat "donnee indisponible"
 * des KpiCard, carte d'anomalie active, transitions courtes.
 */

/* Detail Drawer generalise (Vue Direction / Dechets & Sites / Qualite) */
.bi-movement-drawer { position: fixed; inset: 0; z-index: 1000; }
.bi-movement-drawer-backdrop {
    position: absolute; inset: 0; background: rgba(15, 23, 42, .45);
    opacity: 0; transition: opacity 200ms ease;
}
.bi-movement-drawer.is-open .bi-movement-drawer-backdrop { opacity: 1; }
.bi-movement-drawer-panel {
    position: absolute; top: 0; right: 0; bottom: 0; width: min(440px, 92vw);
    background: var(--bi-surface, #fff); padding: 1.25rem; overflow-y: auto;
    display: flex; flex-direction: column; gap: .75rem;
    box-shadow: -8px 0 24px rgba(0, 0, 0, .12);
    transform: translateX(16px); opacity: 0;
    transition: transform 220ms ease, opacity 220ms ease;
}
.bi-movement-drawer.is-open .bi-movement-drawer-panel { transform: translateX(0); opacity: 1; }
.bi-drawer-section { border-bottom: 1px solid #E5E7EB; padding-bottom: .6rem; }
.bi-drawer-section:last-child { border-bottom: none; }
.bi-drawer-section h4 { margin: 0 0 .35rem; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: #64748B; }
.bi-drawer-section p { margin: .15rem 0; font-size: .92rem; }

/* Ton semantique supplementaire (P1) — violet = traitement, absent de
   bi-dashboard.css qui ne definit que info/success/warning/danger/neutral. */
.bi-kpi-card.tone-treatment .bi-kpi-icon { background: #EDE9FE; color: #7C3AED; }

/* Icones SVG (ui_icon()) dans les composants BI V2 — jamais d'emoji comme
   systeme d'icone principal (spec). Tailles adaptees a chaque contexte. */
.bi-kpi-icon .ui-icon { width: 18px; height: 18px; flex-basis: 18px; }
.bi-chart-empty-svg { width: 28px !important; height: 28px !important; flex-basis: 28px !important; opacity: .55; }
.bi-alert-panel-svg { width: 18px !important; height: 18px !important; flex-basis: 18px !important; margin-top: .15rem; }
.bi-alert-panel-item-critical .bi-alert-panel-svg { color: #DC2626; }
.bi-alert-panel-item-warning .bi-alert-panel-svg { color: #B45309; }
.bi-alert-panel-item-info .bi-alert-panel-svg { color: #2563EB; }
.bi-insight-icon { width: 16px !important; height: 16px !important; flex-basis: 16px !important; margin-right: .4rem; vertical-align: -3px; color: #F59E0B; }
.bi-flux-stage-icon .ui-icon { width: 20px; height: 20px; flex-basis: 20px; color: #475569; }

/* KPI — donnee indisponible / couverture partielle */
.bi-kpi-card { transition: transform 180ms ease, box-shadow 180ms ease; }
.bi-kpi-card[data-anomaly-code] { cursor: pointer; }
.bi-kpi-card.active { outline: 2px solid #2563EB; outline-offset: 2px; }
.bi-kpi-card-empty { opacity: .82; }
.bi-kpi-value-muted { color: #94A3B8; font-size: .95em; }
.bi-kpi-unavailable { color: #94A3B8; cursor: help; border-bottom: 1px dotted #94A3B8; }
.bi-kpi-coverage { color: #B45309; font-size: .82rem; }
.bi-kpi-coverage-line { margin-top: .25rem; font-size: .74rem; color: #94A3B8; }

/* Filtres actifs (chips retirables) */
.bi-active-filters { display: flex; flex-wrap: wrap; gap: .4rem; margin: -.5rem 0 1rem; }
.bi-active-filter-chip {
    display: inline-flex; align-items: center; gap: .35rem;
    background: #EFF6FF; color: #2563EB; border-radius: 999px;
    padding: .25rem .6rem; font-size: .78rem; text-decoration: none;
    transition: background 150ms ease;
}
.bi-active-filter-chip:hover { background: #DBEAFE; }
.bi-active-filter-chip span.remove { font-weight: 700; }

/* Flux de periode (Traitement & Stocks) — precision semantique */
.bi-flux-note { font-size: .82rem; color: #94A3B8; margin-top: .5rem; }

/* AlertPanel transverse (P1) */
.bi-alert-panel { background: var(--bi-surface, #fff); border-radius: 12px; border: 1px solid #E5E7EB; padding: 1rem 1.1rem; margin-bottom: 1.25rem; }
.bi-alert-panel-title { margin: 0 0 .6rem; font-size: .95rem; }
.bi-alert-panel-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .6rem; }
.bi-alert-panel-item { display: flex; gap: .6rem; align-items: flex-start; padding: .55rem .7rem; border-radius: 8px; transition: background 150ms ease; }
.bi-alert-panel-item-critical { background: #FEF2F2; }
.bi-alert-panel-item-warning { background: #FFFBEB; }
.bi-alert-panel-item-info { background: #EFF6FF; }
.bi-alert-panel-body p { margin: .2rem 0; font-size: .86rem; color: #475569; }
.bi-alert-panel-heading { display: flex; justify-content: space-between; gap: .5rem; align-items: baseline; }
.bi-alert-panel-domain { font-size: .72rem; text-transform: uppercase; letter-spacing: .03em; color: #94A3B8; }
.bi-alert-panel-body a { font-size: .8rem; }

/* Insights factuels (P1) */
.bi-insight-list { display: flex; flex-direction: column; gap: .4rem; margin-bottom: 1.25rem; }
.bi-insight-chip { background: #F8FAFC; border: 1px dashed #CBD5E1; border-radius: 8px; padding: .5rem .75rem; font-size: .85rem; color: #334155; }

/* Heatmap site x periode (Collecte, table CSS — pas de nouvelle librairie) */
.bi-heatmap-scroll { overflow-x: auto; }
.bi-heatmap-table { border-collapse: collapse; width: 100%; font-size: .78rem; }
.bi-heatmap-table th, .bi-heatmap-table td { padding: .4rem .55rem; text-align: center; border: 1px solid #F1F5F9; white-space: nowrap; }
.bi-heatmap-table th:first-child, .bi-heatmap-table td:first-child { text-align: left; position: sticky; left: 0; background: var(--bi-surface, #fff); }
.bi-heatmap-cell-empty { color: #CBD5E1; }

/* Multi-select enrichi (GlobalFilters) — remplace la liste native <select
   multiple>, brute et peu lisible, par un bouton + panneau a cocher. */
.bi-multiselect { position: relative; display: inline-block; }
.bi-multiselect select[multiple] { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.bi-multiselect-trigger {
    height: 38px; padding: 0 .9rem; border-radius: 8px; border: 1px solid #E2E8F0;
    background: #fff; color: #475569; font-size: .85rem; cursor: pointer;
    display: inline-flex; align-items: center; min-width: 130px;
    transition: border-color 150ms ease, color 150ms ease;
}
.bi-multiselect-trigger:hover { border-color: #94A3B8; }
.bi-multiselect-trigger.has-value { border-color: #2563EB; color: #2563EB; background: #EFF6FF; font-weight: 600; }
.bi-multiselect-panel {
    position: absolute; top: calc(100% + 4px); left: 0; z-index: 40;
    background: #fff; border: 1px solid #E2E8F0; border-radius: 10px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .12);
    padding: .5rem; min-width: 220px; max-height: 260px; overflow-y: auto;
}
.bi-multiselect-option {
    display: flex; align-items: center; gap: .5rem;
    padding: .4rem .5rem; border-radius: 6px; font-size: .85rem; color: #334155;
    cursor: pointer; transition: background 120ms ease;
}
.bi-multiselect-option:hover { background: #F1F5F9; }
.bi-multiselect-option input { accent-color: #2563EB; }

@media (prefers-reduced-motion: reduce) {
    .bi-movement-drawer-backdrop,
    .bi-movement-drawer-panel,
    .bi-kpi-card,
    .bi-active-filter-chip,
    .bi-multiselect-trigger,
    .bi-multiselect-option {
        transition: none !important;
    }
}
