/* Atelier Billets — tokens Alterium Manager (am-tokens), clair + sombre */
:root{
  --color-primary:#2563eb; --color-primary-strong:#1d4ed8; --color-primary-soft:#dbeafe;
  --color-accent:#10b981;
  --color-bg:#f3f5f8; --color-bg-elevated:#ffffff; --color-bg-sunken:#e9edf3;
  --color-text:#111827; --color-text-muted:#667085; --color-border:#e4e7ec; --color-border-strong:#cfd5df;
  --color-success:#059669; --color-success-soft:#d1fae5; --color-warning:#d97706; --color-warning-soft:#fef3c7; --color-danger:#dc2626; --color-danger-soft:#fee2e2;
  --seat-free:#10b981; --seat-free-ink:#052e22; --seat-occ:#d0d5dd; --seat-occ-ink:#475467; --seat-pend:#f59e0b; --seat-pend-ink:#3b2300;
  --radius-sm:.25rem; --radius:.5rem; --radius-lg:.85rem; --radius-pill:999px;
  --shadow:0 1px 2px rgb(16 24 40 / .06), 0 1px 3px rgb(16 24 40 / .1);
  --font:"Segoe UI","Helvetica Neue",Arial,sans-serif; --mono:Consolas,"Cascadia Mono",ui-monospace,monospace;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --color-primary:#60a5fa; --color-primary-strong:#93c5fd; --color-primary-soft:#1e3a5f; --color-accent:#34d399;
  --color-bg:#0f141c; --color-bg-elevated:#171e29; --color-bg-sunken:#0b0f15;
  --color-text:#e6e9ef; --color-text-muted:#98a2b3; --color-border:#2a3340; --color-border-strong:#3b4656;
  --color-success:#34d399; --color-success-soft:#0b3b2a; --color-warning:#fbbf24; --color-warning-soft:#3a2a07; --color-danger:#f87171; --color-danger-soft:#3f1414;
  --seat-free:#34d399; --seat-occ:#3a4454; --seat-occ-ink:#b4bcc9; --seat-pend:#fbbf24;
  --shadow:0 1px 2px rgb(0 0 0 / .4); color-scheme:dark}}
:root[data-theme="dark"]{
  --color-primary:#60a5fa; --color-primary-strong:#93c5fd; --color-primary-soft:#1e3a5f; --color-accent:#34d399;
  --color-bg:#0f141c; --color-bg-elevated:#171e29; --color-bg-sunken:#0b0f15;
  --color-text:#e6e9ef; --color-text-muted:#98a2b3; --color-border:#2a3340; --color-border-strong:#3b4656;
  --color-success:#34d399; --color-success-soft:#0b3b2a; --color-warning:#fbbf24; --color-warning-soft:#3a2a07; --color-danger:#f87171; --color-danger-soft:#3f1414;
  --seat-free:#34d399; --seat-occ:#3a4454; --seat-occ-ink:#b4bcc9; --seat-pend:#fbbf24;
  --shadow:0 1px 2px rgb(0 0 0 / .4); color-scheme:dark}

*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--color-bg);color:var(--color-text);font-family:var(--font);font-size:14px;line-height:1.5}
h1,h2,h3{margin:0;line-height:1.2;text-wrap:balance}
h1{font-size:1.25rem;font-weight:600}h2{font-size:1.1rem;font-weight:600}h3{font-size:.95rem;font-weight:600}
p{margin:0}
.muted{color:var(--color-text-muted)}.mono{font-family:var(--mono);font-size:.92em}.num{font-variant-numeric:tabular-nums}
a{color:var(--color-primary)}
:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}
[hidden]{display:none!important}

/* En-tête + navigation */
.am-page-header{position:sticky;top:0;z-index:5;background:var(--color-bg-elevated);border-bottom:1px solid var(--color-border);padding:var(--s2) max(16px,env(safe-area-inset-left,0px))}
.am-page-header .user{display:flex;align-items:center;gap:var(--s2);margin-left:auto}
.am-page-header .inner{max-width:1240px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2) var(--s4)}
.brand{font-weight:700;letter-spacing:.08em;font-size:.8rem;padding-right:var(--s4);border-right:1px solid var(--color-border)}
nav.tabs{display:flex;gap:var(--s1);flex-wrap:wrap}
nav.tabs a{text-decoration:none;color:var(--color-text-muted);padding:8px 12px;min-height:40px;display:inline-flex;align-items:center;gap:6px;border-radius:var(--radius-sm);font-weight:600;transition-property:background-color,color;transition-duration:150ms}
nav.tabs a:hover{background:var(--color-bg)}
nav.tabs a[aria-current="page"]{background:var(--color-primary-soft);color:var(--color-primary)}
nav.tabs .count{background:var(--color-bg-sunken);color:var(--color-text-muted);border-radius:var(--radius-pill);padding:0 7px;font-size:.72rem}
.status{margin-left:auto;display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center}
main{max-width:1240px;margin:0 auto;padding:var(--s5) max(16px,env(safe-area-inset-left,0px)) 64px;display:grid;gap:var(--s5)}
.screen{display:grid;gap:var(--s4)}
.screen-head{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2) var(--s4)}
.screen-head .actions{margin-left:auto;display:flex;gap:var(--s2);flex-wrap:wrap}

/* Pills */
.pill{display:inline-flex;align-items:center;gap:6px;padding:2px 10px;border-radius:var(--radius-pill);font-size:.75rem;font-weight:600;line-height:1.5;white-space:nowrap;border:1px solid transparent}
.pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.pill.ok{color:var(--color-success);background:var(--color-success-soft)}
.pill.warn{color:var(--color-warning);background:var(--color-warning-soft)}
.pill.crit{color:var(--color-danger);background:var(--color-danger-soft)}
.pill.info{color:var(--color-primary);background:var(--color-primary-soft)}
.pill.neutral{color:var(--color-text-muted);background:var(--color-bg-sunken);border-color:var(--color-border)}

/* Cartes, formulaires, boutons */
.am-card{background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--s4) var(--s5);display:grid;gap:var(--s3);min-width:0;box-shadow:var(--shadow)}
.am-card.flat{box-shadow:none}
.field{display:grid;gap:4px;font-size:.8rem;color:var(--color-text-muted);min-width:0}
.field>span{font-weight:600}
input,select,textarea{font:inherit;color:var(--color-text);background:var(--color-bg-elevated);border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);padding:8px 10px;min-height:40px;width:100%}
textarea{min-height:160px;resize:vertical;font-family:var(--mono);font-size:.9rem;line-height:1.5}
input:disabled,select:disabled{opacity:.6}
.btn{font:inherit;font-weight:600;min-height:40px;padding:8px 14px;border-radius:var(--radius-sm);border:1px solid var(--color-border-strong);background:var(--color-bg-elevated);color:var(--color-text);cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition-property:background-color,border-color,box-shadow;transition-duration:150ms;text-decoration:none}
.btn:hover{background:var(--color-bg)}
.btn:active{box-shadow:inset 0 1px 2px rgb(0 0 0 / .15)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.primary{background:var(--color-primary);border-color:var(--color-primary);color:#fff}
.btn.primary:hover{background:var(--color-primary-strong);border-color:var(--color-primary-strong)}
.btn.danger{background:var(--color-danger);border-color:var(--color-danger);color:#fff}
.btn.small{min-height:32px;padding:4px 10px;font-size:.8rem}
.btn-row{display:flex;gap:var(--s2);flex-wrap:wrap;align-items:center}
.banner{border-left:3px solid var(--color-warning);background:var(--color-warning-soft);padding:8px 12px;border-radius:var(--radius-sm);font-size:.85rem;text-wrap:pretty}
.banner.info{border-left-color:var(--color-primary);background:var(--color-primary-soft)}
.banner.crit{border-left-color:var(--color-danger);background:var(--color-danger-soft)}
.banner.ok{border-left-color:var(--color-success);background:var(--color-success-soft)}
.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--s3)}
.split{display:grid;grid-template-columns:minmax(0,3fr) minmax(300px,2fr);gap:var(--s4);align-items:start}
@media (max-width:860px){.split{grid-template-columns:1fr}}
dl{display:grid;grid-template-columns:max-content 1fr;gap:4px var(--s3);margin:0;font-size:.9rem}dt{color:var(--color-text-muted)}dd{margin:0;min-width:0;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}

/* Tableaux denses */
.tablewrap{overflow:auto;background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow);min-width:0}
.am-table{width:100%;border-collapse:collapse;font-size:.85rem;font-variant-numeric:tabular-nums}
.am-table th{text-align:left;font-weight:600;color:var(--color-text-muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;padding:8px 10px;border-bottom:1px solid var(--color-border);background:var(--color-bg-elevated);position:sticky;top:0;white-space:nowrap}
.am-table td{padding:6px 10px;border-bottom:1px solid var(--color-border);vertical-align:top}
.am-table tr:last-child td{border-bottom:0}
.am-table tbody tr:hover td{background:var(--color-bg)}
.am-table tr.needs_info td:first-child{box-shadow:inset 3px 0 0 var(--color-danger)}
.am-table tr.ready td:first-child{box-shadow:inset 3px 0 0 var(--color-success)}
.am-table tr.done td:first-child{box-shadow:inset 3px 0 0 var(--color-primary)}
.am-table tr.failed td:first-child{box-shadow:inset 3px 0 0 var(--color-danger)}
.am-table tr.selected td{background:var(--color-primary-soft)}
.am-table input,.am-table select{min-height:32px;padding:4px 6px;font-size:.85rem}
.am-table .w-s{width:6ch}.am-table .w-m{width:12ch}
.flags{display:flex;flex-direction:column;gap:2px;font-size:.78rem;color:var(--color-danger)}
.flags .rule{color:var(--color-warning)}
.empty{padding:var(--s5);text-align:center;color:var(--color-text-muted)}

/* Plan de salle */
.hall{background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--s3);display:grid;gap:var(--s3);min-width:0;box-shadow:var(--shadow)}
.hall svg{width:100%;height:auto;display:block;max-height:68vh}
.seat{cursor:pointer;stroke:none;transition-property:opacity;transition-duration:150ms}
.seat.free{fill:var(--seat-free)}.seat.occupied{fill:var(--seat-occ)}.seat.pending{fill:var(--seat-pend)}
.seat.occupied,.seat.pending{cursor:not-allowed}
g[data-id]:hover .seat{opacity:.8}
.seat.current{stroke:var(--color-primary);stroke-width:2.5}
.seat.sel{stroke:var(--color-text);stroke-width:2.5}
.seatlabel{font-size:7px;pointer-events:none;text-anchor:middle;font-family:var(--mono)}
.seatlabel.free{fill:var(--seat-free-ink)}.seatlabel.occupied{fill:var(--seat-occ-ink)}.seatlabel.pending{fill:var(--seat-pend-ink)}
.rowlabel,.blocklabel{fill:var(--color-text-muted);font-size:8px;text-anchor:middle;font-family:var(--font)}
.blocklabel{text-transform:uppercase;letter-spacing:.12em;font-weight:600}
.scene{fill:var(--color-text);opacity:.8}.scenetext{fill:var(--color-bg);font-size:8px;text-anchor:middle;letter-spacing:.25em;text-transform:uppercase;font-weight:600}
.legend{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);font-size:.78rem;color:var(--color-text-muted);align-items:center}
.legend i{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:-2px;margin-right:5px}
.legend .current i{background:transparent;border:2px solid var(--color-primary)}

/* Plan d'exécution */
.steps{list-style:none;margin:0;padding:0;display:grid;gap:var(--s2);counter-reset:step}
.steps li{display:grid;grid-template-columns:28px 1fr;gap:var(--s2);align-items:start;padding:8px 10px;border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-bg);min-width:0}
.steps li::before{counter-increment:step;content:counter(step);width:24px;height:24px;border-radius:50%;background:var(--color-text-muted);color:#fff;font-size:.75rem;font-weight:600;display:grid;place-items:center}
.steps li.write::before{background:var(--color-danger)}
.steps li.ok::before{background:var(--color-success)}.steps li.failed::before{background:var(--color-danger)}.steps li.dry-run::before{background:var(--color-warning)}
.steps .what{font-weight:600;font-size:.85rem}
.steps code{display:block;font-family:var(--mono);font-size:.8rem;overflow-wrap:anywhere;margin-top:2px}
.steps .why{font-size:.78rem;color:var(--color-text-muted)}

/* Modale */
dialog{border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-bg-elevated);color:var(--color-text);padding:var(--s5);max-width:min(720px,92vw);box-shadow:0 10px 30px rgb(0 0 0 / .25)}
dialog::backdrop{background:rgb(0 0 0 / .45)}
dialog .body{display:grid;gap:var(--s3);max-height:70vh;overflow:auto}
.toast{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);background:var(--color-text);color:var(--color-bg);padding:10px 16px;border-radius:var(--radius);font-size:.85rem;box-shadow:var(--shadow);z-index:20;max-width:90vw}
.toast.crit{background:var(--color-danger);color:#fff}

/* Chargement */
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes fade-in{from{opacity:0}to{opacity:1}}
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
@keyframes netbar{0%{transform:translateX(-100%)}100%{transform:translateX(250%)}}
.spinner{display:inline-block;width:14px;height:14px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite;vertical-align:-2px;flex:none}
/* bouton occupé : libellé conservé, spinner devant */
.btn.is-busy{cursor:progress;opacity:.75}
.btn.is-busy::before{content:"";width:12px;height:12px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite;flex:none}
/* conteneur en chargement : voile + spinner, apparition retardée pour éviter le flash */
.is-loading{position:relative}
.is-loading.is-empty{min-height:160px}
.is-loading::after{content:attr(data-loading-label);position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s2);padding-top:34px;border-radius:inherit;background:color-mix(in srgb,var(--color-bg-elevated) 70%,transparent);color:var(--color-text-muted);font-size:.85rem;font-weight:600;opacity:0;animation:fade-in .2s ease .2s forwards;pointer-events:all;cursor:progress}
.is-loading::before{content:"";position:absolute;left:50%;top:50%;z-index:4;width:24px;height:24px;margin:-24px 0 0 -12px;border:3px solid var(--color-primary);border-right-color:transparent;border-radius:50%;opacity:0;animation:fade-in .2s ease .2s forwards,spin .7s linear infinite}
.is-loading:not([data-loading-label])::before{margin-top:-12px}
.is-loading:not([data-loading-label])::after{padding-top:0}
/* barre réseau globale sous l'en-tête */
#netbar{position:fixed;top:0;left:0;right:0;height:3px;z-index:30;overflow:hidden;pointer-events:none;opacity:0;transition-property:opacity;transition-duration:200ms}
#netbar.on{opacity:1;transition-delay:150ms}
#netbar::before{content:"";position:absolute;inset:0;width:40%;background:linear-gradient(90deg,transparent,var(--color-primary),transparent);animation:netbar 1.1s ease-in-out infinite}
/* squelettes */
.sk{display:inline-block;height:.8em;width:100%;max-width:14ch;border-radius:var(--radius-sm);background:linear-gradient(90deg,var(--color-bg-sunken) 25%,var(--color-border) 50%,var(--color-bg-sunken) 75%);background-size:200% 100%;animation:shimmer 1.4s linear infinite;vertical-align:middle}
.am-table tr.skeleton:hover td{background:none}
.pill.sk-pill{width:80px;height:22px;padding:0;border:0;background:linear-gradient(90deg,var(--color-bg-sunken) 25%,var(--color-border) 50%,var(--color-bg-sunken) 75%);background-size:200% 100%;animation:shimmer 1.4s linear infinite}
.pill.sk-pill::before{display:none}
/* lignes en cours */
.am-table tr.saving td{opacity:.6}
.am-table tr.saving td:first-child{opacity:1}
.am-table tr.running td{background:var(--color-primary-soft)}
.am-table tr.running td:first-child{box-shadow:inset 3px 0 0 var(--color-primary)}
.am-table tr.queued td{opacity:.55}
.pill.run::before{display:none}
/* progression d'exécution */
.progress{height:6px;border-radius:var(--radius-pill);background:color-mix(in srgb,var(--color-primary) 18%,transparent);overflow:hidden;margin-top:6px}
.progress>i{display:block;height:100%;background:var(--color-primary);border-radius:inherit;transition-property:width;transition-duration:300ms}
.banner .head{display:flex;align-items:center;gap:var(--s2);font-weight:600}
select.is-pending{color:var(--color-text-muted)}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important}
  .spinner,.btn.is-busy::before,.is-loading::before{animation-duration:2s!important}
  .sk,.pill.sk-pill{animation:none!important}
  #netbar::before{animation:none!important;width:100%;opacity:.6}
}
