/* Retail v5 shell refresh (review prototype 25-10).
   1. Semantic status colours: ok / attention / problem / neutral (+ info), day and night, fed into the console's own
      variables (--vx-*, --st-*) so every existing tag, chip, dot and banner follows without markup changes.
   2. Settings, Feature switchboard, Roles & permissions.
   3. Switched-off features: extra controls hidden by html.v5x-off-<key> (pages themselves are hidden by canSee).
   4. No visible scrollbar anywhere; scrolling kept. */

/* ---------- 1. semantic tokens (calm: lower saturation, softer fills) ---------- */
:root:not([data-theme=night]){
 --v5x-ok:#2f7a57;--v5x-ok-bg:#e7f2ec;
 --v5x-attn:#8a6516;--v5x-attn-bg:#f8efd9;
 --v5x-prob:#a8433a;--v5x-prob-bg:#f8e7e4;
 --v5x-info:#356192;--v5x-info-bg:#e9f0f8;
 --v5x-neutral:#5d6a78;--v5x-neutral-bg:#eef1f4;
 --v5x-letterbox:#e9edf0;--v5x-ph-ink:#8a96a3;
 --v5x-focus:0 0 0 3px rgba(33,109,98,.22);
}
[data-theme=night]{
 --v5x-ok:#7cc9a3;--v5x-ok-bg:#183428;
 --v5x-attn:#e2bd72;--v5x-attn-bg:#352c1b;
 --v5x-prob:#ee9d93;--v5x-prob-bg:#3d2320;
 --v5x-info:#9fc0e8;--v5x-info-bg:#1c2a3d;
 --v5x-neutral:#a3b0bd;--v5x-neutral-bg:#222c36;
 --v5x-letterbox:#111a19;--v5x-ph-ink:#6f7f80;
 --v5x-focus:0 0 0 3px rgba(76,194,180,.28);
}
:root{
 --st-good:var(--v5x-ok);--st-good-bg:var(--v5x-ok-bg);--st-warn:var(--v5x-attn);--st-warn-bg:var(--v5x-attn-bg);
 --st-bad:var(--v5x-prob);--st-bad-bg:var(--v5x-prob-bg);--st-info:var(--v5x-info);--st-info-bg:var(--v5x-info-bg);--st-mute-bg:var(--v5x-neutral-bg);
 --vx-ok:var(--v5x-ok);--vx-ok-soft:var(--v5x-ok-bg);
 --vx-crit:var(--v5x-prob);--vx-crit-soft:var(--v5x-prob-bg);
 --vx-high:var(--v5x-attn);--vx-high-soft:var(--v5x-attn-bg);
 --vx-med:var(--v5x-attn);--vx-med-soft:var(--v5x-attn-bg);
 --vx-info:var(--v5x-info);--vx-info-soft:var(--v5x-info-bg);
}
body{background:var(--vx-bg)}
.v5x-switch:focus-visible,.v5x-link:focus-visible{outline:2px solid var(--vx-accent);outline-offset:2px}

/* ---------- 2. Configure pages ---------- */
.v5x-switch{display:inline-flex;align-items:center;gap:8px;min-height:44px;min-width:44px;padding:0 4px;border:0;background:none;color:var(--vx-ink-2);font-size:12.5px;font-weight:600;cursor:pointer;flex:none}
.v5x-switch i{position:relative;width:38px;height:22px;border-radius:11px;background:var(--vx-line-strong,#c3cccd);transition:background-color .16s ease;flex:none}
.v5x-switch i::after{content:"";position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform .16s cubic-bezier(.2,.7,.2,1)}
.v5x-switch.on i{background:var(--vx-accent)}
.v5x-switch.on i::after{transform:translateX(16px)}
.v5x-switch.on{color:var(--vx-ink)}
.v5x-switch[disabled]{cursor:default;opacity:.62}
.v5x-setrow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-top:1px solid var(--vx-line)}
.v5x-setrow:first-of-type{border-top:0}
.v5x-setrow>div{min-width:0;flex:1}
.v5x-setrow b{display:block;font-size:13.5px;font-weight:600}
.v5x-setrow span{display:block;font-size:12.5px;color:var(--vx-ink-3);line-height:1.4;margin-top:2px}
.v5x-setrow em{font-style:normal;display:block;color:var(--vx-ink-3);font-size:11.5px;margin-top:2px}
.v5x-setrow.is-off b{color:var(--vx-ink-2)}
.v5x-setrow.v5x-demo{background:var(--v5x-attn-bg);border-radius:8px;padding:8px 10px;border-top:0;margin-top:4px}
.v5x-fsum{margin:0 0 12px}
.v5x-fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:var(--v5-gap,20px);align-items:start}
.v5x-fgrid>.md-panel{margin:0}
.v5x-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:8px}
.v5x-link{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;min-height:56px;padding:10px 12px;border:1px solid var(--vx-line);border-radius:10px;background:var(--vx-surface-2);color:var(--vx-ink);cursor:pointer;font:inherit}
.v5x-link:hover{border-color:var(--vx-line-strong,#c3cccd)}
.v5x-link b{font-size:13.5px;font-weight:600}.v5x-link span{font-size:12px;color:var(--vx-ink-3)}
.v5x-canopen{display:grid;gap:8px}
.v5x-canopen b{display:block;font-size:12px;color:var(--vx-ink-3);font-weight:600;text-transform:none}
.v5x-canopen span{display:block;font-size:13px;line-height:1.45}
.v5x-roles{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:var(--v5-gap,20px);align-items:start;margin-top:12px}
.v5x-roles>.md-panel{margin:0}
.v5x-rh{font-size:12px;color:var(--vx-ink-3);font-weight:600;margin:12px 0 4px}
.v5x-rl{margin:0 0 4px;font-size:13px;line-height:1.45}
.v5x-rl b{font-weight:600;margin-right:4px}

/* ---------- 3. switched-off features: their extra controls ---------- */
.v5x-off-search .gs,.v5x-off-search [data-md-search]{display:none!important}
.v5x-off-enrolment [data-enrol-open],.v5x-off-enrolment #globalEnroll{display:none!important}
.v5x-off-movement [data-mv]{display:none!important}
.v5x-off-detectionlog [data-dlperson]{display:none!important}
.v5x-off-liveHD .lvq{display:none!important}
.v5x-off-loss .lp-today{display:none!important}

/* ---------- 4. no visible scrollbars (v5-layout.css already does this; repeated so a later sheet cannot undo it) ---------- */
html,body,*{scrollbar-width:none!important;-ms-overflow-style:none!important}
*::-webkit-scrollbar{width:0!important;height:0!important;display:none!important;background:transparent!important}