/* ============================================================
   THEME BLUE GLASS (v1) — dimuat PALING AKHIR.
   Tema gelap standar (tidak pekat), aksen biru, efek glass
   dengan gradasi halus. Hanya mengubah mode gelap; mode terang,
   warna beli/jual (hijau/merah) dan logika aplikasi tidak berubah.
   Hapus link file ini di index.html untuk kembali ke tema lama.
   ============================================================ */
:root:not([data-theme="light"]){
  /* Permukaan: biru-slate gelap standar, bukan hitam */
  --bg:#070C16;
  --bg-raised:#0A1120;
  --panel:#0D1526;
  --panel-2:#111B31;
  --border:#1B2944;
  --border-soft:#142038;

  --text-1:#E6ECF8;
  --text-2:#9DABC6;
  --text-3:#6B7A97;

  /* Aksen biru */
  --accent:#5B9BFF;
  --accent-dim:rgba(91,155,255,.15);
  --accent-glow:rgba(91,155,255,.38);
  --accent-fg:#FFFFFF;
  --brand-bg:linear-gradient(135deg,#6AA8FF,#3B6FE0);
  --brand-fg:#FFFFFF;
  --brand-shadow:0 4px 16px rgba(91,155,255,.35);

  /* Netral (hijau/merah beli-jual tetap) */
  --neutral:#7D8CA8;
  --neutral-dim:rgba(125,140,168,.12);

  /* Glass */
  --glass-blur:20px;
  --glass-saturate:1.25;
  --glass-panel:rgba(14,22,40,.68);
  --glass-panel-2:rgba(18,28,50,.60);
  --glass-border:rgba(120,165,255,.14);
  --glass-border-soft:rgba(120,165,255,.08);
  --glass-bg-sidebar:rgba(7,12,22,.70);
  --glass-bg-topbar:rgba(9,15,28,.70);
  --glass-bg-page:rgba(15,22,36,.65);

  /* Aurora: gradasi biru lembut di sudut layar */
  --aurora-1:rgba(59,130,246,.16);
  --aurora-2:rgba(99,102,241,.10);
  --aurora-3:rgba(56,189,248,.07);
  --aurora-4:rgba(37,99,235,.12);
}

/* Latar halaman: gradasi biru halus (bukan hitam) */
html.glass-on:not([data-theme="light"]),
:root:not([data-theme="light"]) body.glass-on{
  background:
    radial-gradient(ellipse 60% 50% at 0% 0%, var(--aurora-1), transparent 62%),
    radial-gradient(ellipse 55% 45% at 100% 0%, var(--aurora-2), transparent 62%),
    radial-gradient(ellipse 60% 50% at 100% 100%, var(--aurora-3), transparent 62%),
    radial-gradient(ellipse 50% 40% at 0% 100%, var(--aurora-4), transparent 62%),
    linear-gradient(160deg,#0C1527 0%,#070C16 55%,#0A111F 100%);
  background-attachment:fixed;
}
:root:not([data-theme="light"]) body{background-image:none;}

/* Panel: kaca biru dengan kilau halus di atas */
:root:not([data-theme="light"]) .panel{
  background:var(--panel) !important;
  background-image:linear-gradient(160deg,rgba(130,175,255,.04),rgba(255,255,255,.005) 45%,transparent 75%) !important;
  border-color:var(--glass-border) !important;
  box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 6px 22px rgba(0,3,10,.35) !important;
}
:root:not([data-theme="light"]) body.glass-on .panel{
  background:var(--glass-panel) !important;
  background-image:linear-gradient(160deg,rgba(130,175,255,.06),rgba(255,255,255,.01) 40%,transparent 80%) !important;
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 8px 28px rgba(0,3,10,.38) !important;
}

/* Kartu statistik / engine / chart Autobot */
:root:not([data-theme="light"]) .ab-stat,
:root:not([data-theme="light"]) .ab-chart-panel,
:root:not([data-theme="light"]) .ab-engine,
:root:not([data-theme="light"]) .ab-wrap,
:root:not([data-theme="light"]) .bot-runner-shell,
:root:not([data-theme="light"]) .bot-runner-card,
:root:not([data-theme="light"]) #botInfoModalBox{
  background:var(--glass-panel);
  background-image:linear-gradient(160deg,rgba(130,175,255,.05),transparent 70%);
  border-color:var(--glass-border);
  backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
  box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 6px 22px rgba(0,3,10,.32);
}

/* Sidebar & topbar: kaca biru gradasi */
:root:not([data-theme="light"]) body.glass-on .app-sidebar{
  background:linear-gradient(180deg,rgba(10,17,32,.75),rgba(6,10,19,.75)) !important;
}
:root:not([data-theme="light"]) body.glass-on header.topbar{
  background:linear-gradient(90deg,rgba(11,18,34,.75),rgba(8,13,25,.75)) !important;
}
:root:not([data-theme="light"]) .ticker-strip{background:transparent;}

/* Menu aktif, badge, tombol TF aktif: biru */
:root:not([data-theme="light"]) .side-link[data-page-link].active,
:root:not([data-theme="light"]) .side-link.active{
  background:linear-gradient(90deg,rgba(91,155,255,.20),rgba(91,155,255,.06)) !important;
  box-shadow:inset 0 0 0 1px rgba(91,155,255,.28);
}
:root:not([data-theme="light"]) .side-link.active::before{
  background:#5B9BFF !important; box-shadow:0 0 12px rgba(91,155,255,.7);
}
:root:not([data-theme="light"]) .side-brand-mark{
  background:linear-gradient(135deg,#6AA8FF,#3B6FE0) !important;
  color:#fff !important; box-shadow:0 4px 16px rgba(91,155,255,.35) !important;
}
:root:not([data-theme="light"]) .side-badge{
  background:#5B9BFF !important; color:#fff !important;
  box-shadow:0 0 10px rgba(91,155,255,.5) !important;
}
:root:not([data-theme="light"]) .tf-btn.active,
:root:not([data-theme="light"]) .chart-tf.active{
  background:#5B9BFF !important; color:#fff !important;
}

/* Input / dropdown: kaca tipis, bukan hitam */
:root:not([data-theme="light"]) select,
:root:not([data-theme="light"]) input,
:root:not([data-theme="light"]) textarea,
:root:not([data-theme="light"]) select.pill,
:root:not([data-theme="light"]) .search-box,
:root:not([data-theme="light"]) .tf-group,
:root:not([data-theme="light"]) .icon-btn,
:root:not([data-theme="light"]) .ab-seg{
  background-color:rgba(255,255,255,.03);
  border-color:var(--glass-border);
}
:root:not([data-theme="light"]) select option{background:#0D1526; color:var(--text-1);}

/* Chart: transparan supaya gradasi latar terlihat */
:root:not([data-theme="light"]) .tv-chart-wrap,
:root:not([data-theme="light"]) #tvChartWrap,
:root:not([data-theme="light"]) #lwMainChart,
:root:not([data-theme="light"]) #lwRsiChart,
:root:not([data-theme="light"]) #lwMacdChart,
:root:not([data-theme="light"]) #abChart,
:root:not([data-theme="light"]) #abChart *{background:transparent !important;}

/* Tabel posisi: baris hover kebiruan */
:root:not([data-theme="light"]) .ab-table tbody tr:hover{background:rgba(91,155,255,.07);}
:root:not([data-theme="light"]) .ab-table tbody tr.sel{background:rgba(91,155,255,.12) !important;}

/* Autofill browser */
:root:not([data-theme="light"]) body.glass-on input:-webkit-autofill,
:root:not([data-theme="light"]) body.glass-on input:-webkit-autofill:hover,
:root:not([data-theme="light"]) body.glass-on input:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 1000px #101A2E inset !important;
  box-shadow:0 0 0 1000px #101A2E inset !important;
  -webkit-text-fill-color:var(--text-1) !important;
}

/* ============================================================
   MODE TERANG — biru lembut + kaca putih (sebelumnya latar gelap
   ikut terbawa ke mode terang sehingga panel tampak abu-abu).
   ============================================================ */
:root[data-theme="light"]{
  --bg:#EDF2FA;
  --bg-raised:#FFFFFF;
  --panel:#FFFFFF;
  --panel-2:#F3F7FD;
  --border:#D6DFEE;
  --border-soft:#E3E9F4;
  --text-1:#14213A;
  --text-2:#4B5C7A;
  --text-3:#7D8CA8;
  --accent:#2563EB;
  --accent-dim:rgba(37,99,235,.10);
  --accent-glow:rgba(37,99,235,.25);
  --brand-bg:linear-gradient(135deg,#4F8BFF,#2563EB);
  --brand-fg:#FFFFFF;
  --brand-shadow:0 4px 14px rgba(37,99,235,.30);
  --glass-panel:rgba(255,255,255,.72);
  --glass-panel-2:rgba(243,247,253,.72);
  --glass-border:rgba(37,99,235,.14);
  --glass-bg-sidebar:rgba(255,255,255,.62);
  --glass-bg-topbar:rgba(255,255,255,.66);
  --aurora-1:rgba(59,130,246,.18);
  --aurora-2:rgba(99,102,241,.10);
  --aurora-3:rgba(56,189,248,.12);
  --aurora-4:rgba(37,99,235,.10);
}
html.glass-on[data-theme="light"]{
  background:
    radial-gradient(ellipse 60% 50% at 0% 0%, var(--aurora-1), transparent 62%),
    radial-gradient(ellipse 55% 45% at 100% 0%, var(--aurora-2), transparent 62%),
    radial-gradient(ellipse 60% 50% at 100% 100%, var(--aurora-3), transparent 62%),
    linear-gradient(160deg,#F4F8FF 0%,#EAF0FA 100%);
  background-attachment:fixed;
}
html[data-theme="light"] body,
html[data-theme="light"] body.glass-on{background:transparent;}
html[data-theme="light"] header.topbar,
html[data-theme="light"] .app-sidebar{
  background:var(--glass-bg-topbar) !important;
  backdrop-filter:blur(var(--glass-blur,18px)) saturate(1.2);
  -webkit-backdrop-filter:blur(var(--glass-blur,18px)) saturate(1.2);
  border-color:var(--glass-border) !important;
}
html[data-theme="light"] .panel{
  background:var(--glass-panel) !important;
  background-image:linear-gradient(160deg,rgba(255,255,255,.7),rgba(235,243,255,.35)) !important;
  border-color:var(--glass-border) !important;
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 6px 20px rgba(37,99,235,.08) !important;
}
html[data-theme="light"] .side-link.active{
  background:linear-gradient(90deg,rgba(37,99,235,.14),rgba(37,99,235,.04)) !important;
  color:var(--text-1) !important;
  box-shadow:inset 0 0 0 1px rgba(37,99,235,.20);
}
html[data-theme="light"] .side-link.active::before{background:#2563EB !important; box-shadow:none;}
html[data-theme="light"] .side-badge{background:#2563EB !important; color:#fff !important; box-shadow:none !important;}
html[data-theme="light"] .tf-btn.active,
html[data-theme="light"] .chart-tf.active{background:#2563EB !important; color:#fff !important;}
html[data-theme="light"] select,
html[data-theme="light"] input,
html[data-theme="light"] textarea{background-color:rgba(255,255,255,.85); color:var(--text-1);}
html[data-theme="light"] .icon-btn,
html[data-theme="light"] .search-box,
html[data-theme="light"] .tf-group{background:rgba(255,255,255,.8) !important; border-color:var(--glass-border);}

/* ============================================================
   KURANGI DOMINAN BIRU (mode gelap saja)
   Permukaan dibuat lebih netral (abu gelap), aurora biru & tint
   biru pada border/kilau diturunkan. Aksen biru (menu aktif,
   badge, tombol) tetap. Hapus blok ini untuk kembali ke semula.
   ============================================================ */
:root:not([data-theme="light"]){
  --bg:#0A0C10;
  --bg-raised:#0E1116;
  --panel:#12151B;
  --panel-2:#171B22;
  --border:#252A33;
  --border-soft:#1B1F27;
  --text-2:#A3ABB8;
  --text-3:#727A88;

  --glass-panel:rgba(18,21,27,.74);
  --glass-panel-2:rgba(23,27,34,.66);
  --glass-border:rgba(255,255,255,.08);
  --glass-border-soft:rgba(255,255,255,.05);
  --glass-bg-sidebar:rgba(10,12,16,.76);
  --glass-bg-topbar:rgba(12,14,18,.76);
  --glass-bg-page:rgba(18,21,27,.68);

  --aurora-1:rgba(59,130,246,.06);
  --aurora-2:rgba(99,102,241,.03);
  --aurora-3:rgba(56,189,248,.025);
  --aurora-4:rgba(37,99,235,.04);
}
html.glass-on:not([data-theme="light"]),
:root:not([data-theme="light"]) body.glass-on{
  background:
    radial-gradient(ellipse 60% 50% at 0% 0%, var(--aurora-1), transparent 62%),
    radial-gradient(ellipse 55% 45% at 100% 0%, var(--aurora-2), transparent 62%),
    radial-gradient(ellipse 60% 50% at 100% 100%, var(--aurora-3), transparent 62%),
    radial-gradient(ellipse 50% 40% at 0% 100%, var(--aurora-4), transparent 62%),
    linear-gradient(160deg,#101319 0%,#0A0C10 55%,#0C0F14 100%);
  background-attachment:fixed;
}
:root:not([data-theme="light"]) .panel{
  background-image:linear-gradient(160deg,rgba(255,255,255,.03),rgba(255,255,255,.005) 45%,transparent 75%) !important;
}
:root:not([data-theme="light"]) body.glass-on .panel{
  background-image:linear-gradient(160deg,rgba(255,255,255,.04),rgba(255,255,255,.008) 40%,transparent 80%) !important;
}
:root:not([data-theme="light"]) .ab-stat,
:root:not([data-theme="light"]) .ab-chart-panel,
:root:not([data-theme="light"]) .ab-engine,
:root:not([data-theme="light"]) .ab-wrap,
:root:not([data-theme="light"]) .bot-runner-shell,
:root:not([data-theme="light"]) .bot-runner-card,
:root:not([data-theme="light"]) #botInfoModalBox{
  background-image:linear-gradient(160deg,rgba(255,255,255,.035),transparent 70%);
}
:root:not([data-theme="light"]) body.glass-on .app-sidebar{
  background:linear-gradient(180deg,rgba(13,15,20,.78),rgba(8,10,13,.78)) !important;
}
:root:not([data-theme="light"]) body.glass-on header.topbar{
  background:linear-gradient(90deg,rgba(14,16,21,.78),rgba(10,12,16,.78)) !important;
}
:root:not([data-theme="light"]) select option{background:#12151B;}
:root:not([data-theme="light"]) .ab-table tbody tr:hover{background:rgba(255,255,255,.04);}
:root:not([data-theme="light"]) .ab-table tbody tr.sel{background:rgba(91,155,255,.08) !important;}

/* ============================================================
   SIDEBAR & TOPBAR SENADA DENGAN AREA KONTEN (mode gelap)
   Sebelumnya sidebar/topbar punya gradasi gelap sendiri (lebih pekat)
   di atas latar halaman, sehingga warnanya beda dengan sisi kanan.
   Sekarang keduanya transparan: ikut latar halaman, hanya dibatasi
   garis tipis.
   ============================================================ */
:root:not([data-theme="light"]) .app-sidebar,
:root:not([data-theme="light"]) body.glass-on .app-sidebar{
  background:transparent !important;
  -webkit-backdrop-filter:none; backdrop-filter:none;
  border-right:1px solid var(--glass-border) !important;
}
:root:not([data-theme="light"]) header.topbar,
:root:not([data-theme="light"]) body.glass-on header.topbar{
  background:transparent !important;
  -webkit-backdrop-filter:none; backdrop-filter:none;
  border-bottom:1px solid var(--glass-border-soft) !important;
}
:root:not([data-theme="light"]) .app-shell,
:root:not([data-theme="light"]) .app-content{background:transparent;}

/* ============================================================
   SIDEBAR IKON SAJA (tanpa tulisan) + TILE KACA — ikon dari pack Web Pack.
   Nama menu muncul sebagai tooltip (atribut title).
   ============================================================ */
@media (min-width:761px){ :root{ --sidebar-w:76px; } }
.side-brand-name, .side-label{display:none !important;}
.side-brand{justify-content:center; padding:2px 0 0;}
.app-sidebar{align-items:center; padding-left:0; padding-right:0;}
.side-nav{align-items:center; gap:10px;}
.side-link[data-page-link]{
  width:48px; height:48px; min-height:0; padding:0; justify-content:center; align-items:center;
  border-radius:14px; border:1px solid rgba(0,0,0,.08); background:rgba(0,0,0,.04);
  box-shadow:none !important;
}
:root:not([data-theme="light"]) .side-link[data-page-link]{
  background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.10);
}
:root:not([data-theme="light"]) .side-link[data-page-link]:hover{
  background:rgba(255,255,255,.09); border-color:rgba(255,255,255,.18);
}
:root:not([data-theme="light"]) .side-link[data-page-link].active{
  background:rgba(249,115,22,.16) !important; border-color:rgba(249,115,22,.55);
}
.side-link[data-page-link].active::before{display:none !important;}
.side-ico{width:30px; height:30px;}
.side-ico img{width:100%; height:100%; display:block; object-fit:contain;}
.side-link[data-page-link].active .side-ico{filter:none !important;}
.side-link[data-page-link] .side-badge{position:absolute; top:-5px; right:-5px; margin:0; min-width:18px; height:18px; padding:0 4px; font-size:10px;}
@media (max-width:760px){
  .app-sidebar{align-items:stretch;}
  .side-nav{width:100%; justify-content:space-around; gap:2px;}
  .side-link[data-page-link]{width:46px; height:46px;}
}

/* HP: bar bawah dibuat hampir solid + blur supaya konten di belakangnya tidak tembus/tumpang tindih */
@media (max-width:760px){
  :root:not([data-theme="light"]) .app-sidebar,
  :root:not([data-theme="light"]) body.glass-on .app-sidebar{
    background:rgba(11,13,18,.96) !important;
    -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px);
    border-top:1px solid rgba(255,255,255,.10) !important; border-right:0 !important;
    box-shadow:0 -6px 18px rgba(0,0,0,.35);
  }
  html[data-theme="light"] .app-sidebar{
    background:rgba(255,255,255,.96) !important;
    -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px);
    border-top:1px solid rgba(0,0,0,.10) !important;
  }
  .app-sidebar{padding-top:8px;}
}

/* Badge jumlah posisi Autobot: orange + animasi bounce */
:root:not([data-theme="light"]) .side-link[data-page-link] .side-badge,
.side-link[data-page-link] .side-badge{
  background:#F97316 !important; color:#fff !important;
  box-shadow:0 0 10px rgba(249,115,22,.55) !important;
  animation:sideBadgeBounce 1.6s ease-in-out infinite;
}
@keyframes sideBadgeBounce{
  0%,100%{transform:translateY(0);}
  20%{transform:translateY(-5px);}
  40%{transform:translateY(0);}
  55%{transform:translateY(-2px);}
  70%{transform:translateY(0);}
}
@media (prefers-reduced-motion:reduce){
  .side-link[data-page-link] .side-badge{animation:none;}
}

/* ============================================================
   MENU AKTIF MELEBAR: tile aktif memanjang ke kanan dan menampilkan nama menu.
   Menu lain tetap tile ikon saja.
   ============================================================ */
@media (min-width:761px){
  .side-nav{width:100%; padding-left:14px; align-items:flex-start;}
}
.side-link[data-page-link].active{
  width:auto; min-width:48px; padding:0 16px 0 9px; gap:8px;
  justify-content:flex-start; position:relative; z-index:3;
  background:#26180D !important;              /* solid supaya konten di belakangnya tidak tembus */
}
html[data-theme="light"] .side-link[data-page-link].active{background:#FFEFE0 !important;}
.side-link[data-page-link].active .side-label{
  display:inline-block !important; white-space:nowrap; font-size:13.5px; font-weight:500;
  color:var(--text-1); animation:sideLabelIn .24s ease-out both;
}
@keyframes sideLabelIn{
  from{opacity:0; transform:translateX(-8px);}
  to{opacity:1; transform:translateX(0);}
}
@media (prefers-reduced-motion:reduce){
  .side-link[data-page-link].active .side-label{animation:none;}
}
@media (max-width:760px){
  .side-link[data-page-link]{width:42px; height:44px;}
  .side-link[data-page-link].active{width:auto; flex-direction:row; padding:0 12px 0 7px; gap:6px; min-height:0;}
  .side-link[data-page-link].active .side-label{font-size:12.5px;}
  .side-nav{justify-content:space-between; padding:0 4px;}
}

/* ============================================================
   NEAR-BLACK + GLASS JELAS (mode gelap saja)
   Permukaan hampir hitam netral (tanpa tint biru), kaca lebih
   transparan dengan blur kuat, border terang, kilau atas tegas.
   Aksen biru kecil saja (menu aktif/badge). Hapus blok ini untuk
   kembali ke tampilan sebelumnya.
   ============================================================ */
:root:not([data-theme="light"]){
  --bg:#040405;
  --bg-raised:#08090B;
  --panel:#0C0D10;
  --panel-2:#121317;
  --border:#2A2C33;
  --border-soft:#1C1E23;
  --text-1:#EEF0F4;
  --text-2:#A9AEB8;
  --text-3:#767B86;

  --glass-blur:28px;
  --glass-saturate:1.6;
  --glass-panel:rgba(22,23,27,.46);
  --glass-panel-2:rgba(30,31,36,.40);
  --glass-border:rgba(255,255,255,.16);
  --glass-border-soft:rgba(255,255,255,.09);
  --glass-bg-sidebar:rgba(8,8,10,.55);
  --glass-bg-topbar:rgba(10,10,12,.55);
  --glass-bg-page:rgba(16,17,20,.50);

  /* cahaya latar netral (putih redup) agar efek kaca/blur terlihat, bukan biru */
  --aurora-1:rgba(255,255,255,.07);
  --aurora-2:rgba(200,205,215,.045);
  --aurora-3:rgba(255,255,255,.03);
  --aurora-4:rgba(180,185,195,.05);
}
html.glass-on:not([data-theme="light"]),
:root:not([data-theme="light"]) body.glass-on{
  background:
    radial-gradient(ellipse 55% 45% at 8% 6%, var(--aurora-1), transparent 62%),
    radial-gradient(ellipse 50% 40% at 95% 10%, var(--aurora-2), transparent 62%),
    radial-gradient(ellipse 55% 45% at 92% 95%, var(--aurora-3), transparent 62%),
    radial-gradient(ellipse 45% 38% at 6% 92%, var(--aurora-4), transparent 62%),
    linear-gradient(160deg,#0A0A0C 0%,#040405 55%,#070709 100%);
  background-attachment:fixed;
}
/* Panel & kartu: kaca bening + blur kuat + kilau atas + tepi terang */
:root:not([data-theme="light"]) .panel,
:root:not([data-theme="light"]) body.glass-on .panel,
:root:not([data-theme="light"]) .ab-stat,
:root:not([data-theme="light"]) .ab-chart-panel,
:root:not([data-theme="light"]) .ab-engine,
:root:not([data-theme="light"]) .ab-wrap,
:root:not([data-theme="light"]) .bot-runner-shell,
:root:not([data-theme="light"]) .bot-runner-card,
:root:not([data-theme="light"]) #botInfoModalBox,
:root:not([data-theme="light"]) .cp-panel,
:root:not([data-theme="light"]) .cp-card,
:root:not([data-theme="light"]) .ab-tabs-panel{
  background-color:var(--glass-panel) !important;
  background-image:linear-gradient(155deg,rgba(255,255,255,.10),rgba(255,255,255,.025) 38%,rgba(255,255,255,0) 70%) !important;
  border:1px solid var(--glass-border) !important;
  backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate)) !important;
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate)) !important;
  box-shadow:0 1px 0 rgba(255,255,255,.22) inset, 0 0 0 1px rgba(255,255,255,.03) inset, 0 10px 32px rgba(0,0,0,.55) !important;
}
:root:not([data-theme="light"]) body.glass-on .app-sidebar{
  background:linear-gradient(180deg,rgba(14,14,17,.58),rgba(6,6,8,.58)) !important;
  backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
  border-right:1px solid var(--glass-border-soft);
}
:root:not([data-theme="light"]) body.glass-on header.topbar{
  background:linear-gradient(90deg,rgba(16,16,19,.58),rgba(8,8,10,.58)) !important;
  backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
  border-bottom:1px solid var(--glass-border-soft);
}
:root:not([data-theme="light"]) select,
:root:not([data-theme="light"]) input,
:root:not([data-theme="light"]) textarea,
:root:not([data-theme="light"]) select.pill,
:root:not([data-theme="light"]) .search-box,
:root:not([data-theme="light"]) .tf-group,
:root:not([data-theme="light"]) .icon-btn,
:root:not([data-theme="light"]) .ab-seg,
:root:not([data-theme="light"]) .cp-seg{
  background-color:rgba(255,255,255,.05);
  border-color:rgba(255,255,255,.14);
}
:root:not([data-theme="light"]) select option{background:#0C0D10;}
:root:not([data-theme="light"]) .ab-table tbody tr:hover,
:root:not([data-theme="light"]) .cp-table tbody tr:hover td{background:rgba(255,255,255,.05);}
:root:not([data-theme="light"]) .ab-table tbody tr.sel{background:rgba(255,255,255,.09) !important;}
:root:not([data-theme="light"]) .cp-table th,
:root:not([data-theme="light"]) .ab-table th{background:rgba(255,255,255,.03);}
:root:not([data-theme="light"]) body.glass-on input:-webkit-autofill,
:root:not([data-theme="light"]) body.glass-on input:-webkit-autofill:hover,
:root:not([data-theme="light"]) body.glass-on input:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 1000px #15161A inset !important;
  box-shadow:0 0 0 1000px #15161A inset !important;
}

/* ============================================================
   PENYESUAIAN: glass dikurangi sedikit, kontras warna dinaikkan sedikit
   ============================================================ */
:root:not([data-theme="light"]){
  --bg:#030304;
  --panel:#0E0F12;
  --panel-2:#15161B;
  --border:#31343C;
  --border-soft:#22252B;
  --text-1:#F5F7FA;
  --text-2:#BAC0CB;
  --text-3:#8A909C;

  --glass-blur:20px;
  --glass-saturate:1.35;
  --glass-panel:rgba(24,25,30,.62);
  --glass-panel-2:rgba(32,33,39,.56);
  --glass-border:rgba(255,255,255,.13);
  --glass-border-soft:rgba(255,255,255,.08);
  --glass-bg-sidebar:rgba(8,8,10,.68);
  --glass-bg-topbar:rgba(10,10,12,.68);
}
:root:not([data-theme="light"]) .panel,
:root:not([data-theme="light"]) body.glass-on .panel,
:root:not([data-theme="light"]) .ab-stat,
:root:not([data-theme="light"]) .ab-chart-panel,
:root:not([data-theme="light"]) .ab-engine,
:root:not([data-theme="light"]) .ab-wrap,
:root:not([data-theme="light"]) .bot-runner-shell,
:root:not([data-theme="light"]) .bot-runner-card,
:root:not([data-theme="light"]) #botInfoModalBox,
:root:not([data-theme="light"]) .cp-panel,
:root:not([data-theme="light"]) .cp-card,
:root:not([data-theme="light"]) .ab-tabs-panel{
  background-image:linear-gradient(155deg,rgba(255,255,255,.07),rgba(255,255,255,.015) 38%,rgba(255,255,255,0) 70%) !important;
  box-shadow:0 1px 0 rgba(255,255,255,.15) inset, 0 10px 30px rgba(0,0,0,.6) !important;
}
:root:not([data-theme="light"]) body.glass-on .app-sidebar{
  background:linear-gradient(180deg,rgba(14,14,17,.7),rgba(6,6,8,.7)) !important;
}
:root:not([data-theme="light"]) body.glass-on header.topbar{
  background:linear-gradient(90deg,rgba(16,16,19,.7),rgba(8,8,10,.7)) !important;
}
:root:not([data-theme="light"]) .cp-table th,
:root:not([data-theme="light"]) .ab-table th{color:#9EA4B0;}

/* ============================================================
   MENU AUTOBOT: glass dikalemkan (sama halusnya dengan menu Analitik)
   Tanpa blur kuat, tanpa kilau tebal, tepi tipis, bayangan lembut.
   ============================================================ */
:root:not([data-theme="light"]) #page-autobot .panel,
:root:not([data-theme="light"]) #page-autobot .ab-stat,
:root:not([data-theme="light"]) #page-autobot .ab-chart-panel,
:root:not([data-theme="light"]) #page-autobot .ab-engine,
:root:not([data-theme="light"]) #page-autobot .ab-wrap,
:root:not([data-theme="light"]) #page-autobot .ab-tabs-panel,
:root:not([data-theme="light"]) body.glass-on #page-autobot .panel{
  background-color:rgba(16,17,21,.88) !important;
  background-image:linear-gradient(160deg,rgba(255,255,255,.025),rgba(255,255,255,0) 60%) !important;
  border:1px solid rgba(255,255,255,.07) !important;
  backdrop-filter:blur(6px) !important;
  -webkit-backdrop-filter:blur(6px) !important;
  box-shadow:0 4px 14px rgba(0,0,0,.35) !important;
}
:root:not([data-theme="light"]) #page-autobot .ab-stat{background-color:rgba(20,21,26,.9) !important;}
:root:not([data-theme="light"]) #page-autobot select,
:root:not([data-theme="light"]) #page-autobot input,
:root:not([data-theme="light"]) #page-autobot .ab-seg{
  background-color:rgba(255,255,255,.035);
  border-color:rgba(255,255,255,.09);
}

/* ============================================================
   PENGATURAN: ikon gear di topbar digabung ke menu Setting (satu pintu),
   tampilan halaman dibuat ringkas, warna lembut, font tidak bold.
   ============================================================ */
#settingsGearBtn{display:none !important;}   /* tetap ada di DOM agar handler JS aman; akses lewat menu Setting di sidebar */

#page-setting, #page-setting *{font-weight:400 !important;}
#page-setting > .setting-page-body{padding:14px clamp(12px,2vw,24px) 22px !important; font-size:12px;}
#page-setting .setting-page-body > div:first-child{margin-bottom:12px !important;}
#page-setting .setting-page-body > div:first-child h3{font-size:20px !important; font-weight:400 !important; letter-spacing:0;}
#page-setting .settings-grid{gap:12px !important;}
#page-setting .settings-col{gap:12px;}
#page-setting .settings-col > *,
#page-setting .settings-col > *:first-child{
  padding:12px 14px !important; border-radius:12px !important;
  background:rgba(18,19,23,.86) !important;
  border:1px solid rgba(255,255,255,.07) !important;
  box-shadow:0 3px 10px rgba(0,0,0,.28) !important;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
#page-setting label{font-size:11.5px !important; color:var(--text-2) !important; margin-bottom:4px !important;}
#page-setting .account-forms-grid{gap:14px !important;}
#page-setting input, #page-setting select{
  padding:7px 10px !important; margin-bottom:8px !important; font-size:12px !important; border-radius:8px !important;
  background:rgba(255,255,255,.04) !important; border:1px solid rgba(255,255,255,.10) !important; color:var(--text-1) !important;
}
#page-setting input:focus{outline:none; border-color:rgba(255,255,255,.28) !important; background:rgba(255,255,255,.06) !important;}
#avatarPreview{width:40px !important; height:40px !important;}
#page-setting button{
  padding:7px 12px !important; font-size:12px !important; border-radius:8px !important; cursor:pointer;
  background:rgba(255,255,255,.07) !important; color:var(--text-1) !important;
  border:1px solid rgba(255,255,255,.14) !important; transition:background .18s ease, border-color .18s ease;
}
#page-setting button:hover:not(:disabled){background:rgba(255,255,255,.12) !important;}
/* tombol simpan/tambah: oranye lembut transparan (bukan solid) */
#page-setting button[type="submit"], #avatarSaveBtn, #evRequestBtn{
  background:rgba(249,115,22,.14) !important; color:#FFC9A3 !important; border:1px solid rgba(249,115,22,.38) !important;
}
#page-setting button[type="submit"]:hover:not(:disabled), #avatarSaveBtn:hover:not(:disabled), #evRequestBtn:hover:not(:disabled){
  background:rgba(249,115,22,.24) !important;
}
#avatarSaveBtn:disabled{opacity:.45 !important;}
