/* ============================================================
   Diamond Auth console: corporate theme shared by
   test-auth.likeediamond.com and test-auth.bigodiamond.com.
   Loaded AFTER style.css. The only per-site inputs are
   <html data-brand="likee|bigo"> and the tokens right below.
   Presentation only: no ids, data hooks or behaviour change.
   ============================================================ */

/* ---------- Brand tokens ---------- */
html[data-brand="likee"] {
    --brand: #C81E5B;
    --brand-rgb: 200 30 91;
    --brand-hover: #A9174B;
    --brand-bar: #C81E5B;
    --brand-text: #A9174B;
    --brand-signature: linear-gradient(90deg, #9333FF 0 25%, #FF4850 25% 50%, #FF8534 50% 75%, #FFCA43 75% 100%);
    --brand-signature-v: linear-gradient(180deg, #9333FF 0 25%, #FF4850 25% 50%, #FF8534 50% 75%, #FFCA43 75% 100%);
}
html[data-brand="likee"].dark { --brand-text: #FF8FB3; --brand-bar: #A9174B; }

html[data-brand="bigo"] {
    --brand: #00808E;
    --brand-rgb: 0 128 142;
    --brand-hover: #006A76;
    --brand-bar: #00808E;
    --brand-text: #006A76;
    --brand-signature: linear-gradient(90deg, #11E8DC 0 100%);
    --brand-signature-v: linear-gradient(180deg, #11E8DC 0 100%);
}
html[data-brand="bigo"].dark { --brand-text: #4FE3E3; --brand-bar: #006A76; }

/* ---------- Neutrals ---------- */
html[data-brand] {
    --brand-500: var(--brand);
    --brand-600: var(--brand);
    --brand-700: var(--brand-hover);
    --on-dark-accent: var(--brand-text);
    --ring: rgb(var(--brand-rgb) / .22);
    --radius: 8px;
    --r-sm: 6px;
    --line: #DFE3E8;
    --line-soft: #ECEFF3;
    --surface: 255 255 255;
    --page: #F4F6F8;
    --ink: #1B2430;
    --ink-2: #566272;
    --shadow-card: none;
    --card-border: var(--line);
    --s-800: 240 242 245;
    --s-700: 223 227 232;
    --s-400: 86 98 114;
    --tab-h: 58px;
}
html[data-brand].dark {
    --line: #2C333D;
    --line-soft: #232932;
    --surface: 24 29 36;
    --page: #11151A;
    --ink: #E8ECF1;
    --ink-2: #9AA5B2;
    --s-900: 24 29 36;
    --s-950: 17 21 26;
    --s-800: 35 41 50;
    --s-700: 44 51 61;
    --s-400: 154 165 178;
}

html[data-brand] body, html[data-brand] button, html[data-brand] input, html[data-brand] select, html[data-brand] textarea {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    letter-spacing: 0;
}
html[data-brand] body.bg-slate-950 { background: var(--page) !important; background-image: none !important; }
html[data-brand] main.bg-slate-950 { background: transparent !important; }
html[data-brand] h1, html[data-brand] h2, html[data-brand] h3, html[data-brand] h4 { letter-spacing: -.005em; }

/* ---------- Accent utilities: everything "pink" becomes the app's colour ---------- */
html[data-brand] .bg-pink-500, html[data-brand] .bg-pink-600 { background-color: var(--brand) !important; background-image: none !important; color: #fff !important; }
html[data-brand] .hover\:bg-pink-500:hover { background-color: var(--brand-hover) !important; }
html[data-brand] .bg-pink-500\/10, html[data-brand] .bg-pink-500\/15 { background-color: rgb(var(--brand-rgb) / .09) !important; }
html[data-brand] .bg-pink-500\/20 { background-color: rgb(var(--brand-rgb) / .14) !important; }
html[data-brand] .hover\:bg-pink-500\/20:hover { background-color: rgb(var(--brand-rgb) / .14) !important; }
html[data-brand] .border-pink-500, html[data-brand] .focus\:border-pink-500:focus { border-color: var(--brand) !important; }
html[data-brand] .border-pink-500\/20, html[data-brand] .border-pink-500\/30, html[data-brand] .border-pink-500\/40 { border-color: rgb(var(--brand-rgb) / .28) !important; }
html[data-brand] .text-pink-300, html[data-brand] .text-pink-400, html[data-brand] .text-pink-500,
html[data-brand] .hover\:text-pink-300:hover, html[data-brand] .hover\:text-pink-400:hover, html[data-brand] .group:hover .group-hover\:text-pink-400 { color: var(--brand-text) !important; }
html[data-brand] .selection\:bg-pink-500 *::selection { background: var(--brand); }
html[data-brand] ::selection { background: var(--brand); color: #fff; }
html[data-brand] ::-webkit-scrollbar-thumb:hover { background: rgba(100,116,139,.6); background-clip: padding-box; }

/* Gradients are gone: flat colour only */
html[data-brand] .from-pink-500, html[data-brand] .from-pink-600, html[data-brand] .from-purple-600 { background-color: var(--brand) !important; background-image: none !important; }
html[data-brand] .from-emerald-600 { background-color: #047857 !important; background-image: none !important; }
html[data-brand] .from-pink-950\/30, html[data-brand] .from-pink-950\/40 { background-color: rgb(var(--brand-rgb) / .06) !important; background-image: none !important; }

/* ---------- App bar: solid in the app's colour ---------- */
html[data-brand] header.h-16 {
    height: 60px; position: sticky; background: var(--brand-bar) !important; border: 0 !important;
    -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: none;
}
html[data-brand] header.h-16::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; pointer-events: none;
    background: var(--brand-signature);
}
.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.brand-logo { width: 38px; height: 38px; flex-shrink: 0; display: block; border-radius: 9px; background: #fff; object-fit: cover; }
html[data-brand] .brand-title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 16px; font-weight: 600; line-height: 1.2; color: #fff; }
.brand-word { color: #fff; }
.brand-tag {
    font-size: 10px; font-weight: 600; letter-spacing: .08em; line-height: 1; padding: 3px 6px; border-radius: 4px;
    color: #fff; border: 1px solid rgba(255,255,255,.55);
}
.brand-sub { font-size: 12px; color: rgba(255,255,255,.82); margin-top: 2px; }

html[data-brand] header .bg-slate-800\/80, html[data-brand] header #adminProfileBtn {
    background: rgba(255,255,255,.12) !important; border: 1px solid rgba(255,255,255,.22) !important;
    border-radius: var(--r-sm) !important; box-shadow: none !important;
}
html[data-brand] header .bg-slate-800\/80 span, html[data-brand] header .bg-slate-800\/80 i,
html[data-brand] header #adminProfileBtn div, html[data-brand] header #adminProfileBtn i,
html[data-brand] header #sidebarToggle, html[data-brand] header #themeToggle, html[data-brand] header #themeToggle i { color: #fff !important; }
html[data-brand] header #sidebarToggle:hover { background: rgba(255,255,255,.14) !important; }
html[data-brand] header #adminProfileBtn:hover, html[data-brand] header #themeToggle:hover { background: rgba(255,255,255,.2) !important; }
html[data-brand] header #adminProfileBtn > div:first-child { background: rgba(255,255,255,.2) !important; background-image: none !important; box-shadow: none !important; }
html[data-brand] header #systemLivePing { display: none; }
html[data-brand] header #systemLiveDot { background: #5CF0A8 !important; }
html[data-brand] header .animate-spin-slow { animation: none; }
html[data-brand] #adminRoleDisplay, html[data-brand] header .font-mono { font-family: inherit; }
html[data-brand] #adminRoleDisplay { opacity: .85; }
html[data-brand] #profileDropdown { border-radius: var(--radius) !important; border: 1px solid var(--line) !important; box-shadow: 0 8px 24px rgba(16,24,40,.14) !important; overflow: hidden; }

/* ---------- Sidebar: light, quiet, current page marked in the app's colour ---------- */
html[data-brand] .app-sidebar { background: rgb(var(--surface)) !important; border-right: 1px solid var(--line) !important; width: 232px; }
html[data-brand] #sidebar .text-slate-400, html[data-brand] #sidebar .text-slate-500 { color: var(--ink-2) !important; }
html[data-brand] #sidebar .text-slate-300 { color: var(--ink) !important; }
html[data-brand] #sidebar .font-mono { font-family: inherit; }
html[data-brand] #sidebar .hover\:text-slate-200:hover { color: var(--ink) !important; }
html[data-brand] #sidebar .hover\:bg-slate-800\/60:hover { background-color: rgb(var(--s-800)) !important; }
html[data-brand] #sidebar .bg-slate-800 { background-color: rgb(var(--s-800)) !important; }
html[data-brand] #sidebar .border-slate-800 { border-color: var(--line) !important; }
html[data-brand] #sidebar .bg-slate-950\/70 { background-color: var(--page) !important; }
html[data-brand] #sidebar .text-emerald-400 { color: #047857 !important; }
html[data-brand].dark #sidebar .text-emerald-400 { color: #34D399 !important; }
html[data-brand] #sidebar .to-emerald-400 { --tw-gradient-to: #059669 !important; }
html[data-brand] #sidebar .rounded-xl { border-radius: var(--r-sm) !important; }
html[data-brand] #sidebar .nav-item { border-radius: var(--r-sm) !important; margin-bottom: 1px; padding: 8px 10px !important; font-size: 13.5px; }
html[data-brand] #sidebar .nav-item:hover { transform: none; }
html[data-brand] #sidebar .nav-item > div > i { width: 18px !important; font-size: 13px; }
html[data-brand] #sidebar .nav-item.bg-pink-500\/10 {
    background: rgb(var(--brand-rgb) / .09) !important; color: var(--brand-text) !important; font-weight: 600;
    border: 0 !important; box-shadow: inset 3px 0 0 var(--brand);
    padding-left: 10px !important;
}
html[data-brand] #sidebar .nav-item.bg-pink-500\/10 span { color: var(--brand-text) !important; }
html[data-brand] #sidebar .bg-pink-500\/20 { background-color: rgb(var(--brand-rgb) / .14) !important; }
html[data-brand] #sidebar .text-pink-300 { color: var(--brand-text) !important; }
html[data-brand] #sidebar span[id^="badge"] { border-radius: 4px !important; font-family: inherit; font-weight: 600; }

@media (min-width: 1024px) {
    html[data-brand] body.bg-slate-950 { height: 100vh; height: 100dvh; overflow: hidden; }
    body > div.flex-1 { min-height: 0; }
    #sidebar > div:first-child { flex: 1 1 auto; }
}

/* ---------- Cards ---------- */
html[data-brand] .glass-card {
    background: rgb(var(--surface)) !important; background-image: none !important;
    border: 1px solid var(--line) !important; border-radius: var(--radius) !important; box-shadow: none !important;
}
html[data-brand] .glass-card:hover, html[data-brand] .glass-card-hover:hover { transform: none; box-shadow: none !important; }
html[data-brand] main .rounded-2xl, html[data-brand] main .rounded-xl { border-radius: var(--radius) !important; }
html[data-brand] main .rounded-lg { border-radius: var(--r-sm) !important; }

/* Page titles */
html[data-brand] section[id^="view-"] > div:first-child h2 { font-size: 20px; line-height: 28px; font-weight: 600; color: var(--ink) !important; }
html[data-brand] section[id^="view-"] > div:first-child p { font-size: 13px; color: var(--ink-2) !important; margin-top: 2px; }
html[data-brand] .glass-card h3 { font-size: 14px; font-weight: 600; text-transform: none; letter-spacing: 0; }
html[data-brand] .tracking-wider { letter-spacing: .04em; }

/* KPI tiles: number first, quiet icon */
html[data-brand] #view-dashboard > div:nth-of-type(2) > .glass-card { padding: 16px 18px !important; }
html[data-brand] #view-dashboard > div:nth-of-type(2) > .glass-card .w-9.h-9 {
    width: 30px !important; height: 30px !important; border: 0 !important; background: rgb(var(--s-800)) !important; color: var(--ink-2) !important;
}
html[data-brand] #view-dashboard > div:nth-of-type(2) > .glass-card .text-3xl {
    font-family: inherit; font-size: 28px; line-height: 34px; font-weight: 600; font-feature-settings: "tnum" 1; color: var(--ink) !important;
}
html[data-brand] #view-dashboard > div:nth-of-type(2) > .glass-card > div:first-child > span { font-size: 12px; font-weight: 500; text-transform: none; letter-spacing: 0; color: var(--ink-2) !important; }
html[data-brand] #view-dashboard > div:nth-of-type(2) > .glass-card .text-pink-400,
html[data-brand] #view-dashboard > div:nth-of-type(2) > .glass-card .text-emerald-400,
html[data-brand] #view-dashboard > div:nth-of-type(2) > .glass-card .text-cyan-400,
html[data-brand] #view-dashboard > div:nth-of-type(2) > .glass-card .text-purple-400 { color: var(--ink-2) !important; }

/* Pipeline stages */
html[data-brand] #view-dashboard > div:nth-of-type(3) .grid > div { background: var(--page) !important; border: 1px solid var(--line-soft) !important; }
html[data-brand] #view-dashboard > div:nth-of-type(3) .grid > div .text-\[10px\] { font-size: 11px; font-family: inherit; }
html[data-brand] .animate-pulse { animation: none; }

/* ---------- Buttons ---------- */
html[data-brand] button { transition: background-color .15s ease, border-color .15s ease, color .15s ease; }
html[data-brand] button:not(:disabled):active { transform: none; }
html[data-brand] button[class*="shadow-"], html[data-brand] a[class*="shadow-"] { box-shadow: none !important; }
html[data-brand] button.bg-pink-600, html[data-brand] button.bg-pink-500, html[data-brand] a.bg-pink-600, html[data-brand] button.from-pink-600 {
    border-radius: var(--r-sm) !important; color: #fff !important; font-weight: 600; filter: none;
}
html[data-brand] button.bg-pink-600:hover, html[data-brand] button.bg-pink-500:hover, html[data-brand] button.from-pink-600:hover { background-color: var(--brand-hover) !important; filter: none; }
html[data-brand] button.bg-pink-600 *, html[data-brand] button.from-pink-600 * { color: #fff !important; }
html[data-brand] button.from-emerald-600 { border-radius: var(--r-sm) !important; color: #fff !important; }
html[data-brand] button.from-emerald-600:hover { background-color: #065F46 !important; }
html[data-brand] button.bg-slate-800 { background: rgb(var(--surface)) !important; border: 1px solid var(--line) !important; border-radius: var(--r-sm) !important; box-shadow: none; color: var(--ink) !important; }
html[data-brand] button.bg-slate-800:hover { background: rgb(var(--s-800)) !important; }
html[data-brand] :focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
html[data-brand] input:focus-visible, html[data-brand] select:focus-visible, html[data-brand] textarea:focus-visible { outline: none; }

/* ---------- Inputs ---------- */
html[data-brand] main input:not([type="checkbox"]):not([type="radio"]), html[data-brand] main select,
html[data-brand] [id^="modal"] input:not([type="checkbox"]):not([type="radio"]), html[data-brand] [id^="modal"] select, html[data-brand] [id^="modal"] textarea {
    border-radius: var(--r-sm) !important; box-shadow: none;
}
html[data-brand] input:focus, html[data-brand] select:focus, html[data-brand] textarea:focus { box-shadow: 0 0 0 3px var(--ring) !important; border-color: var(--brand) !important; }

/* ---------- Tables ---------- */
html[data-brand] table thead th {
    font-family: inherit; font-size: 11.5px; font-weight: 600; letter-spacing: .02em; text-transform: none; color: var(--ink-2) !important;
    background: var(--page);
}
html[data-brand] thead.font-mono { font-family: inherit; }
html[data-brand] tbody tr { animation: none; }
html[data-brand] .glass-card tbody tr:hover { background: rgb(var(--s-800) / .55) !important; background-image: none; }
html[data-brand] section[id^="view-"]:not(.hidden), html[data-brand] section[id^="view-"]:not(.hidden) .grid > * { animation: none; }

/* ---------- Modals ---------- */
html[data-brand] [id^="modal"]:not(.hidden) > div { animation: none; }
html[data-brand] [id^="modal"] > div, html[data-brand] #drawerUserDetails > div {
    border-radius: 10px !important; box-shadow: 0 16px 48px rgba(16,24,40,.22) !important;
}
html[data-brand] [id^="modal"]:not(#modalAuth), html[data-brand] #drawerUserDetails {
    background-color: rgba(16,24,40,.45) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
html[data-brand] [id^="modal"] .rounded-2xl, html[data-brand] [id^="modal"] .rounded-xl { border-radius: var(--r-sm) !important; }

/* ---------- Sign-in: brand panel + form ---------- */
html[data-brand] #modalAuth { background: var(--page) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
html[data-brand] #modalAuth > div {
    max-width: 420px !important; padding: 28px !important; background: rgb(var(--surface)) !important;
    border: 1px solid var(--line) !important; border-radius: 10px !important; box-shadow: none !important;
}
html[data-brand] #modalAuth > div > .absolute.-top-24 { display: none; }
.auth-panel { display: none; }
@media (min-width: 1024px) {
    html[data-brand] #modalAuth { padding-left: calc(38vw + 1rem); }
    .auth-panel {
        display: flex; flex-direction: column; position: fixed; inset: 0 auto 0 0; width: 38vw; padding: 56px;
        background: var(--brand-bar); color: #fff;
    }
    .auth-panel::after { content: ""; position: absolute; top: 0; bottom: 0; right: 0; width: 4px; background: var(--brand-signature-v); }
    .auth-panel-logo { width: 72px; height: 72px; border-radius: 16px; background: #fff; display: block; }
    .auth-panel-name { font-size: 30px; line-height: 38px; font-weight: 600; margin-top: 28px; }
    .auth-panel-sub { font-size: 15px; margin-top: 4px; color: rgba(255,255,255,.86); }
    .auth-panel-list { list-style: none; margin: 36px 0 0; padding: 20px 0 0; border-top: 1px solid rgba(255,255,255,.25); font-size: 14px; line-height: 2; color: rgba(255,255,255,.9); }
    .auth-panel-foot { margin-top: auto; font-size: 12.5px; color: rgba(255,255,255,.78); }
    html[data-brand] #modalAuth .auth-brand { display: none; }
}
.auth-brand { text-align: center; padding: 2px 0 6px; }
.auth-logo-wrap { width: 60px; height: 60px; margin: 0 auto 12px; }
.auth-logo { width: 100%; height: 100%; display: block; border-radius: 14px; background: #fff; border: 1px solid var(--line); }
.auth-brand-name { font-weight: 600; font-size: 20px; line-height: 26px; color: var(--ink); }
.auth-brand-name span { color: var(--brand-text); }
.auth-brand-sub { font-size: 12.5px; color: var(--ink-2); margin-top: 2px; }
html[data-brand] #modalAuth h3 { font-size: 18px; font-weight: 600; }
html[data-brand] #modalAuth [id^="crumbStep"] > span:first-child { width: 22px !important; height: 22px !important; font-size: 11px !important; font-weight: 600; }
html[data-brand] #modalAuth [id^="crumbStep"].text-pink-400 > span:first-child { background: var(--brand) !important; color: #fff !important; border-color: transparent !important; }
html[data-brand] #modalAuth [id^="crumbStep"].text-emerald-400 > span:first-child { background: #047857 !important; color: #fff !important; border-color: transparent !important; }
html[data-brand] #authWizardStep2 .w-10.h-10, html[data-brand] #authWizardStep3 .w-12.h-12 { background: rgb(var(--brand-rgb) / .09) !important; background-image: none !important; color: var(--brand-text) !important; box-shadow: none !important; border-radius: 10px !important; }
#modalAuth input { min-height: 44px; }
#modalAuth #loginEmail, #modalAuth #stepPassword { font-size: 14px !important; }
#modalAuth #stepTotpCode { font-size: 24px !important; letter-spacing: .5em !important; min-height: 54px; text-indent: .5em; }
#modalAuth form button { min-height: 44px; font-size: 13.5px !important; }

/* ---------- Phone / tablet tab bar ---------- */
#mobileTabBar { display: none; }
@media (max-width: 1023px) {
    #mobileTabBar {
        position: fixed; z-index: 15; left: 0; right: 0; bottom: 0;
        height: calc(var(--tab-h) + env(safe-area-inset-bottom)); padding: 0 4px env(safe-area-inset-bottom);
        display: grid; grid-template-columns: repeat(5, 1fr); align-items: stretch;
        background: rgb(var(--surface)); border-top: 1px solid var(--line);
    }
    .mtab {
        display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
        min-height: 0 !important; background: none; border: 0; position: relative;
        font-size: 11px; font-weight: 500; color: var(--ink-2);
    }
    .mtab i { font-size: 16px; }
    .mtab.active { color: var(--brand-text); font-weight: 600; }
    .mtab.active::before { content: ""; position: absolute; top: -1px; left: 22%; right: 22%; height: 2px; background: var(--brand); }
    main { padding-bottom: calc(var(--tab-h) + 24px + env(safe-area-inset-bottom)) !important; }
    #toastContainer { left: 12px; right: 12px; bottom: calc(var(--tab-h) + 12px + env(safe-area-inset-bottom)) !important; }
    #toastContainer > * { max-width: none; }
    html[data-brand] .app-sidebar { width: 82vw; max-width: 20rem; }
}

@media (max-width: 640px) {
    html[data-brand] header.h-16 { height: 56px; }
    .brand-logo { width: 34px; height: 34px; border-radius: 8px; }
    html[data-brand] section[id^="view-"] > div:first-child h2 { font-size: 18px; line-height: 24px; }
    html[data-brand] section[id^="view-"] > div:first-child p { font-size: 12.5px; }

    /* toolbars: search on its own row, action fills the next */
    section[id^="view-"] > div:first-child > div.flex.items-center.gap-3 { flex-wrap: wrap; width: 100%; }
    section[id^="view-"] > div:first-child > div.flex.items-center.gap-3 > .relative { flex: 1 1 100%; }
    section[id^="view-"] > div:first-child > div.flex.items-center.gap-3 > .relative input { width: 100% !important; }
    section[id^="view-"] > div:first-child > div.flex.items-center.gap-3 > button.bg-pink-600 { flex: 1 1 auto; justify-content: center; min-height: 44px; }
    #view-dashboard > div:first-child > div.flex.items-center.gap-3 > button { min-height: 44px; }

    /* no iOS zoom-on-focus */
    input, select, textarea { font-size: 16px !important; }
    #modalAuth #stepTotpCode { font-size: 24px !important; }

    /* wide tables scroll sideways instead of crushing columns */
    .glass-card > .overflow-x-auto > table { min-width: 760px; }
    .glass-card > .overflow-x-auto > table td[colspan] { text-align: left !important; position: sticky; left: 0; }

    html[data-brand] #view-dashboard > div:nth-of-type(2) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
    html[data-brand] #view-dashboard > div:nth-of-type(2) > .glass-card { padding: 14px !important; }
    html[data-brand] #view-dashboard > div:nth-of-type(2) > .glass-card .text-3xl { font-size: 24px; line-height: 30px; }
    html[data-brand] .glass-card.p-6 { padding: 16px !important; }

    /* modals become bottom sheets */
    [id^="modal"]:not(#modalAuth), #drawerUserDetails { align-items: flex-end !important; padding: 0 !important; }
    html[data-brand] [id^="modal"]:not(#modalAuth) > div, html[data-brand] #drawerUserDetails > div {
        border-radius: 14px 14px 0 0 !important; max-height: 92vh !important; overflow-y: auto;
        padding-bottom: calc(1.5rem + env(safe-area-inset-bottom)) !important;
    }
    html[data-brand] #modalAuth { padding: 14px !important; border-top: 4px solid var(--brand); }
    html[data-brand] #modalAuth > div { padding: 22px 18px !important; }
}
@media (max-width: 479px) {
    header .hidden.md\:flex + div { display: none !important; } /* refresh countdown pill */
    html[data-brand] header.h-16 { padding-left: 10px !important; padding-right: 10px !important; }
}

/* ---------- Details ---------- */
/* Off-canvas sidebar must not cast its shadow onto the page while closed */
#sidebar.-translate-x-full { box-shadow: none !important; }

/* Tighter cells so wide tables fit without sideways scrolling */
@media (min-width: 641px) {
    html[data-brand] main table th, html[data-brand] main table td { padding-left: 14px; padding-right: 14px; }
    html[data-brand] main table th:first-child, html[data-brand] main table td:first-child { padding-left: 20px; }
    html[data-brand] main table th:last-child, html[data-brand] main table td:last-child { padding-right: 20px; }
}
@media (max-width: 640px) {
    #view-users .glass-card > .overflow-x-auto > table { min-width: 1040px; }
    #view-logs .flex-wrap > select { flex: 1 1 140px; }
}

/* Neutral chips and inner panels */
html[data-brand] .bg-slate-800\/60 { background-color: rgb(var(--s-800)) !important; }
html[data-brand] .border-slate-700\/60 { border-color: var(--line) !important; }
html[data-brand] main .bg-slate-900\/80, html[data-brand] [id^="modal"] .bg-slate-900\/80 { background-color: var(--page) !important; }

/* Pale *-300 text on light chips: use the readable status shade */
html[data-brand] .text-emerald-300 { color: rgb(var(--em-400)) !important; }
html[data-brand] .text-amber-300 { color: rgb(var(--am-400)) !important; }
html[data-brand] .text-cyan-300 { color: rgb(var(--cy-400)) !important; }
html[data-brand] .text-purple-300 { color: rgb(var(--pu-400)) !important; }
html[data-brand] .text-rose-300 { color: rgb(var(--rs-400)) !important; }

/* Request Logs stat tiles match the dashboard tiles */
html[data-brand] #view-logs .glass-card > .text-\[11px\] { font-size: 12px; text-transform: none; letter-spacing: 0; color: var(--ink-2) !important; }
html[data-brand] #view-logs .glass-card > .text-2xl { font-family: inherit; font-weight: 600; font-feature-settings: "tnum" 1; color: var(--ink) !important; }
