/* SIAP v2.7 — configurable palettes, strict verification, readable dark mode */

html[data-palette="ocean"]{
  --langkat-950:#17233b;--langkat-900:#1d3154;--langkat-800:#2958a5;--langkat-700:#2f6fed;--langkat-600:#4d86ee;--langkat-500:#72a5f4;--langkat-100:#dce9ff;--langkat-50:#f2f7ff;
  --gold-700:#266da8;--gold-600:#3a8ac7;--gold-500:#72b7f2;--gold-200:#cce9fb;--gold-50:#f0f9ff;
  --primary:#2f6fed;--primary-hover:#245bc8;--primary-soft:#eef4ff;
  --page:#f3f6fb;--surface-alt:#f7f9fc;--border:#dce3ee;--border-strong:#c5cfdf;
  --sidebar-start:#17233b;--sidebar-end:#111a2c;--accent:#72b7f2;--browser-theme-color:#2f6fed;
}
html[data-palette="indigo"]{
  --langkat-950:#25203e;--langkat-900:#302956;--langkat-800:#5146bd;--langkat-700:#6657e8;--langkat-600:#7c6eef;--langkat-500:#a99af7;--langkat-100:#e6e1ff;--langkat-50:#f6f4ff;
  --gold-700:#6454ca;--gold-600:#8575de;--gold-500:#a99af7;--gold-200:#ddd7ff;--gold-50:#f7f5ff;
  --primary:#6657e8;--primary-hover:#5146bd;--primary-soft:#f2f0ff;
  --page:#f6f5fb;--surface-alt:#f9f8fc;--border:#e0ddea;--border-strong:#cbc5dd;
  --sidebar-start:#25203e;--sidebar-end:#19152d;--accent:#a99af7;--browser-theme-color:#6657e8;
}
html[data-palette="rose"]{
  --langkat-950:#30222c;--langkat-900:#432d3b;--langkat-800:#98405f;--langkat-700:#bf5276;--langkat-600:#cf6b8d;--langkat-500:#e8a0b8;--langkat-100:#f5dce5;--langkat-50:#fff5f8;
  --gold-700:#a64969;--gold-600:#c96b8b;--gold-500:#e8a0b8;--gold-200:#f6d6e1;--gold-50:#fff5f8;
  --primary:#bf5276;--primary-hover:#9e405f;--primary-soft:#fff0f5;
  --page:#f9f5f7;--surface-alt:#fcf8fa;--border:#eadde3;--border-strong:#dac6cf;
  --sidebar-start:#30222c;--sidebar-end:#21171e;--accent:#e8a0b8;--browser-theme-color:#bf5276;
}
html[data-palette="cyan"]{
  --langkat-950:#18272d;--langkat-900:#20343c;--langkat-800:#116d82;--langkat-700:#1686a0;--langkat-600:#35a1b8;--langkat-500:#78c9da;--langkat-100:#d7f0f5;--langkat-50:#f0fafc;
  --gold-700:#277d90;--gold-600:#48a4b7;--gold-500:#78c9da;--gold-200:#ccebf1;--gold-50:#f0fafc;
  --primary:#1686a0;--primary-hover:#116d82;--primary-soft:#edf9fb;
  --page:#f2f7f8;--surface-alt:#f7fafb;--border:#d9e5e8;--border-strong:#c2d4d9;
  --sidebar-start:#18272d;--sidebar-end:#101d22;--accent:#78c9da;--browser-theme-color:#1686a0;
}

.sidebar{background:linear-gradient(180deg,var(--sidebar-start),var(--sidebar-end) 78%,color-mix(in srgb,var(--sidebar-end) 86%,#000))}
.sidebar::before{background:radial-gradient(circle at 18% 9%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 27%),radial-gradient(circle at 100% 74%,color-mix(in srgb,var(--primary) 14%,transparent),transparent 34%)}
.brand-mark svg{fill:var(--accent)}.brand-mark svg path+path{fill:var(--sidebar-start)}
.nav-item.is-active{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 22%,transparent),color-mix(in srgb,var(--accent) 8%,transparent));box-shadow:inset 3px 0 0 var(--accent)}
.nav-item.is-active .icon,.nav-dot{color:var(--accent);background:var(--accent)}
.notification-pulse{background:var(--accent)}
.btn-primary{background:linear-gradient(135deg,var(--primary),color-mix(in srgb,var(--primary) 82%,#111827));box-shadow:0 9px 22px color-mix(in srgb,var(--primary) 20%,transparent)}
.btn-primary:hover{background:linear-gradient(135deg,var(--primary-hover),var(--primary));box-shadow:0 12px 28px color-mix(in srgb,var(--primary) 28%,transparent)}

/* Verifikasi: aturan visual dan validasi */
.verification-validation{margin:13px 0;padding:11px 12px;border:1px solid color-mix(in srgb,var(--danger-600) 34%,var(--border));border-radius:11px;background:color-mix(in srgb,var(--danger-50) 78%,var(--surface));color:var(--danger-700)}
.verification-validation strong{font-size:10.5px}.verification-validation ul{margin:6px 0 0;padding-left:18px}.verification-validation li{font-size:9.5px;line-height:1.55}
.verification-rule-note{display:grid;gap:4px;margin-top:12px;padding:10px 11px;border:1px solid var(--border);border-radius:11px;background:var(--surface-alt)}
.verification-rule-note strong{font-size:9.5px;color:var(--text)}.verification-rule-note span{font-size:8.8px;line-height:1.45;color:var(--text-muted)}.verification-rule-note b{color:var(--text)}
.field-conditional{margin-left:5px;padding:3px 6px;border-radius:999px;background:var(--surface-alt);color:var(--text-muted);font-size:7.5px;font-weight:750}
.verification-check-note small{display:block;margin-top:4px;color:var(--text-muted);font-size:8px}
.verification-check-note input[aria-invalid="true"],.verification-main-note textarea[aria-invalid="true"]{border-color:var(--danger-600)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--danger-600) 12%,transparent)!important}
.verification-check-row.is-checked .check-note-toggle,.verification-check-row.is-checked .verification-check-note{display:none!important}
.verification-check-row.is-unchecked{border-color:color-mix(in srgb,var(--warning-600) 24%,var(--border))}
.approve-lock-hint{margin:8px 0 0;text-align:center;color:var(--text-muted);font-size:8.5px}
.btn:disabled,.btn[disabled]{cursor:not-allowed;opacity:.48;transform:none!important;box-shadow:none!important;filter:saturate(.55)}
.note-box-danger{border-color:color-mix(in srgb,var(--danger-600) 28%,var(--border));background:color-mix(in srgb,var(--danger-50) 75%,var(--surface));color:var(--danger-700)}

/* Halaman pengaturan tema */
.theme-page-toolbar{margin-bottom:16px}.theme-page-toolbar h2{margin:3px 0 2px}.theme-page-toolbar p{margin:0;color:var(--text-muted)}
.theme-settings-form{display:grid;gap:16px;padding-bottom:84px}.theme-settings-panel{overflow:hidden}.theme-section-header{padding:18px}.theme-section-header h3,.theme-mode-panel h3{margin:3px 0 2px}.theme-section-header p,.theme-mode-panel p{margin:0;color:var(--text-muted);font-size:10px}
.theme-preset-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:16px;border-top:1px solid var(--border);background:var(--surface-alt)}
.theme-preset-card{position:relative;display:grid;gap:11px;padding:11px;border:1.5px solid var(--border);border-radius:15px;background:var(--surface);cursor:pointer;transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease;min-width:0}
.theme-preset-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--preview-primary) 42%,var(--border));box-shadow:var(--shadow-md)}
.theme-preset-card>input{position:absolute;opacity:0;pointer-events:none}.theme-preset-card:has(input:checked){border-color:var(--preview-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--preview-primary) 12%,transparent),var(--shadow-md)}
.theme-preset-check{position:absolute;right:18px;top:18px;z-index:2;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--preview-primary);color:#fff;opacity:0;transform:scale(.7);transition:.16s ease}.theme-preset-card:has(input:checked) .theme-preset-check{opacity:1;transform:scale(1)}.theme-preset-check .icon{width:12px;height:12px}
.theme-preview{display:grid;grid-template-columns:32px 1fr;height:92px;border-radius:11px;overflow:hidden;background:#f6f8fb;border:1px solid color-mix(in srgb,var(--preview-sidebar) 12%,#d9e0ea)}
.theme-preview-sidebar{background:var(--preview-sidebar)}.theme-preview-content{display:grid;align-content:center;gap:8px;padding:12px;background:linear-gradient(180deg,#fff,#f5f7fb)}.theme-preview-content b{display:block;height:11px;border-radius:5px;background:#e5eaf1}.theme-preview-content b:first-child{width:62%;background:var(--preview-primary)}.theme-preview-content b:last-child{width:78%;background:color-mix(in srgb,var(--preview-accent) 42%,#e5eaf1)}
.theme-preset-copy{display:grid;gap:4px;min-width:0}.theme-preset-copy strong{font-size:11.5px}.theme-preset-copy small{min-height:38px;color:var(--text-muted);font-size:8.8px;line-height:1.45}
.theme-swatch-row{display:flex;gap:5px}.theme-swatch-row i{width:20px;height:7px;border-radius:99px;background:var(--preview-sidebar)}.theme-swatch-row i:nth-child(2){background:var(--preview-primary)}.theme-swatch-row i:nth-child(3){background:var(--preview-accent)}
.theme-mode-panel{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px}.theme-mode-options{display:flex;gap:8px;flex-wrap:wrap}.theme-mode-option{position:relative}.theme-mode-option input{position:absolute;opacity:0}.theme-mode-option span{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 14px;border:1px solid var(--border);border-radius:10px;background:var(--surface);font-size:10px;font-weight:750;cursor:pointer}.theme-mode-option input:checked+span{border-color:var(--primary);background:var(--primary-soft);color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 10%,transparent)}
.theme-sticky-actions{z-index:35}

/* Dark mode — semua komponen tetap memiliki kontras yang jelas */
html[data-theme="dark"]{
  --page:#0d1119;--surface:#171c27;--surface-alt:#111620;--surface-raised:#1c2230;--border:#2b3444;--border-strong:#414c60;
  --text:#f1f4f9;--text-muted:#b1bac9;--text-soft:#8792a4;--primary-soft:color-mix(in srgb,var(--primary) 17%,#171c27);
  --ink-950:#f4f7fb;--ink-900:#edf1f7;--ink-800:#dce2eb;--ink-700:#c5ceda;--ink-600:#aab5c4;--ink-500:#909cac;--ink-400:#738094;--ink-300:#505d70;--ink-200:#354052;--ink-100:#242c3a;--ink-50:#1b222e;
  --browser-theme-color:#111620;
}
html[data-theme="dark"][data-palette="ocean"]{--primary:#78a7ff;--primary-hover:#9bbdff;--accent:#72b7f2}
html[data-theme="dark"][data-palette="indigo"]{--primary:#a99af7;--primary-hover:#c4baff;--accent:#a99af7}
html[data-theme="dark"][data-palette="rose"]{--primary:#ee9bb7;--primary-hover:#f7b7cc;--accent:#e8a0b8}
html[data-theme="dark"][data-palette="cyan"]{--primary:#78c9da;--primary-hover:#9bdbe7;--accent:#78c9da}
html[data-theme="dark"] body,html[data-theme="dark"] .page-content{background:var(--page);color:var(--text)}
html[data-theme="dark"] .topbar{background:color-mix(in srgb,var(--surface) 92%,transparent)}
html[data-theme="dark"] .panel,html[data-theme="dark"] .modal,html[data-theme="dark"] dialog,html[data-theme="dark"] .card,html[data-theme="dark"] .table-shell,html[data-theme="dark"] .admin-workspace{background:var(--surface);color:var(--text);border-color:var(--border)}
html[data-theme="dark"] input,html[data-theme="dark"] select,html[data-theme="dark"] textarea{background:var(--surface-alt);color:var(--text);border-color:var(--border-strong)}
html[data-theme="dark"] input::placeholder,html[data-theme="dark"] textarea::placeholder{color:var(--text-soft);opacity:1}
html[data-theme="dark"] select option{background:#171c27;color:#f1f4f9}
html[data-theme="dark"] label,html[data-theme="dark"] h1,html[data-theme="dark"] h2,html[data-theme="dark"] h3,html[data-theme="dark"] h4,html[data-theme="dark"] strong,html[data-theme="dark"] .table td,html[data-theme="dark"] .table th{color:var(--text)}
html[data-theme="dark"] small,html[data-theme="dark"] p,html[data-theme="dark"] .panel-eyebrow,html[data-theme="dark"] .breadcrumb,html[data-theme="dark"] .field-conditional{color:var(--text-muted)}
html[data-theme="dark"] .verification-pdf-toolbar,html[data-theme="dark"] .verification-pdf-footer,html[data-theme="dark"] .verification-check-row,html[data-theme="dark"] .spm-checklist-faq,html[data-theme="dark"] .spm-checklist-faq-item{background:var(--surface);border-color:var(--border)}
html[data-theme="dark"] .verification-checklist-scroll,html[data-theme="dark"] .spm-checklist-faq-body,html[data-theme="dark"] .verification-summary-grid>div{background:var(--surface-alt)}
html[data-theme="dark"] .verification-check-row.is-checked{background:color-mix(in srgb,var(--primary) 12%,var(--surface));border-color:color-mix(in srgb,var(--primary) 40%,var(--border))}
html[data-theme="dark"] .verification-check-row.is-unchecked{background:color-mix(in srgb,var(--warning-700) 10%,var(--surface));border-color:color-mix(in srgb,var(--warning-600) 42%,var(--border))}
html[data-theme="dark"] .verification-validation{background:color-mix(in srgb,var(--danger-700) 14%,var(--surface));color:#ffb4ac}
html[data-theme="dark"] .btn-secondary,html[data-theme="dark"] .icon-btn{background:var(--surface-raised);color:var(--text);border-color:var(--border-strong)}
html[data-theme="dark"] .btn-ghost{color:var(--text-muted)}
html[data-theme="dark"] .btn-primary{color:#fff}
html[data-theme="dark"] .badge-neutral{background:#2b3444;color:#dce2eb}
html[data-theme="dark"] .theme-preview{border-color:#354052}.theme-preview-content{color:#111827}
html[data-theme="dark"] .theme-preset-card,html[data-theme="dark"] .theme-mode-option span{background:var(--surface-raised)}
html[data-theme="dark"] .action-confirm-dialog .modal-body,html[data-theme="dark"] .pdf-modal-card{background:var(--surface);color:var(--text)}
html[data-theme="dark"] .toast{background:var(--surface-raised);color:var(--text);border-color:var(--border-strong)}

@media(max-width:1100px){.theme-preset-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.theme-preset-grid{grid-template-columns:1fr}.theme-mode-panel{align-items:flex-start;flex-direction:column}.theme-mode-options,.theme-mode-option{width:100%}.theme-mode-option span{width:100%}.theme-settings-form{padding-bottom:104px}}