/* B08/B09. Default metrics are inherited unchanged from app/mobile/preparation CSS.
   Separate font/density axes; no column visibility/order/width or new fixed elements. */
:root {
  color-scheme: light;
  --text:#243c42; --page:#f5f7f6; --surface:#fff; --soft:#edf3f1;
  --title:#203b41; --secondary:#5b7377; --table-heading:#526e70;
  --error-text:#913c34; --error-bg:#fbefeb; --warning-bg:#fff0c6;
  --selected-bg:#e8f5ef; --focus:#d89832; --input-border:#bfcecb;
  --button-bg:#256b66; --button-text:#fff; --button-hover:#194e4b;
  --chart-children:#195d9a; --chart-staff:#1e7b44; --chart-required:#b44725;
  --font-factor:1; --space-factor:1;
}
:root[data-display-theme=dark] {
  color-scheme:dark;
  --text:#e6efee; --page:#152323; --surface:#203333; --soft:#2a4140;
  --title:#f1f7f6; --secondary:#b9cecb; --table-heading:#c7ded8;
  --primary:#8cdccc; --muted:#b9cecb; --border:#617f79; --input-border:#78958f;
  --error-text:#ffc5ba; --error-bg:#4c2825; --warning-bg:#443a1c;
  --selected-bg:#23483e; --focus:#ffd078;
  --button-bg:#286f65; --button-hover:#1d554c;
  --chart-children:#86c7ff; --chart-staff:#80dda3; --chart-required:#ffb28a;
}
@media(prefers-color-scheme:dark) {
  :root[data-display-theme=system] {
    color-scheme:dark;
    --text:#e6efee; --page:#152323; --surface:#203333; --soft:#2a4140;
    --title:#f1f7f6; --secondary:#b9cecb; --table-heading:#c7ded8;
    --primary:#8cdccc; --muted:#b9cecb; --border:#617f79; --input-border:#78958f;
    --error-text:#ffc5ba; --error-bg:#4c2825; --warning-bg:#443a1c;
    --selected-bg:#23483e; --focus:#ffd078;
    --button-bg:#286f65; --button-hover:#1d554c;
  --chart-children:#86c7ff; --chart-staff:#80dda3; --chart-required:#ffb28a;
  }
}
:root[data-display-contrast=strong] {
  --text:#102321; --title:#102321; --secondary:#29433e; --muted:#29433e;
  --table-heading:#102321; --border:#42665d; --input-border:#42665d;
  --primary:#124f45; --focus:#8b4e00;
}
:root[data-display-theme=dark][data-display-contrast=strong] {
  --text:#fff; --title:#fff; --secondary:#e4f2ee; --muted:#e4f2ee; --table-heading:#fff;
  --primary:#a7ffe5; --border:#b0dace; --input-border:#b0dace; --focus:#ffe0a3;
}
@media(prefers-color-scheme:dark) {
  :root[data-display-theme=system][data-display-contrast=strong] {
    --text:#fff; --title:#fff; --secondary:#e4f2ee; --muted:#e4f2ee; --table-heading:#fff;
    --primary:#a7ffe5; --border:#b0dace; --input-border:#b0dace; --focus:#ffe0a3;
  }
}
/* Only non-default palettes override historical colours. Root specificity also
   wins over later page HeadContent styles without blanket !important rules. */
:root:is([data-display-theme=dark], [data-display-contrast=strong]) {
body, dialog { color:var(--text); }
.brand, .dashboard-value, .dashboard-metrics strong { color:var(--title); }
.card p, .dashboard-card>span:not(.dashboard-kicker):not(.hint), .dashboard-balance-list { color:var(--secondary); }
input, select, textarea { color:var(--text); background:var(--surface); border-color:var(--input-border); }
button, .button { background:var(--button-bg); color:var(--button-text); }
button:hover, .button:hover { background:var(--button-hover); }
.text-button { background:transparent; color:var(--muted); }
.text-button:hover { background:transparent; color:var(--text); }
nav a, .menu-more > summary { color:var(--secondary); }
nav a:hover, .menu-more > summary:hover { color:var(--primary); background:var(--soft); }
thead th { background:var(--soft); color:var(--table-heading); }
tbody th { color:var(--secondary); }
.error, .validation-summary-errors { color:var(--error-text); background:var(--error-bg); }
.issue, .field-validation-error { color:var(--error-text); }
.notice, .secret, .status-badge, .dashboard-metrics>div { color:var(--text); background:var(--soft); }
.hero-card { background:var(--selected-bg); border-color:var(--border); }
.hero-card p { color:var(--secondary); }
.auth-body { background:var(--soft); }
:is(a, button, input, textarea, select, summary, .table-scroll):focus-visible { outline:3px solid var(--focus); outline-offset:3px; }
.bar-current { fill:var(--primary); }
.bar-reference { fill:var(--muted); }
.legend-current { color:var(--primary); }
.legend-reference { color:var(--secondary); }
/* Keep active and exceptional states distinct rather than overriding all table cells. */
.treasury-tabs a.active, .treasury-tabs a[aria-current=page], .section-tabs a.active,
.section-tabs a[aria-current=page], .schedule-page .calendar-modes a[aria-current=page] {
  background:var(--button-bg); color:var(--button-text);
}
.prep-unit h2, .prep-selected { background:var(--selected-bg); }
.prep-table thead th, .prep-table tr>th:first-child, .prep-tabs a { background:var(--soft); color:var(--text); }
.prep-over td { background:var(--error-bg); color:var(--error-text); }
.prep-dirty { background:var(--warning-bg); color:var(--text); }
.prep-unit, .prep-card, .prep-table th, .prep-table td { border-color:var(--border); }
.pilotage-page .metric-grid>div, .pilotage-facts>div, .team-chart,
.schedule-page table th:first-child { background:var(--soft); }
.team-chart text { fill:var(--text); }
.team-chart polyline[stroke="#195d9a"] { stroke:var(--chart-children); }
.team-chart polyline[stroke="#1e7b44"] { stroke:var(--chart-staff); stroke-dasharray:8 3; }
.team-chart polyline[stroke="#b44725"] { stroke:var(--chart-required); stroke-dasharray:2 3; }

}
@media(prefers-color-scheme:dark) {
:root[data-display-theme=system] {
body, dialog { color:var(--text); }
.brand, .dashboard-value, .dashboard-metrics strong { color:var(--title); }
.card p, .dashboard-card>span:not(.dashboard-kicker):not(.hint), .dashboard-balance-list { color:var(--secondary); }
input, select, textarea { color:var(--text); background:var(--surface); border-color:var(--input-border); }
button, .button { background:var(--button-bg); color:var(--button-text); }
button:hover, .button:hover { background:var(--button-hover); }
.text-button { background:transparent; color:var(--muted); }
.text-button:hover { background:transparent; color:var(--text); }
nav a, .menu-more > summary { color:var(--secondary); }
nav a:hover, .menu-more > summary:hover { color:var(--primary); background:var(--soft); }
thead th { background:var(--soft); color:var(--table-heading); }
tbody th { color:var(--secondary); }
.error, .validation-summary-errors { color:var(--error-text); background:var(--error-bg); }
.issue, .field-validation-error { color:var(--error-text); }
.notice, .secret, .status-badge, .dashboard-metrics>div { color:var(--text); background:var(--soft); }
.hero-card { background:var(--selected-bg); border-color:var(--border); }
.hero-card p { color:var(--secondary); }
.auth-body { background:var(--soft); }
:is(a, button, input, textarea, select, summary, .table-scroll):focus-visible { outline:3px solid var(--focus); outline-offset:3px; }
.bar-current { fill:var(--primary); }
.bar-reference { fill:var(--muted); }
.legend-current { color:var(--primary); }
.legend-reference { color:var(--secondary); }
/* Keep active and exceptional states distinct rather than overriding all table cells. */
.treasury-tabs a.active, .treasury-tabs a[aria-current=page], .section-tabs a.active,
.section-tabs a[aria-current=page], .schedule-page .calendar-modes a[aria-current=page] {
  background:var(--button-bg); color:var(--button-text);
}
.prep-unit h2, .prep-selected { background:var(--selected-bg); }
.prep-table thead th, .prep-table tr>th:first-child, .prep-tabs a { background:var(--soft); color:var(--text); }
.prep-over td { background:var(--error-bg); color:var(--error-text); }
.prep-dirty { background:var(--warning-bg); color:var(--text); }
.prep-unit, .prep-card, .prep-table th, .prep-table td { border-color:var(--border); }
.pilotage-page .metric-grid>div, .pilotage-facts>div, .team-chart,
.schedule-page table th:first-child { background:var(--soft); }
.team-chart text { fill:var(--text); }
.team-chart polyline[stroke="#195d9a"] { stroke:var(--chart-children); }
.team-chart polyline[stroke="#1e7b44"] { stroke:var(--chart-staff); stroke-dasharray:8 3; }
.team-chart polyline[stroke="#b44725"] { stroke:var(--chart-required); stroke-dasharray:2 3; }

}
}

:root[data-display-font=medium] { --font-factor:.9375; }
:root[data-display-font=small] { --font-factor:.875; }
:root[data-display-font=extrasmall] { --font-factor:.8125; }
:root[data-display-font=tiny] { --font-factor:.75; }
html:not([data-display-font=large]) main { font-size:calc(16px * var(--font-factor)); }
html:not([data-display-font=large]) main h1 { font-size:calc(34px * var(--font-factor)); }
html:not([data-display-font=large]) main h2 { font-size:calc(21px * var(--font-factor)); }
html:not([data-display-font=large]) main table,
html:not([data-display-font=large]) main .hint { font-size:calc(13px * var(--font-factor)); }
html:not([data-display-font=large]) main label { font-size:calc(14px * var(--font-factor)); }
html:not([data-display-font=large]) main :is(button, .button) { font-size:calc(16px * var(--font-factor)); }
html:not([data-display-font=large]) main .preparation-workspace :is(button, .button) { font-size:calc(14.4px * var(--font-factor)); }
html:not([data-display-font=large]) main .prep-table :is(button, .button) { font-size:calc(12px * var(--font-factor)); }
html:not([data-display-font=large]) main :is(input:not([type=checkbox]):not([type=radio]), select, textarea) { font-size:calc(14px * var(--font-factor)); }
:root[data-display-density=medium] { --space-factor:.8; }
:root[data-display-density=small] { --space-factor:.6; }
:root[data-display-density=extrasmall] { --space-factor:.5; }
:root[data-display-density=tiny] { --space-factor:.4; }
html:not([data-display-density=large]) main { line-height:1.45; }
html[data-display-density=small] main { line-height:1.35; }
html:is([data-display-density=extrasmall], [data-display-density=tiny]) main { line-height:1.35; }
html:not([data-display-density=large]) main:not(.auth-card) { padding:calc(28px * var(--space-factor)) calc(48px * var(--space-factor)) calc(20px * var(--space-factor)); }
html:not([data-display-density=large]) main .card { padding:calc(26px * var(--space-factor)); margin-block:calc(22px * var(--space-factor)); }
html:not([data-display-density=large]) main .dashboard-card { padding:calc(22px * var(--space-factor)); }
html:not([data-display-density=large]) main :is(p, h2) { margin-block:calc(16px * var(--space-factor)); }
html:not([data-display-density=large]) main label { margin-block:calc(14px * var(--space-factor)) calc(5px * var(--space-factor)); }
html:not([data-display-density=large]) main .form-grid { gap:calc(18px * var(--space-factor)); }
html:not([data-display-density=large]) main :is(th, td) { padding:calc(11px * var(--space-factor)) calc(13px * var(--space-factor)); }
html:not([data-display-density=large]) main .prep-table :is(th, td) { padding:calc(7.2px * var(--space-factor)); }
/* Les tableaux de diagnostic de l'aide partent de .35rem (screen-help.css), pas des 11×13 px du socle. */
html:not([data-display-density=large]) main .screen-help-diagnostic-details :is(th, td) { padding:calc(.35rem * var(--space-factor)); }
html:not([data-display-density=large]) main .prep-card { padding:calc(11.2px * var(--space-factor)); margin-block:calc(8px * var(--space-factor)); }
html:not([data-display-density=large]) main :is(input:not([type=checkbox]):not([type=radio]), select, textarea) { padding:calc(10px * var(--space-factor)) calc(12px * var(--space-factor)); }
html:not([data-display-density=large]) main form button { margin-top:calc(24px * var(--space-factor)); }
/* Desktop compact controls scale with their text, including page-local rules.
   Leave the default profile and icon-only remove controls at their established size. */
@media(min-width:768px) {
  html:not([data-display-density=large]) main :is(button, .button):not(.text-button):not(.prep-remove-button) {
    padding:calc(12px * var(--space-factor)) calc(20px * var(--space-factor));
    gap:calc(24px * var(--space-factor));
    min-height:0; min-width:0; line-height:1.35;
  }
  html:not([data-display-density=large]) main .prep-table :is(button, .button):not(.prep-remove-button) {
    padding:calc(6.4px * var(--space-factor)) calc(8px * var(--space-factor));
    gap:calc(4.8px * var(--space-factor));
  }
  html:not([data-display-density=large]) main :is(.page-actions, .prep-toolbar, .prep-heading-actions, .prep-table-actions, .prep-related-links) {
    gap:calc(12px * var(--space-factor));
  }
  html:not([data-display-density=large]) main :is(button, .button):not(.prep-remove-button) svg {
    width:1em; height:1em; flex-shrink:0;
  }
  html:not([data-display-density=large]) main .prep-times input {
    /* Keep native HH:mm readable; compact padding must not determine their width. */
    min-width:88px;
  }
}
[data-logout-dialog] { background:var(--surface); max-width:min(30rem, calc(100vw - 24px)); border:1px solid var(--border); border-radius:10px; padding:24px; }
[data-logout-dialog]::backdrop { background:#0008; }
[data-logout-dialog] button { padding:10px 16px; min-width:44px; min-height:44px; }
[data-logout-dialog] form { display:inline-block; }
html:not([data-display-theme=light][data-display-contrast=normal]) .workflow-page :is(pre, .metric-grid>div),
html:not([data-display-theme=light][data-display-contrast=normal]) .workflow-facts>div,
html:not([data-display-theme=light][data-display-contrast=normal]) .account-page .recovery-codes code,
html:not([data-display-theme=light][data-display-contrast=normal]) .pilotage-page th[colspan] { background:var(--soft); }
html:not([data-display-theme=light][data-display-contrast=normal]) :is(.scope-danger, .scope-danger-text) { color:var(--error-text); }
html:not([data-display-theme=light][data-display-contrast=normal]) footer { color:var(--muted); }
.account-display-page select { display:block; }
.account-display-page summary { min-height:44px; padding-block:8px; cursor:pointer; }
@media(max-width:900px) {
  html:not([data-display-density=large]) main:not(.auth-card) { padding:calc(24px * var(--space-factor)); }
}
@media(max-width:767px) {
  html:not([data-display-density=large]) main:not(.auth-card) { padding:calc(18px * var(--space-factor)) 12px; }
  html:not([data-display-density=large]) main .card { padding:calc(16px * var(--space-factor)); margin-block:calc(16px * var(--space-factor)); }
  html:not([data-display-font=large]) main h1 { font-size:calc(28px * var(--font-factor)); }
  main :is(button, .button, select, input:not([type=checkbox]):not([type=radio]), textarea) { min-height:44px; min-width:44px; }
  /* 16px minimum avoids iOS form zoom. Do not disable browser zoom. */
  html:not([data-display-font=large]) main :is(input:not([type=checkbox]):not([type=radio]), select, textarea) { font-size:16px; }
  main :is(.confirmation, .checkbox, .waiting-collective label:has(input[type=checkbox])) { min-height:44px; min-width:44px; }
}
@media(forced-colors:active) {
  :root { --text:CanvasText; --title:CanvasText; --secondary:CanvasText; --muted:CanvasText; --page:Canvas; --surface:Canvas; --soft:Canvas; --primary:LinkText; --border:CanvasText; --input-border:CanvasText; --focus:Highlight; --button-bg:ButtonFace; --button-text:ButtonText; }
  .bar-current, .bar-reference { fill:CanvasText; stroke:CanvasText; }
}

/* Navigation uses the same independent font/density axes as the content.
   Keep the default metrics and mobile touch targets unchanged. */
html:not([data-display-font=large]) .sidebar :is(.journey-navigation a, .menu-more > summary) {
  font-size:calc(15px * var(--font-factor));
}
html:not([data-display-font=large]) .sidebar .journey-selector button {
  font-size:calc(13px * var(--font-factor));
}
html:not([data-display-font=large]) .sidebar :is(.journey-selector select, .navigation-toggle) {
  font-size:calc(16px * var(--font-factor));
}
html:not([data-display-font=large]) .sidebar .menu-count {
  font-size:calc(12px * var(--font-factor));
}
html:not([data-display-font=large]) .sidebar .menu-icon {
  width:calc(18px * var(--font-factor)); height:calc(18px * var(--font-factor));
}
@media(min-width:768px) {
  html:not([data-display-density=large]) .sidebar :is(.journey-navigation a, .menu-more > summary) {
    padding:calc(9px * var(--space-factor)) calc(12px * var(--space-factor));
    min-height:0; line-height:1.35;
  }
  html:not([data-display-density=large]) .sidebar .journey-selector button {
    padding:calc(8px * var(--space-factor)); min-height:0; line-height:1.35;
  }
  html:not([data-display-density=large]) .sidebar .journey-selector select {
    padding:calc(10px * var(--space-factor)) calc(12px * var(--space-factor));
  }
  html:not([data-display-density=large]) .sidebar :is(.menu-item-link, .menu-more > summary) {
    gap:calc(9px * var(--space-factor));
  }
  html:not([data-display-density=large]) .sidebar .journey-navigation {
    gap:calc(6px * var(--space-factor));
  }
  html:not([data-display-density=large]) .sidebar .menu-more-links {
    gap:calc(6px * var(--space-factor)); padding-top:calc(6px * var(--space-factor));
  }
  html:not([data-display-density=large]) .sidebar .journey-selector {
    gap:calc(8px * var(--space-factor));
  }
}
@media(max-width:767px) {
  html:not([data-display-font=large]) .sidebar .journey-selector select { font-size:16px; }
}
@media(max-width:620px) {
  html:not([data-display-font=large]) .sidebar .menu-count { font-size:calc(11px * var(--font-factor)); }
  html:not([data-display-font=large]) .sidebar .menu-icon {
    width:calc(17px * var(--font-factor)); height:calc(17px * var(--font-factor));
  }
}

/* Planning d'équipe (#127, #180) : operational-team.css fixe ses couleurs. Hors profil
   clair/normal, ses teintes locales suivent les jetons de palette. Les événements et les
   cases de charge gardent leurs teintes claires et leur texte foncé (contraste mesuré). */
html:not([data-display-theme=light][data-display-contrast=normal]) .team-page {
  --team-ink:var(--text); --team-muted:var(--secondary); --team-line:var(--border);
  --team-teal:var(--primary); --team-bg:var(--page); color:var(--text);
  /* Sans JS, aucune teinte par personne n'est posée : l'événement resterait transparent
     sur fond sombre. La teinte propre à chaque événement la remplace dès qu'elle existe. */
  --person-hue:150;
}
html:not([data-display-theme=light][data-display-contrast=normal]) .team-page
  :is(p, small, span, label, div, a, summary, i):not(.team-event, .team-event *, .team-heat-cell, .team-heat-cell *, .team-avatar, .team-button, .team-button *) {
  color:var(--secondary);
}
html:not([data-display-theme=light][data-display-contrast=normal]) .team-page
  :is(h1, h2, h3, h4, strong, b, .team-week-date > strong):not(.team-event *, .team-heat-cell *, .team-avatar *) { color:var(--text); }
html:not([data-display-theme=light][data-display-contrast=normal]) .team-page :is(a, .team-link, button.team-link) { color:var(--primary); }
html:not([data-display-theme=light][data-display-contrast=normal]) .team-page .team-empty { color:var(--secondary) !important; }
html:not([data-display-theme=light][data-display-contrast=normal]) .team-page .team-warning { color:var(--error-text) !important; }
html:not([data-display-theme=light][data-display-contrast=normal]) .team-page
  :is(.team-context, .team-card, .team-view-tabs, .team-week-calendar, .team-week-axis, .team-dialog,
      .team-button:not(.primary), .team-context :is(input, select), .team-dialog :is(input, select)) {
  background:var(--surface); color:var(--text); border-color:var(--border);
}
html:not([data-display-theme=light][data-display-contrast=normal]) .team-page
  :is(.team-rule, .team-calendar-caption, .team-date-number, .team-view-tabs a.active, .team-shift-summary span:last-child,
      .team-comparison-grid > div, .team-table-scroll th, .team-compare, .team-dialog-close, .team-week-date,
      .week-mode .team-calendar-head, .team-shift-fields :is(input, select)) {
  background:var(--soft); color:var(--text); border-color:var(--border);
}
html:not([data-display-theme=light][data-display-contrast=normal]) .team-page .team-event-lanes {
  background:repeating-linear-gradient(to bottom, var(--surface) 0, var(--surface) calc(var(--team-slot,32px) - 1px),
    var(--soft) calc(var(--team-slot,32px) - 1px), var(--soft) var(--team-slot,32px));
  border-color:var(--border);
}
html:not([data-display-theme=light][data-display-contrast=normal]) .team-page :is(.team-lane, .team-week-column) { border-left-color:var(--border); }
html:not([data-display-theme=light][data-display-contrast=normal]) .team-page :is(.team-button.primary, button.team-button.primary) {
  background:var(--button-bg); color:var(--button-text); border-color:var(--button-bg);
}
html:not([data-display-theme=light][data-display-contrast=normal]) .team-page .team-error { background:var(--error-bg); color:var(--error-text); border-color:var(--border); }
html:not([data-display-theme=light][data-display-contrast=normal]) .team-page .team-success { background:var(--soft); color:var(--text); border-color:var(--border); }
html:not([data-display-theme=light][data-display-contrast=normal]) .team-heat-cell i { opacity:1; }
html:not([data-display-theme=light][data-display-contrast=normal]) .team-page .team-avatar { color:hsl(var(--person-hue) 40% 26%); }
@media(forced-colors:active) { .team-heat-cell i { opacity:1; } }
