body{background:transparent!important;color:var(--t1)!important;font-family:'Inter',system-ui,sans-serif!important}

/* Doc vars that map to base.html theme vars */
.sidebar{position:sticky;top:80px}
.sidebar a{display:block;padding:6px 12px;color:var(--t2);text-decoration:none;font-size:.88rem;border-left:2px solid transparent;border-radius:0 6px 6px 0;transition:all .15s}
.sidebar a:hover,.sidebar a.active{color:var(--accent);border-left-color:var(--accent);background:rgba(15,118,110,.06)}
.sidebar .sidebar-title{font-weight:600;font-size:.78rem;text-transform:uppercase;letter-spacing:.5px;color:var(--t3);padding:6px 12px;margin-top:16px}

.doc-section{padding-top:24px;margin-bottom:32px}
.doc-section h2{font-size:1.4rem;font-weight:700;color:var(--accent);margin-bottom:12px;padding-bottom:8px;border-bottom:2px solid var(--glass-b)}
.doc-section h3{font-size:1.1rem;font-weight:600;color:var(--t1);margin-top:20px;margin-bottom:8px}
.doc-section p,.doc-section li{font-size:.92rem;line-height:1.7;color:var(--t1)}
.doc-section code{background:var(--glass);border:1px solid var(--glass-b);padding:2px 6px;border-radius:4px;font-size:.84rem;color:var(--accent)}

.platform-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.platform-item{
  background:var(--glass);border:1px solid var(--glass-b);border-radius:10px;padding:16px;
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  box-shadow:0 1px 3px rgba(0,0,0,.06);height:100%;
}
[data-theme="dark"] .platform-item{box-shadow:0 1px 3px rgba(0,0,0,.25)}
[data-theme="dark"] .sociabuzz-icon{filter:brightness(0) invert(1)}
.platform-item h5{font-size:.95rem;font-weight:600;margin-bottom:4px;color:var(--t1)}
.platform-item p{font-size:.82rem;color:var(--t2);margin-bottom:0}

.changelog-item{
  background:var(--glass);border:1px solid var(--glass-b);border-radius:10px;padding:16px;margin-bottom:12px;
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
.changelog-item .cl-version{font-weight:700;color:var(--accent);font-size:1rem}
.changelog-item .cl-date{font-size:.8rem;color:var(--t3)}
.changelog-item ul{margin-bottom:0;padding-left:20px}
.changelog-item li{font-size:.88rem;margin-bottom:4px;color:var(--t1)}

.badge-new{background:#22c55e;color:#fff;font-size:.68rem;padding:2px 6px;border-radius:4px;font-weight:600}
.badge-remove{background:#ef4444;color:#fff;font-size:.68rem;padding:2px 6px;border-radius:4px;font-weight:600}
.badge-fix{background:#f59e0b;color:#fff;font-size:.68rem;padding:2px 6px;border-radius:4px;font-weight:600}
.badge-improve{background:#3b82f6;color:#fff;font-size:.68rem;padding:2px 6px;border-radius:4px;font-weight:600}

hr{border-color:var(--glass-b)!important}

.kompas-logo{filter:brightness(0)}
[data-theme="dark"] .kompas-logo{filter:none}

.dark-invert{filter:none}
[data-theme="dark"] .dark-invert{filter:invert(1)}

/* Dark mode contrast fixes */
[data-theme="dark"] .doc-section code{
  background:rgba(15,118,110,.14);
  border-color:rgba(94,234,212,.3);
  color:#5eead4;
}
[data-theme="dark"] .doc-section h2{
  color:#5eead4;
}

/* Bilingual: same layout, text swaps with the navbar language toggle */
.lang-en{display:none}
[data-lang="en"] .lang-id{display:none}
[data-lang="en"] .lang-en{display:block}
