/* ==========================================================================
   InSuite GTO — Feuille de style commune
   1) Thème "digital énergie" — site vitrine public
   2) Thème "ERP" — back-office de gestion
   ========================================================================== */

:root {
    --gto-navy: #0a1a30;
    --gto-navy-2: #0f2747;
    --gto-blue: #1f6feb;
    --gto-teal: #12c9b5;
    --gto-amber: #ffb020;
    --gto-ink: #0b1220;

    --erp-bg: #f3f5f9;
    --erp-sidebar: #10182b;
    --erp-sidebar-hover: #1a2540;
    --erp-accent: #2f6fed;
    --erp-accent-2: #12c9b5;
    --erp-card-border: #e7eaf1;
    --erp-text-muted: #6b7488;
    --erp-radius: 14px;
}

body { font-family: 'Inter', system-ui, -apple-system, "Segoe UI", sans-serif; }

/* ---------------------------------------------------------------------- */
/* 1) SITE VITRINE — digital / domaine HTB                                */
/* ---------------------------------------------------------------------- */

.site-navbar {
    background: rgba(10, 26, 48, 0.92);
    backdrop-filter: saturate(160%) blur(8px);
}
.site-navbar .navbar-brand { font-weight: 800; letter-spacing: .02em; color: #fff !important; }
.site-navbar .navbar-brand small { display:block; font-size:.62rem; font-weight:500; letter-spacing:.12em; color: var(--gto-teal); text-transform: uppercase; }
.site-navbar .nav-link { color: rgba(255,255,255,.82) !important; font-weight: 500; }
.site-navbar .nav-link:hover, .site-navbar .nav-link.active { color: #fff !important; }
.site-navbar .btn-cta { background: var(--gto-teal); border: none; color: #04241f; font-weight: 700; }
.site-navbar .btn-cta:hover { background: #0fb3a1; color: #04241f; }

.site-hero {
    position: relative;
    background:
        radial-gradient(circle at 15% 20%, rgba(31,111,235,.35), transparent 45%),
        radial-gradient(circle at 85% 0%, rgba(18,201,181,.25), transparent 40%),
        linear-gradient(160deg, var(--gto-navy) 0%, var(--gto-navy-2) 55%, #08213f 100%);
    color: #fff;
    overflow: hidden;
}
.site-hero::before {
    content: "";
    position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: radial-gradient(circle at 30% 20%, black, transparent 70%);
    opacity: .5;
}
.site-hero .badge-pilot {
    background: rgba(18,201,181,.15); color: var(--gto-teal);
    border: 1px solid rgba(18,201,181,.4); font-weight: 600; letter-spacing: .04em;
}
.site-hero h1 { font-weight: 800; letter-spacing: -0.02em; line-height: 1.08; }
.site-hero .lead { color: rgba(255,255,255,.82); }
.site-hero .stat-pill { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: 16px; }
.site-hero .stat-pill .num { font-size: 1.6rem; font-weight: 800; color: var(--gto-teal); }
.site-hero .stat-pill .lbl { font-size: .74rem; color: rgba(255,255,255,.7); }

.pylon-svg { filter: drop-shadow(0 20px 40px rgba(0,0,0,.35)); }

.section-title { font-weight: 800; letter-spacing: -0.01em; }
.section-eyebrow { color: var(--gto-blue); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; font-size: .74rem; }

.flow-card {
    border: 1px solid #e7eaf1; border-radius: var(--erp-radius); background: #fff;
    transition: transform .15s ease, box-shadow .15s ease;
}
.flow-card:hover { transform: translateY(-4px); box-shadow: 0 16px 30px rgba(15,39,71,.1); }
.flow-card .flow-num {
    width: 42px; height: 42px; border-radius: 12px; display:flex; align-items:center; justify-content:center;
    background: linear-gradient(135deg, var(--gto-blue), var(--gto-teal)); color:#fff; font-weight:800;
}

.family-card { border-radius: var(--erp-radius); border: 1px solid #e7eaf1; background:#fff; }
.family-card .icon-wrap {
    width:48px; height:48px; border-radius:12px; display:flex; align-items:center; justify-content:center;
    background: rgba(31,111,235,.1); color: var(--gto-blue); font-size:1.3rem;
}

.cta-band { background: linear-gradient(120deg, var(--gto-navy), #123a64); color:#fff; border-radius: 24px; }

.site-footer { background: var(--gto-ink); color: rgba(255,255,255,.65); }
.site-footer a { color: rgba(255,255,255,.85); text-decoration:none; }
.site-footer a:hover { color: var(--gto-teal); }

/* ---------------------------------------------------------------------- */
/* 2) BACK-OFFICE — style ERP                                             */
/* ---------------------------------------------------------------------- */

.erp-body { background: var(--erp-bg); min-height: 100vh; }

.erp-sidebar {
    width: 264px; background: var(--erp-sidebar); color: #cfd6e6; min-height: 100vh;
    position: fixed; top:0; left:0; bottom:0; z-index: 1030; display:flex; flex-direction:column;
    transition: transform .2s ease;
}
.erp-sidebar .brand { padding: 1.15rem 1.25rem; border-bottom: 1px solid rgba(255,255,255,.08); }
.erp-sidebar .brand .name { color:#fff; font-weight:800; font-size:1.05rem; }
.erp-sidebar .brand .tag { font-size:.66rem; color:#7c8bb0; letter-spacing:.1em; text-transform:uppercase; }
.erp-sidebar .nav-section-title { font-size:.68rem; text-transform:uppercase; letter-spacing:.1em; color:#5c6889; padding: 1rem 1.25rem .35rem; }
.erp-sidebar .nav-link {
    color:#c3cbe0; padding:.55rem 1.25rem; font-size:.9rem; font-weight:500; border-left:3px solid transparent;
    display:flex; align-items:center; gap:.65rem;
}
.erp-sidebar .nav-link i { font-size:1.05rem; width:20px; text-align:center; color:#8b96b8; }
.erp-sidebar .nav-link:hover { background: var(--erp-sidebar-hover); color:#fff; }
.erp-sidebar .nav-link.active { background: var(--erp-sidebar-hover); color:#fff; border-left-color: var(--erp-accent-2); }
.erp-sidebar .nav-link.active i { color: var(--erp-accent-2); }
.erp-sidebar .sidebar-footer { margin-top:auto; padding: 1rem 1.25rem; border-top:1px solid rgba(255,255,255,.08); font-size:.76rem; color:#66739a; }

.erp-main { margin-left: 264px; min-height:100vh; display:flex; flex-direction:column; }

.erp-topbar {
    background:#fff; border-bottom:1px solid var(--erp-card-border);
    padding:.65rem 1.5rem; position:sticky; top:0; z-index:1020;
    display:flex; align-items:center; gap:1rem;
}
.erp-topbar .page-title { font-weight:700; color:#1c2333; }
.erp-topbar .icon-btn {
    width:38px; height:38px; border-radius:10px; display:flex; align-items:center; justify-content:center;
    background:#f3f5f9; color:#4a5268; position:relative; border:none;
}
.erp-topbar .icon-btn:hover { background:#e9ecf5; }
.erp-topbar .icon-btn .dot { position:absolute; top:6px; right:6px; width:8px; height:8px; border-radius:50%; background:#ef4444; border:2px solid #fff; }

.erp-content { padding: 1.5rem; flex: 1; }

.erp-card { background:#fff; border:1px solid var(--erp-card-border); border-radius: var(--erp-radius); }
.erp-card .erp-card-header { padding: 1rem 1.25rem; border-bottom:1px solid var(--erp-card-border); display:flex; align-items:center; justify-content:space-between; }
.erp-card .erp-card-body { padding: 1.25rem; }

.kpi-card {
    background:#fff; border:1px solid var(--erp-card-border); border-radius: var(--erp-radius);
    padding: 1.1rem 1.25rem; display:flex; align-items:center; gap:1rem; position:relative; overflow:hidden;
}
.kpi-card::before { content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background: var(--kpi-color, var(--erp-accent)); }
.kpi-card .kpi-icon { width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:1.25rem; background: color-mix(in srgb, var(--kpi-color, var(--erp-accent)) 14%, white); color: var(--kpi-color, var(--erp-accent)); }
.kpi-card .kpi-value { font-size:1.6rem; font-weight:800; color:#1c2333; line-height:1; }
.kpi-card .kpi-label { color: var(--erp-text-muted); font-size:.8rem; margin-top:.2rem; }

.table-erp { font-size:.88rem; }
.table-erp thead th { background:#f8f9fc; color:#5c6478; font-weight:700; font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; border-bottom:1px solid var(--erp-card-border); white-space:nowrap; }
.table-erp tbody td { vertical-align:middle; border-bottom:1px solid #f0f1f6; }
.table-erp tbody tr:hover { background:#f8f9fd; }

.badge-status { font-weight:600; font-size:.72rem; padding:.35em .6em; border-radius:8px; }

.sidebar-toggle { display:none; }

.avatar-circle {
    width:38px; height:38px; border-radius:50%; background: linear-gradient(135deg, var(--erp-accent), var(--erp-accent-2));
    color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.85rem;
}

.form-label { font-weight:600; font-size:.85rem; color:#33394b; }
.form-control, .form-select { border-radius:10px; border-color:#dfe3ee; }
.form-control:focus, .form-select:focus { border-color: var(--erp-accent); box-shadow: 0 0 0 .2rem rgba(47,111,237,.15); }

.btn-erp-primary { background: var(--erp-accent); border-color: var(--erp-accent); font-weight:600; }
.btn-erp-primary:hover { background:#2359c4; border-color:#2359c4; }

.nav-tabs-erp .nav-link { border:none; color:var(--erp-text-muted); font-weight:600; }
.nav-tabs-erp .nav-link.active { color: var(--erp-accent); border-bottom:2px solid var(--erp-accent); background:transparent; }

.timeline-item { border-left:2px solid var(--erp-card-border); padding-left:1rem; padding-bottom:1.25rem; position:relative; }
.timeline-item::before { content:""; position:absolute; left:-6px; top:2px; width:10px; height:10px; border-radius:50%; background: var(--erp-accent); }

.dropzone-upload { border:2px dashed #c7cfe3; border-radius: var(--erp-radius); background:#fafbff; text-align:center; padding: 2.5rem 1rem; cursor:pointer; }
.dropzone-upload:hover { border-color: var(--erp-accent); background:#f2f6ff; }

@media (max-width: 991.98px) {
    .erp-sidebar { transform: translateX(-100%); }
    .erp-sidebar.show { transform: translateX(0); }
    .erp-main { margin-left: 0; }
    .sidebar-toggle { display:inline-flex; }
}

.map-container { height: 560px; border-radius: var(--erp-radius); overflow:hidden; border:1px solid var(--erp-card-border); }
.map-container-sm { height: 260px; }

/* ========================================================================== 
   3) GTO Grid UI — interface claire de supervision électrique
   ========================================================================== */

:root {
    --gto-navy: #09283f;
    --gto-navy-2: #0d3856;
    --gto-blue: #0878d1;
    --gto-blue-dark: #055da5;
    --gto-teal: #12c9a5;
    --gto-teal-dark: #008f73;
    --gto-amber: #f5a524;
    --gto-ink: #102a3e;
    --erp-bg: #f4f8fb;
    --erp-sidebar: #fbfdff;
    --erp-sidebar-hover: #eef7fc;
    --erp-accent: #0878d1;
    --erp-accent-2: #00a884;
    --erp-card-border: #dce7ef;
    --erp-text-muted: #65798a;
    --erp-radius: 12px;
    --gto-shadow: 0 12px 34px rgba(25, 67, 96, .07);
}

body {
    font-family: "Segoe UI Variable", "Aptos", "Segoe UI", system-ui, -apple-system, sans-serif;
    color: var(--gto-ink);
    font-size: .94rem;
    background: #fff;
}

.gto-brand-mark {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    color: #063d63;
    background: linear-gradient(145deg, #84f0d4, #16c8a1);
    box-shadow: 0 8px 18px rgba(0, 168, 132, .2);
    position: relative;
}
.gto-brand-mark::after {
    content: "";
    position: absolute;
    inset: 5px;
    border: 1px solid rgba(255,255,255,.36);
    border-radius: 7px;
}
.gto-brand-mark i { position: relative; z-index: 1; font-size: 1.15rem; }

/* Site public */
.site-navbar {
    background: rgba(255,255,255,.92);
    border-bottom: 1px solid rgba(220,231,239,.9);
    box-shadow: 0 8px 28px rgba(13,56,86,.05);
    backdrop-filter: saturate(180%) blur(14px);
}
.site-navbar .navbar-brand {
    color: var(--gto-ink) !important;
    font-size: 1.05rem;
    letter-spacing: -.02em;
    line-height: 1;
}
.site-navbar .navbar-brand strong { color: var(--gto-blue); }
.site-navbar .navbar-brand small {
    color: #688092;
    font-size: .57rem;
    letter-spacing: .14em;
    margin-top: .24rem;
}
.site-navbar .gto-brand-mark { width: 36px; height: 36px; flex-basis: 36px; border-radius: 10px; }
.site-navbar .nav-link { color: #435a6c !important; font-size: .88rem; }
.site-navbar .nav-link:hover, .site-navbar .nav-link.active { color: var(--gto-blue) !important; }
.site-navbar .btn-cta, .btn-energy {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    color: #fff;
    background: linear-gradient(135deg, var(--gto-blue), #0566b4);
    border: 1px solid var(--gto-blue);
    border-radius: 9px;
    font-weight: 700;
    box-shadow: 0 7px 16px rgba(8,120,209,.18);
}
.site-navbar .btn-cta:hover, .btn-energy:hover, .btn-energy:focus {
    color: #fff;
    background: var(--gto-blue-dark);
    border-color: var(--gto-blue-dark);
    transform: translateY(-1px);
}
.site-hero {
    background:
        radial-gradient(circle at 12% 10%, rgba(8,120,209,.34), transparent 36%),
        radial-gradient(circle at 82% 8%, rgba(18,201,165,.2), transparent 35%),
        linear-gradient(145deg, #071f32 0%, #0b3450 55%, #0c4561 100%);
}
.site-hero::before { background-size: 48px 48px; opacity: .42; }
.section-eyebrow { color: var(--gto-blue); }
.flow-card, .family-card { border-color: var(--erp-card-border); box-shadow: 0 8px 25px rgba(25,67,96,.04); }
.flow-card .flow-num { background: linear-gradient(135deg, var(--gto-blue), var(--gto-teal-dark)); }
.family-card .icon-wrap { background: #eaf6fd; color: var(--gto-blue); }
.site-footer { background: #071f32; }
.footer-brand { display:flex; align-items:center; gap:.65rem; color:#fff; font-size:1.12rem; font-weight:600; }
.footer-brand strong { color: #64dfc2; }
.footer-brand .gto-brand-mark { width:34px; height:34px; flex-basis:34px; border-radius:9px; }

/* Back-office shell */
.erp-body {
    background-color: var(--erp-bg);
    background-image:
        linear-gradient(rgba(8,120,209,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(8,120,209,.025) 1px, transparent 1px);
    background-size: 32px 32px;
}
.erp-sidebar {
    width: 276px;
    background: rgba(251,253,255,.97);
    color: #435a6c;
    border-right: 1px solid var(--erp-card-border);
    box-shadow: 12px 0 35px rgba(23,59,83,.035);
}
.erp-sidebar .brand {
    min-height: 74px;
    padding: 1rem 1.1rem;
    display: flex;
    align-items: center;
    gap: .65rem;
    color: inherit;
    text-decoration: none;
    border-bottom: 1px solid #e7eff5;
}
.erp-sidebar .brand-copy { min-width: 0; flex: 1; }
.erp-sidebar .brand .name {
    display:block;
    color: var(--gto-ink);
    font-weight: 650;
    font-size: 1.04rem;
    letter-spacing: -.02em;
    line-height: 1.1;
}
.erp-sidebar .brand .name strong { color: var(--gto-blue); }
.erp-sidebar .brand .tag {
    display:block;
    color: #718696;
    font-size: .57rem;
    letter-spacing: .11em;
    margin-top: .25rem;
}
.voltage-badge {
    padding: .28rem .42rem;
    border-radius: 6px;
    color: #8a5b00;
    background: #fff5dc;
    border: 1px solid #f4d78f;
    font-size: .59rem;
    font-weight: 800;
    letter-spacing: .08em;
}
.network-status-card {
    margin: 1rem 1rem .25rem;
    padding: .8rem .85rem;
    color: #d8eaf5;
    background:
        linear-gradient(90deg, transparent 49%, rgba(255,255,255,.05) 50%, transparent 51%),
        linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
        linear-gradient(135deg, #0a314c, #0c4661);
    background-size: 26px 26px;
    border-radius: 10px;
    box-shadow: 0 9px 20px rgba(9,40,63,.13);
}
.network-label { font-size:.62rem; text-transform:uppercase; letter-spacing:.1em; color:#8fb0c5; }
.live-indicator { display:inline-flex; align-items:center; gap:.3rem; font-size:.62rem; color:#89f3d4; font-weight:700; }
.live-indicator span { width:6px; height:6px; border-radius:50%; background:#2ee0b3; box-shadow:0 0 0 4px rgba(46,224,179,.12); }
.network-site { font-weight:700; font-size:.83rem; }
.network-site i { color:#52ddbb; margin-right:.35rem; }
.network-meta { color:#8fb0c5; font-size:.66rem; margin-top:.2rem; }
.erp-sidebar .nav-section-title {
    color: #91a1ad;
    font-size: .61rem;
    font-weight: 800;
    letter-spacing: .13em;
    padding: 1.05rem 1.2rem .35rem;
}
.erp-sidebar .nav-link {
    color: #4d6273;
    margin: .12rem .7rem;
    padding: .6rem .72rem;
    font-size: .84rem;
    font-weight: 600;
    border: 0;
    border-radius: 8px;
    gap: .7rem;
}
.erp-sidebar .nav-link i {
    width: 22px;
    color: #718899;
    font-size: 1rem;
}
.erp-sidebar .nav-link:hover { color: var(--gto-blue-dark); background: #f0f7fb; }
.erp-sidebar .nav-link.active {
    color: var(--gto-blue-dark);
    background: linear-gradient(90deg, #e5f4fd, #edf9f7);
    box-shadow: inset 3px 0 var(--gto-teal-dark);
}
.erp-sidebar .nav-link.active i { color: var(--gto-blue); }
.erp-sidebar .sidebar-footer {
    display:flex;
    align-items:center;
    gap:.7rem;
    padding: .9rem 1.1rem;
    color:#778b99;
    background:#f6fafc;
    border-top:1px solid #e3edf3;
    font-size:.67rem;
    line-height:1.45;
}
.erp-sidebar .sidebar-footer strong { color:#435d70; font-size:.72rem; }
.footer-signal { width:30px; height:30px; flex:0 0 30px; display:flex; align-items:center; justify-content:center; border-radius:8px; background:#e2f7f0; color:var(--gto-teal-dark); font-size:1rem; }
.erp-main { margin-left: 276px; }
.erp-topbar {
    min-height:74px;
    padding:.7rem 1.65rem;
    background:rgba(255,255,255,.91);
    border-bottom:1px solid var(--erp-card-border);
    box-shadow: 0 5px 18px rgba(25,67,96,.035);
    backdrop-filter: blur(14px);
}
.topbar-heading { line-height:1.2; }
.topbar-eyebrow { display:block; color:#8496a4; font-size:.61rem; font-weight:700; letter-spacing:.11em; text-transform:uppercase; margin-bottom:.2rem; }
.erp-topbar .page-title { color:var(--gto-ink); font-size:1rem; font-weight:750; }
.topbar-icon-btn {
    width:38px;
    height:38px;
    padding:0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:#587083;
    background:#f5f9fb;
    border:1px solid #dfe9ef;
    border-radius:9px;
    position:relative;
}
.erp-topbar .sidebar-toggle { display:none; }
.topbar-icon-btn:hover { color:var(--gto-blue); background:#eef7fc; }
.topbar-icon-btn .dot { position:absolute; top:7px; right:7px; width:7px; height:7px; border-radius:50%; background:#ef5b5b; border:2px solid #fff; }
.erp-topbar .btn-energy { min-height:38px; padding:.45rem .82rem; font-size:.8rem; }
.profile-trigger {
    display:flex;
    align-items:center;
    gap:.55rem;
    padding:.25rem .35rem .25rem .25rem;
    color:inherit;
    background:transparent;
    border:0;
    border-radius:10px;
}
.profile-trigger:hover { background:#f3f8fb; }
.avatar-circle { width:38px; height:38px; background:linear-gradient(145deg, #0b719f, #08a884); box-shadow:0 5px 12px rgba(8,120,160,.16); }
.dropdown-menu { border-color:var(--erp-card-border); border-radius:10px; padding:.45rem; }
.dropdown-item { border-radius:7px; padding:.55rem .7rem; font-size:.85rem; }
.erp-content { padding: 1.55rem; }
.content-shell { width:100%; max-width:1540px; margin:0 auto; }
.sidebar-backdrop { display:none; }

/* Bootstrap métier */
.erp-card, .kpi-card {
    border: 1px solid var(--erp-card-border);
    border-radius: var(--erp-radius);
    box-shadow: var(--gto-shadow);
}
.erp-card { overflow:hidden; }
.erp-card .erp-card-header {
    min-height:64px;
    padding:.85rem 1rem;
    background:linear-gradient(180deg, #fff, #fbfdfe);
}
.erp-card .erp-card-header > div:first-child { display:flex; flex-direction:column; gap:.12rem; }
.erp-card .erp-card-header strong { color:#17364d; font-size:.9rem; }
.card-kicker { color:#91a2af; font-size:.58rem; font-weight:800; text-transform:uppercase; letter-spacing:.12em; }
.card-icon { width:32px; height:32px; display:flex; align-items:center; justify-content:center; color:var(--gto-blue); background:#eaf6fd; border-radius:8px; }
.card-link { color:var(--gto-blue); font-size:.72rem; font-weight:700; text-decoration:none; white-space:nowrap; }
.card-link:hover { color:var(--gto-blue-dark); }
.table-erp { font-size:.82rem; }
.table-erp thead th { padding:.72rem 1rem; color:#718595; background:#f7fafc; font-size:.63rem; letter-spacing:.09em; }
.table-erp tbody td { padding:.75rem 1rem; color:#304a5d; }
.table-erp tbody tr:hover { background:#f6fbfe; }
.table-erp .btn-light { color:var(--gto-blue); background:#f1f8fc; border-color:#d8e8f2 !important; border-radius:7px; }
.form-label { color:#3f5769; font-size:.78rem; font-weight:700; }
.form-control, .form-select {
    min-height:42px;
    color:#233f53;
    border-color:#d8e4ec;
    border-radius:9px;
    background-color:#fff;
    font-size:.88rem;
}
.form-control:focus, .form-select:focus { border-color:#54a7dc; box-shadow:0 0 0 .2rem rgba(8,120,209,.11); }
.btn-primary, .btn-erp-primary { background:var(--gto-blue); border-color:var(--gto-blue); }
.btn-primary:hover, .btn-erp-primary:hover { background:var(--gto-blue-dark); border-color:var(--gto-blue-dark); }
.alert { border-radius:10px; font-size:.84rem; }
.badge-status { border-radius:6px; }
.timeline-item { border-left-color:#d8e7ef; }
.timeline-item::before { background:var(--gto-teal-dark); box-shadow:0 0 0 4px #e1f7f1; }
.dropzone-upload { background:#f8fcfe; border-color:#bad8e7; }
.dropzone-upload:hover { background:#eef9fd; border-color:var(--gto-blue); }

/* Dashboard */
.dashboard-command {
    min-height:238px;
    padding:2rem 2.2rem;
    color:#fff;
    background:
        radial-gradient(circle at 88% 10%, rgba(18,201,165,.2), transparent 28%),
        linear-gradient(125deg, #092a42, #0b4763);
    border:1px solid rgba(8,120,209,.2);
    border-radius:16px;
    box-shadow:0 18px 42px rgba(9,42,66,.14);
    position:relative;
    overflow:hidden;
}
.command-grid {
    position:absolute;
    inset:0;
    opacity:.18;
    background-image:
        linear-gradient(rgba(255,255,255,.14) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.14) 1px, transparent 1px);
    background-size:38px 38px;
    mask-image:linear-gradient(90deg, transparent, #000 45%, #000);
}
.command-eyebrow { display:flex; align-items:center; gap:.55rem; color:#91ead5; font-size:.66rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; margin-bottom:.8rem; }
.dashboard-command.is-compact { min-height:0; padding:1.35rem 1.6rem; border-radius:18px; }
.dashboard-command.is-compact .command-eyebrow { margin-bottom:.3rem; }
.dashboard-command.is-compact h1 { font-size:1.35rem; margin-bottom:.3rem; }
.dashboard-command.is-compact p { margin-bottom:0; font-size:.82rem; }
.command-hero-icon {
    width:54px; height:54px; border-radius:15px; display:flex; align-items:center; justify-content:center; font-size:1.5rem;
    background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.22); color:#7ee6cd; flex:0 0 54px;
}
.command-hero-icon.tone-danger { background:rgba(239,91,91,.16); border-color:rgba(239,91,91,.35); color:#f5a3a3; }
.command-hero-icon.tone-amber { background:rgba(245,165,36,.16); border-color:rgba(245,165,36,.35); color:#f5c56b; }
.status-pulse { width:7px; height:7px; border-radius:50%; background:#52e5bd; box-shadow:0 0 0 5px rgba(82,229,189,.12); }
.dashboard-command h1 { max-width:720px; margin:0 0 .7rem; color:#fff; font-size:clamp(1.65rem, 3vw, 2.45rem); font-weight:750; letter-spacing:-.035em; line-height:1.12; }
.dashboard-command h1 span { color:#79e6cd; }
.dashboard-command p { max-width:660px; margin-bottom:1.2rem; color:#b9ceda; font-size:.9rem; line-height:1.65; }
.btn-command-primary, .btn-command-secondary { display:inline-flex; align-items:center; gap:.45rem; padding:.58rem .88rem; border-radius:8px; font-size:.78rem; font-weight:700; }
.btn-command-primary { color:#083248; background:#6fe0c4; border-color:#6fe0c4; }
.btn-command-primary:hover { color:#052638; background:#8ce9d2; border-color:#8ce9d2; }
.btn-command-secondary { color:#dcebf3; background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.22); }
.btn-command-secondary:hover { color:#fff; background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.35); }
.grid-visual { width:300px; height:190px; margin-left:auto; position:relative; }
.grid-ring { position:absolute; border:1px solid rgba(104,229,198,.25); border-radius:50%; }
.ring-one { width:170px; height:170px; left:64px; top:10px; }
.ring-two { width:112px; height:112px; left:93px; top:39px; border-style:dashed; animation:grid-spin 18s linear infinite; }
@keyframes grid-spin { to { transform:rotate(360deg); } }
.grid-node { position:absolute; display:flex; align-items:center; justify-content:center; color:#b9d5e2; background:#0d3b55; border:1px solid rgba(121,230,205,.3); box-shadow:0 8px 24px rgba(3,20,31,.22); }
.node-main { width:62px; height:62px; left:119px; top:64px; border-radius:18px; color:#79e6cd; font-size:1.6rem; }
.node-a, .node-b, .node-c { width:75px; height:40px; gap:.35rem; border-radius:9px; font-size:.7rem; font-weight:700; }
.node-a { top:2px; left:6px; }
.node-b { top:35px; right:0; }
.node-c { bottom:0; right:25px; }
.grid-node::after { content:""; position:absolute; height:1px; background:rgba(121,230,205,.38); transform-origin:left; }
.node-a::after { width:82px; left:68px; top:38px; transform:rotate(28deg); }
.node-b::after { width:76px; right:64px; top:41px; transform:rotate(151deg); transform-origin:right; }
.node-c::after { width:76px; right:64px; bottom:40px; transform:rotate(35deg); transform-origin:right; }
.section-heading { display:flex; align-items:end; justify-content:space-between; }
.section-kicker { display:block; color:var(--gto-blue); font-size:.61rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; margin-bottom:.18rem; }
.section-heading h2 { margin:0; color:#18384f; font-size:1.15rem; font-weight:750; letter-spacing:-.02em; }
.data-freshness { display:flex; align-items:center; gap:.4rem; color:#6f8494; font-size:.68rem; }
.data-freshness i { color:var(--gto-teal-dark); }
.kpi-card {
    min-height:122px;
    padding:1rem;
    gap:.85rem;
    align-items:flex-start;
    transition:transform .18s ease, box-shadow .18s ease;
}
.kpi-card:hover { transform:translateY(-2px); box-shadow:0 15px 34px rgba(25,67,96,.1); }
.kpi-card::before { width:100%; height:3px; bottom:auto; background:linear-gradient(90deg, var(--kpi-color), transparent 75%); }
.kpi-card .kpi-icon { width:42px; height:42px; flex:0 0 42px; border-radius:10px; }
.kpi-card .kpi-copy { min-width:0; }
.kpi-card .kpi-label { margin:0 0 .2rem; color:#647b8c; font-size:.68rem; font-weight:700; white-space:nowrap; }
.kpi-card .kpi-value { color:#17364d; font-size:1.65rem; font-weight:750; }
.kpi-meta { margin-top:.38rem; color:#91a2af; font-size:.61rem; white-space:nowrap; }
.kpi-meta i { color:var(--kpi-color); margin-right:.2rem; }
.kpi-blue { --kpi-color:#0878d1; }
.kpi-teal { --kpi-color:#00a884; }
.kpi-amber { --kpi-color:#e59917; }
.kpi-green { --kpi-color:#22a06b; }

/* Connexion */
.login-page {
    min-height:100vh;
    padding:112px 0 44px;
    display:flex;
    align-items:center;
    background:
        radial-gradient(circle at 10% 10%, rgba(8,120,209,.11), transparent 30%),
        linear-gradient(145deg, #eef7fb, #f9fcfd 55%, #edf8f5);
    position:relative;
    overflow:hidden;
}
.login-grid { position:absolute; inset:0; opacity:.65; background-image:linear-gradient(rgba(8,120,209,.045) 1px, transparent 1px),linear-gradient(90deg, rgba(8,120,209,.045) 1px, transparent 1px); background-size:38px 38px; mask-image:radial-gradient(circle at center, #000, transparent 78%); }
.login-shell { max-width:1060px; min-height:610px; margin:0 auto; display:grid; grid-template-columns:1.08fr .92fr; background:#fff; border:1px solid #dbe8ef; border-radius:20px; box-shadow:0 28px 70px rgba(18,61,88,.14); overflow:hidden; }
.login-story { min-width:0; padding:2.2rem; display:flex; flex-direction:column; justify-content:space-between; color:#fff; background:radial-gradient(circle at 85% 15%, rgba(18,201,165,.22), transparent 32%),linear-gradient(145deg, #082940, #0b455f); position:relative; overflow:hidden; }
.login-story::before { content:""; position:absolute; inset:0; opacity:.22; background-image:linear-gradient(rgba(255,255,255,.12) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,.12) 1px, transparent 1px); background-size:42px 42px; mask-image:linear-gradient(135deg, transparent 10%, #000 90%); }
.login-story::after { content:""; position:absolute; width:260px; height:260px; right:-90px; bottom:-110px; border:1px solid rgba(111,224,196,.25); border-radius:50%; box-shadow:0 0 0 45px rgba(111,224,196,.035), 0 0 0 90px rgba(111,224,196,.025); }
.login-story > * { position:relative; z-index:1; }
.login-story-top { display:flex; align-items:center; justify-content:space-between; }
.login-brand { display:flex; align-items:center; gap:.7rem; color:#fff; font-size:1.05rem; line-height:1; }
.login-brand strong { color:#75e4ca; }
.login-brand small { display:block; margin-top:.28rem; color:#8eafc1; font-size:.54rem; text-transform:uppercase; letter-spacing:.14em; }
.login-voltage { padding:.32rem .5rem; color:#fbd78f; background:rgba(245,165,36,.1); border:1px solid rgba(245,165,36,.3); border-radius:6px; font-size:.6rem; font-weight:800; letter-spacing:.08em; }
.login-story-copy { max-width:450px; }
.login-story-copy h1 { margin:.9rem 0 1rem; font-size:clamp(2rem, 4vw, 3rem); font-weight:750; letter-spacing:-.045em; line-height:1.05; }
.login-story-copy h1 span { color:#75e4ca; }
.login-story-copy p { max-width:420px; margin:0; color:#b8ceda; line-height:1.7; }
.login-flow { display:flex; align-items:start; }
.login-flow > div { display:flex; flex-direction:column; align-items:center; gap:.4rem; color:#afc9d7; font-size:.65rem; }
.flow-dot { width:35px; height:35px; display:flex; align-items:center; justify-content:center; color:#75e4ca; background:#0d4a64; border:1px solid rgba(117,228,202,.27); border-radius:9px; }
.flow-line { height:1px; flex:1; margin-top:17px; background:linear-gradient(90deg, rgba(117,228,202,.55), rgba(117,228,202,.12)); }
.login-panel { padding:clamp(2rem, 4vw, 3.2rem); display:flex; flex-direction:column; justify-content:center; }
.login-panel-head { margin-bottom:1.4rem; }
.login-kicker { display:block; margin-bottom:.45rem; color:var(--gto-blue); font-size:.62rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.login-panel h2 { margin:0 0 .4rem; color:#17364d; font-size:1.55rem; font-weight:750; letter-spacing:-.03em; }
.login-panel-head p { color:#778b99; font-size:.82rem; margin:0; }
.input-icon-wrap { position:relative; }
.input-icon-wrap > i { position:absolute; left:.85rem; top:50%; z-index:2; transform:translateY(-50%); color:#8295a3; }
.input-icon-wrap .form-control { padding-left:2.45rem; }
.login-form .form-control { min-height:48px; font-size:.88rem; }
.login-form .btn-energy { min-height:48px; font-size:.84rem; }
.demo-accounts { border:1px solid #dfe9ef; border-radius:9px; background:#f8fbfc; }
.demo-accounts summary { padding:.7rem .8rem; color:#536b7c; font-size:.75rem; font-weight:700; cursor:pointer; list-style:none; }
.demo-accounts summary::-webkit-details-marker { display:none; }
.demo-accounts summary::after { content:"+"; float:right; color:#7e919f; }
.demo-accounts[open] summary::after { content:"−"; }
.demo-accounts summary i { color:var(--gto-blue); margin-right:.4rem; }
.demo-accounts-body { padding:0 .8rem .75rem; border-top:1px solid #e5edf2; }
.demo-password { padding:.55rem 0; color:#708493; font-size:.67rem; }
.demo-accounts ul { list-style:none; padding:0; margin:0; }
.demo-accounts li { display:flex; justify-content:space-between; padding:.2rem 0; font-size:.66rem; }
.demo-accounts li span { color:#7d909e; }
.demo-accounts code { color:#0a6fab; }
.login-security { margin-top:1rem; color:#91a2af; text-align:center; font-size:.62rem; }
.login-security i { color:var(--gto-teal-dark); margin-right:.25rem; }
.login-brand-mobile { color:#18384f; }
.login-brand-mobile strong { color:var(--gto-blue); }
.login-page + .site-footer { margin-top:0 !important; }

@media (max-width: 1199.98px) {
    .kpi-card .kpi-label, .kpi-meta { white-space:normal; }
}

@media (max-width: 991.98px) {
    .erp-sidebar { transform:translateX(-100%); box-shadow:16px 0 40px rgba(9,40,63,.16); }
    .erp-sidebar.show { transform:translateX(0); }
    .erp-main { margin-left:0; }
    .erp-topbar .sidebar-toggle { display:inline-flex; }
    .sidebar-backdrop { display:block; position:fixed; inset:0; z-index:1025; background:rgba(5,28,43,.42); opacity:0; visibility:hidden; transition:opacity .2s, visibility .2s; backdrop-filter:blur(2px); }
    .sidebar-open .sidebar-backdrop { opacity:1; visibility:visible; }
    .sidebar-open { overflow:hidden; }
    .login-shell { max-width:520px; display:block; min-height:0; }
    .site-navbar .navbar-collapse { margin-top:.7rem; padding:.75rem; background:#fff; border:1px solid var(--erp-card-border); border-radius:10px; box-shadow:var(--gto-shadow); }
}

@media (max-width: 575.98px) {
    .erp-topbar { min-height:64px; padding:.55rem .8rem; gap:.55rem; }
    .topbar-eyebrow, .profile-trigger .bi-chevron-down { display:none; }
    .erp-topbar .page-title { max-width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.9rem; }
    .profile-trigger { padding:0; }
    .avatar-circle { width:36px; height:36px; }
    .erp-content { padding:1rem .8rem; }
    .dashboard-command { min-height:0; padding:1.4rem; border-radius:13px; }
    .dashboard-command h1 { font-size:1.65rem; }
    .dashboard-command p { font-size:.8rem; }
    .section-heading { align-items:start; }
    .data-freshness { display:none; }
    .login-page { padding:92px 0 24px; align-items:flex-start; }
    .login-page .container { padding-left:.75rem; padding-right:.75rem; }
    .login-shell { width:100%; max-width:100%; border-radius:14px; }
    .login-panel { min-width:0; padding:1.6rem 1.25rem; }
    .login-form, .input-icon-wrap, .login-form .form-control, .login-form .btn { width:100%; max-width:100%; }
    .site-navbar .navbar-brand small { display:block; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}

/* ==========================================================================
   4) Capture & OCR — composants dynamiques (file de captures, fiche capture)
   ========================================================================== */

.kpi-violet { --kpi-color:#7c3aed; }
.kpi-red { --kpi-color:#ef4444; }
.kpi-card.kpi-clickable { cursor:pointer; }
.kpi-card.is-active { box-shadow:0 0 0 2px var(--kpi-color, var(--erp-accent)), var(--gto-shadow); }

/* Pastille "live" animée — s'applique aussi aux indicateurs déjà existants (sidebar, hero) */
@keyframes livePulseRing {
    0%   { box-shadow:0 0 0 0 var(--pulse-color, rgba(82,229,189,.45)); }
    70%  { box-shadow:0 0 0 8px rgba(0,0,0,0); }
    100% { box-shadow:0 0 0 0 rgba(0,0,0,0); }
}
.status-pulse, .live-indicator span { animation:livePulseRing 1.8s ease-out infinite; }
.pulse-violet { background:#7c3aed !important; --pulse-color:rgba(124,58,237,.45); }
.pulse-red { background:#ef4444 !important; --pulse-color:rgba(239,68,68,.45); }

/* Cartes de capture (grille file d'attente) */
.capture-card { overflow:hidden; transition:transform .18s ease, box-shadow .18s ease; }
.capture-card:hover { transform:translateY(-4px); box-shadow:0 16px 32px rgba(9,40,63,.14); }
.capture-card:hover .capture-thumb img { transform:scale(1.06); }
.capture-thumb { position:relative; height:160px; overflow:hidden; background:#0b1220; }
.capture-thumb img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.capture-scrim { position:absolute; inset:0; background:linear-gradient(180deg, transparent 55%, rgba(6,20,32,.55) 100%); }
.capture-status { position:absolute; top:.6rem; right:.6rem; }
.capture-status .badge-status { box-shadow:0 3px 8px rgba(0,0,0,.3); }
.capture-confidence {
    position:absolute; bottom:.6rem; left:.6rem; display:flex; align-items:center; gap:.3rem;
    background:rgba(9,40,63,.75); color:#fff; font-size:.72rem; font-weight:700; padding:.22rem .55rem; border-radius:8px;
}
.capture-card--live { box-shadow:0 0 0 2px rgba(124,58,237,.5); }
.capture-scanline {
    position:absolute; left:0; right:0; height:3px; top:0;
    background:linear-gradient(90deg, transparent, #c4b5fd, transparent);
    box-shadow:0 0 14px 3px rgba(167,139,250,.85);
    animation:captureScan 2.2s ease-in-out infinite;
}
@keyframes captureScan { 0%{ top:0; opacity:0; } 10%{ opacity:1; } 90%{ opacity:1; } 100%{ top:100%; opacity:0; } }

/* Cadre "viseur numérique" pour l'image d'une fiche capture */
.digital-frame { position:relative; border-radius:14px; overflow:hidden; background:#0b1220; }
.digital-frame img { width:100%; display:block; }
.digital-frame .frame-corner { position:absolute; width:22px; height:22px; border-color:#5eead4; opacity:.85; }
.digital-frame .fc-tl { top:10px; left:10px; border-top:2px solid; border-left:2px solid; border-radius:4px 0 0 0; }
.digital-frame .fc-tr { top:10px; right:10px; border-top:2px solid; border-right:2px solid; border-radius:0 4px 0 0; }
.digital-frame .fc-bl { bottom:10px; left:10px; border-bottom:2px solid; border-left:2px solid; border-radius:0 0 0 4px; }
.digital-frame .fc-br { bottom:10px; right:10px; border-bottom:2px solid; border-right:2px solid; border-radius:0 0 4px 0; }
.digital-frame .frame-scanline {
    position:absolute; left:0; right:0; height:2px; top:0;
    background:linear-gradient(90deg, transparent, #5eead4, transparent);
    box-shadow:0 0 14px 3px rgba(94,234,212,.7);
    animation:captureScan 2.6s ease-in-out infinite;
}

/* Jauge de confiance OCR (anneau conique, rempli via JS pour une animation fiable) */
.confidence-ring {
    --pct: 0;
    width:88px; height:88px; border-radius:50%; flex:0 0 88px;
    background:conic-gradient(var(--ring-color, #0878d1) calc(var(--pct) * 1%), #e7edf3 0);
    display:flex; align-items:center; justify-content:center;
    transition:background 1s cubic-bezier(.22,.61,.36,1);
}
.confidence-ring-inner {
    width:70px; height:70px; border-radius:50%; background:#fff; display:flex; flex-direction:column;
    align-items:center; justify-content:center; box-shadow:inset 0 0 0 1px rgba(9,40,63,.05);
}
.confidence-ring-inner strong { font-size:1.05rem; color:#17364d; line-height:1; }
.confidence-ring-inner span { font-size:.55rem; color:#8496a4; text-transform:uppercase; letter-spacing:.06em; }

/* Sortie "terminal" pour le texte OCR brut */
.ocr-terminal { background:#0b1220; color:#c9f7ec; border-radius:10px; overflow:hidden; border:1px solid rgba(94,234,212,.18); }
.ocr-terminal-bar { display:flex; align-items:center; gap:.4rem; padding:.5rem .75rem; background:rgba(255,255,255,.04); border-bottom:1px solid rgba(255,255,255,.06); }
.ocr-terminal-bar span { width:9px; height:9px; border-radius:50%; background:#3a4b5c; }
.ocr-terminal-bar small { margin-left:.5rem; color:#7c94a3; font-size:.66rem; letter-spacing:.04em; }
.ocr-terminal pre { margin:0; padding:.85rem 1rem; font-family:"Cascadia Code","Consolas",monospace; font-size:.78rem; line-height:1.55; white-space:pre-wrap; max-height:180px; overflow:auto; }
.ocr-terminal .cursor { display:inline-block; width:7px; height:1em; background:#5eead4; vertical-align:middle; animation:cursorBlink 1s step-end infinite; }
@keyframes cursorBlink { 50% { opacity:0; } }

/* Chips de champs structurés (apparition en cascade) */
.data-chip {
    display:flex; align-items:center; gap:.6rem; padding:.6rem .75rem; border:1px solid var(--erp-card-border);
    border-radius:10px; background:#fbfdfe; opacity:0; transform:translateY(6px);
    animation:chipIn .45s ease forwards;
}
.data-chip .chip-icon { width:30px; height:30px; border-radius:8px; display:flex; align-items:center; justify-content:center; background:#eaf6fd; color:var(--gto-blue); font-size:.9rem; flex:0 0 30px; }
.data-chip .chip-label { font-size:.64rem; color:#8496a4; text-transform:uppercase; letter-spacing:.05em; }
.data-chip .chip-value { font-weight:700; color:#17364d; font-size:.86rem; }
.data-chip .chip-ocr-tag { margin-left:auto; font-size:.6rem; color:var(--gto-teal-dark); background:#e3f8f2; padding:.15rem .4rem; border-radius:6px; font-weight:700; white-space:nowrap; }
@keyframes chipIn { to { opacity:1; transform:translateY(0); } }

/* Empty state radar (localisation / OCR en attente) */
.ocr-empty-radar, .geo-empty-radar { position:relative; width:72px; height:72px; display:flex; align-items:center; justify-content:center; margin:0 auto; }
.ocr-empty-radar i, .geo-empty-radar i { position:relative; z-index:2; font-size:1.7rem; color:var(--gto-blue); }
.ocr-empty-radar span, .geo-empty-radar span { position:absolute; inset:0; border-radius:50%; border:2px solid var(--gto-blue); opacity:.55; animation:radarPulse 2.4s ease-out infinite; }
.ocr-empty-radar span:nth-child(2), .geo-empty-radar span:nth-child(2) { animation-delay:1.2s; }
@keyframes radarPulse { 0%{ transform:scale(.5); opacity:.7; } 100%{ transform:scale(2.3); opacity:0; } }

/* Fenêtres modales "fiche" — en-tête digital + tuiles d'information */
.modal-content { border:none; border-radius:18px; overflow:hidden; box-shadow:0 30px 70px rgba(9,40,63,.28); }
.digital-modal-header {
    position:relative; overflow:hidden; padding:1.4rem 1.5rem; color:#fff; border:none;
    background:
        radial-gradient(circle at 88% 8%, rgba(18,201,165,.24), transparent 30%),
        linear-gradient(135deg, #092a42, #0b4763);
}
.digital-modal-header .modal-grid {
    position:absolute; inset:0; opacity:.16;
    background-image:linear-gradient(rgba(255,255,255,.16) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.16) 1px, transparent 1px);
    background-size:30px 30px; mask-image:radial-gradient(circle at 80% 0%, #000, transparent 70%);
}
.digital-modal-header > * { position:relative; z-index:1; }
.digital-modal-header .btn-close { filter:invert(1) grayscale(1) brightness(2); opacity:.85; }
.digital-modal-header .btn-close:hover { opacity:1; }
.digital-modal-icon {
    width:52px; height:52px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:1.4rem;
    background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.22); color:#7ee6cd; flex:0 0 52px;
}
.digital-modal-header .modal-kicker { display:block; color:#8eafc1; font-size:.62rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; margin-bottom:.15rem; }
.digital-modal-header .modal-title { color:#fff; font-size:1.15rem; font-weight:750; letter-spacing:-.01em; }
.digital-modal-header .modal-title code { background:rgba(255,255,255,.14); color:#7ee6cd; border-radius:6px; padding:.08rem .4rem; font-size:.82rem; }
.digital-modal-header .modal-breadcrumb { color:#b9ceda; font-size:.78rem; margin-top:.2rem; }
.digital-modal-header .modal-breadcrumb i { color:#6fd8bf; }

.info-tile { background:#fbfdfe; border:1px solid var(--erp-card-border); border-radius:12px; padding:.7rem .85rem; display:flex; gap:.6rem; align-items:flex-start; height:100%; }
.info-tile .info-icon { width:32px; height:32px; border-radius:9px; display:flex; align-items:center; justify-content:center; background:#eaf6fd; color:var(--gto-blue); font-size:.92rem; flex:0 0 32px; }
.info-tile .info-label { font-size:.62rem; color:#8496a4; text-transform:uppercase; letter-spacing:.05em; }
.info-tile .info-value { font-weight:700; color:#17364d; font-size:.85rem; word-break:break-word; }
.modal-section-title { display:flex; align-items:center; gap:.4rem; color:#8496a4; font-size:.66rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; margin:1.3rem 0 .7rem; }
.modal-section-title:first-child { margin-top:0; }

/* Fiche équipement — formulaire dynamique par catégorie */
.form-section-title {
    display:flex; align-items:center; gap:.45rem; color:var(--gto-blue); font-size:.68rem; font-weight:800;
    letter-spacing:.1em; text-transform:uppercase; margin:.4rem 0 .3rem; padding-bottom:.5rem;
    border-bottom:1px dashed var(--erp-card-border);
}
.dynamic-field { transition:background .15s ease; border-radius:10px; padding:.35rem .4rem; margin:-.35rem -.4rem; }
.dynamic-field:focus-within { background:#f2f8ff; }
.dynamic-field .form-label .badge { font-weight:700; }
.field-state { font-size:.7rem; color:#8496a4; border-color:#e4ecf1; background:#fbfdfe; }
.field-state:focus { box-shadow:none; border-color:#c9d8e2; }
.unit-addon { background:#eaf6fd; color:var(--gto-blue); font-weight:700; font-size:.78rem; border-color:#d8e4ec; }

/* Chips d'association (travées rattachées à un équipement) */
.association-chip {
    display:inline-flex; align-items:center; gap:.5rem; background:#fbfdfe; border:1px solid var(--erp-card-border);
    border-radius:999px; padding:.35rem .5rem .35rem .8rem; font-size:.8rem; color:#17364d;
}
.association-chip i { color:var(--gto-blue); }
.association-chip small { display:block; color:#8496a4; font-size:.62rem; text-transform:uppercase; letter-spacing:.04em; }
.association-chip form { display:inline-flex; margin:0; }
.association-chip button {
    border:none; background:#eef2f7; color:#8496a4; width:20px; height:20px; border-radius:50%;
    display:inline-flex; align-items:center; justify-content:center; font-size:.7rem; line-height:1;
}
.association-chip button:hover { background:#fde2e2; color:#c0392b; }
.association-chip a { color:inherit; text-decoration:none; font-weight:650; }

/* Lot 1 — recherche, hiérarchie et qualification */
.topbar-search { position:relative; width:min(28vw, 360px); margin-left:auto; }
.topbar-search i { position:absolute; left:.75rem; top:50%; transform:translateY(-50%); color:#8396a4; }
.topbar-search input { padding-left:2.2rem; border-radius:999px; background:#f7fafc; border-color:#dce6ec; font-size:.78rem; }

.structure-tree .accordion-item { border:1px solid var(--erp-card-border); border-radius:10px !important; overflow:hidden; margin-bottom:.55rem; }
.structure-tree .accordion-button { padding:.7rem .9rem; font-size:.82rem; font-weight:700; background:#fbfdfe; }
.structure-tree .accordion-button:not(.collapsed) { color:var(--gto-blue); background:#eef8fd; box-shadow:none; }
.tree-equipment { display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding:.45rem .65rem; border-left:2px solid #c9dfe9; font-size:.78rem; }
.tree-equipment + .tree-equipment { margin-top:.35rem; }
.tree-equipment a { color:#17364d; text-decoration:none; font-weight:650; }
.empty-tree { padding:.7rem; color:#8496a4; font-size:.76rem; background:#f8fafb; border-radius:8px; }

.table-group-row td { padding:.5rem .8rem !important; color:#41657a; background:#eef5f8 !important; font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.07em; }
.comparison-table th:first-child { width:30%; }
.comparison-table thead th strong, .comparison-table thead th small { display:block; }
.comparison-table thead th code { display:block; margin-bottom:.2rem; }
.comparison-table .comparison-diff > * { background:#fff7df; }
.comparison-table .comparison-diff > *:first-child { box-shadow:inset 3px 0 #f5a524; }
.comparison-table .comparison-section td { color:#41657a; background:#eef5f8; font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.07em; }
.save-filter { position:relative; }
.save-filter > summary { list-style:none; cursor:pointer; }
.save-filter > summary::-webkit-details-marker { display:none; }
.save-filter-popover { position:absolute; z-index:20; right:0; top:calc(100% + .45rem); width:260px; padding:.8rem; background:#fff; border:1px solid var(--erp-card-border); border-radius:10px; box-shadow:0 14px 34px rgba(9,40,63,.16); }
.search-result { display:flex; align-items:center; gap:.8rem; padding:.85rem 1rem; }
.search-result-icon { width:38px; height:38px; flex:0 0 38px; display:flex; align-items:center; justify-content:center; color:var(--gto-blue); background:#eaf6fd; border-radius:10px; }

.capture-priority { position:absolute; bottom:.6rem; right:.6rem; z-index:2; display:flex; align-items:center; gap:.25rem; padding:.22rem .45rem; border-radius:7px; color:#fff; background:#b7791f; font-size:.62rem; font-weight:800; text-transform:uppercase; letter-spacing:.03em; }
.capture-priority.priority-urgente { background:#d92d20; }
.capture-priority.priority-haute { background:#b7791f; }
.capture-priority.priority-basse { background:#64748b; }
.ocr-raw { max-height:220px; overflow:auto; padding:.75rem; color:#c9f7ec; background:#0b1220; border-radius:9px; font: .72rem/1.5 "Cascadia Code",Consolas,monospace; white-space:pre-wrap; }
.ocr-box-layer { position:absolute; inset:0; pointer-events:none; }
.ocr-word-box { position:absolute; border:1px solid rgba(94,234,212,.65); background:rgba(94,234,212,.08); border-radius:2px; }
.offline-queue-status { display:flex; align-items:center; gap:.65rem; padding:.65rem .75rem; border:1px solid #cde8df; border-radius:10px; color:#286857; background:#f1fbf7; }
.offline-queue-status .status-dot { width:9px; height:9px; flex:0 0 9px; border-radius:50%; background:#22a06b; box-shadow:0 0 0 4px rgba(34,160,107,.12); }
.offline-queue-status strong, .offline-queue-status small { display:block; font-size:.7rem; }
.offline-queue-status small { color:#789087; }
.offline-queue-status.is-offline { border-color:#f1d598; color:#805a11; background:#fff9e9; }
.offline-queue-status.is-offline .status-dot { background:#f5a524; box-shadow:0 0 0 4px rgba(245,165,36,.14); }

@media (max-width: 767.98px) {
    .comparison-table { font-size:.72rem; }
    .structure-tree .accordion-button { align-items:flex-start; }
}