/* openDesk Admin Portal tokens (light), dark set below. No external fonts:
   "Barlow" is used where installed, system-ui otherwise. */
:root,:root[data-theme="light"]{--brand:#045462;--brand-hover:#003c3e;--brand-ink:#fff;--brand-soft:#e8fcfc;--accent:#00c3cd;--link:#00696e;--focus:#00696e;--chrome:#0a1e2d;--chrome-ink:#fff;--chrome-ink-2:#c9d6e0;--chrome-line:#22384a;--chrome-fill-hover:#234c6b;--chrome-fill-active:#193a53;--bg:#f3f6f8;--surface:#fff;--surface-2:#fafbfc;--surface-sunken:#e3eaf0;--line:#e3eaf0;--line-strong:#c9d6e0;--control-line:#6a8aa3;--ink:#0a1e2d;--ink-2:#3e596e;--ink-3:#516f85;--ok:#2e7d32;--ok-bg:#ecf8ed;--ok-mark:#4ab54f;--warn:#8a5300;--warn-bg:#fff4e5;--warn-mark:#fd8023;--bad:#c62828;--bad-bg:#fdebe9;--bad-mark:#f44336;--info:#045462;--info-bg:#e8fcfc;--info-mark:#00969d;--r-xs:.125rem;--r-sm:.25rem;--r-md:.5rem;--font:"Barlow",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--fs-xs:.8125rem;--fs-sm:.875rem;--fs-md:1rem;--fs-lg:1.25rem;--fs-xl:1.625rem;--fs-2xl:2.125rem;color-scheme:light}
/* dark: an explicit data-theme (the top-bar switch, theme cookie) always wins over the OS preference */
:root[data-theme="dark"]{--brand:#3dd0d8;--brand-hover:#79dde2;--brand-ink:#002626;--brand-soft:#003c3e;--link:#79dde2;--focus:#79dde2;--chrome:#000e19;--chrome-fill-hover:#3b4752;--chrome-fill-active:#2c363e;--bg:#000e19;--surface:#081723;--surface-2:#0d1c28;--surface-sunken:#11212d;--line:#22384a;--line-strong:#31495c;--control-line:#7393ab;--ink:#e3eaf0;--ink-2:#c9d6e0;--ink-3:#9db3c4;--ok:#6fcf73;--ok-bg:#0f2a17;--warn:#f4b67f;--warn-bg:#2e1f0e;--bad:#ff8a8a;--bad-bg:#331416;--info:#79dde2;--info-bg:#002626;--info-mark:#3dd0d8;color-scheme:dark}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--brand:#3dd0d8;--brand-hover:#79dde2;--brand-ink:#002626;--brand-soft:#003c3e;--link:#79dde2;--focus:#79dde2;--chrome:#000e19;--chrome-fill-hover:#3b4752;--chrome-fill-active:#2c363e;--bg:#000e19;--surface:#081723;--surface-2:#0d1c28;--surface-sunken:#11212d;--line:#22384a;--line-strong:#31495c;--control-line:#7393ab;--ink:#e3eaf0;--ink-2:#c9d6e0;--ink-3:#9db3c4;--ok:#6fcf73;--ok-bg:#0f2a17;--warn:#f4b67f;--warn-bg:#2e1f0e;--bad:#ff8a8a;--bad-bg:#331416;--info:#79dde2;--info-bg:#002626;--info-mark:#3dd0d8;color-scheme:dark}}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:var(--fs-md);line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--link)}
code{font-size:var(--fs-sm);overflow-wrap:anywhere}

/* chrome bar */
.chrome{background:var(--chrome);color:var(--chrome-ink);border-bottom:1px solid var(--chrome-line)}
.chrome-in{max-width:64rem;margin:0 auto;padding:.875rem 16px;display:flex;align-items:center;gap:1rem}
.logo{display:block;height:22px;width:auto}
.chrome-title{font-weight:600;font-size:var(--fs-sm);color:var(--chrome-ink-2);padding-left:1rem;border-left:1px solid var(--chrome-line)}
.chrome-btn{margin:-.5rem -.5rem -.5rem auto}
/* icon button (portal .icon-btn + .chrome-btn): theme switch in the top bar */
.icon-btn{display:inline-grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:var(--r-md);color:var(--chrome-ink);text-decoration:none;transition:background-color .12s}
.icon-btn:hover{background:var(--chrome-fill-hover)}
.icon-btn:active{background:var(--chrome-fill-active)}
.icon-btn svg{width:1.25rem;height:1.25rem}

/* canvas + card */
.canvas{flex:1;width:100%;padding:2.5rem 16px}
.card{max-width:34rem;margin:0 auto;background:var(--surface);border:1px solid var(--line);border-top:4px solid var(--accent);border-radius:var(--r-md)}
.card-wide{max-width:40rem}
.card-body{padding:1.5rem 1.25rem 1.5rem}
.card-foot{border-top:1px solid var(--line);background:var(--surface-2);padding:.875rem 1.25rem;border-radius:0 0 var(--r-md) var(--r-md)}
h1{font-size:var(--fs-xl);letter-spacing:-.015em;line-height:1.2;margin:0 0 .5rem}
h2{font-size:var(--fs-lg);margin:0 0 .25rem}
.lead{color:var(--ink-2);margin:0 0 1rem}
.title-row{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;margin-bottom:.75rem}
.title-row h1{margin:0}
.facts{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:.25rem 1rem;margin:0 0 1rem;font-size:var(--fs-sm)}
.facts dt{color:var(--ink-3);font-weight:500}.facts dd{margin:0;overflow-wrap:anywhere}

/* form */
.form{display:grid;gap:1rem;margin-top:1rem}
.field{display:grid;gap:.375rem}
label{font-size:var(--fs-sm);font-weight:500;color:var(--ink-2)}
.hint{font-size:var(--fs-xs);color:var(--ink-3);margin:0}
input[type=text],input[type=email],input[type=password],input[type=file]{width:100%;min-height:2.5rem;padding:.5rem .75rem;border:1px solid var(--control-line);border-radius:var(--r-xs);background:var(--surface);color:var(--ink);font:inherit;font-size:var(--fs-md)}
input[type=file]{font-size:var(--fs-sm);padding:.375rem .5rem}
input[type=file]::file-selector-button{margin-right:.75rem;min-height:1.75rem;padding:.25rem .75rem;border:1px solid var(--control-line);border-radius:var(--r-sm);background:var(--surface);color:var(--ink);font:inherit;font-weight:600;cursor:pointer}
input:hover{border-color:var(--ink-2)}
input:focus-visible,.btn:focus-visible,.icon-btn:focus-visible,.seg-btn:focus-visible,a:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.sub{display:grid;gap:1rem;padding-top:1rem;border-top:1px solid var(--line)}
.check{display:flex;gap:.625rem;align-items:flex-start;font-weight:400;color:var(--ink)}
.check input{margin:.25rem 0 0;width:1rem;height:1rem;accent-color:var(--brand);flex:none}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:2.5rem;padding:.5rem 1rem;border:1px solid transparent;border-radius:var(--r-sm);font:inherit;font-size:var(--fs-sm);font-weight:600;line-height:1.2;cursor:pointer;text-decoration:none;transition:background-color .12s,border-color .12s,color .12s}
.btn-primary{background:var(--brand);color:var(--brand-ink)}
.btn-primary:hover{background:var(--brand-hover)}
.btn-secondary{background:var(--surface);color:var(--ink);border-color:var(--control-line)}
.btn-submit{min-height:3rem;font-size:var(--fs-md);justify-self:start}

/* notices + badges */
.notice{display:flex;gap:.75rem;align-items:flex-start;margin:0 0 1rem;padding:.875rem 1rem;border:1px solid;border-radius:var(--r-sm);font-size:var(--fs-sm);color:var(--ink)}
.notice-info{background:var(--info-bg);border-color:color-mix(in srgb,var(--info-mark) 45%,transparent)}
.notice-warn{background:var(--warn-bg);border-color:color-mix(in srgb,var(--warn-mark) 55%,transparent)}
.notice-bad{background:var(--bad-bg);border-color:color-mix(in srgb,var(--bad-mark) 50%,transparent)}
.notice-ok{background:var(--ok-bg);border-color:color-mix(in srgb,var(--ok-mark) 50%,transparent)}
.notice-sunken{background:var(--surface-sunken);border-color:var(--line-strong)}
.badge{display:inline-block;padding:.125rem .625rem;border-radius:999px;font-size:var(--fs-xs);font-weight:600;border:1px solid transparent}
.badge-provisioning{background:var(--info-bg);color:var(--info);border-color:color-mix(in srgb,var(--info-mark) 45%,transparent)}
.badge-ready{background:var(--ok-bg);color:var(--ok);border-color:color-mix(in srgb,var(--ok-mark) 50%,transparent)}
.badge-failed{background:var(--bad-bg);color:var(--bad);border-color:color-mix(in srgb,var(--bad-mark) 50%,transparent)}
.badge-cancelled{background:var(--surface-sunken);color:var(--ink-3);border-color:var(--line-strong)}

/* footer + language switch */
.foot{max-width:64rem;width:100%;margin:0 auto;padding:1rem 16px 1.5rem;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;font-size:var(--fs-xs);color:var(--ink-3)}
.seg{display:inline-flex;border:1px solid var(--control-line);border-radius:var(--r-sm);overflow:hidden}
.seg-btn{min-width:2.5rem;padding:.25rem .625rem;text-align:center;text-decoration:none;font-weight:600;color:var(--ink-2);background:var(--surface)}
.seg-btn+.seg-btn{border-left:1px solid var(--control-line)}
.seg-btn[aria-pressed=true]{background:var(--brand);color:var(--brand-ink)}

@media (max-width:40rem){.canvas{padding:1rem 16px}.card-body{padding:1.25rem 1rem}.btn-submit{width:100%;justify-self:stretch}.facts{grid-template-columns:minmax(0,1fr)}.facts dd{margin-bottom:.375rem}}
