/* =========================================================
   CSU DESIGN SYSTEM — thème Bornes unifié
   Ajout non destructif : conserve les écrans/fonctions des apps.
   ========================================================= */
:root{
  color-scheme:dark;
  --csu-bg:#080d14;
  --csu-bg-soft:#0d1621;
  --csu-sidebar:#0b121c;
  --csu-panel:#111a26;
  --csu-panel-2:#151f2d;
  --csu-input:#09111b;
  --csu-line:#243244;
  --csu-line-strong:#2b3d53;
  --csu-text:#f4f7fb;
  --csu-muted:#8997aa;
  --csu-muted-strong:#aab6c5;
  --csu-blue:#1478ff;
  --csu-blue-2:#0d5fd4;
  --csu-blue-soft:#142c4b;
  --csu-green:#36d399;
  --csu-red:#ff626f;
  --csu-amber:#f0b766;
  --csu-shadow:0 16px 45px rgba(0,0,0,.22);
  --csu-glow:rgba(16,35,60,.95);
}
html[data-theme="light"]{
  color-scheme:light;
  --csu-bg:#edf3f8;
  --csu-bg-soft:#f4f7fa;
  --csu-sidebar:#f8fafc;
  --csu-panel:#ffffff;
  --csu-panel-2:#f4f7fa;
  --csu-input:#ffffff;
  --csu-line:#d7e0e9;
  --csu-line-strong:#c8d4df;
  --csu-text:#172433;
  --csu-muted:#5d6d7d;
  --csu-muted-strong:#415466;
  --csu-blue:#0f6fe8;
  --csu-blue-2:#0b58bd;
  --csu-blue-soft:#e8f2ff;
  --csu-green:#14875f;
  --csu-red:#cf3f4b;
  --csu-amber:#9a6714;
  --csu-shadow:0 15px 38px rgba(32,52,74,.10);
  --csu-glow:rgba(36,119,220,.10);
}

/* Alias pour les différentes générations de la suite */
html[data-theme]{
  --bg:var(--csu-bg)!important;
  --bg2:var(--csu-bg-soft)!important;
  --panel:var(--csu-panel)!important;
  --panel2:var(--csu-panel-2)!important;
  --line:var(--csu-line)!important;
  --line2:var(--csu-line)!important;
  --txt:var(--csu-text)!important;
  --text:var(--csu-text)!important;
  --mut:var(--csu-muted)!important;
  --muted:var(--csu-muted)!important;
  --blue:var(--csu-blue)!important;
  --blue2:var(--csu-blue-2)!important;
}

/* Fond, typographie et lisibilité globale */
html[data-theme] body{
  background:
    radial-gradient(circle at 85% 0,var(--csu-glow) 0,transparent 30%),
    var(--csu-bg)!important;
  color:var(--csu-text)!important;
  font-family:"Segoe UI",Arial,sans-serif!important;
}
html[data-theme] body,
html[data-theme] h1,
html[data-theme] h2,
html[data-theme] h3,
html[data-theme] h4,
html[data-theme] strong,
html[data-theme] b{color:var(--csu-text)}
html[data-theme] p,
html[data-theme] .muted,
html[data-theme] .subtitle,
html[data-theme] .page-subtitle,
html[data-theme] .helper,
html[data-theme] .help,
html[data-theme] .form-help{color:var(--csu-muted)!important}
html[data-theme] label{color:var(--csu-muted-strong)!important}

/* Navigation Bornes */
html[data-theme] aside,
html[data-theme] .sidebar{
  background:var(--csu-sidebar)!important;
  border-color:var(--csu-line)!important;
}
html[data-theme] aside .brand,
html[data-theme] .sidebar .brand{color:var(--csu-text)!important}
html[data-theme] aside .brand span,
html[data-theme] aside .brand small,
html[data-theme] .sidebar .brand span,
html[data-theme] .sidebar .brand small{color:var(--csu-muted)!important}
html[data-theme] aside nav a,
html[data-theme] .sidebar nav a,
html[data-theme] .sidebar>a{
  color:var(--csu-muted-strong)!important;
}
html[data-theme] aside nav a:hover,
html[data-theme] aside nav a.active,
html[data-theme] .sidebar nav a:hover,
html[data-theme] .sidebar nav a.active,
html[data-theme] .sidebar>a:hover,
html[data-theme] .sidebar>a.active{
  background:var(--csu-blue-soft)!important;
  color:var(--csu-text)!important;
}
html[data-theme="light"] aside nav a.active,
html[data-theme="light"] .sidebar nav a.active,
html[data-theme="light"] .sidebar>a.active{
  color:#0d5aae!important;
}
html[data-theme] .nav-label,
html[data-theme] .navlabel,
html[data-theme] .aside-foot,
html[data-theme] .sidebar-foot{color:var(--csu-muted)!important}

/* Panneaux / cartes */
html[data-theme] section,
html[data-theme] .card,
html[data-theme] .panel,
html[data-theme] .table-card,
html[data-theme] .hero,
html[data-theme] .peoplebar,
html[data-theme] .metric-card,
html[data-theme] .stat-card,
html[data-theme] .dashboard-card,
html[data-theme] .form-card,
html[data-theme] .login-card,
html[data-theme] .loginbox{
  background:linear-gradient(145deg,var(--csu-panel),var(--csu-panel-2))!important;
  border-color:var(--csu-line)!important;
  color:var(--csu-text)!important;
  box-shadow:var(--csu-shadow);
}
html[data-theme="light"] .hero{
  background:linear-gradient(110deg,#ffffff,#f3f7fb)!important;
  border-color:#c8d7e7!important;
}

/* Inputs : jamais de texte noir sur fond sombre, ni blanc sur fond clair */
html[data-theme] input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
html[data-theme] textarea,
html[data-theme] select{
  background:var(--csu-input)!important;
  color:var(--csu-text)!important;
  border-color:var(--csu-line-strong)!important;
  caret-color:var(--csu-text);
}
html[data-theme] input::placeholder,
html[data-theme] textarea::placeholder{color:var(--csu-muted)!important;opacity:1}
html[data-theme] option{
  background:var(--csu-panel)!important;
  color:var(--csu-text)!important;
}
html[data-theme] input:disabled,
html[data-theme] textarea:disabled,
html[data-theme] select:disabled,
html[data-theme] .readonly{
  background:var(--csu-panel-2)!important;
  color:var(--csu-muted)!important;
  opacity:1!important;
}

/* Tableaux / listes */
html[data-theme] table{color:var(--csu-text)!important}
html[data-theme] th{
  background:var(--csu-panel-2)!important;
  color:var(--csu-muted)!important;
  border-color:var(--csu-line)!important;
}
html[data-theme] td,
html[data-theme] tr,
html[data-theme] .row,
html[data-theme] .hist,
html[data-theme] .cfg,
html[data-theme] .list-row,
html[data-theme] .notice-row{
  border-color:var(--csu-line)!important;
}
html[data-theme="light"] tbody tr:hover{background:#f5f8fb!important}

/* Actions secondaires */
html[data-theme] .secondary,
html[data-theme] .btn.secondary,
html[data-theme] .button-secondary,
html[data-theme] .ghost,
html[data-theme] .filter-btn{
  background:var(--csu-panel-2)!important;
  border-color:var(--csu-line-strong)!important;
  color:var(--csu-text)!important;
}
html[data-theme] .secondary:hover,
html[data-theme] .button-secondary:hover,
html[data-theme] .ghost:hover{
  background:var(--csu-blue-soft)!important;
  border-color:#4f86c2!important;
}
html[data-theme] .btn.primary,
html[data-theme] .btn:not(.secondary):not(.danger):not(.ghost),
html[data-theme] button.primary{
  color:#fff!important;
}

/* Barres hautes et zones sticky */
html[data-theme] .top,
html[data-theme] .topbar,
html[data-theme] .savebar,
html[data-theme] .borne-head,
html[data-theme] .clock,
html[data-theme] .fr-clock{
  background:color-mix(in srgb,var(--csu-panel) 94%,transparent)!important;
  border-color:var(--csu-line)!important;
  color:var(--csu-text)!important;
}
@supports not (background:color-mix(in srgb,white 50%,black)){
  html[data-theme] .top,
  html[data-theme] .topbar,
  html[data-theme] .savebar,
  html[data-theme] .borne-head,
  html[data-theme] .clock,
  html[data-theme] .fr-clock{background:var(--csu-panel)!important}
}

/* Zones spécifiques des apps */
html[data-theme] .main,
html[data-theme] main{color:var(--csu-text)}
html[data-theme] .access-state,
html[data-theme] .search,
html[data-theme] .quick-hint,
html[data-theme] .vehicle-list,
html[data-theme] .res p,
html[data-theme] .other-defect{
  background:var(--csu-bg-soft)!important;
  border-color:var(--csu-line)!important;
  color:var(--csu-text)!important;
}
html[data-theme] .result{background:var(--csu-panel)!important;color:var(--csu-text)!important}
html[data-theme] .address,
html[data-theme] .result-sub{color:var(--csu-muted)!important}
html[data-theme] .plate{background:#f6f7f9!important;color:#10141a!important}

/* Réquisitions : compatibilité avec sa génération CSS embarquée */
html[data-theme] .content,
html[data-theme] .page-content,
html[data-theme] .dashboard-panel,
html[data-theme] .filters,
html[data-theme] .filter-bar,
html[data-theme] .modal-content{
  color:var(--csu-text)!important;
}
html[data-theme="light"] .content,
html[data-theme="light"] .page-content{background:transparent!important}
html[data-theme="light"] .sidebar{
  box-shadow:1px 0 0 var(--csu-line);
}
html[data-theme] .page-header,
html[data-theme] .section-header{color:var(--csu-text)!important}

/* Registre / kiosque : ne pas casser les états vert/rouge */
html[data-theme] .backoffice{background:var(--csu-bg)!important;color:var(--csu-text)!important}
html[data-theme] .backoffice main{background:transparent!important}
html[data-theme="light"] .premium-kiosk{background:#edf3f8!important;color:#172433!important}
html[data-theme="light"] .premium-kiosk .pin-card,
html[data-theme="light"] .premium-kiosk .rules-card{background:#fff!important;color:#172433!important;border-color:#d7e0e9!important}
html[data-theme="dark"] .premium-kiosk input{color:#fff!important}

/* Main courante / live */
html[data-theme] .event-card,
html[data-theme] .timeline-item,
html[data-theme] .mc-card{
  background:var(--csu-panel)!important;
  border-color:var(--csu-line)!important;
  color:var(--csu-text)!important;
}

/* Messages : garder un contraste fort dans les deux thèmes */
html[data-theme] .flash.success,
html[data-theme] .notice.success{color:#0f7b56}
html[data-theme="dark"] .flash.success,
html[data-theme="dark"] .notice.success{color:#8df0c9}
html[data-theme] .flash.error,
html[data-theme] .flash.danger,
html[data-theme] .notice.error{color:#c43f4b}
html[data-theme="dark"] .flash.error,
html[data-theme="dark"] .flash.danger,
html[data-theme="dark"] .notice.error{color:#ffadb4}

/* Sélecteur de thème commun */
.csu-theme-control{
  padding:12px 7px 2px;
  margin-top:12px;
  border-top:1px solid var(--csu-line);
}
.csu-theme-toggle{
  width:100%;
  border:1px solid var(--csu-line-strong);
  background:var(--csu-panel-2);
  color:var(--csu-text);
  border-radius:10px;
  padding:10px 11px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:9px;
  font:700 12px "Segoe UI",Arial,sans-serif;
  cursor:pointer;
  transition:.18s ease;
  box-shadow:none;
}
.csu-theme-toggle:hover{
  background:var(--csu-blue-soft);
  border-color:#4b79ac;
  transform:translateY(-1px);
}
.csu-theme-toggle .csu-theme-icon{
  width:22px;height:22px;display:grid;place-items:center;
  border-radius:7px;background:var(--csu-blue-soft);color:var(--csu-blue);
  font-size:14px;flex:0 0 22px;
}
.csu-theme-toggle .csu-theme-copy{min-width:0;text-align:left}
.csu-theme-toggle .csu-theme-copy b{display:block;font-size:11px;color:var(--csu-text)}
.csu-theme-toggle .csu-theme-copy span{display:block;font-size:9px;color:var(--csu-muted);font-weight:600;margin-top:1px}
.csu-theme-control.csu-theme-floating{
  position:fixed;right:18px;bottom:18px;z-index:9999;
  margin:0;padding:0;border:0;width:180px;
}
.csu-theme-control.csu-theme-floating .csu-theme-toggle{
  box-shadow:0 10px 30px rgba(0,0,0,.22);
}

/* Focus clavier lisible */
html[data-theme] :focus-visible{
  outline:2px solid #5da2ff!important;
  outline-offset:2px;
}

/* Mobile : le bouton reste disponible sans gêner l'interface */
@media(max-width:1000px){
  aside .csu-theme-control,
  .sidebar .csu-theme-control{padding-left:0;padding-right:0}
  aside .csu-theme-toggle,
  .sidebar .csu-theme-toggle{justify-content:center;padding:9px 6px}
  aside .csu-theme-toggle .csu-theme-copy,
  .sidebar .csu-theme-toggle .csu-theme-copy{display:none}
}
@media(max-width:700px){
  .csu-theme-control.csu-theme-floating{right:12px;bottom:12px;width:auto}
  .csu-theme-control.csu-theme-floating .csu-theme-copy{display:none}
  .csu-theme-control.csu-theme-floating .csu-theme-toggle{padding:10px}
}

/* =========================================================
   Compatibilité fine des écrans historiques
   ========================================================= */

/* Inventaire réseau */
html[data-theme] .stat{
  background:linear-gradient(145deg,var(--csu-panel),var(--csu-panel-2))!important;
  border-color:var(--csu-line)!important;color:var(--csu-text)!important;
}
html[data-theme] .topsearch #suggestions{
  background:var(--csu-panel)!important;border-color:var(--csu-line)!important;color:var(--csu-text)!important;
}
html[data-theme] .topsearch #suggestions a{color:var(--csu-text)!important}
html[data-theme] .topsearch #suggestions a:hover{background:var(--csu-blue-soft)!important}
html[data-theme] .field,
html[data-theme] .filters select{background:var(--csu-input)!important;border-color:var(--csu-line-strong)!important;color:var(--csu-text)!important}
html[data-theme] .actions a,
html[data-theme] .details div,
html[data-theme] .networkstats,
html[data-theme] .ipgrid div,
html[data-theme] .importbox code{
  background:var(--csu-panel-2)!important;border-color:var(--csu-line)!important;color:var(--csu-text)!important;
}
html[data-theme] .actions a{border:1px solid var(--csu-line)!important}
html[data-theme] .actions small,
html[data-theme] .details small,
html[data-theme] .history small,
html[data-theme] .history p,
html[data-theme] .network p,
html[data-theme] .networkstats span,
html[data-theme] .ipgrid small{color:var(--csu-muted)!important}
html[data-theme] .track{background:var(--csu-line)!important}
html[data-theme] .pill,
html[data-theme] .count{background:var(--csu-blue-soft)!important;color:var(--csu-muted-strong)!important}
html[data-theme] .network .mono{color:var(--csu-muted-strong)!important}
html[data-theme="light"] .tablewrap tbody tr:hover{background:#f5f8fb!important}
html[data-theme="dark"] .tablewrap tbody tr:hover{background:#142134!important}

/* Réquisitions */
html[data-theme] .kpi,
html[data-theme] .result-kpi,
html[data-theme] .todo-item,
html[data-theme] .compare-card{
  background:linear-gradient(145deg,var(--csu-panel),var(--csu-panel-2))!important;
  border-color:var(--csu-line)!important;color:var(--csu-text)!important;
}
html[data-theme] .panel-head,
html[data-theme] .card-header{border-color:var(--csu-line)!important}
html[data-theme] .kpi-label,
html[data-theme] .kpi-note,
html[data-theme] .panel-sub,
html[data-theme] .bar-label,
html[data-theme] .chart-axis,
html[data-theme] .donut-center small,
html[data-theme] .results,
html[data-theme] .pagination-info,
html[data-theme] .todo-item span,
html[data-theme] .compare-card small,
html[data-theme] .result-kpi span,
html[data-theme] .result-kpi small,
html[data-theme] .topbar-identity small,
html[data-theme] .user-chip small{color:var(--csu-muted)!important}
html[data-theme] .mini,
html[data-theme] .filter-chip,
html[data-theme] .todo-pill,
html[data-theme] .pagination-bar,
html[data-theme] .donut:after{
  background:var(--csu-bg-soft)!important;border-color:var(--csu-line)!important;color:var(--csu-muted-strong)!important;
}
html[data-theme] .mini b,
html[data-theme] .results strong,
html[data-theme] .operator,
html[data-theme] .top-tool strong,
html[data-theme] .topbar-identity strong,
html[data-theme] .user-chip strong,
html[data-theme] .todo-item strong{color:var(--csu-text)!important}
html[data-theme] .date,
html[data-theme] .nature,
html[data-theme] .observations,
html[data-theme] .legend-row,
html[data-theme] .legend-count{color:var(--csu-muted-strong)!important}
html[data-theme] .unassigned,
html[data-theme] .legend-pct{color:var(--csu-muted)!important}
html[data-theme="light"] .reference{background:#e8f2ff!important;color:#0b5dbb!important;border-color:#bfd7f2!important}
html[data-theme="light"] .action-btn{background:#f4f8fc!important;color:#145eac!important;border-color:#c6d9ea!important}
html[data-theme="light"] .todo-pill.warn{background:#fff5df!important;color:#8b5a05!important;border-color:#ebcf91!important}
html[data-theme="light"] .variation{background:#e9f8f0!important;color:#14704f!important}
html[data-theme="light"] .variation.down{background:#fdecef!important;color:#b73b47!important}
html[data-theme="light"] .clear-chip{background:#fdecef!important;color:#b73b47!important;border-color:#efb7bd!important}

/* Main Courante */
html[data-theme] .suggest{
  background:var(--csu-panel)!important;border-color:var(--csu-line-strong)!important;color:var(--csu-text)!important;
}
html[data-theme] .suggest button{color:var(--csu-text)!important}
html[data-theme] .suggest button:hover{background:var(--csu-blue-soft)!important}
html[data-theme] .suggest small,
html[data-theme] .composer-hint,
html[data-theme] .severity-option small{color:var(--csu-muted)!important}
html[data-theme] .chips span,
html[data-theme] .camera-chips span,
html[data-theme] .composer-hint kbd,
html[data-theme] .archive-label{
  background:var(--csu-panel-2)!important;border-color:var(--csu-line)!important;color:var(--csu-muted-strong)!important;
}
html[data-theme] .premium-feed .entry p,
html[data-theme] .premium-empty b{color:var(--csu-text)!important}
html[data-theme="light"] .premium-composer{
  background:linear-gradient(180deg,#ffffff,#f5f8fb)!important;border-color:#cbd8e5!important;box-shadow:var(--csu-shadow)!important;
}
html[data-theme="light"] .severity-option{
  background:#f7f9fc!important;border-color:#d6e0ea!important;color:#172433!important;
}
html[data-theme="light"] .severity-option:hover{background:#edf4fb!important;border-color:#aac5df!important}
html[data-theme="light"] .severity-option.active{background:#e8f2ff!important;border-color:#6ca4df!important}
html[data-theme="light"] .livebody{background:#edf3f8!important;color:#172433!important}
html[data-theme="light"] .livebody .kpi,
html[data-theme="light"] .live-row{background:#fff!important;color:#172433!important;border-color:#d7e0e9!important}

/* Portail / horloges / cartes */
html[data-theme] .access-state strong{color:var(--csu-muted-strong)!important}
html[data-theme] .clock span,
html[data-theme] .fr-clock span,
html[data-theme] .clock small,
html[data-theme] .fr-clock small{color:var(--csu-muted)!important}
html[data-theme] .avatar{background:var(--csu-panel-2)!important;border-color:var(--csu-line-strong)!important;color:var(--csu-text)!important}
html[data-theme] footer{color:var(--csu-muted)!important;border-color:var(--csu-line)!important}

/* Login commun */
html[data-theme] .login-page,
html[data-theme] .loginbody{
  background:radial-gradient(circle at 70% 25%,var(--csu-glow) 0,transparent 31%),var(--csu-bg)!important;
}
html[data-theme] .login-brand p,
html[data-theme] .login-foot,
html[data-theme] .system{color:var(--csu-muted)!important}

/* =========================================================
   CSU DESIGN SYSTEM V2 — coque d'interface commune Bornes
   ========================================================= */
:root{--csu-sidebar-width:245px;--csu-sidebar-collapsed:76px;--csu-radius:15px;--csu-radius-sm:10px;--csu-white:#f4f4f1;--csu-accent:#ed2939}
body.csu-shell{min-height:100vh;background:radial-gradient(circle at 85% 0,var(--csu-glow) 0,transparent 27%),var(--csu-bg)!important;color:var(--csu-text)!important}
body.csu-shell>aside,body.csu-shell>.sidebar,.backoffice>aside{
  position:fixed!important;inset:0 auto 0 0!important;width:var(--csu-sidebar-width)!important;
  background:var(--csu-sidebar)!important;border-right:1px solid var(--csu-line)!important;
  padding:27px 17px 18px!important;display:flex!important;flex-direction:column!important;z-index:50!important;
  overflow-y:auto!important;overflow-x:hidden!important
}
body.csu-shell .brand,.backoffice .brand{display:flex!important;gap:12px!important;align-items:center!important;padding:0 8px 14px!important;text-decoration:none!important;min-height:58px!important}
body.csu-shell .brand>div:last-child,.backoffice .brand>div:last-child{display:grid!important;min-width:0!important}
body.csu-shell .brand strong,.backoffice .brand strong{font-size:15px!important;line-height:1.15!important;color:var(--csu-text)!important;white-space:normal!important}
body.csu-shell .brand span,.backoffice .brand span{font-size:10px!important;color:var(--csu-muted)!important;margin-top:4px!important;line-height:1.25!important}
body.csu-shell .logo-wrap,.backoffice .logo-wrap{width:58px!important;height:58px!important;border-radius:50%!important;overflow:hidden!important;flex:0 0 58px!important;border:2px solid #fff!important;box-shadow:0 5px 24px #0008,0 0 0 3px color-mix(in srgb,var(--csu-blue) 40%,#0d3a61)!important;background:var(--csu-panel)!important;display:block!important}
body.csu-shell .logo-wrap img,.backoffice .logo-wrap img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important}
body.csu-shell .flagline,.backoffice .flagline{height:3px!important;display:grid!important;grid-template-columns:1fr 1fr 1fr!important;margin:0 9px 21px!important;border-radius:4px!important;overflow:hidden!important;opacity:.9!important;flex:0 0 auto!important}
body.csu-shell .flagline i:nth-child(1),.backoffice .flagline i:nth-child(1){background:var(--csu-blue)!important}
body.csu-shell .flagline i:nth-child(2),.backoffice .flagline i:nth-child(2){background:var(--csu-white)!important}
body.csu-shell .flagline i:nth-child(3),.backoffice .flagline i:nth-child(3){background:var(--csu-accent)!important}
body.csu-shell aside nav,body.csu-shell .sidebar nav,.backoffice aside nav{display:grid!important;gap:6px!important;align-content:start!important}
body.csu-shell aside nav a,body.csu-shell .sidebar nav a,.backoffice aside nav a{
  display:flex!important;align-items:center!important;gap:10px!important;min-height:44px!important;
  padding:11px 13px!important;border-radius:10px!important;color:var(--csu-muted-strong)!important;
  text-decoration:none!important;border:1px solid transparent!important;font-size:13px!important;font-weight:650!important;
  transition:background .18s ease,color .18s ease,transform .18s ease!important
}
body.csu-shell aside nav a:hover,body.csu-shell .sidebar nav a:hover,.backoffice aside nav a:hover{background:var(--csu-blue-soft)!important;color:var(--csu-text)!important;transform:translateX(2px)!important}
body.csu-shell aside nav a > span:not(.nav-icon),body.csu-shell .sidebar nav a > span:not(.nav-icon),.backoffice aside nav a > span:not(.nav-icon){width:auto!important;min-width:0!important;flex:1 1 auto!important;text-align:left!important;white-space:normal!important;overflow-wrap:normal!important;word-break:normal!important;line-height:1.3!important}
body.csu-shell aside nav a.active,body.csu-shell .sidebar nav a.active,.backoffice aside nav a.active{background:linear-gradient(90deg,color-mix(in srgb,var(--csu-blue) 22%,transparent),transparent)!important;color:var(--csu-text)!important;border-color:color-mix(in srgb,var(--csu-blue) 34%,transparent)!important;box-shadow:inset 3px 0 0 var(--csu-blue)!important}
body.csu-shell .nav-label,.backoffice .nav-label{margin:13px 11px 3px!important;color:var(--csu-muted)!important;font-size:9px!important;letter-spacing:1.25px!important;font-weight:850!important;text-transform:uppercase!important}
body.csu-shell .nav-icon{width:18px!important;text-align:center!important;flex:0 0 18px!important}
body.csu-shell .aside-user,.backoffice .aside-user{
  margin-top:auto!important;border-top:1px solid var(--csu-line)!important;padding:14px 5px 0!important;
  display:grid!important;grid-template-columns:1fr auto auto!important;gap:8px!important;align-items:center!important;position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;z-index:3!important
}
body.csu-shell .aside-user>div,.backoffice .aside-user>div{display:grid!important;min-width:0!important}
body.csu-shell .aside-user b,.backoffice .aside-user b{font-size:11px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
body.csu-shell .aside-user span,.backoffice .aside-user span{font-size:9px!important;color:var(--csu-muted)!important;margin-top:2px!important}
body.csu-shell .aside-user a,.backoffice .aside-user a{color:var(--csu-muted)!important;text-decoration:none!important;padding:6px!important;border-radius:8px!important}
body.csu-shell .aside-user a:hover,.backoffice .aside-user a:hover{background:var(--csu-blue-soft)!important;color:var(--csu-text)!important}
body.csu-shell .aside-bottom{margin-top:auto!important}
body.csu-shell .csu-theme-control,.backoffice .csu-theme-control{margin-top:12px!important;padding:12px 5px 0!important;border-top:1px solid var(--csu-line)!important;order:90}
body.csu-shell .csu-global-watermark,.backoffice .csu-global-watermark{display:var(--csu-watermark-display,block);pointer-events:none!important;opacity:var(--wm-opacity,.055)!important}
body.csu-watermark-disabled .csu-global-watermark{display:none!important}
body[data-csu-watermark="lynx"] .csu-global-watermark img{transform:scale(2.05)!important}
body[data-csu-watermark="logo"] .csu-global-watermark img{transform:scale(1)!important}
body.csu-shell .lynx-watermark,body.csu-shell .wolf-watermark,body.csu-shell .req-lynx,.backoffice .wolf-watermark{
  position:absolute!important;left:34px!important;bottom:96px!important;width:178px!important;height:178px!important;border-radius:50%!important;overflow:hidden!important;filter:none!important
}
body.csu-shell .lynx-watermark img,body.csu-shell .wolf-watermark img,body.csu-shell .req-lynx img,.backoffice .wolf-watermark img{width:100%!important;height:100%!important;object-fit:cover!important;filter:grayscale(1)!important}
body.csu-shell>.main-shell,body.csu-shell>main,body.csu-shell>section.main,.backoffice>main.bo-main{margin-left:var(--csu-sidebar-width)!important;min-width:0!important}
body.csu-shell>main,body.csu-shell>section.main,.backoffice>main.bo-main{padding:40px 46px!important;max-width:none!important;width:auto!important}
body.csu-shell>.main-shell{width:auto!important;min-height:100vh!important}
body.csu-shell>.main-shell>.page{margin:0!important;padding:32px 46px!important;max-width:none!important}
body.csu-shell .top-accent,.backoffice .top-accent{position:fixed!important;top:0!important;left:var(--csu-sidebar-width)!important;right:0!important;height:3px!important;display:grid!important;grid-template-columns:1fr 1fr 1fr!important;z-index:80!important;opacity:.82!important}
body.csu-shell .top-accent span:nth-child(1),.backoffice .top-accent span:nth-child(1){background:var(--csu-blue)!important}
body.csu-shell .top-accent span:nth-child(2),.backoffice .top-accent span:nth-child(2){background:var(--csu-white)!important}
body.csu-shell .top-accent span:nth-child(3),.backoffice .top-accent span:nth-child(3){background:var(--csu-accent)!important}
body.csu-shell header.csu-page-header,body.csu-shell .topbar.csu-page-header,.backoffice header{display:flex!important;justify-content:space-between!important;align-items:center!important;gap:20px!important;margin:0 0 27px!important;background:transparent!important;border:0!important;height:auto!important;min-height:72px!important;padding:0!important;box-shadow:none!important}
body.csu-shell .topbar.csu-page-header:before,body.csu-shell .topbar.csu-page-header:after{display:none!important}
body.csu-shell .csu-app-toolbar{background:var(--csu-panel)!important;border:1px solid var(--csu-line)!important;border-radius:var(--csu-radius)!important;box-shadow:var(--csu-shadow)!important;padding:14px 16px!important;margin-bottom:18px!important}
body.csu-shell section,body.csu-shell .card,body.csu-shell .panel,.backoffice section{border-radius:var(--csu-radius)!important}
body.csu-shell .btn,body.csu-shell button,.backoffice .btn,.backoffice button{border-radius:var(--csu-radius-sm)!important}
body.csu-shell .main-lynx{position:fixed!important;right:4vw!important;bottom:-5vh!important;width:460px!important;height:460px!important;border-radius:50%!important;overflow:hidden!important;z-index:-1!important}
body.csu-shell .main-lynx img{width:100%!important;height:100%!important;object-fit:cover!important;filter:grayscale(1)!important}

/* Personnalisation globale du portail */
.personal-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.personal-grid>section{margin:0}.personal-grid>.wide,.settings-save{grid-column:1/-1}.settings-form{display:grid;grid-template-columns:1fr 1fr;gap:15px}.settings-form .wide{grid-column:1/-1}.color-grid{grid-template-columns:repeat(3,1fr)}.sectionhead{margin-bottom:18px}.brand-preview{display:flex;align-items:center;gap:14px;padding:12px;border:1px solid var(--csu-line);border-radius:12px;background:var(--csu-panel-2);margin-bottom:10px}.brand-preview img{width:62px;height:62px;border-radius:50%;object-fit:cover;border:2px solid #fff}.brand-preview p{font-size:11px}.check-box{display:flex;align-items:end}.switchline{display:flex!important;align-items:center;gap:8px;margin:0!important;padding:12px 0}.switchline input{width:auto!important}.unity-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.unity-grid>div{display:grid;gap:5px;padding:15px;border:1px solid var(--csu-line);border-radius:12px;background:var(--csu-panel-2)}.unity-grid span{color:var(--csu-muted);font-size:12px}

@media(max-width:1000px){
  body.csu-shell>aside,body.csu-shell>.sidebar,.backoffice>aside{width:var(--csu-sidebar-collapsed)!important;padding:20px 9px!important}
  body.csu-shell>.main-shell,body.csu-shell>main,body.csu-shell>section.main,.backoffice>main.bo-main{margin-left:var(--csu-sidebar-collapsed)!important}
  body.csu-shell .top-accent,.backoffice .top-accent{left:var(--csu-sidebar-collapsed)!important}
  body.csu-shell .brand>div:last-child,.backoffice .brand>div:last-child,body.csu-shell nav a span:not(.nav-icon),.backoffice nav a span,body.csu-shell .nav-label,.backoffice .nav-label,body.csu-shell .aside-user>div,.backoffice .aside-user>div{display:none!important}
  body.csu-shell .brand,.backoffice .brand{padding-left:0!important;padding-right:0!important;justify-content:center!important}
  body.csu-shell .logo-wrap,.backoffice .logo-wrap{width:48px!important;height:48px!important;flex-basis:48px!important}
  body.csu-shell aside nav a,body.csu-shell .sidebar nav a,.backoffice aside nav a{justify-content:center!important;padding:11px 8px!important}
  body.csu-shell .aside-user,.backoffice .aside-user{grid-template-columns:1fr 1fr!important}
  body.csu-shell .lynx-watermark,body.csu-shell .wolf-watermark,body.csu-shell .req-lynx,.backoffice .wolf-watermark{display:none!important}
  body.csu-shell>.main-shell>.page,body.csu-shell>main,body.csu-shell>section.main,.backoffice>main.bo-main{padding-left:20px!important;padding-right:20px!important}
}
@media(max-width:760px){.personal-grid,.settings-form,.color-grid,.unity-grid{grid-template-columns:1fr}.personal-grid>.wide,.settings-save,.settings-form .wide{grid-column:auto}}


/* =========================================================
   CSU DESIGN SYSTEM V3 — coque et composants réellement communs
   Bornes reste la référence visuelle de l'ensemble de la suite.
   ========================================================= */
body.csu-shell .top-accent i,.backoffice .top-accent i{display:block!important}
body.csu-shell .top-accent i:nth-child(1),.backoffice .top-accent i:nth-child(1){background:var(--csu-blue)!important}
body.csu-shell .top-accent i:nth-child(2),.backoffice .top-accent i:nth-child(2){background:var(--csu-white,#f4f5f6)!important}
body.csu-shell .top-accent i:nth-child(3),.backoffice .top-accent i:nth-child(3){background:var(--csu-accent,var(--csu-red))!important}

/* Même rythme de page que Bornes */
body.csu-shell .page,body.csu-shell .content,body.csu-shell .container,body.csu-shell .wrap{max-width:none!important}
body.csu-shell .page-header{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:18px!important;margin:0 0 22px!important}
body.csu-shell .page-title{font-size:25px!important;letter-spacing:-.025em!important;color:var(--csu-text)!important}
body.csu-shell .page-subtitle{font-size:12px!important;color:var(--csu-muted)!important}

/* Surfaces secondaires : plus de panneaux noirs résiduels en thème clair */
html[data-theme] body.csu-shell .kpi,
html[data-theme] body.csu-shell .compare-card,
html[data-theme] body.csu-shell .todo-item,
html[data-theme] body.csu-shell .filters-panel,
html[data-theme] body.csu-shell .filter-panel,
html[data-theme] body.csu-shell .pagination-bar,
html[data-theme] body.csu-shell .vehicle-list,
html[data-theme] body.csu-shell .quick-hint,
html[data-theme] body.csu-shell .ref-tabs,
html[data-theme] body.csu-shell .toolbar,
html[data-theme] body.csu-shell .summary,
html[data-theme] body.csu-shell .metric,
html[data-theme] body.csu-shell .stat,
html[data-theme] body.csu-shell .result,
html[data-theme] body.csu-shell .result-body,
html[data-theme] body.csu-shell .list-item,
html[data-theme] body.csu-shell .item-card{
  background:var(--csu-panel)!important;
  border-color:var(--csu-line)!important;
  color:var(--csu-text)!important;
  box-shadow:var(--csu-shadow)!important;
}
html[data-theme="light"] body.csu-shell .panel-head,
html[data-theme="light"] body.csu-shell .card-header,
html[data-theme="light"] body.csu-shell .pagination-bar,
html[data-theme="light"] body.csu-shell .ref-tabs{background:var(--csu-panel-2)!important;border-color:var(--csu-line)!important}
html[data-theme="light"] body.csu-shell .mini,
html[data-theme="light"] body.csu-shell .todo-pill,
html[data-theme="light"] body.csu-shell .filter-chip,
html[data-theme="light"] body.csu-shell .quick-hint,
html[data-theme="light"] body.csu-shell .stat{background:var(--csu-blue-soft)!important;border-color:var(--csu-line)!important;color:var(--csu-muted-strong)!important}

/* Textes issus d'anciennes versions : contraste systématique */
html[data-theme] body.csu-shell .kpi-label,
html[data-theme] body.csu-shell .kpi-note,
html[data-theme] body.csu-shell .panel-sub,
html[data-theme] body.csu-shell .todo-item span,
html[data-theme] body.csu-shell .compare-card small,
html[data-theme] body.csu-shell .result-sub,
html[data-theme] body.csu-shell .address,
html[data-theme] body.csu-shell .clock,
html[data-theme] body.csu-shell .top-tool,
html[data-theme] body.csu-shell .top-brand p{color:var(--csu-muted)!important}
html[data-theme] body.csu-shell .kpi-value,
html[data-theme] body.csu-shell .panel-title,
html[data-theme] body.csu-shell .todo-item strong,
html[data-theme] body.csu-shell .compare-card strong,
html[data-theme] body.csu-shell .person{color:var(--csu-text)!important}

/* Tableaux : même lecture dans les deux thèmes */
html[data-theme] body.csu-shell tbody tr,
html[data-theme] body.csu-shell .table tbody tr{background:var(--csu-panel)!important}
html[data-theme] body.csu-shell tbody tr:nth-child(even),
html[data-theme] body.csu-shell .table tbody tr:nth-child(even){background:var(--csu-panel-2)!important}
html[data-theme] body.csu-shell tbody tr:hover,
html[data-theme] body.csu-shell .table tbody tr:hover{background:var(--csu-blue-soft)!important}
html[data-theme] body.csu-shell td{color:var(--csu-muted-strong)!important;border-color:var(--csu-line)!important}

/* Boutons secondaires homogènes */
html[data-theme] body.csu-shell .btn-secondary,
html[data-theme] body.csu-shell .button-secondary,
html[data-theme] body.csu-shell button.secondary,
html[data-theme] body.csu-shell a.secondary{background:var(--csu-panel-2)!important;color:var(--csu-text)!important;border:1px solid var(--csu-line-strong)!important}
html[data-theme] body.csu-shell .btn-primary,
html[data-theme] body.csu-shell .button:not(.button-secondary):not(.button-danger),
html[data-theme] body.csu-shell button.primary{background:linear-gradient(135deg,var(--csu-blue),var(--csu-blue-2))!important;color:#fff!important}

/* Le bouton de thème a exactement la même place et le même rendu partout */
.csu-theme-toggle{width:100%!important;min-height:44px!important;display:flex!important;align-items:center!important;gap:10px!important;padding:9px 11px!important;background:transparent!important;border:1px solid var(--csu-line)!important;border-radius:10px!important;color:var(--csu-muted-strong)!important;cursor:pointer!important;text-align:left!important}
.csu-theme-toggle:hover{background:var(--csu-blue-soft)!important;color:var(--csu-text)!important}
.csu-theme-icon{width:20px!important;text-align:center!important;font-size:16px!important}.csu-theme-copy{display:grid!important;gap:1px!important}.csu-theme-copy b{font-size:11px!important;color:inherit!important}.csu-theme-copy span{font-size:9px!important;color:var(--csu-muted)!important}
.csu-theme-floating{position:fixed!important;right:18px!important;bottom:18px!important;width:180px!important;z-index:9999!important;padding:0!important;border:0!important}

/* Écrans de connexion qui subsistent localement */
html[data-theme] .login-page,html[data-theme] .loginbody{background:var(--csu-bg)!important;color:var(--csu-text)!important}
html[data-theme] .login-card,html[data-theme] .loginbox{background:var(--csu-panel)!important;border-color:var(--csu-line)!important}

@media(max-width:1000px){
  .csu-theme-copy{display:none!important}.csu-theme-toggle{justify-content:center!important;padding:9px 6px!important}
}