/* AALVAA CMS — ONE shared shell for every admin module (7 Aug 2026).
   Tokens are byte-for-byte the public site's (_site.css) so the CMS and the site
   read as one product. Modules link this FIRST, then keep only their module-specific
   rules; page-local token blocks are retired. Topbar/palette markup is injected by
   _cms.js — pages carry a <header id="cmsbar"></header> placeholder only. */
@import url('/fonts.css');
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--display:'Poppins','Inter',sans-serif;--font:'Inter',Helvetica,Arial,sans-serif;--bg:#05080d;--panel:#0e141c;--text:#eafcff;--dim:#6e8a93;--accent:#2CB7C4;--accent2:#1899a6;--accent3:#7fdde6;
 --card:#0e141c;--line:rgba(44,224,240,.16);--onaccent:#03121a;--ghost:rgba(255,255,255,.07);--r2:14px;
 --live:#ff4a3d;--green:#3fcf8e;--gold:#c8a96e;--deep:#003943}
html[data-theme="light"]{--bg:#eef5f6;--panel:#ffffff;--text:#00242b;--dim:#527578;--accent:#1899a6;--accent2:#2CB7C4;--accent3:#0a5560;
 --card:#ffffff;--line:rgba(0,57,67,.13);--onaccent:#ffffff;--ghost:rgba(0,57,67,.05);--live:#e23b2e}
body{font-family:var(--font);background:var(--bg);color:var(--text);min-height:100vh;transition:background .4s,color .4s}
a{color:inherit;text-decoration:none}
img{max-width:100%}
::selection{background:color-mix(in srgb,var(--accent) 35%,transparent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important}}

/* ── the bar every module shares (injected by _cms.js) ── */
.cmsbar{position:sticky;top:0;z-index:80;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;
 padding:.6rem 1.4rem;background:color-mix(in srgb,var(--bg) 72%,transparent);
 backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);border-bottom:1px solid var(--line)}
.cmsbar .brand{font-family:var(--display);font-weight:900;letter-spacing:.22em;font-size:.82rem;justify-self:start;display:flex;align-items:center;gap:.55rem}
.cmsbar .brand b{color:var(--accent)}
.cmsbar .brand .mod{font-weight:600;letter-spacing:.02em;color:var(--dim);text-transform:none;font-family:var(--font);font-size:.78rem}
.cmsbar .brand .mod::before{content:'▸';color:var(--accent);margin-right:.55rem}
.cmsbar .mid{justify-self:center;display:flex;align-items:center;gap:.5rem}
.cmsbar .right{justify-self:end;display:flex;align-items:center;gap:.6rem}
/* worker heartbeat — green when /health answers, red when it doesn't */
.cmsbar .sys{display:flex;align-items:center;gap:.4rem;font-size:.6rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);
 padding:.35rem .65rem;border-radius:999px;border:1px solid var(--line)}
.cmsbar .sys .d{width:7px;height:7px;border-radius:50%;background:var(--dim)}
.cmsbar .sys.ok{color:var(--green);border-color:color-mix(in srgb,var(--green) 40%,transparent)}
.cmsbar .sys.ok .d{background:var(--green);box-shadow:0 0 0 0 color-mix(in srgb,var(--green) 60%,transparent);animation:cmspulse 2.2s infinite}
.cmsbar .sys.err{color:var(--live);border-color:color-mix(in srgb,var(--live) 45%,transparent)}
.cmsbar .sys.err .d{background:var(--live)}
@keyframes cmspulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--green) 50%,transparent)}70%{box-shadow:0 0 0 6px transparent}100%{box-shadow:0 0 0 0 transparent}}
.cmsbar .kbd{font-size:.6rem;color:var(--dim);border:1px solid var(--line);border-radius:6px;padding:.28rem .5rem;cursor:pointer;background:var(--ghost);font-family:inherit}
.cmsbar .kbd:hover{color:var(--text);border-color:var(--accent)}
.cmsbar .theme-toggle{cursor:pointer;font-family:inherit;font-size:.62rem;font-weight:600;padding:.38rem .62rem;border-radius:999px;background:var(--ghost);border:1px solid var(--line);color:var(--text)}
.cmsbar .who{display:flex;align-items:center;gap:.45rem;font-size:.7rem;color:var(--dim)}
.cmsbar .who .av{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:.62rem;
 background:linear-gradient(135deg,var(--accent2),var(--accent));color:var(--onaccent)}
.cmsbar .who a{color:var(--dim);font-size:.64rem}.cmsbar .who a:hover{color:var(--live)}

/* ── shared layout + components ── */
.cms-wrap{max-width:1180px;margin:0 auto;padding:1.3rem 1.4rem 4.5rem}
.cms-h1{font-family:var(--display);font-weight:900;font-size:1.65rem;letter-spacing:-.01em;display:flex;align-items:center;gap:.55rem;flex-wrap:wrap}
.cms-h1 .count{color:var(--dim);font-weight:400;font-size:.95rem}
.cms-sub{color:var(--dim);font-size:.8rem;line-height:1.65;margin:.25rem 0 1rem;max-width:70ch}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r2);padding:1rem 1.1rem;
 transition:transform .18s,box-shadow .18s,border-color .18s}
.card.lift:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 40%,transparent);box-shadow:0 12px 34px -18px color-mix(in srgb,var(--accent) 55%,transparent)}
.btn{font-family:inherit;font-size:.74rem;font-weight:700;padding:.55rem 1rem;border-radius:9px;border:1px solid var(--line);background:var(--ghost);color:var(--text);cursor:pointer;transition:border-color .15s,transform .12s}
.btn:hover{border-color:var(--accent)}.btn:active{transform:scale(.97)}
.btn.pri{background:linear-gradient(135deg,var(--accent2),var(--accent));color:var(--onaccent);border-color:transparent}
.btn.sm{padding:.32rem .6rem;font-size:.64rem}
.btn.red{color:#ff8585;border-color:rgba(255,80,80,.4)}
.btn[disabled]{opacity:.55;cursor:default}
.badge{font-size:.56rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:.14rem .5rem;border-radius:999px;border:1px solid var(--line);color:var(--dim)}
.badge.ok{color:var(--green);border-color:color-mix(in srgb,var(--green) 45%,transparent)}
.badge.warn{color:var(--gold);border-color:color-mix(in srgb,var(--gold) 45%,transparent)}
.badge.err{color:var(--live);border-color:color-mix(in srgb,var(--live) 45%,transparent)}
.badge.acc{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 45%,transparent)}
table.cms{width:100%;border-collapse:collapse;font-size:.8rem}
table.cms th{font-family:var(--display);font-weight:800;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);text-align:left;padding:.55rem .6rem;border-bottom:1px solid var(--line)}
table.cms td{padding:.55rem .6rem;border-bottom:1px solid var(--line)}
table.cms tr:hover td{background:var(--ghost)}
input.cms,select.cms,textarea.cms{font-family:inherit;font-size:.82rem;color:var(--text);background:var(--ghost);border:1px solid var(--line);border-radius:9px;padding:.5rem .8rem}
input.cms:focus,select.cms:focus,textarea.cms:focus{outline:none;border-color:var(--accent)}
.empty{border:1px dashed var(--line);border-radius:var(--r2);padding:2rem;text-align:center;color:var(--dim);font-size:.84rem;line-height:1.7}
.empty b{color:var(--text);font-family:var(--display)}
.skel{position:relative;overflow:hidden;background:var(--ghost);border-radius:8px;min-height:1em}
.skel::after{content:'';position:absolute;inset:0;transform:translateX(-100%);
 background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent) 8%,transparent),transparent);animation:cmsshimmer 1.4s infinite}
@keyframes cmsshimmer{to{transform:translateX(100%)}}

/* ── ⌘K command palette ── */
.cmspal{position:fixed;inset:0;z-index:200;display:none;align-items:flex-start;justify-content:center;padding:12vh 1rem 1rem;
 background:color-mix(in srgb,var(--bg) 55%,transparent);backdrop-filter:blur(6px)}
.cmspal.on{display:flex}
.cmspal .box{width:min(560px,94vw);background:var(--panel);border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);border-radius:16px;overflow:hidden;
 box-shadow:0 30px 80px -30px color-mix(in srgb,var(--accent) 45%,transparent);animation:cmspalin .16s ease-out}
@keyframes cmspalin{from{transform:translateY(8px);opacity:0}}
.cmspal input{width:100%;font-family:inherit;font-size:1rem;color:var(--text);background:transparent;border:0;outline:none;padding:.95rem 1.1rem;border-bottom:1px solid var(--line)}
.cmspal .list{max-height:46vh;overflow:auto;padding:.4rem}
.cmspal .it{display:flex;align-items:center;gap:.7rem;padding:.55rem .7rem;border-radius:9px;cursor:pointer;font-size:.84rem}
.cmspal .it .ic{flex:0 0 1.4rem;text-align:center}
.cmspal .it small{color:var(--dim);margin-left:auto;font-size:.62rem}
.cmspal .it.sel,.cmspal .it:hover{background:color-mix(in srgb,var(--accent) 12%,transparent)}
.cmspal .nores{padding:1rem;text-align:center;color:var(--dim);font-size:.8rem}
