/* ═══════════════════════════════════════════════════════════
   AIO — Tombol & pemilih bahasa v3 (dimuat paling akhir)
═══════════════════════════════════════════════════════════ */
:root{--btn-ease:cubic-bezier(.2,.8,.2,1)}
button{-webkit-tap-highlight-color:transparent}
button:focus-visible,.nav-cta:focus-visible,.lp-item:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

/* ── Tombol dasar ── */
.btn{border-radius:14px;font-weight:700;letter-spacing:-.005em;transition:transform .2s var(--btn-ease),box-shadow .2s var(--btn-ease),background .2s,filter .2s,color .2s,border-color .2s}
.btn:active:not(:disabled){transform:scale(.97)}
.btn .ico svg{width:1.15em;height:1.15em}
.btn-primary{background:var(--grad);color:#fff;border:0;box-shadow:0 8px 22px -8px rgba(47,91,255,.65),inset 0 1px 0 rgba(255,255,255,.22)}
.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 14px 28px -10px rgba(47,91,255,.7),inset 0 1px 0 rgba(255,255,255,.25)}
.btn-primary:disabled{opacity:.45;box-shadow:none;filter:saturate(.6)}
.btn-ghost{background:var(--card);color:var(--ink2);border:1px solid var(--border2);box-shadow:0 1px 2px rgba(20,30,70,.05)}
.btn-ghost:hover{background:var(--blue-s);color:var(--blue);border-color:var(--blue-b);transform:translateY(-1px)}
.btn-danger-soft{background:color-mix(in srgb,var(--red) 9%,var(--card));color:var(--red);border:1px solid color-mix(in srgb,var(--red) 35%,transparent)}
.btn-danger-soft:hover{background:var(--red);color:#fff;border-color:var(--red);transform:translateY(-1px)}
.btn-success{background:linear-gradient(135deg,#16a34a,#22c55e);color:#fff;border:0;box-shadow:0 8px 20px -8px rgba(22,163,74,.6),inset 0 1px 0 rgba(255,255,255,.25)}
.btn-success:hover{transform:translateY(-2px);filter:brightness(1.05)}
.btn-xs{border-radius:10px;padding:6px 12px}
.dl-main-btn{min-height:56px;border-radius:18px;font-size:1.02rem}

/* ── Pilih Video / Audio (segmented) ── */
.type-switch{background:var(--bg2);border:1px solid var(--border);border-radius:16px;padding:4px;gap:4px}
.type-opt{border:0;border-radius:12px;color:var(--ink2);font-weight:700;transition:background-color .22s var(--btn-ease),border-color .22s var(--btn-ease),color .22s var(--btn-ease),box-shadow .22s var(--btn-ease),transform .22s var(--btn-ease)}
.type-opt:hover:not(.on){background:color-mix(in srgb,var(--blue) 8%,transparent);color:var(--ink)}
.type-opt.on{background:var(--grad);color:#fff;box-shadow:0 6px 16px -6px rgba(47,91,255,.7),inset 0 1px 0 rgba(255,255,255,.22)}

/* ── Kartu kualitas ── */
.q-btn{border:1.5px solid var(--border);border-radius:16px;background:var(--card);transition:background-color .2s var(--btn-ease),border-color .2s var(--btn-ease),color .2s var(--btn-ease),box-shadow .2s var(--btn-ease),transform .2s var(--btn-ease)}
.q-btn:hover{border-color:var(--blue-b);transform:translateY(-2px);box-shadow:0 10px 22px -12px rgba(47,91,255,.4)}
.q-btn:active{transform:scale(.98)}
.q-btn.on{border-color:var(--blue);background:linear-gradient(160deg,var(--blue-s),var(--card));box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 16%,transparent),0 10px 22px -12px rgba(47,91,255,.5)}

/* ── Filter FAQ (pil) ── */
.faq-filter{border:1px solid var(--border2);background:var(--card);color:var(--ink2);border-radius:999px;padding:8px 15px;font-weight:700;font-size:.78rem;transition:background-color .2s var(--btn-ease),border-color .2s var(--btn-ease),color .2s var(--btn-ease),box-shadow .2s var(--btn-ease),transform .2s var(--btn-ease)}
.faq-filter:hover{border-color:var(--blue-b);background:var(--blue-s);color:var(--blue);transform:translateY(-1px)}
.faq-filter.active{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 6px 16px -6px rgba(47,91,255,.7)}

/* ── Tempel / Hapus URL ── */
.url-paste{border:1px solid var(--blue-b);background:var(--blue-s);color:var(--blue);border-radius:11px;padding:8px 13px;transition:background-color .2s var(--btn-ease),border-color .2s var(--btn-ease),color .2s var(--btn-ease),box-shadow .2s var(--btn-ease),transform .2s var(--btn-ease)}
.url-paste:hover{background:var(--blue);color:#fff;border-color:var(--blue);transform:translateY(-1px)}
.url-clear{border-radius:50%;width:26px;height:26px;background:var(--bg2);color:var(--ink3);transition:background-color .18s,border-color .18s,color .18s}
.url-clear:hover{background:var(--red);color:#fff}

/* ── Tema & CTA nav ── */
.theme-toggle{width:40px;height:40px;border-radius:13px;background:var(--card);border:1px solid var(--border2);color:var(--ink2);box-shadow:0 1px 2px rgba(20,30,70,.05);transition:background-color .2s var(--btn-ease),border-color .2s var(--btn-ease),color .2s var(--btn-ease),box-shadow .2s var(--btn-ease),transform .2s var(--btn-ease)}
.theme-toggle:hover{background:var(--blue-s);border-color:var(--blue-b);color:var(--blue);transform:translateY(-1px) rotate(-8deg)}
.nav-cta{height:40px;border-radius:13px;background:var(--grad);color:#fff;padding:0 17px;box-shadow:0 8px 20px -8px rgba(47,91,255,.7),inset 0 1px 0 rgba(255,255,255,.22)}
.nav-cta:hover{transform:translateY(-2px);box-shadow:0 14px 26px -10px rgba(47,91,255,.75)}
.hist-del{border-radius:10px;transition:background-color .18s,border-color .18s,color .18s}

/* ═════════ Pemilih bahasa ═════════ */
.lang-toggle{display:none}
.lang-picker{position:relative}
.lp-btn{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 11px 0 12px;border-radius:13px;background:var(--card);border:1px solid var(--border2);color:var(--ink2);font:inherit;font-size:.78rem;font-weight:800;letter-spacing:.04em;cursor:pointer;box-shadow:0 1px 2px rgba(20,30,70,.05);transition:background-color .2s var(--btn-ease),border-color .2s var(--btn-ease),color .2s var(--btn-ease),box-shadow .2s var(--btn-ease),transform .2s var(--btn-ease)}
.lp-btn svg{width:17px;height:17px;flex:none}
.lp-btn .lp-chev{width:13px;height:13px;opacity:.65;transition:transform .25s var(--btn-ease)}
.lp-btn:hover,.lang-picker.open .lp-btn{background:var(--blue-s);border-color:var(--blue-b);color:var(--blue)}
.lang-picker.open .lp-chev{transform:rotate(180deg)}
.lp-backdrop{display:none}
.lp-menu{position:fixed;right:12px;top:64px;pointer-events:none;width:310px;max-width:calc(100vw - 24px);background:var(--card);border:1px solid var(--border);border-radius:20px;box-shadow:0 24px 60px -16px rgba(20,30,70,.4),0 4px 14px rgba(20,30,70,.08);padding:10px;z-index:200;opacity:0;visibility:hidden;transform:translateY(-8px) scale(.97);transform-origin:top right;transition:opacity .18s,transform .22s var(--btn-ease),visibility .18s}
.lp-layer.open .lp-menu{pointer-events:auto;opacity:1;visibility:visible;transform:none}
.lp-top{display:none}
.lp-search{position:relative;margin-bottom:6px}
.lp-search svg{position:absolute;left:12px;top:50%;width:16px;height:16px;transform:translateY(-50%);color:var(--ink3);pointer-events:none}
.lp-search input{width:100%;height:40px;padding:0 12px 0 36px;border-radius:12px;border:1px solid var(--border2);background:var(--bg2);color:var(--ink);font:inherit;font-size:.86rem;outline:none;transition:border-color .18s,box-shadow .18s}
.lp-search input:focus{border-color:var(--blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 18%,transparent);background:var(--card)}
.lp-list{list-style:none;margin:0;padding:0;max-height:min(340px,52vh);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.lp-head{position:sticky;top:0;z-index:1;background:var(--card);padding:9px 10px 5px;font-size:.66rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--ink3)}
.lp-item{display:flex;align-items:center;gap:11px;padding:8px 10px;border-radius:12px;cursor:pointer;outline:none;transition:background .15s}
.lp-item:hover,.lp-item:focus-visible{background:var(--blue-s)}
.lp-badge{flex:none;display:grid;place-items:center;width:36px;height:30px;border-radius:9px;background:var(--bg2);border:1px solid var(--border);font-size:.68rem;font-weight:800;letter-spacing:.04em;color:var(--ink2)}
.lp-names{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.lp-names b{font-size:.88rem;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-names small{font-size:.72rem;color:var(--ink3)}
.lp-item.on{background:linear-gradient(135deg,var(--blue-s),transparent)}
.lp-item.on .lp-badge{background:var(--grad);border-color:transparent;color:#fff}
.lp-item.on .lp-names b{color:var(--blue)}
.lp-check{width:17px;height:17px;flex:none;color:var(--blue)}
.lp-empty{padding:22px 10px;text-align:center;font-size:.84rem;color:var(--ink3)}
.lp-foot{margin-top:6px;padding:9px 10px 3px;border-top:1px solid var(--border);font-size:.7rem;color:var(--ink3);text-align:center}

/* Mobile: bottom sheet */
@media(max-width:600px){
  .lp-btn .lp-cur{display:none}
  .lp-btn{padding:0 10px;gap:5px}
  .lp-backdrop{display:block;pointer-events:none;position:fixed;inset:0;z-index:199;background:rgba(8,10,20,.5);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}
  .lp-layer.open .lp-backdrop{pointer-events:auto;opacity:1;visibility:visible}
  .lp-menu{position:fixed;left:0;right:0;top:auto;bottom:0;width:auto;max-width:none;border-radius:24px 24px 0 0;padding:8px 14px calc(14px + env(safe-area-inset-bottom,0px));transform:translateY(100%);transform-origin:bottom;transition:transform .3s var(--btn-ease),visibility .3s;opacity:1}
  .lp-layer.open .lp-menu{transform:none}
  .lp-menu::before{content:"";display:block;width:38px;height:4px;border-radius:9px;background:var(--border2);margin:2px auto 8px}
  .lp-top{display:flex;align-items:center;justify-content:space-between;padding:2px 4px 10px}
  .lp-title{font-size:1rem;font-weight:800;letter-spacing:-.02em;color:var(--ink)}
  .lp-x{width:32px;height:32px;border-radius:50%;border:0;background:var(--bg2);color:var(--ink2);display:grid;place-items:center;cursor:pointer}
  .lp-x svg{width:16px;height:16px}
  .lp-list{max-height:48vh}
}
html.lp-lock{overflow:hidden}
@media(min-width:601px){html.lp-lock{overflow:auto}}

/* ═════════ Sembunyikan UI bawaan Google Translate ═════════ */
#google_translate_element,.goog-te-banner-frame,.skiptranslate>iframe,iframe.skiptranslate,.goog-te-balloon-frame,#goog-gt-tt,.goog-tooltip,.goog-tooltip:hover{display:none!important}
body{top:0!important;position:relative}
.goog-text-highlight{background:none!important;box-shadow:none!important}
font[style]{vertical-align:baseline!important}
@media(prefers-reduced-motion:reduce){.btn,.type-opt,.q-btn,.lp-menu,.lp-btn .lp-chev,.theme-toggle{transition:none}}

/* Ikon/spinner/banner melayang Google Translate (G文) — disembunyikan total */
[class*="VIpgJd-ZVi9od"],[class*="VIpgJd-yAWNEb"],[class*="VIpgJd-suEOdc"],body>.skiptranslate,.goog-te-gadget-icon,.goog-te-spinner-pos,.goog-te-menu-frame,#goog-gt-tt{display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important;width:0!important;height:0!important}
html{height:auto!important}