/* mistREG customer panel — shared mist* design system on top of Bootstrap 5.3.
   Replaces sidebar-modern / style / theme-fixes / panel-modern. Legacy variable and class
   names used inside views are aliased to the new tokens so every page follows one look. */
:root{
  --brand:#4f46e5; --brand-2:#2563eb; --brand-ink:#fff; --brand-soft:#eef0ff; --brand-line:#c7cbff;
  --bg:#f5f6fa; --surface:#fff; --surface-2:#f8f9fc; --surface-3:#eef0f5;
  --ink:#0f172a; --ink-2:#334155; --mut:#64748b; --mut-2:#94a3b8;
  --line:#e5e8ef; --line-2:#d7dbe5;
  --ok:#059669; --ok-soft:#e7f7f0; --warn:#b45309; --warn-soft:#fdf3e2; --bad:#dc2626; --bad-soft:#fdecec; --info:#2563eb; --info-soft:#e8f0fe;
  --shadow-sm:0 1px 2px rgba(16,24,40,.05); --shadow:0 1px 3px rgba(16,24,40,.06),0 8px 24px -12px rgba(16,24,40,.12); --shadow-lg:0 24px 60px -20px rgba(16,24,40,.35);
  --r:14px; --r-sm:10px; --side:256px; --top:64px;
  --font:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif; --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
html[data-theme="dark"]{
  --brand:#818cf8; --brand-2:#60a5fa; --brand-ink:#0b0f1d; --brand-soft:#1e2140; --brand-line:#3b3f7a;
  --bg:#0b0e17; --surface:#121624; --surface-2:#161b2b; --surface-3:#1d2335;
  --ink:#e8ebf4; --ink-2:#c3c9d8; --mut:#8b93a7; --mut-2:#646d83;
  --line:#232a3d; --line-2:#2e364c;
  --ok:#34d399; --ok-soft:#0f2a22; --warn:#fbbf24; --warn-soft:#2b2210; --bad:#f87171; --bad-soft:#2c1517; --info:#60a5fa; --info-soft:#13213a;
  --shadow-sm:none; --shadow:0 8px 24px -12px rgba(0,0,0,.6); --shadow-lg:0 24px 60px -20px rgba(0,0,0,.8);
}
/* legacy aliases (views use these inline) */
:root,html[data-theme="dark"]{
  --primary:var(--brand); --primary-strong:var(--brand); --primary-color:var(--brand); --primary-soft:var(--brand-soft);
  --accent:var(--brand-2); --accent-2:var(--brand-2); --accent2:var(--brand-2); --purple:var(--brand);
  --bg-body:var(--bg); --bg-card:var(--surface); --panel:var(--surface); --bg-soft:var(--surface-2); --bg2:var(--surface-2); --soft:var(--surface-2);
  --border-color:var(--line); --border-strong:var(--line-2); --border:var(--line);
  --text-main:var(--ink); --text:var(--ink); --text-muted:var(--mut); --muted:var(--mut); --hint:var(--mut-2);
  --success:var(--ok); --good:var(--ok); --warning:var(--warn); --danger:var(--bad); --err:var(--bad);
  --radius:var(--r); --radius-sm:var(--r-sm); --shadow-md:var(--shadow);
  --gradient:linear-gradient(135deg,var(--brand),var(--brand-2));
  --bs-body-bg:var(--bg); --bs-body-color:var(--ink); --bs-body-font-family:var(--font);
  --bs-border-color:var(--line); --bs-secondary-color:var(--mut); --bs-tertiary-bg:var(--surface-2); --bs-secondary-bg:var(--surface-3);
  --bs-emphasis-color:var(--ink); --bs-heading-color:var(--ink); --bs-link-color:var(--brand); --bs-link-hover-color:var(--brand);
}

/* ---------- base ---------- */
html,body{background:var(--bg)!important}
body{color:var(--ink);font:400 14px/1.55 var(--font);-webkit-font-smoothing:antialiased;min-height:100vh;margin:0}
h1,h2,h3,h4,h5,h6,.page-title,.section-title{color:var(--ink);letter-spacing:-.01em}
a{color:var(--brand)}
code,.font-monospace,.mono{font-family:var(--mono)!important}
::selection{background:var(--brand);color:var(--brand-ink)}
.tiny{font-size:11.5px}

/* ---------- shell ---------- */
.shell{display:flex;min-height:100vh}
.side{position:fixed;inset:0 auto 0 0;width:var(--side);background:var(--surface);border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:1040;transition:transform .22s ease}
.side-brand{display:flex;align-items:center;gap:10px;height:var(--top);padding:0 20px;font-weight:800;font-size:18px;color:var(--ink)!important;letter-spacing:-.02em;border-bottom:1px solid var(--line);text-decoration:none}
.side-brand .mark{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;font-size:14px}
.side-brand b{color:var(--brand)}
.side-nav{flex:1;overflow-y:auto;padding:12px}
.side-label{font-size:11px;font-weight:650;text-transform:uppercase;letter-spacing:.06em;color:var(--mut-2);padding:14px 12px 6px}
.nav-a{display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:var(--r-sm);color:var(--ink-2);font-weight:550;margin-bottom:2px;text-decoration:none;transition:background .15s,color .15s}
.nav-a i{width:18px;text-align:center;color:var(--mut-2);font-size:15px}
.nav-a:hover{background:var(--surface-3);color:var(--ink)}
.nav-a.on{background:var(--brand-soft);color:var(--brand)}
.nav-a.on i{color:var(--brand)}
.side-foot{border-top:1px solid var(--line);padding:10px 12px}
.main{flex:1;min-width:0;margin-left:var(--side);display:flex;flex-direction:column}
.top{position:sticky;top:0;z-index:1030;height:var(--top);display:flex;align-items:center;gap:12px;padding:0 28px;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.top-title{font-weight:650;font-size:15px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top-sp{flex:1}
.icon-btn{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:transparent;border:1px solid transparent;color:var(--ink-2);cursor:pointer;font-size:15px}
.icon-btn:hover{background:var(--surface-3)}
.burger{display:none}
.bal{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:99px;padding:4px 4px 4px 14px;box-shadow:var(--shadow-sm)}
.bal-v{font-weight:700;font-variant-numeric:tabular-nums;color:var(--ink);white-space:nowrap}
.bal-v small{color:var(--mut);font-weight:550;font-size:12px;margin-right:6px}
.bal .btn{border-radius:99px!important;padding:4px 10px}
.me{position:relative}
.me-btn{display:flex;align-items:center;gap:8px;background:none;border:0;padding:4px;border-radius:99px;cursor:pointer;color:var(--ink)}
.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand);font-weight:750;font-size:13px;text-transform:uppercase}
.menu{position:absolute;right:0;top:calc(100% + 8px);min-width:230px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-lg);padding:6px;display:none;z-index:1050}
.menu.open{display:block}
.menu-h{padding:10px 12px 8px;border-bottom:1px solid var(--line);margin-bottom:6px}
.menu-h b{display:block;font-size:13.5px;color:var(--ink)}
.menu-h span{font-size:12px;color:var(--mut)}
.menu a{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;color:var(--ink-2);text-decoration:none}
.menu a:hover{background:var(--surface-3)}
.menu i{width:16px;color:var(--mut)}
.menu .danger,.menu .danger i{color:var(--bad)}
.content{padding:28px;max-width:1280px;width:100%;margin:0 auto;flex:1}
.scrim{display:none}
.imp-bar{position:sticky;top:0;z-index:2000;background:#f59e0b;color:#111;padding:8px 16px;text-align:center;font-size:13px;font-weight:600}
.imp-bar a{color:#111;text-decoration:underline;margin-left:10px}
.top-lang #ls-wrap{position:relative!important;bottom:auto!important;left:auto!important;z-index:1050}
.top-lang #ls-btn{padding:6px 12px 6px 10px}
.top-lang #ls-panel{bottom:auto!important;top:calc(100% + 10px)!important;left:auto!important;right:0}

/* ---------- Bootstrap + legacy component theming ---------- */
.card,.theme-card{background:var(--surface)!important;border:1px solid var(--line)!important;border-radius:var(--r)!important;box-shadow:var(--shadow-sm)!important;color:var(--ink)}
.card-header,.card-footer{background:var(--surface-2)!important;border-color:var(--line)!important;color:var(--ink)}
.text-main,.text-body,.text-dark,.text-body-emphasis,.text-black{color:var(--ink)!important}
.text-muted,.text-body-secondary{color:var(--mut)!important}
.text-primary{color:var(--brand)!important}
.text-success{color:var(--ok)!important}
.text-danger{color:var(--bad)!important}
.text-warning{color:var(--warn)!important}
.text-info{color:var(--info)!important}
.bg-light,.bg-body,.bg-body-tertiary,.bg-body-secondary{background-color:var(--surface-2)!important;color:var(--ink)}
.bg-white{background-color:var(--surface)!important}
.border,.border-top,.border-bottom,.border-start,.border-end,.border-custom{border-color:var(--line)!important}
.shadow-sm{box-shadow:var(--shadow-sm)!important}.shadow{box-shadow:var(--shadow)!important}
.btn{border-radius:var(--r-sm);font-weight:600;font-size:13.5px;padding:.5rem .95rem;transition:background .15s,border-color .15s,box-shadow .15s,filter .15s}
.btn-sm{font-size:12.5px;padding:.32rem .7rem;border-radius:8px}
.btn-lg{font-size:15px;padding:.7rem 1.3rem;border-radius:12px}
.btn-primary,.btn-primary-custom{background:var(--brand)!important;border-color:var(--brand)!important;color:var(--brand-ink)!important;box-shadow:none}
.btn-primary:hover,.btn-primary-custom:hover{filter:brightness(1.08)}
.btn-outline-primary{color:var(--brand)!important;border-color:var(--brand-line)!important;background:transparent}
.btn-outline-primary:hover{background:var(--brand-soft)!important}
.btn-outline-secondary,.btn-light,.btn-secondary{color:var(--ink)!important;border-color:var(--line-2)!important;background:var(--surface)!important}
.btn-outline-secondary:hover,.btn-light:hover,.btn-secondary:hover{background:var(--surface-3)!important}
.btn-success{background:var(--ok)!important;border-color:var(--ok)!important;color:#fff!important}
.btn-danger{background:var(--bad)!important;border-color:var(--bad)!important;color:#fff!important}
.btn-outline-danger{color:var(--bad)!important;border-color:color-mix(in srgb,var(--bad) 40%,transparent)!important}
.btn-outline-danger:hover{background:var(--bad-soft)!important}
.btn-outline-warning{color:var(--warn)!important;border-color:color-mix(in srgb,var(--warn) 40%,transparent)!important}
.btn-outline-warning:hover{background:var(--warn-soft)!important}
.btn-link{color:var(--brand)!important;text-decoration:none}
.btn:focus-visible,.form-control:focus,.form-select:focus,.form-check-input:focus{box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 20%,transparent)!important;border-color:var(--brand)!important}
.form-control,.form-select{background-color:var(--surface)!important;color:var(--ink)!important;border:1px solid var(--line-2)!important;border-radius:var(--r-sm)!important;min-height:40px;font-size:14px}
.form-control::placeholder{color:var(--mut-2)!important}
.form-control:disabled,.form-control[readonly]{background:var(--surface-2)!important}
.form-label{font-size:12.5px;font-weight:600;color:var(--ink-2);margin-bottom:6px}
.form-check-input{background-color:var(--surface);border-color:var(--line-2)}
.form-check-input:checked{background-color:var(--brand);border-color:var(--brand)}
.input-group-text{background:var(--surface-2);border-color:var(--line-2);color:var(--mut)}
.alert{border:0!important;border-radius:var(--r-sm)!important;font-size:13.5px}
.alert-success{background:var(--ok-soft)!important;color:var(--ok)!important}
.alert-danger{background:var(--bad-soft)!important;color:var(--bad)!important}
.alert-warning{background:var(--warn-soft)!important;color:var(--warn)!important}
.alert-info,.alert-primary{background:var(--info-soft)!important;color:var(--info)!important}
.alert-secondary,.alert-light{background:var(--surface-2)!important;color:var(--ink-2)!important}
.badge{border-radius:99px;font-weight:650;padding:.38em .7em}
.table{--bs-table-bg:transparent;--bs-table-color:var(--ink);--bs-table-border-color:var(--line);--bs-table-hover-bg:var(--surface-2);--bs-table-striped-bg:var(--surface-2);color:var(--ink)}
.table thead th{font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut);font-weight:650;background:var(--surface-2);border-bottom-color:var(--line)}
.table td,.table th{padding:.8rem 1rem;vertical-align:middle}
.modal-content{background:var(--surface)!important;color:var(--ink);border:1px solid var(--line)!important;border-radius:16px!important;box-shadow:var(--shadow-lg)}
.modal-header,.modal-footer{border-color:var(--line)!important}
.modal-footer{background:var(--surface-2);border-radius:0 0 16px 16px}
.modal-backdrop.show{opacity:.55}
.nav-tabs{border-color:var(--line)}
.nav-tabs .nav-link{color:var(--mut);border:0;border-bottom:2px solid transparent;font-weight:600}
.nav-tabs .nav-link.active{color:var(--brand)!important;background:transparent!important;border-bottom-color:var(--brand)}
.nav-pills .nav-link{color:var(--ink-2);border-radius:var(--r-sm);font-weight:600}
.nav-pills .nav-link.active{background:var(--brand)!important;color:var(--brand-ink)!important}
.dropdown-menu{background:var(--surface);border-color:var(--line);border-radius:var(--r-sm);box-shadow:var(--shadow-lg)}
.dropdown-item{color:var(--ink-2)}.dropdown-item:hover{background:var(--surface-3);color:var(--ink)}
.list-group-item{background:var(--surface);border-color:var(--line);color:var(--ink)}
.accordion-item,.accordion-button{background:var(--surface);color:var(--ink);border-color:var(--line)}
.accordion-button:not(.collapsed){background:var(--brand-soft);color:var(--brand)}
.page-link{background:var(--surface);border-color:var(--line);color:var(--ink-2)}
.page-item.active .page-link{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.progress{background:var(--surface-3);border-radius:99px}
.progress-bar{background:var(--brand)}
.bg-primary.bg-opacity-10{background:var(--brand-soft)!important}
.rounded-circle.bg-opacity-10,.bg-opacity-10{--bs-bg-opacity:1}
.bg-success.bg-opacity-10{background:var(--ok-soft)!important}
.bg-warning.bg-opacity-10{background:var(--warn-soft)!important}
.bg-danger.bg-opacity-10{background:var(--bad-soft)!important}
.bg-info.bg-opacity-10{background:var(--info-soft)!important}
.btn-close{filter:none}
html[data-theme="dark"] .btn-close{filter:invert(1) grayscale(100%) brightness(200%)}

/* legacy view helpers */
.ot-badge{display:inline-flex;align-items:center;font-size:11px;font-weight:650;padding:2px 8px;border-radius:99px}
.ot-badge--info{background:var(--info-soft);color:var(--info)}
.ot-badge--success{background:var(--ok-soft);color:var(--ok)}
.ot-badge--soon{background:var(--warn-soft);color:var(--warn)}
.hosting-card{padding-top:22px!important;position:relative}
.hosting-card .fs-3{font-weight:800;letter-spacing:-.02em}
.hosting-card .text-decoration-line-through{opacity:.6}
.hosting-feats{margin-top:2px}
.hosting-feats li{font-size:.92rem;color:var(--ink)}
.hf-ico{width:22px;height:22px;border-radius:7px;display:inline-grid;place-items:center;background:var(--brand-soft);color:var(--brand);font-size:11px;margin-right:8px}
.hosting-card--featured{border-color:var(--brand)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 14%,transparent)!important}
.hosting-card .btn-primary-custom{padding:12px 18px;font-size:.98rem}

/* page header used by the new views */
.ph{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.ph h1{font-size:24px;font-weight:750;margin:0}
.ph p{color:var(--mut);margin:4px 0 0}
.stat{padding:18px 20px;display:flex;flex-direction:column;gap:6px;height:100%}
.stat-k{font-size:12.5px;color:var(--mut);font-weight:550;display:flex;align-items:center;gap:8px}
.stat-k i{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:var(--surface-3);color:var(--ink-2);font-size:13px}
.stat-v{font-size:24px;font-weight:750;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--ink)}
.stat-s{font-size:12.5px;color:var(--mut)}
.stat.hl{background:linear-gradient(135deg,var(--brand),var(--brand-2))!important;border-color:transparent!important;color:#fff}
.stat.hl .stat-k,.stat.hl .stat-s,.stat.hl .stat-s a{color:rgba(255,255,255,.85)}
.stat.hl .stat-k i{background:rgba(255,255,255,.18);color:#fff}
.stat.hl .stat-v{color:#fff}
.sbadge{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:99px;font-size:12px;font-weight:650;white-space:nowrap;background:var(--surface-3);color:var(--ink-2)}
.sbadge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.sb-ok{background:var(--ok-soft);color:var(--ok)}.sb-wait{background:var(--warn-soft);color:var(--warn)}.sb-bad{background:var(--bad-soft);color:var(--bad)}.sb-info{background:var(--info-soft);color:var(--info)}
.svc-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:16px;align-items:center;padding:14px 20px;border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none;transition:background .15s}
.svc-row:last-child{border-bottom:0}
.svc-row:hover{background:var(--surface-2);color:var(--ink)}
.svc-ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand);font-size:16px}
.svc-t{font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.svc-s{font-size:12.5px;color:var(--mut);display:flex;gap:10px;flex-wrap:wrap}
.qk{display:flex;flex-direction:column;gap:10px;padding:16px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);color:var(--ink);text-decoration:none;height:100%;transition:all .15s}
.qk:hover{border-color:var(--brand-line);box-shadow:var(--shadow);transform:translateY(-2px);color:var(--ink)}
.qk i{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand);font-size:16px}
.qk b{font-size:14px}.qk span{font-size:12px;color:var(--mut);line-height:1.4}
.empty{padding:44px 24px;text-align:center;color:var(--mut)}
.empty .ei{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;margin:0 auto 14px;background:var(--surface-3);color:var(--mut);font-size:22px}

/* toasts (window.OTToast) */
.ot-toast-container{position:fixed;right:20px;bottom:20px;display:flex;flex-direction:column;gap:10px;z-index:3000;max-width:calc(100vw - 40px)}
.ot-toast{display:flex;gap:12px;align-items:flex-start;min-width:260px;max-width:400px;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-left:4px solid var(--brand);border-radius:12px;box-shadow:var(--shadow-lg);padding:12px 14px;font-size:13.5px;animation:tin .2s ease}
.ot-toast i{color:var(--brand);margin-top:3px}
.ot-toast .title{font-weight:700}.ot-toast .desc{color:var(--mut);font-size:13px;margin-top:2px}
@keyframes tin{from{transform:translateY(8px);opacity:0}}
/* confirm modal (window.otConfirm) */
.ot-modal-overlay{position:fixed;inset:0;z-index:20000;display:flex;align-items:center;justify-content:center;background:rgba(10,14,25,.55);backdrop-filter:blur(2px);opacity:0;transition:opacity .18s ease;padding:20px}
.ot-modal-overlay.show{opacity:1}
.ot-modal-box{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:18px;max-width:420px;width:100%;box-shadow:var(--shadow-lg);padding:26px 24px 20px;text-align:center;transform:translateY(10px) scale(.98);transition:transform .18s ease}
.ot-modal-overlay.show .ot-modal-box{transform:none}
.ot-modal-icon{width:56px;height:56px;border-radius:50%;margin:0 auto 14px;display:flex;align-items:center;justify-content:center;background:var(--brand-soft);color:var(--brand);font-size:24px}
.ot-modal-msg{font-size:15px;line-height:1.5;font-weight:500;margin-bottom:20px;white-space:pre-line}
.ot-modal-actions{display:flex;gap:10px;justify-content:center}
.ot-modal-btn{border:0;border-radius:10px;padding:11px 20px;font-weight:600;font-size:14px;cursor:pointer;flex:1}
.ot-modal-btn.cancel{background:var(--surface-3);color:var(--ink-2)}
.ot-modal-btn.ok{background:var(--brand);color:var(--brand-ink)}

/* ---------- responsive ---------- */
@media (max-width:991.98px){
  .side{transform:translateX(-100%);box-shadow:var(--shadow-lg)}
  body.nav-open .side{transform:none}
  body.nav-open .scrim{display:block;position:fixed;inset:0;background:rgba(10,14,25,.45);z-index:1035}
  .main{margin-left:0}
  .burger{display:grid}
  .top{padding:0 14px}
  .content{padding:18px 14px 40px}
}
@media (max-width:575.98px){
  .bal-v small,.top-title,.top-lang{display:none}
  .svc-row{grid-template-columns:auto minmax(0,1fr);gap:12px}
  .svc-row>.svc-x,.svc-row>.svc-st{grid-column:2}
  .ot-toast-container{left:14px;right:14px;bottom:14px}
  .ot-toast{min-width:0;max-width:none}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- fixes after visual review ---------- */
/* .border-0 on tables reset border-color to currentColor (black row lines) */
.table>:not(caption)>*>*{border-color:var(--line)!important}
.table.border-0>:not(caption)>tr:last-child>*{border-bottom:0}
/* language switcher: light pill inside the top bar (it ships its own dark inline styles) */
.top-lang #ls-btn{background:var(--surface)!important;border:1px solid var(--line)!important;color:var(--ink-2)!important;box-shadow:var(--shadow-sm)!important;backdrop-filter:none!important;padding:6px 12px 6px 10px!important;border-radius:99px!important}
.top-lang #ls-btn:hover{border-color:var(--brand-line)!important;transform:none!important}
.top-lang #ls-btn .ls-globe-icon{color:var(--mut)!important}
.top-lang #ls-btn .ls-chevron{transform:rotate(180deg);color:var(--mut)!important}
.top-lang #ls-panel{background:var(--surface)!important;border:1px solid var(--line)!important;box-shadow:var(--shadow-lg)!important;backdrop-filter:none!important}
.top-lang .ls-item{color:var(--ink-2)!important}
.top-lang .ls-item:hover{background:var(--surface-3)!important;color:var(--ink)!important}
.top-lang .ls-item.ls-active{background:var(--brand-soft)!important;color:var(--brand)!important}
/* domain search: registrar tabs in brand colors */
.ot-prov-tab{background:var(--surface)!important;border:1px solid var(--line-2)!important;color:var(--ink)!important;border-radius:12px!important;padding:9px 16px!important;min-width:170px;text-align:left;box-shadow:none!important}
.ot-prov-tab .ot-note{color:var(--mut)!important}
.ot-prov-tab.active{background:var(--brand-soft)!important;border-color:var(--brand)!important;color:var(--brand)!important}
.ot-prov-tab.active .ot-note{color:var(--brand)!important;opacity:.8}
/* package cards: one brand color for every order button (admin-set accents stay on the badge) */
.ot-order-btn{background:var(--brand)!important;border-color:var(--brand)!important}
.btn-cta-alt{background:var(--brand)!important;color:var(--brand-ink)!important;border:0}
.notice-inline{display:flex;gap:8px;align-items:center;font-size:12.5px;color:var(--mut);margin-top:6px}