/* ══════════════════════════════════════════════════════════════
   THANATOS SMM PANEL — Design System (Dark + Gold Energy)
   ══════════════════════════════════════════════════════════════ */
:root {
  /* ── Backgrounds — deep dark, subtle warmth ── */
  --bg:#0A0A0D; --bg2:#101014; --bg3:#16161C;

  /* ── Gold accent — present but not overwhelming ── */
  --g:#C8961E;  --g2:#E4B84A; --g3:#9A7018; --g4:#624808;
  --glow:rgba(200,150,30,.2); --glow-lg:rgba(200,150,30,.38);

  /* ── Cards — neutral with subtle presence ── */
  --card:rgba(255,255,255,.03);
  --card-b:rgba(255,255,255,.08);
  --card-bh:rgba(200,150,30,.4);

  /* ── Text — white-dominant, warm secondary ── */
  --t1:#FFFFFF; --t2:#C8C0B8;

  /* ── Status ── */
  --green:#34D399; --yellow:#FBBF24; --red:#F87171; --blue:#60A5FA;
  --purple:#A78BFA;

  /* ── Shape ── */
  --r:14px; --r-sm:10px; --r-lg:20px;
  --trans:all .2s ease;
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body {
  background:var(--bg); color:var(--t1);
  font-family:'Cairo',sans-serif; font-size:15px; line-height:1.6;
  min-height:100vh;
}

/* ── App shell ── */
.app-shell  { display:block; min-height:100vh; position:relative; }
.app-main   { display:flex; flex-direction:column; min-height:100vh; }
.app-content{ flex:1; padding:1rem; }

/* ── Topbar ── */
.topbar {
  height:56px; display:flex; align-items:center; gap:.6rem;
  padding:0 1rem; background:rgba(12,12,15,.96);
  border-bottom:1px solid rgba(255,255,255,.06);
  backdrop-filter:blur(20px); position:sticky; top:0; z-index:700;
}
.topbar-brand {
  font-family:'Orbitron',monospace; font-size:.9rem; font-weight:900;
  background:linear-gradient(135deg,var(--g2),var(--g));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  white-space:nowrap;
}
.topbar-title { font-size:.88rem; font-weight:700; color:var(--t2); flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.topbar-pill {
  display:inline-flex; align-items:center; gap:.35rem;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1);
  border-radius:50px; padding:.28rem .7rem; cursor:pointer;
  font-size:.78rem; font-weight:700; color:var(--t2);
  transition:var(--trans); user-select:none; white-space:nowrap;
}
.topbar-pill:hover { border-color:rgba(200,155,42,.4); color:var(--t1); }
.topbar-pill i { font-size:.8rem; color:var(--g2); }
.tp-caret { font-size:.65rem; opacity:.5; }
@media(max-width:560px) {
  /* Guest topbar has 4 extra items (lang, currency, Sign In, Register)
     on top of the hamburger + title — too many for a narrow screen,
     they were overflowing off the right edge. Lang/currency move into
     the sidebar's guest section instead; Sign In / Register stay put
     since they're the primary CTAs. */
  .topbar-pill.guest-hide-sm { display:none; }
}
.topbar-avatar {
  width:34px; height:34px; border-radius:10px; flex-shrink:0;
  background:linear-gradient(135deg,var(--g4),var(--g));
  display:flex; align-items:center; justify-content:center;
  font-size:.85rem; font-weight:900; color:#050301; cursor:pointer;
  box-shadow:0 0 10px var(--glow);
}
.menu-btn {
  width:34px; height:34px; border-radius:10px; flex-shrink:0;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08);
  display:flex; align-items:center; justify-content:center;
  font-size:1rem; color:var(--t2); cursor:pointer; transition:var(--trans);
}
.menu-btn:hover { border-color:rgba(200,155,42,.4); color:var(--t1); }

/* Dropdown container */
.tp-dropdown {
  position:fixed; z-index:950;
  background:#16161B;
  border:1px solid rgba(255,255,255,.09); border-radius:var(--r);
  min-width:180px; box-shadow:0 12px 40px rgba(0,0,0,.7);
  display:none;
}
.tp-dropdown.open { display:block; animation:ddIn .12s ease; }
@keyframes ddIn { from{opacity:0} to{opacity:1} }
.tp-dd-item {
  display:flex; align-items:center; justify-content:space-between;
  padding:.62rem 1rem; font-size:.82rem; color:var(--t2);
  cursor:pointer; transition:background .15s; gap:.5rem;
  border-bottom:1px solid rgba(255,255,255,.05);
}
.tp-dd-item:last-child { border-bottom:none; }
.tp-dd-item:hover { background:rgba(255,255,255,.05); color:var(--t1); }
.tp-dd-item.active { color:var(--g2); }
.tp-dd-item i { color:var(--g2); font-size:.85rem; }
.tp-dd-sep { height:1px; background:rgba(255,255,255,.07); margin:.2rem 0; }
.tp-dd-danger i,.tp-dd-danger { color:var(--red) !important; }
.tp-dd-danger:hover { background:rgba(248,113,113,.07) !important; }

/* ── Sidebar ── ALWAYS fixed — never static in document flow */
.sidebar {
  position:fixed; top:0; left:0; bottom:0;
  width:240px; z-index:900;
  background:rgba(10,10,13,.99);
  border-right:1px solid rgba(255,255,255,.07);
  display:flex; flex-direction:column;
  transform:translateX(-100%);
  transition:transform .25s cubic-bezier(.4,0,.2,1);
}
[dir="rtl"] .sidebar {
  left:auto; right:0;
  transform:translateX(100%);
  border-right:none; border-left:1px solid rgba(255,255,255,.07);
}
.sidebar.open { transform:translateX(0); }
.sidebar-header {
  padding:1rem; border-bottom:1px solid rgba(255,255,255,.06);
  display:flex; align-items:center; justify-content:space-between;
}
.sidebar-brand {
  display:flex; align-items:center; gap:.6rem; min-width:0; flex:1; overflow:hidden;
}
.sidebar-brand-logo {
  height:34px; max-width:120px; width:auto; object-fit:contain;
  flex-shrink:0; border-radius:8px;
  filter:drop-shadow(0 0 6px rgba(212,175,55,.25));
}
.sidebar-logo {
  font-family:'Orbitron',monospace; font-size:.95rem; font-weight:900;
  background:linear-gradient(135deg,var(--g2),var(--g));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0;
}
.sidebar-close { font-size:1.1rem; color:var(--t2); cursor:pointer; padding:.25rem; transition:color .15s; }
.sidebar-close:hover { color:var(--t1); }

/* Balance widget */
.sidebar-balance {
  margin:.75rem .85rem; padding:.85rem 1rem;
  background:rgba(200,155,42,.07);
  border:1px solid rgba(200,155,42,.15); border-radius:var(--r-sm);
  position:relative; overflow:hidden;
}
.sidebar-balance::before {
  content:''; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg,transparent,var(--g2),transparent);
  opacity:.6;
}
.sb-bal-label { font-size:.62rem; color:var(--t2); font-weight:700; letter-spacing:.07em; margin-bottom:.2rem; }
.sb-bal-amount {
  font-family:'Orbitron',monospace; font-size:1.1rem; font-weight:900;
  color:var(--t1);
}
.sb-bal-add {
  display:inline-flex; align-items:center; gap:.3rem; margin-top:.45rem;
  background:rgba(200,155,42,.1); border:1px solid rgba(200,155,42,.2);
  border-radius:50px; padding:.2rem .7rem; font-size:.7rem; font-weight:700;
  color:var(--g2); text-decoration:none; transition:var(--trans);
}
.sb-bal-add:hover { background:rgba(200,155,42,.2); color:var(--t1); }

/* Nav */
.nav-section {
  font-size:.6rem; font-weight:700; color:var(--t2); letter-spacing:.1em;
  text-transform:uppercase; padding:.75rem 1rem .3rem;
}
.nav-item {
  display:flex; align-items:center; gap:.75rem;
  padding:.62rem 1rem; font-size:.85rem; font-weight:600; color:var(--t2);
  text-decoration:none; border-radius:var(--r-sm); margin:0 .5rem .12rem;
  transition:var(--trans); position:relative;
}
.nav-item:hover { background:rgba(255,255,255,.04); color:var(--t2); }
.nav-item.active {
  background:rgba(200,155,42,.1);
  color:var(--t1);
}
.nav-item.active::before {
  content:''; position:absolute; left:0; top:20%; bottom:20%;
  width:3px; border-radius:0 3px 3px 0;
  background:var(--g2);
}
[dir="rtl"] .nav-item.active::before { left:auto; right:0; border-radius:3px 0 0 3px; }
.nav-item i { font-size:1rem; color:var(--t2); width:18px; text-align:center; }
.nav-item:hover i { color:var(--g2); }
.nav-item.active i { color:var(--g2); }
.nav-item-primary { background:linear-gradient(135deg,var(--g4),var(--g),var(--g2)); color:#0A0A0D; margin:0 .5rem .5rem; }
.nav-item-primary i, .nav-item-primary:hover i { color:#0A0A0D; }
.nav-item-primary:hover { background:linear-gradient(135deg,var(--g4),var(--g),var(--g2)); color:#0A0A0D; filter:brightness(1.08); }
.nav-sep { height:1px; background:rgba(255,255,255,.08); margin:.5rem .5rem .75rem; }

/* ── Sidebar overlay */
.sidebar-overlay {
  display:none;
  position:fixed;inset:0;
  background:rgba(0,0,0,.72);
  z-index:850;
  backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  cursor:pointer;
  pointer-events:none;
}
.sidebar-overlay.show {
  display:block;
  pointer-events:auto;
}
body.sidebar-open { overflow:hidden; }

/* ── Responsive ── */
@media(max-width:900px) {
  .app-content { padding:.75rem; }
}

/* ── Flash bar ── */
#flashBar {
  position:fixed; top:.75rem; left:50%; transform:translateX(-50%);
  z-index:9000; display:flex; flex-direction:column; gap:.4rem;
  min-width:280px; max-width:90vw; pointer-events:none;
}
#flashBar > * { pointer-events:auto; }
.flash-msg {
  display:flex; align-items:center; gap:.6rem;
  padding:.65rem 1rem; border-radius:var(--r-sm);
  font-size:.82rem; font-weight:600; backdrop-filter:blur(20px);
  animation:slideDown .25s ease; transition:opacity .3s;
}
@keyframes slideDown { from{opacity:0;transform:translateY(-12px)} to{opacity:1;transform:translateY(0)} }
.flash-success { background:rgba(52,211,153,.1);  border:1px solid rgba(52,211,153,.25);  color:#34d399; }
.flash-error   { background:rgba(248,113,113,.1); border:1px solid rgba(248,113,113,.25); color:#f87171; }
.flash-info    { background:rgba(96,165,250,.1);  border:1px solid rgba(96,165,250,.22);  color:#60a5fa; }
.flash-close   { margin-right:auto; opacity:.6; cursor:pointer; padding:.1rem .3rem; }

/* ── Cards ── */
.card {
  background:var(--card); border:1px solid var(--card-b);
  border-radius:var(--r); padding:1rem; position:relative; overflow:hidden;
  transition:border-color .2s;
}
.card:hover { border-color:var(--card-bh); }
.card-top-line::before {
  content:''; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg,transparent,var(--g2),transparent); opacity:.5;
}

/* ── Table ── */
.smm-table { width:100%; border-collapse:collapse; font-size:.83rem; }
.smm-table thead th {
  padding:.6rem .9rem; font-size:.68rem; font-weight:700;
  color:var(--t2); text-transform:uppercase; letter-spacing:.06em;
  border-bottom:1px solid rgba(255,255,255,.07); text-align:left; white-space:nowrap;
}
[dir="rtl"] .smm-table thead th { text-align:right; }
.smm-table tbody td {
  padding:.65rem .9rem; border-bottom:1px solid rgba(255,255,255,.04);
  color:var(--t2); vertical-align:middle;
}
.smm-table tbody tr:hover td { background:rgba(255,255,255,.025); }
.smm-table tbody tr:last-child td { border-bottom:none; }

/* ── Buttons ── */
.btn {
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.5rem 1.1rem; border-radius:50px; font-size:.82rem; font-weight:700;
  font-family:'Cairo',sans-serif; cursor:pointer; transition:var(--trans);
  border:none; text-decoration:none; white-space:nowrap;
}
.btn-primary {
  background:linear-gradient(135deg,var(--g3),var(--g),var(--g2));
  color:#0C0C0F; box-shadow:0 0 14px var(--glow);
}
.btn-primary:hover { box-shadow:0 0 24px var(--glow-lg); transform:translateY(-1px); color:#0C0C0F; }
.btn-ghost { background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); color:var(--t2); }
.btn-ghost:hover { border-color:rgba(200,155,42,.4); color:var(--t1); background:rgba(255,255,255,.08); }
.btn-danger { background:rgba(248,113,113,.08); border:1px solid rgba(248,113,113,.2); color:var(--red); }
.btn-danger:hover { background:rgba(248,113,113,.14); }
.btn-sm  { padding:.3rem .75rem; font-size:.75rem; }
.btn-lg  { padding:.7rem 1.6rem; font-size:.9rem; }
.btn-block { width:100%; justify-content:center; border-radius:var(--r-sm); }

/* ── Unified Search Bar (SMM.search) ── */
.smm-search {
  position:relative;margin-bottom:1rem;
}
.smm-search-ico {
  position:absolute;left:.9rem;top:50%;transform:translateY(-50%);
  color:var(--t2);font-size:.9rem;pointer-events:none;
  transition:color .2s;
}
.smm-search-inp {
  width:100%;
  background:rgba(255,255,255,.04);
  border:1.5px solid rgba(255,255,255,.1);
  border-radius:var(--r-sm);
  padding:.72rem .9rem .72rem 2.5rem;
  color:#fff;font-size:.88rem;
  font-family:'Cairo',sans-serif;
  outline:none;
  transition:border-color .2s,box-shadow .2s;
}
.smm-search-inp:focus {
  border-color:rgba(200,150,30,.5);
  box-shadow:0 0 0 3px rgba(200,150,30,.08);
}
.smm-search-inp:focus ~ .smm-search-ico,
.smm-search:focus-within .smm-search-ico { color:var(--g2); }
.smm-search-inp::placeholder { color:var(--t2); }
.smm-search-clear {
  position:absolute;right:.75rem;top:50%;transform:translateY(-50%);
  color:var(--t2);cursor:pointer;font-size:.9rem;
  display:none;transition:color .15s;
}
.smm-search-clear:hover { color:var(--t1); }
.smm-search-inp:not(:placeholder-shown) ~ .smm-search-clear { display:block; }
/* RTL support — icon/clear/padding must flip, this was missing entirely */
[dir="rtl"] .smm-search-ico { left:auto; right:.9rem; }
[dir="rtl"] .smm-search-inp { padding:.72rem 2.5rem .72rem .9rem; }
[dir="rtl"] .smm-search-clear { right:auto; left:.75rem; }
@keyframes smm-spin { to { transform:translateY(-50%) rotate(360deg); } }
.smm-spin { animation:smm-spin .7s linear infinite !important; color:var(--g2) !important; }

/* ── Form fields ── */
.field-group { margin-bottom:1rem; }
.field-label { display:block; font-size:.72rem; font-weight:700; color:var(--t2); margin-bottom:.35rem; }
.field-input,.field-select,.field-textarea {
  width:100%; background:rgba(255,255,255,.04); border:1.5px solid rgba(255,255,255,.1);
  border-radius:var(--r-sm); padding:.7rem 1rem; color:var(--t1);
  font-size:.88rem; font-family:'Cairo',sans-serif; outline:none;
  transition:border-color .2s, box-shadow .2s; direction:inherit;
}
.field-input:focus,.field-select:focus,.field-textarea:focus {
  border-color:rgba(200,155,42,.5); box-shadow:0 0 0 3px rgba(200,155,42,.08);
}
.field-input::placeholder,.field-textarea::placeholder { color:var(--t2); }
.field-select option { background:var(--bg2); color:var(--t1); }
.field-textarea { resize:vertical; min-height:100px; }

/* ── Badges ── */
.badge { display:inline-flex; align-items:center; gap:.22rem; border-radius:50px; padding:.15rem .55rem; font-size:.68rem; font-weight:700; border:1px solid; }
.badge-completed    { background:rgba(52,211,153,.1);  border-color:rgba(52,211,153,.28);  color:#34d399; }
.badge-pending,.badge-partial { background:rgba(251,191,36,.08); border-color:rgba(251,191,36,.25); color:#fbbf24; }
.badge-processing,.badge-inprogress { background:rgba(200,155,42,.08); border-color:rgba(200,155,42,.25); color:var(--g2); }
.badge-canceled,.badge-failed { background:rgba(248,113,113,.08); border-color:rgba(248,113,113,.25); color:#f87171; }
.badge-active   { background:rgba(52,211,153,.1);  border-color:rgba(52,211,153,.28);  color:#34d399; }
.badge-inactive { background:rgba(255,255,255,.04); border-color:rgba(255,255,255,.08); color:var(--t2); }

/* ── Progress bar ── */
.progress { height:5px; background:rgba(255,255,255,.06); border-radius:50px; overflow:hidden; }
.progress-fill { height:100%; border-radius:50px; background:linear-gradient(90deg,var(--g3),var(--g2)); transition:width 1s cubic-bezier(.22,1,.36,1); }

/* ── Page header ── */
.page-header { display:flex; align-items:center; gap:.6rem; margin-bottom:1.25rem; flex-wrap:wrap; }
.page-header-ico {
  width:38px; height:38px; border-radius:10px; flex-shrink:0;
  background:rgba(200,155,42,.12); border:1px solid rgba(200,155,42,.2);
  display:flex; align-items:center; justify-content:center;
  font-size:.92rem; color:var(--g2);
}
.page-header-title { font-size:1.05rem; font-weight:900; color:var(--t1); }
.page-header-sub   { font-size:.72rem; color:var(--t2); }
.page-header-line  {
  height:2px; margin-top:.6rem; border-radius:2px; width:100%;
  background:linear-gradient(90deg,var(--g2),var(--g3),transparent);
  background-size:200% 100%; animation:ph-slide 2.5s ease infinite;
}
@keyframes ph-slide { 0%{background-position:100% 0} 50%{background-position:0 0} 100%{background-position:100% 0} }

/* ── Empty state ── */
.empty-state { text-align:center; padding:2.5rem 1rem; }
.empty-ico   { font-size:2.5rem; color:var(--t2); margin-bottom:.75rem; }
.empty-title { font-size:.95rem; font-weight:800; color:var(--t2); margin-bottom:.3rem; }
.empty-sub   { font-size:.78rem; color:var(--t2); margin-bottom:1.1rem; }

/* ── Divider ── */
.divider { height:1px; background:rgba(255,255,255,.07); margin:1rem 0; }

/* ═══════════════════════════════════════════════════════════════
   TomSelect — Unified Panel Theme
   Covers: control, dropdown, options, optgroups, items, focus,
   disabled, placeholder, RTL, multi-select.
   NO page-specific overrides needed anywhere in panel.
   ═══════════════════════════════════════════════════════════════ */

/* Control (the visible input box) */
.ts-wrapper .ts-control {
  background:rgba(255,255,255,.04) !important;
  border:1.5px solid rgba(255,255,255,.1) !important;
  border-radius:var(--r-sm) !important;
  min-height:48px !important;
  padding:.55rem .9rem !important;
  color:#fff !important;
  box-shadow:none !important;
  cursor:pointer !important;
  gap:.4rem !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  font-family:'Cairo',sans-serif !important;
  transition:border-color .2s,box-shadow .2s !important;
}
/* Defensive: TomSelect copies the original <select>'s class attribute onto
   .ts-wrapper itself (confirmed in its source). If that select ever carries
   .field-input/.field-select/.field-textarea, the wrapper would render ITS
   OWN box on top of .ts-control's box — a real double-frame bug. Neutralize
   it here so this can never happen again, regardless of what class a select
   element is given. */
.ts-wrapper.field-input, .ts-wrapper.field-select, .ts-wrapper.field-textarea {
  background:none !important; border:none !important; padding:0 !important;
}
/* Focus state */
.ts-wrapper.focus .ts-control {
  border-color:rgba(200,150,30,.55) !important;
  box-shadow:0 0 0 3px rgba(200,150,30,.1) !important;
  outline:none !important;
}
/* Caret (arrow icon) */
.ts-wrapper .ts-control::after {
  border-top-color:var(--t2) !important;
}
.ts-wrapper.open .ts-control::after {
  border-bottom-color:var(--g2) !important;
}
/* Inner text input */
.ts-wrapper .ts-control input {
  color:#fff !important;
  font-size:.88rem !important;
  font-family:'Cairo',sans-serif !important;
  background:transparent !important;
  min-width:2px !important;
}
.ts-wrapper .ts-control input::placeholder { color:var(--t2) !important; }
/* Disabled */
.ts-wrapper.disabled .ts-control {
  opacity:.4 !important;
  cursor:not-allowed !important;
}
/* Selected single item */
.ts-wrapper .ts-control .item {
  color:#fff !important;
  font-size:.88rem !important;
  font-weight:600 !important;
  background:transparent !important;
  border:none !important;
  padding:0 !important;
}
/* Multi-select items (tags) */
.ts-wrapper.multi .ts-control .item {
  background:rgba(200,150,30,.12) !important;
  border:1px solid rgba(200,150,30,.25) !important;
  color:var(--g2) !important;
  border-radius:6px !important;
  padding:.1rem .5rem !important;
  font-size:.8rem !important;
}
.ts-wrapper.multi .ts-control .item .remove {
  color:var(--t2) !important;
  border-left:1px solid rgba(200,150,30,.2) !important;
  padding:0 .35rem !important;
  margin-left:.3rem !important;
}
.ts-wrapper.multi .ts-control .item .remove:hover { color:var(--red) !important; }

/* ── TomSelect override z-index ── */
/* Dropdown container */
.ts-dropdown {
  background:#15151A !important;
  border:1px solid rgba(255,255,255,.1) !important;
  border-radius:var(--r-sm) !important;
  box-shadow:0 16px 48px rgba(0,0,0,.85) !important;
  margin-top:4px !important;
  overflow:hidden !important;
  z-index:600 !important;  /* Always below topbar (700) and tp-dropdown (950) */
}
/* Dropdown scroll area */
.ts-dropdown-content {
  max-height:260px !important;
  overflow-y:auto !important;
  overscroll-behavior:contain !important;
  /* Thin gold scrollbar */
  scrollbar-width:thin !important;
  scrollbar-color:rgba(200,150,30,.3) transparent !important;
}
.ts-dropdown-content::-webkit-scrollbar { width:3px; }
.ts-dropdown-content::-webkit-scrollbar-track { background:transparent; }
.ts-dropdown-content::-webkit-scrollbar-thumb { background:rgba(200,150,30,.3);border-radius:3px; }

/* Option rows */
.ts-dropdown .option {
  color:var(--t2) !important;
  padding:.6rem 1rem !important;
  font-size:.85rem !important;
  font-family:'Cairo',sans-serif !important;
  cursor:pointer !important;
  transition:background .1s !important;
  border-bottom:1px solid rgba(255,255,255,.03) !important;
}
.ts-dropdown .option:last-child { border-bottom:none !important; }
.ts-dropdown .option:hover,
.ts-dropdown .option.active {
  background:rgba(200,150,30,.08) !important;
  color:#fff !important;
}
.ts-dropdown .option.selected {
  background:rgba(200,150,30,.14) !important;
  color:var(--g2) !important;
  font-weight:700 !important;
}
/* Highlight matched text */
.ts-dropdown .option .highlight {
  background:rgba(200,150,30,.25) !important;
  border-radius:3px !important;
  color:#fff !important;
  font-weight:700 !important;
}
/* Optgroup header */
.ts-dropdown .optgroup-header {
  font-size:.62rem !important;
  font-weight:800 !important;
  color:var(--t2) !important;
  letter-spacing:.1em !important;
  text-transform:uppercase !important;
  padding:.55rem 1rem .22rem !important;
  background:#15151A !important;
  position:sticky !important;
  top:0 !important;
  z-index:1 !important;
  border-bottom:1px solid rgba(255,255,255,.05) !important;
}
/* No results */
.ts-dropdown .no-results {
  color:var(--t2) !important;
  padding:1rem !important;
  text-align:center !important;
  font-size:.82rem !important;
}
/* RTL support */
[dir="rtl"] .ts-wrapper .ts-control { direction:rtl !important; }
[dir="rtl"] .ts-dropdown { direction:rtl !important; }
[dir="rtl"] .ts-wrapper.multi .ts-control .item .remove {
  border-left:none !important;
  border-right:1px solid rgba(200,150,30,.2) !important;
  margin-left:0 !important;
  margin-right:.3rem !important;
}
/* Loading spinner */
.ts-wrapper .spinner {
  border-color:rgba(200,150,30,.3) !important;
  border-top-color:var(--g2) !important;
}

/* ── Scrollbar ── */
::-webkit-scrollbar { width:4px; height:4px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:rgba(255,255,255,.1); border-radius:4px; }

@keyframes va-scan {
  0%   { transform:translateX(-100%); opacity:0 }
  20%  { opacity:1 }
  80%  { opacity:1 }
  100% { transform:translateX(100%); opacity:0 }
}

/* ── Themed confirm dialog (SMM.confirm) — replaces native confirm() ── */
.smm-confirm-overlay {
  position:fixed; inset:0; background:rgba(0,0,0,.6); backdrop-filter:blur(3px);
  display:flex; align-items:center; justify-content:center; z-index:3000;
  opacity:0; transition:opacity .18s; padding:1rem;
}
.smm-confirm-overlay.show { opacity:1; }
.smm-confirm-box {
  background:#111115; border:1px solid rgba(200,150,30,.25); border-radius:var(--r);
  padding:1.1rem; max-width:340px; width:100%;
  transform:scale(.94); transition:transform .18s;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
}
.smm-confirm-overlay.show .smm-confirm-box { transform:scale(1); }
.smm-confirm-msg { font-size:.86rem; color:var(--t1); line-height:1.6; margin-bottom:1rem; }
.smm-confirm-actions { display:flex; gap:.5rem; justify-content:flex-end; }
.smm-confirm-actions .btn { flex:1; justify-content:center; }

/* ── Rich confirm variant (order receipt-style) ── */
.smm-confirm-box.smm-confirm-rich { max-width:380px; position:relative; overflow:hidden; padding-top:1.35rem; }
.smm-confirm-box.smm-confirm-rich::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,#9A7018,#E4B84A,#624808);
}
.smm-confirm-title { display:flex; align-items:center; gap:.45rem; font-family:'Orbitron',monospace; font-weight:900; font-size:1rem; color:#fff; margin-bottom:.9rem; }
.smm-confirm-title i { color:#E4B84A; }
.smm-confirm-row { display:flex; justify-content:space-between; align-items:flex-start; gap:.75rem; font-size:.82rem; padding:.5rem 0; border-bottom:1px solid rgba(255,255,255,.06); }
.smm-confirm-row:last-of-type { border-bottom:none; padding-bottom:0; }
.smm-confirm-row .lbl { color:var(--t2); flex-shrink:0; font-weight:700; }
.smm-confirm-row .val { color:#fff; font-weight:700; text-align:end; word-break:break-all; }
.smm-confirm-row.total { margin-top:.2rem; }
.smm-confirm-row.total .val { color:#E4B84A; font-family:'Orbitron',monospace; font-size:1rem; }