/* ── Inter auto-hébergée ─────────────────────────────────────────────────── */
@font-face {
    font-family: 'Inter';
    src: url('/css/fonts/InterVariable.woff2') format('woff2');
    font-weight: 100 900;
    font-style: normal oblique;
    font-display: block;
}

/* ── Thème « Soleil » : clair, orange, contraste élevé pour le plein soleil ──
   Overrides de variables Tabler, comme le thème TSMonitor. ──────────────── */
:root,
[data-bs-theme="light"] {
    --tblr-font-sans-serif: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;

    --tblr-body-bg:               #f7f7f7;
    --tblr-body-bg-rgb:           247, 247, 247;
    --tblr-bg-surface:            #ffffff;
    --tblr-bg-surface-secondary:  #fff1e3;
    --tblr-bg-surface-tertiary:   #ffe8d1;
    --tblr-card-bg:               #ffffff;

    /* Texte quasi noir : lisible même écran à moitié éclairé par le soleil */
    --tblr-body-color:            #1c1917;
    --tblr-body-color-rgb:        28, 25, 23;
    --tblr-emphasis-color:        #0c0a09;
    --tblr-heading-color:         #0c0a09;
    --tblr-secondary-color:       #57534e;
    --tblr-secondary-color-rgb:   87, 83, 78;

    --tblr-border-color:             #e2e2e2;
    --tblr-border-color-translucent: #d4d4d4;
    --tblr-card-border-color:        #e2e2e2;

    --tblr-primary:      #ea580c;
    --tblr-primary-rgb:  234, 88, 12;
    --tblr-primary-fg:   #ffffff;
    --tblr-link-color:       #c2410c;
    --tblr-link-hover-color: #9a3412;

    --tblr-success:      #15803d;
    --tblr-success-rgb:  21, 128, 61;
    --tblr-warning:      #b45309;
    --tblr-warning-rgb:  180, 83, 9;
    --tblr-danger:       #b91c1c;
    --tblr-danger-rgb:   185, 28, 28;

    --sol-ink-orange: #c2410c;   /* orange lisible en texte (5:1 sur blanc) */
    --sol-chart-text: #57534e;
    --sol-chart-grid: rgba(0, 0, 0, .08);
}

html { font-size: 16px; }
@media (min-width: 992px) { html { font-size: 15px; } }
body { -webkit-text-size-adjust: 100%; }

/* ── Barre latérale (layout TSMonitor), version claire ─────────────────── */
:root {
    --tblr-navbar-bg:                #ffffff;
    --tblr-navbar-border-color:      var(--tblr-border-color);
    --tblr-navbar-color:             #44403c;
    --tblr-navbar-active-color:      #ffffff;
    --tblr-navbar-active-bg:         var(--tblr-primary);
    --tblr-navbar-hover-color:       #0c0a09;
    --tblr-navbar-brand-color:       #0c0a09;
    --tblr-navbar-brand-hover-color: #0c0a09;
}
/* Tabler's own .navbar rule redefines these on the element itself. */
.navbar-vertical {
    --tblr-navbar-active-bg:    var(--tblr-primary);
    --tblr-navbar-active-color: #ffffff;
    border-right: 1px solid var(--tblr-border-color);
}
@media (max-width: 991.98px) {
    .navbar-vertical { border-right: 0; border-bottom: 1px solid var(--tblr-border-color); }
}
#sidebar-menu .nav-link { color: var(--tblr-navbar-color); font-weight: 600; }
#sidebar-menu .nav-link.active,
#sidebar-menu .nav-link.active:hover {
    color: #ffffff;
    background: var(--tblr-primary);
}
#sidebar-menu .nav-link.active .nav-link-icon,
#sidebar-menu .nav-link.active .nav-link-title {
    color: #ffffff;
    opacity: 1;
}
#sidebar-menu .navbar-nav {
    --tblr-sidebar-nav-padding-y: .55rem;
    --tblr-sidebar-nav-padding-x: .625rem;
}
#sol-brand {
    --tblr-navbar-brand-font-size: 1.15rem;
    --tblr-sidebar-brand-padding-x: 1.5rem;
}
#sol-brand a { color: #0c0a09; }
#sol-brand .icon { color: var(--tblr-primary); }
@media (min-width: 992px) {
    #sol-brand { padding-top: 1.25rem; }
}
section[id] { scroll-margin-top: 1rem; }

/* ── Cartes ─────────────────────────────────────────────────────────────── */
.card { box-shadow: 0 1px 2px rgba(0, 0, 0, .05); }
.card-title { font-weight: 700; font-size: 1rem; }
.page-body { margin-top: 1rem; }

/* ── Héros « maintenant » ───────────────────────────────────────────────── */
.sol-hero { border-top: 4px solid var(--sol-status, var(--tblr-primary)); }
.sol-hero[data-status="good"] { --sol-status: var(--tblr-success); }
.sol-hero[data-status="mid"]  { --sol-status: var(--tblr-primary); }
.sol-hero[data-status="bad"]  { --sol-status: var(--tblr-secondary-color); }
.sol-big { font-size: 3rem; font-weight: 800; line-height: 1; color: #0c0a09; font-variant-numeric: tabular-nums; }
.sol-big small { font-size: 1rem; font-weight: 600; color: var(--tblr-secondary-color); }
.sol-kv { display: flex; justify-content: space-between; gap: .5rem; padding: .3rem 0; border-bottom: 1px dashed var(--tblr-border-color); }
.sol-kv:last-child { border-bottom: 0; }
.sol-kv span:last-child { font-weight: 700; color: #0c0a09; font-variant-numeric: tabular-nums; }

/* ── Tuiles ─────────────────────────────────────────────────────────────── */
.sol-stat .subheader { font-size: .7rem; color: #57534e; padding-right: 1.4rem; }
.sol-stat .h1 { font-weight: 800; font-variant-numeric: tabular-nums; margin-bottom: 0; }
.sol-stat .unit { font-size: .8rem; font-weight: 600; color: var(--tblr-secondary-color); margin-left: 2px; }
.text-sol { color: var(--sol-ink-orange) !important; }

/* ── Visionneuse d'images ───────────────────────────────────────────────── */
/* Sélecteur d'image : boutons qui se partagent toute la largeur de la carte
   (7 sur une ligne en grand écran, plusieurs lignes pleines sur mobile). */
.sol-pills { display: flex; flex-wrap: wrap; gap: .375rem; }
.sol-pills button {
    flex: 1 1 96px;  /* grow → every row, including the last, fills the width */
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    min-height: 3.4rem; padding: .4rem .35rem; line-height: 1.2; text-align: center;
    border: 1px solid var(--tblr-border-color-translucent); background: #fff; color: #1c1917;
}
.sol-pills button .lbl { font-weight: 700; font-size: .875rem; }
.sol-pills button .wl { font-size: .72rem; color: #57534e; margin-top: 2px; font-variant-numeric: tabular-nums; }
.sol-pills button:hover { border-color: #a3a3a3; }
.sol-pills button.active { background: var(--tblr-primary); border-color: var(--tblr-primary); color: #fff; }
.sol-pills button.active .wl { color: #ffedd5; }
.sol-viewer { display: block; background: #000; overflow: hidden; aspect-ratio: 1 / 1; max-width: 720px; margin: 0 auto; }
.sol-viewer img { width: 100%; height: 100%; object-fit: contain; display: block; user-select: none; -webkit-user-drag: none; pointer-events: none; }
/* pan-y: the browser keeps vertical scrolling, we handle horizontal swipes */
.sol-viewer { touch-action: pan-y; cursor: grab; user-select: none; -webkit-tap-highlight-color: transparent; }
.sol-dots { display: flex; justify-content: center; gap: 6px; margin-top: .6rem; }
.sol-dots span { width: 18px; height: 4px; background: #d6d3d1; }
.sol-dots span.active { background: var(--tblr-primary); }
.sol-thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: .5rem; }
.sol-thumbs a { display: block; aspect-ratio: 1 / 1; background: #000; overflow: hidden; border: 2px solid transparent; }
.sol-thumbs a.active { border-color: var(--tblr-primary); }
.sol-thumbs img { width: 100%; height: 100%; object-fit: cover; }

/* ── Régions actives ────────────────────────────────────────────────────── */
.sol-ar-num { font-size: 1.35rem; font-weight: 800; color: var(--sol-ink-orange); font-variant-numeric: tabular-nums; }
.sol-prob { display: grid; grid-template-columns: 1.4rem 1fr 2.6rem; align-items: center; gap: .375rem; font-size: .8rem; }
.sol-prob .progress { height: 6px; }

/* ── Grille horaire ─────────────────────────────────────────────────────── */
.sol-hours { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.sol-hours table { border-collapse: separate; border-spacing: 2px; font-size: .8rem; }
.sol-hours th { position: sticky; left: 0; background: #fff; z-index: 1; text-align: left; padding-right: .5rem; white-space: nowrap; color: #57534e; font-weight: 600; }
.sol-hours td { text-align: center; min-width: 2.6rem; padding: .3rem .15rem; font-variant-numeric: tabular-nums; }
.sol-hours .day-sep { border-left: 3px solid #a3a3a3; }
.sol-hours .now { outline: 2px solid #0c0a09; outline-offset: -2px; }
.sc-0 { background: #e7e5e4; color: #44403c; }
.sc-1 { background: #fde68a; color: #422006; }
.sc-2 { background: #fdba74; color: #431407; }
.sc-3 { background: #ea580c; color: #fff; }
.sol-legend { display: flex; flex-wrap: wrap; gap: .25rem .75rem; font-size: .75rem; color: #57534e; }
.sol-legend span { display: inline-flex; align-items: center; gap: 5px; }
.sol-legend i { display: inline-block; width: 12px; height: 12px; }
.sol-legend i.line { height: 3px; }

/* ── Graphiques ─────────────────────────────────────────────────────────── */
.chart-wrap { position: relative; height: 220px; }
.chart-wrap canvas { display: block; width: 100% !important; height: 100% !important; }

/* ── Bouton d'aide « ? » ────────────────────────────────────────────────── */
.sol-help { color: #78716c; display: inline-flex; line-height: 1; padding: 4px; margin: -4px; }
.sol-help:hover { color: var(--tblr-primary); }
.sol-help-corner { position: absolute; top: .5rem; right: .5rem; z-index: 1; }
.sol-help-body ul { padding-left: 1.1rem; }
.sol-help-body li { margin-bottom: .3rem; }
.sol-help-body strong { color: #0c0a09; }
.sol-help-body .table { margin-bottom: 0; }

.sol-dot { display: inline-block; width: 9px; height: 9px; background: #a8a29e; }
.sol-dot.ok { background: var(--tblr-success); }
.sol-dot.bad { background: var(--tblr-danger); }

.view { animation: sol-fade .18s ease; }
@keyframes sol-fade { from { opacity: 0 } to { opacity: 1 } }

/* ── Aucun arrondi, nulle part ──────────────────────────────────────────────
   Variables Tabler à 0 (cartes, boutons, badges, modales, barres de
   progression…) + filet de sécurité pour tout composant qui coderait sa
   propre valeur (fslightbox, contrôles de formulaire). ─────────────────── */
:root,
[data-bs-theme="light"] {
    --tblr-border-radius:      0;
    --tblr-border-radius-sm:   0;
    --tblr-border-radius-lg:   0;
    --tblr-border-radius-xl:   0;
    --tblr-border-radius-xxl:  0;
    --tblr-border-radius-2xl:  0;
    --tblr-border-radius-pill: 0;
}
*, *::before, *::after { border-radius: 0 !important; }