/* ============================================================================
   247TechTeam Admin — Premium dark/light console
   Shares tokens with site.css. Reduced motion density; solid data surfaces.
   ========================================================================= */

.is-admin{min-height:100vh}
.is-admin body::before, .is-admin body::after{display:none !important}
.is-admin #app{min-height:100vh}

/* ---------- Shell ---------- */
.admin-shell{display:grid;grid-template-columns:272px 1fr;min-height:100vh;background:var(--bg)}
@media (max-width:960px){.admin-shell{grid-template-columns:1fr}}

/* Sidebar */
.sidebar{position:sticky;top:0;height:100vh;overflow-y:auto;padding:18px 14px;border-right:1px solid var(--border);background:linear-gradient(180deg, var(--bg-2), var(--bg));backdrop-filter:var(--glass-blur)}
.sidebar::-webkit-scrollbar{width:6px}
.sidebar::-webkit-scrollbar-thumb{background:rgba(160,160,165,0.2);border-radius:4px}
.side-logo{display:flex;align-items:center;gap:10px;padding:10px 10px 20px 10px;border-bottom:1px solid var(--border);margin-bottom:14px}
.side-logo img{height:36px;width:auto;filter:drop-shadow(0 0 20px rgba(255,107,0,.35))}
.side-logo img.logo-light{display:none}
.side-group{display:flex;flex-direction:column;gap:2px;margin-bottom:12px}
.side-group .lbl{color:var(--text-3);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;padding:10px 10px 6px}
.sidebar a{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;color:var(--text-2);font-size:.9rem;font-weight:500;transition:background var(--dur-1) var(--ease), color var(--dur-1) var(--ease)}
.sidebar a .ic{opacity:.8}
.sidebar a:hover{background:var(--panel);color:var(--text)}
.sidebar a.active{background:rgba(255,107,0,0.14);color:var(--text);box-shadow:inset 0 0 0 1px rgba(255,154,77,0.3)}
.sidebar a.active .ic{color:var(--primary-2);opacity:1}
@media (max-width:960px){
  .sidebar{position:fixed;left:0;top:0;z-index:60;width:280px;transform:translateX(-105%);transition:transform .34s var(--ease);height:100vh}
  .sidebar.open{transform:translateX(0);box-shadow:var(--shadow-2)}
}

/* Topbar */
.admin-top{position:sticky;top:0;z-index:30;background:rgba(255,255,255,0.9);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border-bottom:1px solid var(--border);padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;min-width:0}
.admin-top .top-title{display:flex;align-items:center;gap:12px;font-family:var(--font-display);font-weight:700;font-size:1.1rem;color:var(--text);min-width:0;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.admin-top .search{flex:1;max-width:360px}
.admin-top .search input{padding:9px 14px;background:var(--panel);border-radius:999px}
.admin-top .right{display:flex;align-items:center;gap:10px}

.admin-main{min-height:100vh}
.admin-content{padding:24px}
@media (min-width:1200px){.admin-content{padding:32px 40px}}

.page-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.page-head h1{font-size:1.5rem}

/* ---------- Dashboard stats ---------- */
.dash-grid{display:grid;grid-template-columns:repeat(4, 1fr);gap:16px;margin-bottom:24px}
@media (max-width:1100px){.dash-grid{grid-template-columns:repeat(2, 1fr)}}
@media (max-width:620px){.dash-grid{grid-template-columns:1fr}}
.stat{position:relative;display:flex;align-items:center;gap:14px;padding:18px;border-radius:16px;background:var(--panel);border:1px solid var(--border);backdrop-filter:var(--glass-blur);transition:transform var(--dur-2) var(--ease), border-color var(--dur-2) var(--ease)}
.stat:hover{transform:translateY(-3px);border-color:var(--border-2)}
.stat-ic{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:linear-gradient(180deg, rgba(255,107,0,0.2), rgba(255,107,0,0.14));border:1px solid rgba(255,154,77,0.25);color:var(--primary-2)}
.stat .lbl{font-size:.78rem;color:var(--text-3);text-transform:uppercase;letter-spacing:.08em;font-weight:600}
.stat .cnt{font-family:var(--font-display);font-weight:800;font-size:1.6rem;color:var(--text);line-height:1.1}

/* ---------- Tables ---------- */
.table-card{background:var(--panel-solid);border:1px solid var(--border);border-radius:16px;overflow:hidden;box-shadow:var(--shadow-1)}
.table-wrap{overflow:auto;max-width:100%}
.atable{width:100%;border-collapse:separate;border-spacing:0;font-size:.9rem}
.atable thead th{position:sticky;top:0;background:var(--panel-elev);text-align:left;padding:12px 14px;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-3);font-weight:700;border-bottom:1px solid var(--border);z-index:1}
.atable tbody td{padding:12px 14px;border-bottom:1px solid var(--border);color:var(--text-2);vertical-align:middle}
.atable tbody tr{transition:background var(--dur-1) var(--ease)}
.atable tbody tr:hover td{background:rgba(255,107,0,0.04);color:var(--text)}
.atable tbody tr:last-child td{border-bottom:0}
.atable .mono{font-family:var(--font-mono);font-size:.86rem}
.atable .nowrap{white-space:nowrap}

/* Toolbar / search */
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;background:var(--panel);border-bottom:1px solid var(--border);flex-wrap:wrap}
.toolbar .search{display:flex;align-items:center;gap:8px}
.toolbar .search input{padding:9px 12px;border-radius:10px;min-width:220px}

/* Pager */
.pager-row{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;color:var(--text-3);font-size:.85rem;border-top:1px solid var(--border);background:var(--panel)}
.pager-row .btn{padding:7px 12px}

/* ---------- Form editors ---------- */
.aform{display:grid;gap:16px;background:var(--panel-solid);border:1px solid var(--border);padding:24px;border-radius:16px;box-shadow:var(--shadow-1)}
.aform .fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:800px){.aform .fgrid{grid-template-columns:1fr}}
.aform label{color:var(--text-2);font-weight:600;font-size:.85rem}
.action-bar{position:sticky;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;background:rgba(255,255,255,0.95);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--border);border-radius:16px;margin-top:14px;flex-wrap:wrap;box-shadow:var(--shadow-2)}
.action-bar{background:rgba(255,255,255,0.9)}
.action-bar .btn-row{gap:8px}

/* Item editor (array fields) */
.item-row{display:grid;gap:10px;padding:14px;border-radius:14px;background:var(--panel);border:1px solid var(--border);margin-bottom:10px}
.item-ctl{display:flex;gap:8px;justify-content:flex-end}
.items{display:grid;gap:10px}

/* Image field */
.img-field{display:flex;flex-direction:column;gap:10px;max-width:420px}
.img-ctl{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.img-prev{display:flex;align-items:center;justify-content:center;width:100%;max-width:280px;height:180px;border-radius:12px;border:1px solid var(--border);background:var(--panel-2);padding:6px;overflow:hidden;position:relative}
.img-prev img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block;border-radius:6px}
.img-prev svg{color:var(--text-3)}

/* ---------- Media library ---------- */
.media-grid.lib{display:grid;grid-template-columns:repeat(auto-fill, minmax(160px, 1fr));gap:12px}
.media-item{position:relative;background:var(--panel);border:1px solid var(--border);border-radius:14px;overflow:hidden;aspect-ratio:1;transition:transform var(--dur-2) var(--ease), border-color var(--dur-2) var(--ease);cursor:pointer}
.media-item:hover{transform:translateY(-3px);border-color:var(--border-2)}
.media-item img{width:100%;height:100%;object-fit:cover;display:block}
.media-item .item-ctl{position:absolute;bottom:6px;right:6px;display:flex;gap:4px;opacity:0;transition:opacity var(--dur-1) var(--ease)}
.media-item:hover .item-ctl{opacity:1}
.media-item .icon-btn{width:30px;height:30px}
.upl{display:grid;gap:10px;padding:16px;border:2px dashed var(--border-2);border-radius:14px;background:var(--panel);text-align:center;margin-bottom:14px}
.upl .lg{font-size:1.1rem;color:var(--text)}

/* ---------- Login ---------- */
.admin-login{display:grid;place-items:center;min-height:100vh;padding:20px;background:var(--bg)}
.admin-login::before{content:"";position:fixed;inset:0;background:var(--aurora);opacity:.65;pointer-events:none;z-index:0}
.login-card{position:relative;z-index:1;max-width:460px;width:100%;padding:36px;border-radius:22px;background:var(--panel);border:1px solid var(--border);backdrop-filter:var(--glass-blur);box-shadow:var(--shadow-2)}
.login-card .side-logo{justify-content:center;border:0;padding-bottom:12px;margin-bottom:20px}
.login-card .side-logo img{height:48px}

/* ---------- Forced TOTP enrollment during login ---------- */
.enroll-steps{display:flex;flex-direction:column;gap:14px;margin:18px 0}
.enroll-step{display:flex;gap:12px;align-items:flex-start}
.enroll-step .step-n{flex:0 0 28px;height:28px;border-radius:50%;background:var(--primary);color:#fff;font-weight:700;display:grid;place-items:center;font-size:.9rem}
.enroll-step p{margin:0;color:var(--text-2);line-height:1.5;font-size:.95rem}
.enroll-qr-wrap{display:grid;place-items:center;padding:16px;background:#fff;border:1px solid var(--border);border-radius:14px;min-height:200px}
.enroll-qr-wrap img{display:block;border-radius:6px}
.enroll-qr-wrap .qr-placeholder{width:40px;height:40px}
.enroll-manual{margin-top:8px;background:var(--bg-soft);border:1px solid var(--border);border-radius:10px;padding:10px 14px}
.enroll-manual summary{cursor:pointer;font-weight:600;color:var(--primary);font-size:.9rem;list-style:none}
.enroll-manual summary::-webkit-details-marker{display:none}
.enroll-manual summary::before{content:"\25B6";display:inline-block;margin-right:6px;font-size:.75em;transition:transform .18s var(--ease)}
.enroll-manual[open] summary::before{transform:rotate(90deg)}
.enroll-manual .enroll-secret{display:block;padding:8px 10px;margin-top:10px;background:#000;color:#FF6B00;border-radius:6px;font-family:'Roboto Mono',monospace;letter-spacing:.1em;font-size:.92rem;word-break:break-all;user-select:all}
.recovery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:16px 0}
.recovery-grid code{display:block;padding:10px 12px;background:var(--bg-soft);border:1px dashed var(--border);border-radius:8px;font-family:'Roboto Mono',monospace;text-align:center;font-size:.98rem;letter-spacing:.08em;user-select:all}
@media (max-width:520px){.recovery-grid{grid-template-columns:1fr}.enroll-qr-wrap img{max-width:180px;height:auto}}


/* ---------- Expired / recoverable auth state ---------- */
.auth-expired{display:flex;flex-direction:column;align-items:center;text-align:center;padding:12px 4px 4px;gap:14px}
.auth-expired-icon{width:56px;height:56px;border-radius:50%;background:rgba(255,107,0,.1);color:var(--primary);display:grid;place-items:center}
.auth-expired-title{margin:0;font-size:1.2rem;color:var(--text-1)}
.auth-expired-body{margin:0;color:var(--text-2);line-height:1.55;font-size:.95rem;max-width:380px}


/* ---------- Chat admin (two-pane) ---------- */
.chat-admin{display:grid;grid-template-columns:300px 1fr;gap:16px;background:var(--panel-solid);border:1px solid var(--border);border-radius:16px;overflow:hidden;min-height:60vh}
@media (max-width:800px){.chat-admin{grid-template-columns:1fr}}
.conv-list{border-right:1px solid var(--border);display:flex;flex-direction:column;max-height:70vh;overflow:auto}
.conv-filter{display:flex;gap:8px;padding:12px;border-bottom:1px solid var(--border)}
.conv{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border-bottom:1px solid var(--border);cursor:pointer;transition:background var(--dur-1) var(--ease)}
.conv:hover{background:var(--panel)}
.conv.active{background:rgba(255,107,0,0.1)}
.conv.unread{border-left:3px solid var(--primary-2)}
.conv-pane{display:flex;flex-direction:column;max-height:70vh}
.conv-head{display:flex;align-items:center;gap:10px;padding:14px;border-bottom:1px solid var(--border)}
.conv-msgs{flex:1;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:8px}
.msg.agent{background:rgba(255,107,0,0.14);border-color:rgba(255,154,77,0.3)}
.msg.visitor{align-self:flex-end;background:var(--panel);color:var(--text)}
.msg.ai-msg{background:rgba(255,107,0,0.06);border-color:rgba(255,107,0,0.3)}
.msg.ai-msg .who{color:#C24F00}
.msg.ai-msg .who::before{content:"✦ ";color:var(--primary)}
.msg.system{align-self:center;background:transparent;border:1px dashed var(--border);color:var(--text-3);font-size:.84rem;max-width:90%;text-align:center}
.conv-reply{display:grid;grid-template-columns:1fr auto;gap:8px;padding:12px;border-top:1px solid var(--border)}

/* ---------- Settings sections ---------- */
.set-sec{display:grid;gap:18px;background:var(--panel-solid);border:1px solid var(--border);padding:22px;border-radius:16px}
.set-sec h3{margin-bottom:6px}
.color-row{display:grid;grid-template-columns:repeat(2, 1fr);gap:14px}
@media (max-width:600px){.color-row{grid-template-columns:1fr}}
.color-row label{display:flex;align-items:center;gap:10px}
.color-row input[type="color"]{width:52px;height:40px;padding:0;border-radius:10px;cursor:pointer}

/* ---------- RTE / HTML editor ---------- */
.rte{display:grid;gap:8px}
.rte-bar{display:flex;flex-wrap:wrap;gap:4px;padding:8px;background:var(--panel);border:1px solid var(--border);border-radius:12px}
.rte-bar .btn{padding:7px 10px;font-size:.84rem}
.rte-area{min-height:260px;padding:12px 14px;background:rgba(0,0,0,0.3);border:1px solid var(--border-2);border-radius:12px;color:var(--text);font-family:var(--font-mono);font-size:.9rem;overflow:auto;outline:none;line-height:1.6}
.rte-area{background:#fff}
.rte-src{font-family:var(--font-mono);font-size:.86rem}

/* Dense orders detail */
.od-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:16px}
@media (max-width:800px){.od-grid{grid-template-columns:1fr}}

/* Status chips */
.badge-success, .badge-paid{color:#14683C;background:rgba(31,157,90,.14);border-color:rgba(31,157,90,.4)}
.badge-warning, .badge-pending_payment{color:#8A5200;background:rgba(255,176,32,.18);border-color:rgba(184,107,0,.4)}
.badge-danger, .badge-failed{color:#A82424;background:rgba(217,54,54,.12);border-color:rgba(217,54,54,.4)}

/* RTL / small helpers */
.full{width:100%}
.lg{font-size:1.1rem}

/* Mobile hamburger toggle in admin topbar */
.admin-top .menu-toggle{display:none}
@media (max-width:960px){.admin-top .menu-toggle{display:inline-grid}}

/* Audit log viewer */
.rte-area.ro{opacity:.95;cursor:default}

/* Scrollbars in admin */
.admin-main *::-webkit-scrollbar{width:8px;height:8px}
.admin-main *::-webkit-scrollbar-thumb{background:rgba(160,160,165,0.2);border-radius:4px}
.admin-main *::-webkit-scrollbar-track{background:transparent}

/* Sidebar label + nav specifics */
.sidebar a em{font-style:normal;flex:1;color:inherit}
.sidebar a .cnt{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--primary);color:var(--primary-ink);font-size:.68rem;font-weight:800;font-style:normal}
.sidebar a .cnt:empty{display:none}
.side-group .lbl{display:block;color:var(--text-3);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;padding:10px 10px 6px;font-weight:700}

/* Admin top avatar block */
.admin-top .me{display:flex;align-items:center;gap:10px;padding:6px 10px;border-radius:12px;background:var(--panel);border:1px solid var(--border)}
.admin-top .me small{display:block;color:var(--text-3);font-size:.72rem}
.admin-top .me strong{color:var(--text);font-weight:600}
.admin-top .avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(180deg, var(--primary-2), var(--primary));color:#fff;font-weight:800;font-family:var(--font-display)}

/* Admin reveal: calmer */
.is-admin .reveal{transform:translateY(8px)}

/* Dense list cards */
.table-card .toolbar + .table-wrap{border-top:0}

/* Code tag in audit log/email log */
code{font-family:var(--font-mono);background:var(--panel);padding:2px 6px;border-radius:6px}

/* ---------- v3 corporate theme: restore dashboard KPI grid + tidy top bar ---------- */
.admin-top{justify-content:flex-start;background:rgba(11,11,13,.96)}
.admin-top{background:rgba(255,255,255,.96)}
.admin-top .top-title{margin-right:auto}
.stats{display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));gap:16px;margin-bottom:24px}
@media (max-width:1200px){.stats{grid-template-columns:repeat(2, minmax(0, 1fr))}}
@media (max-width:560px){.stats{grid-template-columns:1fr}}
.stat{text-decoration:none !important;color:var(--text)}
.stat small{display:block;color:var(--text-3);font-size:.76rem;text-transform:uppercase;letter-spacing:.08em;font-weight:600}
.stat strong{display:block;font-family:var(--font-display);font-weight:800;font-size:1.55rem;color:var(--text);line-height:1.15}
.stat-ic{background:rgba(255,107,0,.12);border:1px solid rgba(255,107,0,.32);color:#FF6B00}
.sidebar a.active{background:rgba(255,107,0,.10);border-color:rgba(255,107,0,.35)}
.sidebar a.active .ic{color:#FF6B00}
.admin-top .avatar{background:#FF6B00;color:#0B0B0D}
.dash-grid{display:grid;grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);gap:16px;align-items:start}
@media (max-width:1100px){.dash-grid{grid-template-columns:1fr}}
.dash-grid > .card{min-width:0;overflow-x:auto}
.admin-main .card h2, .admin-main .card.pad h2{font-size:1.1rem;line-height:1.3;margin:0 0 14px;letter-spacing:-0.01em}
.checklist{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.checklist li{display:flex;gap:10px;align-items:flex-start}
.checklist li span{color:var(--warning);flex:none;margin-top:2px}
.checklist li.done span{color:var(--success)}
.checklist li.done a{color:var(--text-3);text-decoration:line-through}

/* ---- Two-factor authentication UI ---- */
.steps-list{margin:0 0 16px;padding-left:20px;color:var(--text-2)}
.steps-list li{margin-bottom:6px}
.tfa-enroll{display:grid;grid-template-columns:220px 1fr;gap:20px;align-items:start;margin-bottom:18px;padding:16px;border:1px solid var(--border);border-radius:12px;background:var(--bg-soft)}
.tfa-enroll img{border-radius:8px;background:#fff;padding:8px;border:1px solid var(--border)}
.tfa-manual small{display:block;margin-top:6px;letter-spacing:0.04em;text-transform:uppercase;font-size:0.72rem}
.tfa-manual p{margin:2px 0 10px}
.tfa-manual code.mono{display:inline-block;padding:4px 8px;background:#fff;border:1px solid var(--border);border-radius:6px;font-family:'Roboto Mono',monospace;font-size:0.95rem}
.tfa-manual .tfa-secret{letter-spacing:0.08em}
.recovery-codes{list-style:none;padding:0;margin:16px 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.recovery-codes li code{display:block;padding:10px 12px;background:var(--bg-soft);border:1px dashed var(--border);border-radius:8px;font-family:'Roboto Mono',monospace;text-align:center;font-size:0.95rem;letter-spacing:0.08em}
@media (max-width:640px){.tfa-enroll{grid-template-columns:1fr}.tfa-enroll img{justify-self:center}.recovery-codes{grid-template-columns:1fr}}

/* ============================================================
   PHASE 1.2 — Admin dashboard premium polish
   - Mobile viewport containment
   - Max content width on ultra-wide screens
   - Card elevation + accent border
   - Dashboard stat cards: subtle brand accent
   - Better form field focus states
   ============================================================ */

/* Prevent any descendant from pushing the layout wider than the viewport */
html, body { max-width: 100vw; overflow-x: hidden; }
.app.is-admin, .admin-shell { max-width: 100vw; min-width: 0; }
.admin-main { min-width: 0; overflow-x: hidden; }
.admin-content { min-width: 0; }

/* Keep admin-content comfortably readable on ultra-wide monitors */
@media (min-width: 1600px) {
  .admin-content { max-width: 1500px; margin-left: auto; margin-right: auto; }
}

/* Give the sticky top bar a soft shadow when scrolled */
.admin-top { box-shadow: 0 1px 0 var(--border), 0 6px 20px -16px rgba(0,0,0,0.18); }

/* Dashboard stat cards: elevate + brand-accent corner (overrides base .stat styles) */
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-bottom: 20px; }
.stats .stat {
  position: relative;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 18px 20px;
  display: flex;
  align-items: center;
  gap: 14px;
  text-decoration: none;
  color: inherit;
  box-shadow: 0 1px 0 rgba(16,24,40,0.03), 0 4px 14px -10px rgba(16,24,40,0.14);
  transition: transform var(--dur-1) var(--ease), box-shadow var(--dur-2) var(--ease), border-color var(--dur-1) var(--ease);
  overflow: hidden;
}
.stats .stat::after {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: linear-gradient(180deg, var(--primary), var(--primary-2));
  opacity: 0.85;
}
.stats .stat:hover { transform: translateY(-1px); box-shadow: 0 2px 0 rgba(16,24,40,0.04), 0 10px 24px -14px rgba(16,24,40,0.18); border-color: rgba(255,107,0,0.25); }
.stats .stat .stat-ic { color: var(--primary-2); background: rgba(255,107,0,0.08); border-radius: 10px; width: 42px; height: 42px; display: grid; place-items: center; flex-shrink: 0; }
.stats .stat small { display: block; font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-3); font-weight: 700; margin-bottom: 2px; }
.stats .stat strong { display: block; font-family: var(--font-display); font-weight: 800; font-size: 1.6rem; line-height: 1.1; color: var(--text); }

/* Cards: unified elevation */
.admin-main .card { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; box-shadow: 0 1px 0 rgba(16,24,40,0.02), 0 4px 20px -16px rgba(16,24,40,0.14); }
.admin-main .card.pad { padding: 20px 22px; }

/* Section separators */
.admin-main .page-head { padding-bottom: 14px; margin-bottom: 20px; border-bottom: 1px solid var(--border); display:flex; align-items:flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.admin-main .page-head h1 { font-family: var(--font-display); font-weight: 800; font-size: 1.5rem; letter-spacing: -0.02em; margin: 0 0 4px; }
.admin-main .page-head .muted { margin: 0; color: var(--text-3); font-size: 0.9rem; }

/* Forms: input focus ring in brand color */
.admin-main input:not([type="checkbox"]):not([type="radio"]), .admin-main textarea, .admin-main select {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 10px 12px;
  color: var(--text);
  font-family: inherit;
  font-size: 0.92rem;
  transition: border-color var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease);
}
.admin-main input:focus-visible, .admin-main textarea:focus-visible, .admin-main select:focus-visible {
  outline: none;
  border-color: var(--primary-2);
  box-shadow: 0 0 0 3px rgba(255,107,0,0.18);
}

/* Settings action-bar: subtle elevation on light bg */
.action-bar .form-msg { flex: 1; min-width: 0; margin: 0; }
.action-bar .btn { white-space: nowrap; }

/* Tables inside cards: no extra inner padding above the wrap */
.table-card .table-wrap { border-radius: 14px; overflow: auto; }
.table-card { padding: 0; }
.table-card > .pager-row { padding: 10px 18px; border-top: 1px solid var(--border); }

/* Mobile hardening */
@media (max-width: 768px) {
  .admin-content { padding: 16px; }
  .admin-main .card.pad { padding: 16px; }
  .admin-top { padding: 10px 14px; gap: 10px; }
  .admin-top .top-title { font-size: 1rem; }
  .admin-top .search { max-width: 100%; width: 100%; order: 10; }
  .dash-stats { grid-template-columns: 1fr 1fr; gap: 10px; }
  .dash-stats .stat { padding: 14px; gap: 10px; }
  .dash-stats .stat .val { font-size: 1.35rem; }
  .stats { grid-template-columns: 1fr 1fr; gap: 10px; }
  .stats .stat { padding: 14px; gap: 10px; }
  .stats .stat strong { font-size: 1.35rem; }
  .atable { font-size: 0.85rem; }
  .atable thead th, .atable tbody td { padding: 10px 12px; }
  .action-bar { padding: 12px; gap: 8px; border-radius: 12px; }
  .action-bar .btn { font-size: 0.85rem; padding: 8px 12px; }
  .page-head { align-items: flex-start; }
  .page-head h1 { font-size: 1.25rem !important; }
}
@media (max-width: 480px) {
  .dash-stats { grid-template-columns: 1fr; }
  .stats { grid-template-columns: 1fr; }
}

/* Ambient orbs: constrain so they never trigger horizontal page scroll on tiny viewports */
.ambient-orbs { right: 0; left: 0; width: 100vw; overflow: hidden; }
.ambient-orbs-admin .orb { opacity: 0.22; }

/* Blog Manager extras */
.thumb-sm { width:60px; height:40px; object-fit:cover; border-radius:6px; border:1px solid var(--border); display:block }
.switch { position:relative; display:inline-block; width:46px; height:26px }
.switch input { opacity:0; width:0; height:0 }
.switch .slider { position:absolute; cursor:pointer; inset:0; background:#CBD5E1; border-radius:999px; transition:background var(--dur-1) var(--ease) }
.switch .slider::before { content:""; position:absolute; height:20px; width:20px; left:3px; top:3px; background:#fff; border-radius:50%; transition:transform var(--dur-1) var(--ease); box-shadow:0 1px 3px rgba(0,0,0,0.2) }
.switch input:checked + .slider { background:var(--primary) }
.switch input:checked + .slider::before { transform:translateX(20px) }
.switch input:focus-visible + .slider { box-shadow:0 0 0 3px rgba(255,107,0,0.25) }

/* ---- Blog Manager: selection, bulk bar, per-row publish, category panel (Oct 2026) ---- */
.thumb-sm { width:64px; height:36px; aspect-ratio:16/9; object-fit:cover; background:var(--bg-2, #f4f4f6) }
.atable .sel-col { width:36px; padding-right:0 }
.atable .sel-col input { width:18px; height:18px; accent-color:var(--orange, #FF6B00); cursor:pointer }
.atable tr.is-selected td { background:rgba(255,107,0,.06) }
.bulk-bar { position:sticky; top:72px; z-index:20; display:flex; flex-wrap:wrap; gap:12px; align-items:center; justify-content:space-between; padding:10px 14px; margin-bottom:12px; border:1px solid rgba(255,107,0,.35) }
.btn-xs { padding:5px 10px; font-size:.78rem; min-height:30px; gap:5px }
.cat-publish { margin-bottom:12px }
.cat-publish summary, .ap-summary summary { cursor:pointer; display:flex; flex-wrap:wrap; gap:10px; align-items:center; list-style:none }
.cat-publish .table-wrap, .ap-summary .table-wrap { margin-top:12px; max-height:420px; overflow:auto }
.atable.compact td, .atable.compact th { padding:8px 10px }
.ap-summary { margin-top:12px }
.plain-list { list-style:none; padding:0; margin:0; display:grid; gap:10px }
.card.toolbar { justify-content:flex-start }
.card.toolbar .search { flex:1 1 260px }
.card.toolbar select { width:auto; min-width:190px; flex:0 1 auto }
@media (max-width: 640px) { .card.toolbar select { width:100%; flex:1 1 100% } }

/* Download analytics chart */
.dd-chart{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;gap:16px;align-items:center}
.dd-chart svg{grid-column:1 / 2;grid-row:1 / 3}
.dd-summary{grid-column:2 / 3;grid-row:1 / 2;text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.dd-legend{grid-column:2 / 3;grid-row:2 / 3;list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px;max-width:240px}
.dd-legend li{display:flex;align-items:center;gap:8px;font-size:.88rem}
.dd-sw{width:12px;height:12px;border-radius:3px;flex-shrink:0;display:inline-block}
@media (max-width: 900px){
  .dd-chart{grid-template-columns:1fr}
  .dd-chart svg{grid-row:auto}
  .dd-summary{grid-column:1/2;text-align:left;align-items:flex-start}
  .dd-legend{grid-column:1/2;max-width:none}
}

/* Push analytics summary row (4 KPI tiles stacked under the chart on narrow screens) */
.push-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:flex-start;text-align:left;max-width:280px}
.push-summary > div{display:flex;flex-direction:column;gap:0;line-height:1.2;align-items:flex-start}
.push-summary strong{font-weight:700}
@media (max-width:900px){.push-summary{max-width:none;grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:560px){.push-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Preflight smoke test results panel */
.smoke-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;margin-top:12px}
.smoke-item{border:1px solid rgba(0,0,0,.08);border-radius:10px;padding:12px 14px;background:#fff;display:flex;flex-direction:column;gap:4px}
.smoke-item .smoke-head{display:flex;justify-content:space-between;align-items:center;gap:8px}
.smoke-item.pass{border-left:4px solid #2DBE60}
.smoke-item.fail{border-left:4px solid #E8552D}
.smoke-item.warn{border-left:4px solid #E8CC2A}
.smoke-item .badge-pass{background:#E6F7EC;color:#1a7a3e;padding:2px 8px;border-radius:999px;font-size:.72rem;font-weight:600}
.smoke-item .badge-fail{background:#FDE8E3;color:#A3321E;padding:2px 8px;border-radius:999px;font-size:.72rem;font-weight:600}
.smoke-item .badge-warn{background:#FFF4CF;color:#7A5A00;padding:2px 8px;border-radius:999px;font-size:.72rem;font-weight:600}
.smoke-item code{font-size:.78rem;color:#555;white-space:pre-wrap;word-break:break-word}


/* =====================================================================
   ADMIN RESPONSIVE / TABLE HARDENING  (added 2026-10-20)
   -------------------------------------------------------------------
   Non-destructive, additive-only overrides. Fixes:
    - Overly-tall rows caused by narrow first column text wrapping
    - Numeric columns stealing space from text columns
    - Long unbreakable strings (URLs, tokens) overflowing the viewport
    - Admin top bar / toolbar wrap on tablet & phone
    - Horizontal scrolling for wide tables on narrow screens
    - Consistent, readable row rhythm on every page
   No HTML, data, or theme changes.  Safe for all .atable instances.
   ===================================================================== */

/* ---- Table wrapper: always allow horizontal scroll on narrow screens */
.table-wrap{overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch;scrollbar-gutter:stable}
.card.pad > .atable:not(:only-child), .card.pad > table.atable{display:block}
.card > .atable, .pad > .atable{width:100%}

/* ---- Table itself: predictable widths; keeps columns balanced */
.atable{min-width:720px;table-layout:auto;line-height:1.45}
.atable.compact{min-width:560px;font-size:.86rem;line-height:1.35}
.atable th, .atable td{vertical-align:middle;overflow-wrap:anywhere;word-break:normal}
.atable th{white-space:nowrap}
.atable tbody td{padding:11px 14px}

/* ---- First (title/subject) column: readable width, no vertical stacking */
.atable tbody td:first-child{min-width:200px;max-width:340px;line-height:1.45}
.atable tbody td:first-child strong{display:inline-block;line-height:1.4}
.atable tbody td:first-child small,
.atable tbody td:first-child .muted{display:inline-block;margin-top:2px;line-height:1.35;color:var(--text-3)}
.atable tbody td:first-child a{color:inherit;text-decoration:none}
.atable tbody td:first-child a:hover{color:var(--primary);text-decoration:underline}

/* ---- Numeric columns: narrow, right-aligned, no wrap */
.atable td.num, .atable th.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;min-width:72px}
/* Heuristic: columns that typically hold a short number auto-tighten */
.atable tbody td:where(:nth-child(4), :nth-child(5), :nth-child(6), :nth-child(7), :nth-child(8)){white-space:nowrap}

/* ---- Badge columns: shrink to content, keep padding readable */
.atable td.badge-cell, .atable td:has(> .badge-neutral), .atable td:has(> .badge-info),
.atable td:has(> .badge-pass), .atable td:has(> .badge-warn), .atable td:has(> .badge-fail){white-space:nowrap}

/* ---- Date / timestamp cells: never wrap into vertical blobs */
.atable td.date-cell, .atable th.date-cell{white-space:nowrap;min-width:138px;color:var(--text-2)}

/* ---- Action column: buttons stay on one line, right-aligned */
.atable td.row-actions, .atable th.row-actions{white-space:nowrap;text-align:right}
.atable td.row-actions{display:table-cell}
.atable td.row-actions .btn{margin-left:6px}
.atable td.row-actions .btn:first-child{margin-left:0}

/* ---- Clamp helper for subjects with preheaders (optional per-table) */
.atable td.clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ---- Zebra striping for easier scanning (very subtle) */
.atable tbody tr:nth-child(even) td{background:rgba(0,0,0,0.015)}
body.dark .atable tbody tr:nth-child(even) td,
.admin-shell[data-theme="dark"] .atable tbody tr:nth-child(even) td{background:rgba(255,255,255,0.03)}

/* =====================================================================
   PAGE HEADER / TOOLBAR WRAP
   ===================================================================== */
.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.page-head > div:first-child{min-width:0;flex:1 1 320px}
.page-head h1{margin:0 0 4px 0;font-size:1.35rem;line-height:1.25;display:flex;align-items:center;gap:10px}
.page-head p.muted{margin:0;line-height:1.5}
.page-head .btn-row{flex-wrap:wrap;justify-content:flex-end}

.btn-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.btn-row.tight{gap:6px}

/* =====================================================================
   CARD / PANEL CONTENT SAFETY
   ===================================================================== */
.card{min-width:0}
.card.pad{padding:18px}
.card .pad{padding:18px}
.card code{word-break:break-all;overflow-wrap:anywhere}

/* Grids inside cards must never force horizontal page scroll */
[style*="grid-template-columns"]{min-width:0}

/* =====================================================================
   RESPONSIVE BREAKPOINTS
   ===================================================================== */

/* Laptop (<=1366) — tighten table padding so 10-column tables fit */
@media (max-width:1366px){
  .atable tbody td{padding:10px 12px}
  .atable thead th{padding:11px 12px}
  .atable tbody td:first-child{max-width:300px}
}

/* Tablet (<=1024) — more aggressive compaction + action buttons wrap */
@media (max-width:1024px){
  .admin-content{padding:20px}
  .atable{font-size:.86rem}
  .atable tbody td{padding:10px 10px}
  .atable thead th{padding:10px 10px;font-size:.68rem}
  .atable tbody td:first-child{max-width:260px}
  .atable td.row-actions .btn{padding:6px 10px;font-size:.78rem}
  .page-head h1{font-size:1.2rem}
}

/* Small tablet / large phone (<=768) — buttons stack, tables scroll */
@media (max-width:768px){
  .admin-content{padding:16px}
  .atable{min-width:640px}
  .atable.compact{min-width:480px}
  .atable tbody td:first-child{min-width:180px;max-width:220px}
  .atable td.row-actions{text-align:left}
  .atable td.row-actions .btn{display:inline-flex;margin:2px}
  .page-head{flex-direction:column;align-items:stretch}
  .page-head .btn-row{justify-content:flex-start}
  .admin-top{padding:10px 14px;gap:10px}
  .admin-top .top-title{font-size:1rem}
  .admin-top .search{max-width:none;flex-basis:100%;order:3}
}

/* Phone (<=480) — compact rows & phone-friendly tap targets */
@media (max-width:480px){
  .admin-content{padding:12px}
  .atable{font-size:.82rem;min-width:560px}
  .atable tbody td{padding:9px 8px}
  .atable thead th{padding:9px 8px}
  .atable tbody td:first-child{min-width:160px;max-width:200px}
  .btn-sm{padding:7px 10px;min-height:34px}
  .page-head h1{font-size:1.1rem}
  .card.pad, .card .pad{padding:14px}
}

/* =====================================================================
   LONG-STRING SAFETY (URLs, tokens, emails) — never overflow viewport
   ===================================================================== */
.admin-main code, .admin-main pre{overflow-wrap:anywhere;word-break:break-all;max-width:100%}
.admin-main .mono{overflow-wrap:anywhere}
.admin-main a[href^="http"]{overflow-wrap:anywhere}

/* =====================================================================
   SEO AUTOMATION — specific tightening for the GSC status card
   ===================================================================== */
[data-testid="gsc-card"] .btn-row{margin-top:4px}
@media (max-width:640px){
  [data-testid="gsc-card"]{flex-direction:column}
  [data-testid="gsc-card"] .btn-row{width:100%;justify-content:flex-start}
}

/* =====================================================================
   MARKETING CAMPAIGNS — the specific table in the bug report
   ===================================================================== */
[data-testid="campaigns-table"] tbody td:first-child,
[data-testid="mkt-recent-campaigns"] tbody td:first-child{max-width:320px;line-height:1.4}
[data-testid="campaigns-table"] tbody td:first-child strong,
[data-testid="mkt-recent-campaigns"] tbody td:first-child strong{display:block;margin-bottom:2px}
[data-testid="campaigns-table"] tbody td:first-child small,
[data-testid="mkt-recent-campaigns"] tbody td:first-child small{display:block;color:var(--text-3);line-height:1.3;font-size:.78rem}

/* Numeric volume columns (posts, recipients, delivered, failed, held) */
[data-testid="campaigns-table"] thead th:nth-child(n+4):nth-child(-n+8),
[data-testid="campaigns-table"] tbody td:nth-child(n+4):nth-child(-n+8){text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;min-width:72px}

/* Sent-at column always nowrap and reasonable width */
[data-testid="campaigns-table"] thead th:nth-child(9),
[data-testid="campaigns-table"] tbody td:nth-child(9){white-space:nowrap;min-width:138px}

/* Actions column: right-aligned, buttons stay inline */
[data-testid="campaigns-table"] thead th:last-child,
[data-testid="campaigns-table"] tbody td:last-child{text-align:right;white-space:nowrap;min-width:200px}
[data-testid="campaigns-table"] tbody td:last-child .btn{margin-left:6px}
[data-testid="campaigns-table"] tbody td:last-child .btn:first-child{margin-left:0}

/* END ADMIN RESPONSIVE / TABLE HARDENING */


/* =====================================================================
   LOADING STATE HARDENING (added 2026-10-20)
   -------------------------------------------------------------------
   Fixes "page first shows plain text" symptom.  Root causes addressed:
   - .spinner used white-on-white border → invisible on light theme
   - .page-loading had no branded framing, user thought page was stuck
   - Admin pages briefly flashed unstyled before admin.css attached
   ===================================================================== */

/* Visible spinner on both light + dark surfaces */
.admin-shell .spinner,
body.is-admin .spinner,
.page-loading .spinner{
  border:2px solid rgba(11,11,13,0.12);
  border-top-color:var(--primary);
  box-shadow:0 0 0 0 rgba(255,107,0,0);
}
.admin-shell .spinner.lg,
body.is-admin .spinner.lg,
.page-loading .spinner.lg{border-width:3px}

/* Centered, branded page-level loading state */
.admin-main .page-loading,
.admin-content .page-loading,
body.is-admin .page-loading{
  min-height:60vh;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:14px;color:var(--text-3);font-size:.9rem
}
.admin-main .page-loading::after,
.admin-content .page-loading::after,
body.is-admin .page-loading::after{
  content:"Loading…";font-family:var(--font-display);font-size:.78rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--text-3)
}

/* Prevent flash-of-unstyled-admin-content: hide root until the shell paints */
html.admin-booting body > #app > *:not(.page-loading):not(.boot){visibility:hidden}

/* Skeleton rows for data-heavy pages */
.skeleton{display:block;background:linear-gradient(90deg,
  rgba(11,11,13,0.06) 0%, rgba(11,11,13,0.12) 50%, rgba(11,11,13,0.06) 100%);
  background-size:200% 100%;animation:skeletonShimmer 1.4s linear infinite;
  border-radius:6px;height:14px;margin:6px 0;max-width:100%}
.skeleton.lg{height:22px}
.skeleton.block{height:52px;border-radius:10px}
@keyframes skeletonShimmer{to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){
  .admin-shell .spinner, body.is-admin .spinner, .page-loading .spinner{animation-duration:1.6s}
  .skeleton{animation:none;background:rgba(11,11,13,0.08)}
}


/* =====================================================================
   BROADER ADMIN PAGE HARDENING (cards, forms, toolbars, filters, modals)
   Covers every admin route by targeting generic class names.
   ===================================================================== */

/* Cards & panels — never force horizontal page scroll */
.card, .admin-content .card{min-width:0}
.admin-content > .card + .card{margin-top:16px}
.card h2, .card h3{margin-top:0}

/* Form rows / grids — collapse neatly at narrow widths */
.aform{display:flex;flex-direction:column;gap:14px}
.aform label{display:flex;flex-direction:column;gap:6px;min-width:0}
.aform label > span{font-size:.82rem;color:var(--text-3);font-weight:600;letter-spacing:.02em}
.aform input, .aform select, .aform textarea{width:100%;max-width:100%;min-width:0}
.aform textarea{min-height:92px;resize:vertical}
.aform .fgrid{display:grid;grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));gap:12px}
.aform .form-msg{min-height:1.3em}

/* Toolbars (search + filter chips + action buttons) */
.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 14px;border-bottom:1px solid var(--border);background:var(--panel-elev)}
.toolbar .search{flex:1 1 220px;min-width:0}
.toolbar .search input{width:100%;min-width:0;max-width:420px}
.toolbar .filters{display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.toolbar .filters > *{flex:0 0 auto}
.toolbar .btn-row{margin-left:auto;flex-wrap:wrap;justify-content:flex-end}

/* Stats grid — never overlap, always square cards */
.stats{display:grid;grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));gap:14px;margin-bottom:18px}
.stats .stat-card{min-width:0}
.stats .stat-card .stat-val{min-width:0;overflow-wrap:anywhere}

/* Dashboard split layout */
.dash-grid{display:grid;gap:16px}
.dash-grid > .card{min-width:0}

/* Chart / canvas containers — never overflow */
.chart-wrap, .admin-main canvas, .admin-main svg{max-width:100%;height:auto}
.admin-main img{max-width:100%;height:auto}

/* Modals — fit the viewport comfortably at every size */
.modal-overlay{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,0.55);display:grid;place-items:center;padding:20px}
.modal{max-width:min(96vw, 640px);width:100%;background:var(--panel);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-2);max-height:90vh;overflow:auto;display:flex;flex-direction:column}
.modal.lg{max-width:min(96vw, 860px)}
.modal.xl{max-width:min(96vw, 1100px)}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--border)}
.modal-head h3{margin:0;font-size:1.05rem}
.modal-close{appearance:none;background:transparent;border:0;color:var(--text-2);cursor:pointer;padding:6px;border-radius:8px}
.modal-close:hover{background:var(--panel-2);color:var(--text)}

/* Row-actions row inside tables — buttons never clip or break line */
.row-actions{display:inline-flex;gap:6px;flex-wrap:nowrap;align-items:center}

/* Badges — never wrap */
.badge, [class^="badge-"]{display:inline-flex;align-items:center;white-space:nowrap;padding:3px 10px;border-radius:999px;font-size:.72rem;font-weight:600;letter-spacing:.02em}

/* Buttons — min tap target on mobile */
.btn{min-height:36px}
.btn.btn-sm{min-height:32px}
.btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px}

/* Sidebar scroll + mobile sheet */
.sidebar{min-width:0}
.sidebar a{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Scrollable overflow containers — stable scrollbar gutter */
.scroll-area, [data-scroll], .table-wrap{scrollbar-gutter:stable both-edges}

/* Mobile layout tweaks for all pages */
@media (max-width:900px){
  .toolbar{padding:10px 12px;gap:8px}
  .toolbar .btn-row{width:100%;justify-content:flex-start}
  .stats{grid-template-columns:repeat(auto-fill, minmax(160px, 1fr))}
  .modal{max-height:92vh}
  .modal-head{padding:12px 14px}
  .modal-head h3{font-size:1rem}
}
@media (max-width:480px){
  .stats{grid-template-columns:repeat(auto-fill, minmax(140px, 1fr));gap:10px}
  .admin-content > .card + .card{margin-top:12px}
  .modal{border-radius:12px}
  .modal-overlay{padding:12px}
}

/* END BROADER ADMIN PAGE HARDENING */


/* =====================================================================
   PAGE-SPECIFIC FIXES — targeting the exact tables user reported broken
   (added 2026-10-20c, in response to screenshot-level audit)
   ===================================================================== */

/* ------------------------------------------------------------------ */
/* AI SEO MANAGER - Pages table.  Column order:                       */
/* 1 Score | 2 Path | 3 Source | 4 Title(len) | 5 Meta(len) |         */
/* 6 Issues | 7 AI Queue | 8 (actions)                                 */
/* Previously the Path column (col 2) was auto-sized so URLs like     */
/* /legal/disclaimer wrapped character-by-character into vertical     */
/* columns of letters.  This forces a readable path width.             */
/* ------------------------------------------------------------------ */
[data-testid="seo-pages-table"]{min-width:980px;table-layout:auto}
[data-testid="seo-pages-table"] thead th:nth-child(1),
[data-testid="seo-pages-table"] tbody td:nth-child(1){width:72px;min-width:72px;white-space:nowrap;text-align:left}
[data-testid="seo-pages-table"] thead th:nth-child(2),
[data-testid="seo-pages-table"] tbody td:nth-child(2){width:auto;min-width:260px;max-width:420px;word-break:normal;overflow-wrap:anywhere;line-height:1.4}
[data-testid="seo-pages-table"] tbody td:nth-child(2) code,
[data-testid="seo-pages-table"] tbody td:nth-child(2) a{word-break:break-all;overflow-wrap:anywhere}
[data-testid="seo-pages-table"] thead th:nth-child(3),
[data-testid="seo-pages-table"] tbody td:nth-child(3){width:92px;min-width:92px;white-space:nowrap}
[data-testid="seo-pages-table"] thead th:nth-child(4),
[data-testid="seo-pages-table"] thead th:nth-child(5),
[data-testid="seo-pages-table"] tbody td:nth-child(4),
[data-testid="seo-pages-table"] tbody td:nth-child(5){width:80px;min-width:80px;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
[data-testid="seo-pages-table"] thead th:nth-child(6),
[data-testid="seo-pages-table"] tbody td:nth-child(6){min-width:140px;max-width:260px;white-space:normal;word-break:break-word;line-height:1.3}
[data-testid="seo-pages-table"] thead th:nth-child(7),
[data-testid="seo-pages-table"] tbody td:nth-child(7){min-width:110px;white-space:nowrap}
[data-testid="seo-pages-table"] thead th:nth-child(8),
[data-testid="seo-pages-table"] tbody td:nth-child(8){min-width:140px;text-align:right;white-space:nowrap}

/* Reset the generic td:first-child clamp that was too aggressive here — on
   the SEO pages table the first column is the small Score badge, not a title. */
[data-testid="seo-pages-table"] tbody td:first-child{min-width:72px;max-width:none}

/* ------------------------------------------------------------------ */
/* INVOICES - number / customer / status / amount / date / actions     */
/* First column is the invoice number which can be long; keep readable */
/* ------------------------------------------------------------------ */
[data-testid="invoices-table"] tbody td:first-child{min-width:170px;max-width:220px;white-space:nowrap;font-variant-numeric:tabular-nums}

/* ------------------------------------------------------------------ */
/* LOCATIONS table columns: Order Name Address Coords PlaceId Photo Status Actions
   Name column was being crushed; address needs real breathing room.    */
/* ------------------------------------------------------------------ */
[data-testid="loc-table"]{min-width:1100px}
[data-testid="loc-table"] tbody td:nth-child(2){min-width:180px;max-width:240px;line-height:1.4}
[data-testid="loc-table"] tbody td:nth-child(3){min-width:280px;max-width:360px;line-height:1.4;white-space:normal}

/* ------------------------------------------------------------------ */
/* BOOKINGS table.  Service description column shouldn't become 1-letter wide. */
/* ------------------------------------------------------------------ */
[data-testid="bookings-table"] tbody td:nth-child(3){min-width:220px;max-width:360px;line-height:1.4}
[data-testid="bookings-table"] tbody td:nth-child(4){min-width:220px;max-width:360px;line-height:1.4}

/* ------------------------------------------------------------------ */
/* BLOG MANAGER - title column should be wide                           */
/* ------------------------------------------------------------------ */
[data-testid="posts-table"] tbody td:first-child,
[data-testid="blog-posts-table"] tbody td:first-child{min-width:260px;max-width:460px;line-height:1.4}

/* ------------------------------------------------------------------ */
/* MARKETING CONTACTS - email, name columns readable                    */
/* ------------------------------------------------------------------ */
[data-testid="contacts-table"] tbody td:first-child{min-width:220px;max-width:340px;word-break:break-all;overflow-wrap:anywhere;line-height:1.4}
[data-testid="contacts-table"] tbody td:nth-child(2){min-width:140px;max-width:220px;line-height:1.4}

/* ------------------------------------------------------------------ */
/* SIDEBAR — must always be scrollable so lower menu items are never
   hidden on long pages like AI SEO Manager (71+ rows).                 */
/* ------------------------------------------------------------------ */
.sidebar{overflow-y:auto !important;overscroll-behavior:contain}
.sidebar::-webkit-scrollbar{width:10px}
.sidebar::-webkit-scrollbar-thumb{background:rgba(11,11,13,0.22);border-radius:999px;border:2px solid var(--bg,#fff)}
.sidebar::-webkit-scrollbar-thumb:hover{background:rgba(255,107,0,0.5)}
.sidebar::-webkit-scrollbar-track{background:transparent}
/* Keep the active item visually anchored even while user scrolls */
.sidebar a.active{position:relative}

/* On tall admin pages, sticky sidebar must respect viewport height */
@media (min-width:961px){
  .admin-shell > .sidebar{position:sticky;top:0;align-self:start;height:100vh;max-height:100vh}
}

/* Media Library grid tightening — never spill off the viewport */
.media-grid{min-width:0}

/* END PAGE-SPECIFIC FIXES */


/* ========================================================================
   PREMIUM ADMIN REDESIGN — Phase 0 + 1 (added 2026-10-20)
   Scoped under body.is-admin so the public site is untouched.
   Tokens here override only INSIDE the admin shell.
   Preserves every existing class name + data-testid.
   ======================================================================== */

body.is-admin, html.is-admin body{
  /* --- Design tokens: colors --- */
  --admin-primary:#FF6B00;
  --admin-primary-600:#E65C00;
  --admin-primary-400:#FF8A1F;
  --admin-primary-a08:rgba(255,107,0,0.08);
  --admin-primary-a12:rgba(255,107,0,0.12);
  --admin-primary-a16:rgba(255,107,0,0.16);
  --admin-primary-ring:rgba(255,107,0,0.28);

  --admin-ink:#0B0B0D;
  --admin-ink-2:rgba(11,11,13,0.86);
  --admin-ink-3:rgba(11,11,13,0.60);
  --admin-ink-4:rgba(11,11,13,0.42);

  --admin-border:rgba(11,11,13,0.08);
  --admin-border-2:rgba(11,11,13,0.12);
  --admin-border-3:rgba(11,11,13,0.18);

  --admin-bg:#F6F7F9;
  --admin-surface:#FFFFFF;
  --admin-surface-2:#FBFBFC;
  --admin-surface-3:#F3F4F6;
  --admin-surface-glass:rgba(255,255,255,0.72);

  --admin-sidebar-bg:#0B0B0D;
  --admin-sidebar-text:rgba(255,255,255,0.86);
  --admin-sidebar-muted:rgba(255,255,255,0.56);
  --admin-sidebar-hover:rgba(255,255,255,0.07);
  --admin-sidebar-active:rgba(255,107,0,0.18);
  --admin-sidebar-active-text:#FFB37A;

  /* --- Elevation (subtle 3D via layered shadows) --- */
  --admin-shadow-xs:0 1px 2px rgba(11,11,13,0.04),0 1px 1px rgba(11,11,13,0.03);
  --admin-shadow-sm:0 1px 3px rgba(11,11,13,0.06),0 2px 6px rgba(11,11,13,0.04);
  --admin-shadow-md:0 4px 12px rgba(11,11,13,0.07),0 2px 4px rgba(11,11,13,0.04);
  --admin-shadow-lg:0 18px 40px -12px rgba(11,11,13,0.14),0 6px 18px -6px rgba(11,11,13,0.08);
  --admin-shadow-xl:0 30px 70px -20px rgba(11,11,13,0.20),0 10px 30px -8px rgba(11,11,13,0.10);

  /* --- Radii --- */
  --admin-radius-sm:8px;
  --admin-radius-md:12px;
  --admin-radius-lg:16px;
  --admin-radius-xl:20px;

  /* --- Motion --- */
  --admin-ease-out:cubic-bezier(.2,.8,.2,1);
  --admin-dur-fast:150ms;
  --admin-dur-med:220ms;

  /* --- Spacing (4px base) --- */
  --admin-s1:4px; --admin-s2:8px; --admin-s3:12px; --admin-s4:16px;
  --admin-s5:20px; --admin-s6:24px; --admin-s8:32px; --admin-s10:40px;

  background:var(--admin-bg);
  color:var(--admin-ink-2);
}

/* ------------------------------------------------------------------ */
/* Shell geometry — slightly wider sidebar for premium feel, generous content padding */
/* ------------------------------------------------------------------ */
body.is-admin .admin-shell{display:grid;grid-template-columns:264px 1fr;min-height:100vh;background:var(--admin-bg)}
@media (max-width:960px){
  body.is-admin .admin-shell{grid-template-columns:1fr}
}

/* ------------------------------------------------------------------ */
/* Sidebar — dark ink, layered depth, elegant group dividers           */
/* ------------------------------------------------------------------ */
body.is-admin .sidebar{
  position:sticky;top:0;align-self:start;height:100vh;max-height:100vh;
  background:linear-gradient(180deg,#111114 0%, var(--admin-sidebar-bg) 100%);
  color:var(--admin-sidebar-text);
  border-right:1px solid rgba(255,255,255,0.06);
  padding:var(--admin-s5) var(--admin-s3);
  overflow-y:auto;overscroll-behavior:contain;
  box-shadow:inset -1px 0 0 rgba(255,255,255,0.03), 4px 0 24px -12px rgba(0,0,0,0.3);
}
/* Mobile: restore the existing off-canvas drawer behavior (sidebar leaves the grid flow) */
@media (max-width:960px){
  body.is-admin .sidebar{
    position:fixed;top:0;left:0;z-index:60;width:280px;height:100vh;max-height:100vh;
    transform:translateX(-105%);
    transition:transform .34s cubic-bezier(.2,.8,.2,1);
    border-right:1px solid rgba(255,255,255,0.08);
    box-shadow:0 10px 40px rgba(0,0,0,0.4)
  }
  body.is-admin .sidebar.open{transform:translateX(0)}
}
body.is-admin .sidebar::-webkit-scrollbar{width:10px}
body.is-admin .sidebar::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.14);border-radius:999px;border:2px solid transparent;background-clip:padding-box}
body.is-admin .sidebar::-webkit-scrollbar-thumb:hover{background:rgba(255,107,0,0.5);background-clip:padding-box}
body.is-admin .sidebar::-webkit-scrollbar-track{background:transparent}

/* Logo lockup at top of sidebar */
body.is-admin .side-logo,
body.is-admin .sidebar > .side-logo{
  display:flex;align-items:center;gap:10px;padding:4px 10px var(--admin-s4);
  margin-bottom:var(--admin-s3);border-bottom:1px solid rgba(255,255,255,0.06)
}
body.is-admin .side-logo img{height:30px;width:auto;filter:brightness(1.05)}

/* Group header: SMALL CAPS, muted, with subtle accent on the active group */
body.is-admin .side-section{
  color:var(--admin-sidebar-muted);
  font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  padding:var(--admin-s4) var(--admin-s3) var(--admin-s2);
  margin-top:var(--admin-s2);
  line-height:1
}
body.is-admin .side-section:first-of-type{margin-top:0}

/* Sidebar links: pill shape, soft hover, orange active state with left bar */
body.is-admin .sidebar a{
  display:flex;align-items:center;gap:12px;
  padding:9px var(--admin-s3);margin:1px 4px;
  border-radius:10px;
  color:var(--admin-sidebar-text);
  font-size:.88rem;font-weight:500;line-height:1.3;
  text-decoration:none;
  position:relative;
  transition:background var(--admin-dur-fast) var(--admin-ease-out),
             color var(--admin-dur-fast) var(--admin-ease-out),
             transform var(--admin-dur-fast) var(--admin-ease-out);
  min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap
}
body.is-admin .sidebar a:hover{background:var(--admin-sidebar-hover);color:#fff}
body.is-admin .sidebar a:active{transform:translateX(1px)}
body.is-admin .sidebar a.active{
  background:var(--admin-sidebar-active);
  color:var(--admin-sidebar-active-text);
  font-weight:600;
  box-shadow:inset 0 0 0 1px rgba(255,107,0,0.14)
}
body.is-admin .sidebar a.active::before{
  content:"";position:absolute;left:-4px;top:9px;bottom:9px;width:3px;
  background:var(--admin-primary);border-radius:0 3px 3px 0
}
body.is-admin .sidebar a:focus-visible{outline:2px solid var(--admin-primary-ring);outline-offset:2px}

/* Sidebar icon + badge counts */
body.is-admin .sidebar a > svg,
body.is-admin .sidebar a > span.ic{width:18px;height:18px;flex-shrink:0;opacity:.86}
body.is-admin .sidebar a.active > svg,
body.is-admin .sidebar a.active > span.ic{opacity:1}
body.is-admin .sidebar a .count,
body.is-admin .sidebar a .badge-count{
  margin-left:auto;font-size:.7rem;font-weight:700;
  background:rgba(255,255,255,0.08);color:rgba(255,255,255,0.86);
  padding:2px 8px;border-radius:999px;min-width:22px;text-align:center
}
body.is-admin .sidebar a.active .count{background:var(--admin-primary);color:#fff}

/* ------------------------------------------------------------------ */
/* Top bar — glass panel with brand depth; sticks when scrolling       */
/* ------------------------------------------------------------------ */
body.is-admin .admin-top{
  position:sticky;top:0;z-index:40;
  background:var(--admin-surface-glass);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--admin-border);
  padding:12px 24px;
  display:flex;align-items:center;gap:16px;
  min-height:64px;
  box-shadow:0 1px 0 rgba(255,255,255,0.6) inset
}
body.is-admin .admin-top .top-title{
  font-family:var(--font-display,'Montserrat'),system-ui;
  font-weight:700;font-size:1.05rem;color:var(--admin-ink);
  letter-spacing:-.01em
}
body.is-admin .admin-top .search input{
  background:var(--admin-surface);border:1px solid var(--admin-border-2);
  border-radius:999px;padding:9px 16px;font-size:.88rem;
  min-width:260px;max-width:420px;
  box-shadow:var(--admin-shadow-xs);
  transition:border-color var(--admin-dur-fast),box-shadow var(--admin-dur-fast)
}
body.is-admin .admin-top .search input:focus{
  outline:none;border-color:var(--admin-primary);
  box-shadow:0 0 0 4px var(--admin-primary-ring)
}

/* ------------------------------------------------------------------ */
/* Admin content area — more generous padding, no horizontal page scroll */
/* ------------------------------------------------------------------ */
body.is-admin .admin-content{padding:var(--admin-s6);max-width:1600px;margin:0 auto}
@media (max-width:1024px){ body.is-admin .admin-content{padding:var(--admin-s5)} }
@media (max-width:768px){  body.is-admin .admin-content{padding:var(--admin-s4)} }
@media (max-width:480px){  body.is-admin .admin-content{padding:var(--admin-s3)} }

/* ------------------------------------------------------------------ */
/* Page head — stronger hierarchy                                      */
/* ------------------------------------------------------------------ */
body.is-admin .page-head h1{
  font-family:var(--font-display,'Montserrat'),system-ui;
  font-size:1.5rem;font-weight:700;color:var(--admin-ink);
  letter-spacing:-.015em;line-height:1.2;margin:0 0 4px 0
}
body.is-admin .page-head p.muted{color:var(--admin-ink-3);font-size:.9rem;line-height:1.5}

/* ------------------------------------------------------------------ */
/* Cards — the heart of the "premium 3D" feel                          */
/* ------------------------------------------------------------------ */
body.is-admin .card{
  background:var(--admin-surface);
  border:1px solid var(--admin-border);
  border-radius:var(--admin-radius-lg);
  box-shadow:var(--admin-shadow-sm);
  transition:box-shadow var(--admin-dur-med) var(--admin-ease-out),
             transform var(--admin-dur-fast) var(--admin-ease-out),
             border-color var(--admin-dur-fast) var(--admin-ease-out)
}
body.is-admin .card.pad, body.is-admin .card .pad{padding:var(--admin-s6)}
@media (max-width:768px){
  body.is-admin .card.pad, body.is-admin .card .pad{padding:var(--admin-s5)}
}
body.is-admin .card.interactive:hover,
body.is-admin a.card:hover,
body.is-admin button.card:hover{
  box-shadow:var(--admin-shadow-md);
  transform:translateY(-1px);
  border-color:var(--admin-border-2)
}
body.is-admin .card h2{
  font-family:var(--font-display,'Montserrat'),system-ui;
  font-size:1.05rem;font-weight:700;color:var(--admin-ink);
  margin:0 0 var(--admin-s4) 0;letter-spacing:-.01em
}

/* Stat cards get a premium top-accent line + glow */
body.is-admin .stat-card{
  background:var(--admin-surface);
  border:1px solid var(--admin-border);
  border-radius:var(--admin-radius-lg);
  padding:var(--admin-s5);
  box-shadow:var(--admin-shadow-sm);
  position:relative;overflow:hidden;
  transition:box-shadow var(--admin-dur-med),transform var(--admin-dur-fast);
  display:flex;align-items:center;gap:14px
}
body.is-admin .stat-card::before{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--admin-primary),var(--admin-primary-400));
  opacity:.9
}
body.is-admin .stat-card:hover{box-shadow:var(--admin-shadow-md);transform:translateY(-1px)}
body.is-admin .stat-card .stat-ic{
  flex-shrink:0;width:40px;height:40px;border-radius:12px;
  background:var(--admin-primary-a08);color:var(--admin-primary);
  display:flex;align-items:center;justify-content:center;font-size:1.2rem
}
body.is-admin .stat-card .stat-val strong{
  font-family:var(--font-display,'Montserrat'),system-ui;
  font-size:1.4rem;font-weight:700;color:var(--admin-ink);
  letter-spacing:-.02em;line-height:1.1
}
body.is-admin .stat-card .stat-val .muted{font-size:.78rem;margin-top:2px;color:var(--admin-ink-3)}

/* ------------------------------------------------------------------ */
/* Buttons — modernized hover + focus; sizes unchanged                 */
/* ------------------------------------------------------------------ */
body.is-admin .btn{
  border-radius:10px;font-weight:600;letter-spacing:-.005em;
  transition:background var(--admin-dur-fast),color var(--admin-dur-fast),
             box-shadow var(--admin-dur-fast),transform var(--admin-dur-fast)
}
body.is-admin .btn-primary{
  background:linear-gradient(180deg,var(--admin-primary) 0%,var(--admin-primary-600) 100%);
  color:#fff;border:1px solid var(--admin-primary-600);
  box-shadow:0 1px 2px rgba(255,107,0,0.3),inset 0 1px 0 rgba(255,255,255,0.2)
}
body.is-admin .btn-primary:hover{box-shadow:0 4px 14px rgba(255,107,0,0.35),inset 0 1px 0 rgba(255,255,255,0.2);transform:translateY(-1px)}
body.is-admin .btn-primary:active{transform:translateY(0);box-shadow:0 1px 2px rgba(255,107,0,0.3) inset}
body.is-admin .btn-primary:focus-visible{outline:2px solid var(--admin-primary-ring);outline-offset:2px}

body.is-admin .btn-secondary{
  background:var(--admin-surface);color:var(--admin-ink);
  border:1px solid var(--admin-border-2);box-shadow:var(--admin-shadow-xs)
}
body.is-admin .btn-secondary:hover{background:var(--admin-surface-3);border-color:var(--admin-border-3);box-shadow:var(--admin-shadow-sm)}

body.is-admin .btn-ghost{background:transparent;color:var(--admin-ink-2);border:1px solid transparent}
body.is-admin .btn-ghost:hover{background:var(--admin-primary-a08);color:var(--admin-primary-600)}

/* ------------------------------------------------------------------ */
/* Badges — polished color system                                      */
/* ------------------------------------------------------------------ */
body.is-admin .badge, body.is-admin [class^="badge-"]{
  display:inline-flex;align-items:center;white-space:nowrap;
  padding:3px 10px;border-radius:999px;
  font-size:.72rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;
  border:1px solid transparent;line-height:1.4
}
body.is-admin .badge-pass{background:rgba(16,185,129,0.10);color:#065F46;border-color:rgba(16,185,129,0.18)}
body.is-admin .badge-warn{background:rgba(245,158,11,0.10);color:#92400E;border-color:rgba(245,158,11,0.22)}
body.is-admin .badge-fail{background:rgba(239,68,68,0.10);color:#991B1B;border-color:rgba(239,68,68,0.22)}
body.is-admin .badge-info{background:rgba(59,130,246,0.10);color:#1E40AF;border-color:rgba(59,130,246,0.20)}
body.is-admin .badge-neutral{background:var(--admin-surface-3);color:var(--admin-ink-2);border-color:var(--admin-border-2)}

/* END PREMIUM ADMIN REDESIGN PHASE 0-1 */



/* =====================================================================
   PHASE 6 — Admin Panel Fixes (Functional + Visual)  (2026-10-20)
   Sidebar continuity, scrim overlay, Blog Manager hardening,
   Bulk-Publishing stability, Notifications panel.  Additive overrides
   scoped to body.is-admin — public site remains untouched.
   ===================================================================== */

/* ---- Sidebar: swap logo lockup, remove excess gaps, continuous bg ---- */
body.is-admin .side-logo{
  display:flex;align-items:center;justify-content:flex-start;
  gap:10px;padding:6px 10px 14px;margin-bottom:10px;
  border-bottom:1px solid rgba(255,255,255,0.08);
  min-height:56px;
}
body.is-admin .side-logo img{
  height:36px;width:auto;max-width:200px;object-fit:contain;
  display:block;filter:none;background:transparent;
}
/* Compact category spacing — removes the "excessive blank space" the owner reported */
body.is-admin .side-group{display:flex;flex-direction:column;gap:1px;margin:0 0 4px}
body.is-admin .side-group + .side-group{margin-top:6px}
body.is-admin .side-group .lbl{
  color:rgba(255,255,255,0.52);font-size:.66rem;letter-spacing:.14em;
  text-transform:uppercase;font-weight:700;
  padding:10px 10px 4px;margin:0;line-height:1.1;display:block;
}
body.is-admin .sidebar{
  /* Guarantee the dark background reaches the full viewport height even when
     the content inside is shorter than 100vh (the "white strip" bug). */
  min-height:100vh;height:100vh;
  background:linear-gradient(180deg,#111114 0%, #0B0B0D 100%);
}
body.is-admin .sidebar nav{display:flex;flex-direction:column;padding-bottom:16px}
body.is-admin .sidebar a{margin:0 2px}
body.is-admin .sidebar a:first-child{margin-top:0}

/* Mobile: lock scroll + show scrim behind the drawer */
body.admin-sidebar-open{overflow:hidden}
body.is-admin .sidebar-scrim{
  position:fixed;inset:0;z-index:55;
  background:rgba(0,0,0,0.44);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .22s cubic-bezier(.2,.8,.2,1), visibility .22s;
}
body.is-admin .sidebar-scrim.is-visible{opacity:1;visibility:visible;pointer-events:auto}
@media (min-width:961px){
  body.is-admin .sidebar-scrim{display:none}
}
@media (max-width:960px){
  body.is-admin .sidebar{box-shadow:12px 0 32px -8px rgba(0,0,0,0.45)}
  body.is-admin .admin-top .menu-toggle{display:inline-grid}
}

/* ---- Admin top bar: ensure menu-toggle is only visible on mobile ---- */
body.is-admin .admin-top .menu-toggle{
  display:none;align-items:center;justify-content:center;
  width:40px;height:40px;border-radius:10px;
  background:var(--admin-surface);border:1px solid var(--admin-border-2);
  color:var(--admin-ink);
}
body.is-admin .admin-top .menu-toggle:hover{background:var(--admin-surface-3)}
@media (max-width:960px){body.is-admin .admin-top .menu-toggle{display:inline-grid}}

/* ---- Contain ambient orbs so they never add horizontal scroll ---- */
body.is-admin .ambient-orbs,
body.is-admin .ambient-orbs-admin{
  position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0;
  max-width:100vw;clip-path:inset(0);
}
body.is-admin .ambient-orbs .orb,
body.is-admin .ambient-orbs-admin .orb{max-width:60vw;max-height:60vh}
body.is-admin .ambient-orbs .orb-b{right:0 !important;left:auto !important;}
/* Also ensure body/#app never allow a horizontal page scroll */
html.is-admin, body.is-admin, body.is-admin #app{overflow-x:hidden;max-width:100vw}

/* ---- Blog Manager table (and general): readable titles, no vertical breaks ---- */
body.is-admin [data-testid="posts-table"],
body.is-admin [data-testid="blog-posts-table"]{min-width:960px}
body.is-admin [data-testid="posts-table"] tbody td:first-child,
body.is-admin [data-testid="blog-posts-table"] tbody td:first-child{
  min-width:36px;max-width:36px;padding-right:0;
}
body.is-admin [data-testid="posts-table"] tbody td:nth-child(2),
body.is-admin [data-testid="blog-posts-table"] tbody td:nth-child(2){
  min-width:72px;max-width:88px;
}
body.is-admin [data-testid="posts-table"] tbody td:nth-child(3),
body.is-admin [data-testid="blog-posts-table"] tbody td:nth-child(3){
  min-width:260px;max-width:460px;line-height:1.42;
  overflow-wrap:break-word;word-break:normal;
}
body.is-admin [data-testid="posts-table"] tbody td:nth-child(3) strong,
body.is-admin [data-testid="blog-posts-table"] tbody td:nth-child(3) strong{
  display:inline-block;line-height:1.35;font-weight:600;color:var(--admin-ink);
}
/* Thumbs: predictable size — never larger than the row needs */
body.is-admin .thumb-sm{width:60px;height:40px;object-fit:cover;border-radius:6px}

/* Make generic data-table share the same patterns */
body.is-admin table.data-table{width:100%;border-collapse:separate;border-spacing:0;font-size:.9rem}
body.is-admin table.data-table th{position:sticky;top:0;background:var(--admin-surface-3);padding:11px 14px;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--admin-ink-3);font-weight:700;border-bottom:1px solid var(--admin-border);z-index:1;text-align:left;white-space:nowrap}
body.is-admin table.data-table td{padding:11px 14px;border-bottom:1px solid var(--admin-border);color:var(--admin-ink-2);vertical-align:middle}
body.is-admin table.data-table tbody tr:hover td{background:var(--admin-primary-a08)}

/* ---- Category-wise Bulk Publishing: eliminate shake/flicker ---- */
body.is-admin .cat-publish{
  /* No animation on open/close; content height is also stable via JS min-height. */
  overflow:hidden;
  contain:layout paint;
}
body.is-admin .cat-publish summary{
  cursor:pointer;list-style:none;
  display:flex;align-items:center;gap:10px;
  padding:4px 2px;
  min-height:32px;
}
body.is-admin .cat-publish summary::-webkit-details-marker{display:none}
body.is-admin .cat-publish[open] summary{margin-bottom:12px;border-bottom:1px solid var(--admin-border)}
body.is-admin .cat-publish .cat-publish-body{
  max-height:420px;overflow:auto;
  overscroll-behavior:contain;
  /* Reserve the scrollbar gutter so content never shifts when it appears */
  scrollbar-gutter:stable;
}
body.is-admin .cat-publish .bulk-pub-table{min-width:720px}
body.is-admin .cat-publish .bulk-pub-table thead th{position:sticky;top:0;background:var(--admin-surface);z-index:1}
body.is-admin .cat-publish .bulk-pub-table .right{text-align:right}

/* ---- Notifications card ---- */
body.is-admin .notif-diag-list{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:8px}
body.is-admin .notif-diag-list li{display:flex;align-items:center;gap:8px;font-size:.9rem;color:var(--admin-ink-2);flex-wrap:wrap}
body.is-admin .notif-diag-list .badge{text-transform:uppercase;font-size:.65rem;letter-spacing:.08em}

/* ---- Row-action menus (3-dot style, future-proof) ---- */
body.is-admin .row-menu{position:relative;display:inline-block}
body.is-admin .row-menu-trigger{
  display:inline-flex;align-items:center;justify-content:center;
  width:32px;height:32px;border-radius:8px;
  background:transparent;border:1px solid transparent;color:var(--admin-ink-3);
  cursor:pointer;
}
body.is-admin .row-menu-trigger:hover{background:var(--admin-surface-3);color:var(--admin-ink);border-color:var(--admin-border-2)}
body.is-admin .row-menu-trigger[aria-expanded="true"]{background:var(--admin-primary-a08);color:var(--admin-primary-600);border-color:var(--admin-primary-a16)}
body.is-admin .row-menu-list{
  position:absolute;top:calc(100% + 4px);right:0;z-index:30;
  min-width:200px;padding:6px;background:var(--admin-surface);
  border:1px solid var(--admin-border-2);border-radius:12px;
  box-shadow:var(--admin-shadow-lg);
  display:none;
}
body.is-admin .row-menu-list.is-open{display:block}
body.is-admin .row-menu-list button,
body.is-admin .row-menu-list a{
  display:flex;align-items:center;gap:10px;width:100%;
  padding:8px 10px;border-radius:8px;background:transparent;border:0;
  color:var(--admin-ink-2);text-decoration:none;font-size:.88rem;cursor:pointer;text-align:left;
}
body.is-admin .row-menu-list button:hover,
body.is-admin .row-menu-list a:hover{background:var(--admin-primary-a08);color:var(--admin-ink)}
body.is-admin .row-menu-list .danger{color:#991B1B}
body.is-admin .row-menu-list .danger:hover{background:rgba(239,68,68,0.08);color:#7F1D1D}

/* ---- Form field focus parity across all inputs ---- */
body.is-admin .aform input:focus-visible,
body.is-admin .aform select:focus-visible,
body.is-admin .aform textarea:focus-visible{
  outline:none;border-color:var(--admin-primary);
  box-shadow:0 0 0 3px var(--admin-primary-ring);
}
body.is-admin .aform .form-msg.err{color:#991B1B}
body.is-admin .aform .form-msg.ok{color:#065F46}

/* ---- Visual polish Phase 2–4: modals / dropdowns / toasts ---- */
body.is-admin .modal{
  background:var(--admin-surface);border:1px solid var(--admin-border);
  border-radius:var(--admin-radius-lg);box-shadow:var(--admin-shadow-xl);
}
body.is-admin .modal-head{
  background:var(--admin-surface-glass);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--admin-border);
}
body.is-admin .modal-head h3{font-family:var(--font-display,'Montserrat'),system-ui;font-weight:700;color:var(--admin-ink)}

/* END PHASE 6 FIXES */