.header-right{ display:flex; align-items:center; gap:18px; }

.nav-controls{ display:flex; align-items:center; gap:14px; }

.theme-toggle{
  display:flex; align-items:center; justify-content:center;
  width:34px; height:34px; border:none; border-radius:999px;
  background:rgba(0,0,0,.05); color:#f5a623; cursor:pointer;
  transition:background .25s ease;
}
.theme-toggle:hover{ background:rgba(0,0,0,.1); }
.theme-toggle .ic-moon{ display:none; }

.lang-switch{ display:flex; align-items:center; gap:6px; font-size:14px; font-weight:600; }
.lang-switch a{ color:#7a7a7a; text-decoration:none; transition:color .25s; }
.lang-switch a:hover, .lang-switch a.is-active{ color:#111; }
.lang-switch .sep{ color:#bbb; }

.diskusi-btn{
  display:inline-flex; align-items:center; gap:7px;
  background:#19c0c9; color:#fff; text-decoration:none;
  font-size:14px; font-weight:600; padding:9px 16px; border-radius:999px;
  box-shadow:0 4px 14px rgba(25,192,201,.35);
  transition:transform .2s ease, box-shadow .2s ease;
}
.diskusi-btn:hover{ transform:translateY(-1px); box-shadow:0 6px 18px rgba(25,192,201,.45); }

/* ===== dark mode (header) ===== */
:root.dark body{ background:#0f1115; color:#e8e8e8; }
:root.dark .header-inner{ background:#161a20; }
:root.dark .main-menu a{ color:#e8e8e8; }
:root.dark .theme-toggle{ background:rgba(255,255,255,.08); }
:root.dark .theme-toggle .ic-sun{ display:none; }
:root.dark .theme-toggle .ic-moon{ display:block; color:#cbd5e1; }
:root.dark .lang-switch a:hover, :root.dark .lang-switch a.is-active{ color:#fff; }