/* Alternative per-business interface. All rules are scoped to the opt-in layout. */
body[data-layout="command"]{--navy:#102b43;--blue:#0e8298;--accent:#25bfc3;--bg:#eaf2f7;--line:#d6e2eb;background:radial-gradient(circle at 90% 4%,#d6edf2 0,transparent 32%),#eaf2f7}
body[data-layout="command"] header{background:linear-gradient(105deg,#091c33,#163955 78%,#075f73);border-bottom:1px solid #1a5870;box-shadow:0 5px 20px #0b243438}
body[data-layout="command"]{--bg-command-main-offset:248px}
/* The workspace includes the sidebar gutter in its available width; width:100% plus a left margin caused page overflow. */
body[data-layout="command"] main{width:calc(100% - var(--bg-command-main-offset));max-width:none;margin:20px 0 26px var(--bg-command-main-offset);padding:0 clamp(12px,2vw,32px);min-width:0;box-sizing:border-box;transition:margin-left .18s ease,width .18s ease}
body[data-layout="command"] main>*,body[data-layout="command"] main .panel,body[data-layout="command"] main .grid,body[data-layout="command"] main .wide{min-width:0;max-width:100%}
body[data-layout="command"] main .grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
body[data-layout="command"] .panel{border:1px solid #d0dfe8;border-radius:14px;box-shadow:0 4px 16px #1029430c;min-width:0}
body[data-layout="command"] .panel h1,body[data-layout="command"] .panel h2{color:#113d59}
/* Command-only embellishments must not change Classic or Platform navigation. */
body:not([data-layout="command"]) .nav-group .bg-nav-indicator,body:not([data-layout="command"]) .nav-group .bg-nav-flyout-title{display:none}
/* Accessible click accordion in expanded Command Center navigation. */
body[data-layout="command"] main>nav[aria-label="Main navigation"]{position:fixed!important;top:125px;left:12px;bottom:12px;width:224px;min-width:0;z-index:30;display:block;padding:12px 9px;overflow-x:hidden;overflow-y:auto;background:linear-gradient(180deg,#0c243e,#153755);border:1px solid #1b5371;border-radius:13px;box-shadow:0 14px 30px #071c3060;scrollbar-width:thin;scrollbar-color:#3e718b transparent;box-sizing:border-box}
body[data-layout="command"] main>nav[aria-label="Main navigation"] .nav-group{min-width:0;margin:0 0 5px;position:relative}
body[data-layout="command"] main>nav[aria-label="Main navigation"] .nav-group>summary{display:flex;align-items:center;gap:11px;background:transparent;border:0;color:#dcecf6;padding:11px 8px;border-radius:8px;min-height:43px;font-size:12px;box-shadow:none}
body[data-layout="command"] main>nav[aria-label="Main navigation"] .nav-group[open]>summary,body[data-layout="command"] main>nav[aria-label="Main navigation"] .nav-group>summary:hover,body[data-layout="command"] main>nav[aria-label="Main navigation"] .nav-group>summary:focus-visible{background:#214d67;color:#fff}
body[data-layout="command"] main>nav[aria-label="Main navigation"] .nav-group>summary:after{content:none}
body[data-layout="command"] main>nav[aria-label="Main navigation"] .bg-nav-label{flex:1;min-width:0}
body[data-layout="command"] main>nav[aria-label="Main navigation"] .bg-nav-indicator{display:flex;align-items:center;justify-content:center;flex:0 0 17px;width:17px;height:17px;color:#add6e5}
body[data-layout="command"] main>nav[aria-label="Main navigation"] .bg-nav-indicator svg{height:15px;width:15px}
body[data-layout="command"] main>nav[aria-label="Main navigation"] .bg-plus-vertical{transition:opacity .16s ease}
body[data-layout="command"] main>nav[aria-label="Main navigation"] .nav-group[open] .bg-plus-vertical{opacity:0}
body[data-layout="command"] main>nav[aria-label="Main navigation"] .nav-group .nav-menu{position:static!important;display:block!important;visibility:visible!important;opacity:1;max-height:none!important;box-shadow:none!important;border:0!important;background:transparent!important;min-width:0!important;width:auto!important;transform:none;padding:2px 4px 6px 19px;margin:0!important}
body[data-layout="command"] main>nav[aria-label="Main navigation"] .nav-group:not([open])>.nav-menu{display:none!important}
body[data-layout="command"] main>nav[aria-label="Main navigation"] .nav-group[open]>.nav-menu{animation:bg-command-reveal .18s ease both}
@keyframes bg-command-reveal{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
body[data-layout="command"] main>nav[aria-label="Main navigation"] .nav-menu a{color:#d3e7f3;background:transparent;border-radius:6px;padding:8px 6px;font-size:12px;display:flex;align-items:center;gap:9px;line-height:1.3}
body[data-layout="command"] main>nav[aria-label="Main navigation"] .nav-menu a:hover,body[data-layout="command"] main>nav[aria-label="Main navigation"] .nav-menu a:focus-visible,body[data-layout="command"] main>nav[aria-label="Main navigation"] .nav-menu a[aria-current="page"]{background:#17637a;color:#fff}
body[data-layout="command"] main>nav[aria-label="Main navigation"] .nav-menu a[aria-current="page"]{box-shadow:inset 3px 0 #46d4d5}
body[data-layout="command"] main>nav[aria-label="Main navigation"] .bg-nav-flyout-title{display:none}
body[data-layout="command"] .nav-group .nav-icon{flex:0 0 19px;width:19px;height:19px}
body[data-layout="command"] .bg-command-top{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:18px}
body[data-layout="command"] .bg-command-stat{background:linear-gradient(135deg,#0c2943,#1b5470);color:#f0fbff;border:1px solid #206783;border-radius:13px;padding:16px 19px;box-shadow:0 6px 15px #071d3124;min-width:0}
body[data-layout="command"] .bg-command-stat strong{display:block;font-size:clamp(22px,2vw,30px);font-variant-numeric:tabular-nums;color:#4de2d6}
body[data-layout="command"] .bg-command-stat span{display:block;color:#d4e8f1;font-size:12px}
body[data-layout="command"] #bg-command-nav-toggle{position:fixed;top:83px;left:13px;z-index:40;border:1px solid #23546c;background:#12344e;color:#fff;border-radius:9px;min-width:44px;height:34px;cursor:pointer}
body[data-layout="command"] #bg-command-nav-toggle:hover,body[data-layout="command"] #bg-command-nav-toggle:focus-visible{background:#166c82}
/* Collapsed mode: a stable icon rail. Flyouts are viewport-positioned so sidebar scrolling cannot clip them. */
body[data-layout="command"].bg-command-collapsed{--bg-command-main-offset:90px}
body[data-layout="command"].bg-command-collapsed main>nav[aria-label="Main navigation"]{width:66px;overflow-x:hidden;overflow-y:auto}
body[data-layout="command"].bg-command-collapsed main>nav[aria-label="Main navigation"] .nav-group>summary{justify-content:center;padding:10px 2px}
body[data-layout="command"].bg-command-collapsed main>nav[aria-label="Main navigation"] .nav-group>summary .bg-nav-label,body[data-layout="command"].bg-command-collapsed main>nav[aria-label="Main navigation"] .bg-nav-indicator{display:none}
body[data-layout="command"].bg-command-collapsed main>nav[aria-label="Main navigation"] .nav-group>.nav-menu{position:fixed!important;top:var(--bg-flyout-top,130px)!important;left:var(--bg-flyout-left,86px)!important;width:var(--bg-flyout-width,230px)!important;max-width:calc(100vw - 20px)!important;max-height:calc(100vh - 16px)!important;overflow-y:auto!important;background:#123653!important;box-shadow:0 9px 24px #0a1c3080!important;border-radius:10px!important;border:1px solid #2a6077!important;padding:8px!important;box-sizing:border-box;z-index:35;animation:bg-command-reveal .16s ease both}
body[data-layout="command"].bg-command-collapsed main>nav[aria-label="Main navigation"] .nav-group:not([open])>.nav-menu{display:none!important}
body[data-layout="command"].bg-command-collapsed main>nav[aria-label="Main navigation"] .bg-nav-flyout-title{display:block;color:#f4fcff;font-weight:700;padding:9px 7px 10px;margin-bottom:4px;border-bottom:1px solid #367089}
body[data-layout="command"].bg-command-collapsed main>nav[aria-label="Main navigation"] .nav-menu a{white-space:normal;overflow-wrap:anywhere}
body[data-layout="command"].bg-command-collapsed #bg-command-nav-toggle{left:15px}
@media(prefers-reduced-motion:reduce){body[data-layout="command"] main>nav[aria-label="Main navigation"] .nav-group[open]>.nav-menu{animation:none}body[data-layout="command"] main{transition:none}body[data-layout="command"] .bg-plus-vertical{transition:none}}
body[data-layout="command"] .bg-command-backdrop{position:fixed;inset:0;background:#041322aa;z-index:90}
body[data-layout="command"] .bg-command-drawer{position:fixed;top:0;right:0;bottom:0;width:min(460px,100vw);z-index:100;background:#f7fbff;box-shadow:-18px 0 45px #04122266;display:flex;flex-direction:column;color:#1c3444}
body[data-layout="command"] .bg-command-drawer[hidden],body[data-layout="command"] .bg-command-backdrop[hidden]{display:none!important}
body[data-layout="command"] .bg-command-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:24px;background:linear-gradient(110deg,#0c2942,#176079);color:#fff}
body[data-layout="command"] .bg-command-drawer-head h2{color:#fff;margin:0;font-size:20px}
body[data-layout="command"] .bg-command-drawer-head button{color:#fff;background:transparent;border:1px solid #75a4ae;border-radius:8px}
body[data-layout="command"] #bg-command-drawer-content{overflow:auto;flex:1;padding:18px 24px}
/* v0.3.10: photo sits above the text details and stays inside the slide-out card. */
body[data-layout="command"] .bg-command-photo-card{display:flex;align-items:center;justify-content:center;min-width:0;max-width:100%;min-height:120px;max-height:265px;margin:0 0 16px;padding:10px;border:1px solid #d6e2eb;border-radius:12px;background:#fff;overflow:hidden}
body[data-layout="command"] .bg-command-photo-card img{display:block;width:100%;height:auto;max-width:100%;max-height:240px;object-fit:contain;object-position:center;border-radius:6px}
@media(max-width:520px){body[data-layout="command"] .bg-command-photo-card{max-height:220px}body[data-layout="command"] .bg-command-photo-card img{max-height:195px}}

body[data-layout="command"] .bg-command-data{margin:0}.bg-command-data-row{display:grid;grid-template-columns:42% minmax(0,1fr);align-items:start;gap:8px;border-bottom:1px solid #dce7ec;padding:10px 0}
body[data-layout="command"] .bg-command-data-row dt{color:#526a78;font-size:12px}body[data-layout="command"] .bg-command-data-row dd{margin:0;overflow-wrap:anywhere;font-weight:600}
body[data-layout="command"] #bg-command-drawer-actions{display:flex;gap:10px;flex-wrap:wrap;padding:18px 24px;border-top:1px solid #d3e2e9}
body[data-layout="command"] .bg-command-expiry{background:#fff1dd;color:#875013;border-radius:8px;padding:12px}
body[data-layout="command"].bg-command-drawer-open{overflow:hidden}
body[data-layout="command"] main a[href*="page=record"],body[data-layout="command"] main a[href*="page=customer_detail"],body[data-layout="command"] main a[href*="page=dealer_detail"]{cursor:pointer}
body[data-layout="command"] .bg-command-layout-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.bg-command-layout-choice{display:block;border:2px solid #d4e0e9;padding:12px;border-radius:12px;background:#fafcff;cursor:pointer}
.bg-command-layout-choice:has(input:checked){border-color:#148ba6;background:#eaf8fc}
.bg-command-layout-choice img{display:block;width:100%;max-width:320px;aspect-ratio:16/9;border-radius:6px;border:1px solid #d0dbe4;margin:9px 0}
.bg-command-layout-choice strong{display:block;margin:4px 0}.bg-command-layout-choice small{display:block;color:#536b79}
@media(max-width:800px){body[data-layout="command"],body[data-layout="command"].bg-command-collapsed{--bg-command-main-offset:88px}body[data-layout="command"] main,body[data-layout="command"].bg-command-collapsed main{padding:0 12px}body[data-layout="command"] main>nav[aria-label="Main navigation"]{left:7px}body[data-layout="command"] .bg-command-top{grid-template-columns:repeat(2,minmax(0,1fr))}body[data-layout="command"] #bg-command-nav-toggle{left:15px}}
@media(max-width:520px){body[data-layout="command"] .bg-command-top{grid-template-columns:1fr}body[data-layout="command"] main{margin-top:16px}body[data-layout="command"] .bg-command-drawer-head{padding:16px}body[data-layout="command"] #bg-command-drawer-content{padding:14px}}
@media print{body[data-layout="command"] main,body[data-layout="command"].bg-command-collapsed main{margin:0!important;padding:0!important;max-width:none!important}body[data-layout="command"] main>nav[aria-label="Main navigation"],body[data-layout="command"] .bg-command-top,body[data-layout="command"] #bg-command-nav-toggle,body[data-layout="command"] .bg-command-drawer,body[data-layout="command"] .bg-command-backdrop{display:none!important}}

/* Dashboard glass-style tiles, scoped solely to Command Center. */
body[data-layout="command"][data-page="dashboard"] main .grid>.panel{background:linear-gradient(135deg,#10314f,#18536b);border:1px solid #27758b;color:#e9f8fe;box-shadow:0 8px 18px #0b30412a}
body[data-layout="command"][data-page="dashboard"] main .grid>.panel .muted{color:#d3eaf4}
body[data-layout="command"][data-page="dashboard"] main .grid>.panel .stat{color:#4ee2d7;font-size:clamp(22px,2.5vw,34px)}
body[data-layout="command"][data-page="dashboard"] .dashboard-notices{border-left:4px solid #20bac5}
body[data-layout="command"] .page-guidance{border-left:4px solid #24b7c4;background:#e6f5f9}
