/**
 * Portal light / dark appearance.
 * html[data-portal-theme="light"|"dark"] — mode in data-portal-theme-mode (light|dark|auto).
 */
:root {
  --portal-heading: #1a2332;
}

html[data-portal-theme="dark"] {
  --portal-bg: #0f1114;
  --portal-surface: #1a1d23;
  --portal-text: #eceff4;
  --portal-muted: #b4bac4;
  --portal-border: #2d333b;
  --portal-heading: #eef5fc;
  --portal-link: #6ec9f5;
  --portal-link-hover: #b6e6ff;
  --portal-nav-bg: #151922;
  --portal-nav-text: #f0f2f5;
  --portal-nav-active-bg: #00b4e5;
  --portal-nav-active-text: #0f172a;
  --portal-input-bg: #22262e;
  --portal-input-text: #e8eaed;
  --portal-table-stripe: rgba(255, 255, 255, 0.04);
}

html[data-portal-theme="dark"] body.sewan-body {
  background-color: var(--portal-bg) !important;
  color: var(--portal-text);
}

/* Geen linkkleur op .btn — anders worden statusknoppen fel/cyan */
html[data-portal-theme="dark"] .container > .row a:not(.btn),
html[data-portal-theme="dark"] .col-xs-9 a:not(.btn),
html[data-portal-theme="dark"] .col-xs-6 a:not(.btn),
html[data-portal-theme="dark"] .col-xs-3 a:not(.btn) {
  color: var(--portal-link);
}

html[data-portal-theme="dark"] .container > .row a:not(.btn):hover,
html[data-portal-theme="dark"] .col-xs-9 a:not(.btn):hover {
  color: var(--portal-link-hover);
}

/* Porting-overzicht: statusflow in nachtmodus */
html[data-portal-theme="dark"] .sewan-status-flow {
  --sf-line: #38bdf8;
  background: var(--portal-surface);
  border-color: var(--portal-border);
}
html[data-portal-theme="dark"] .sewan-status-chip {
  background: var(--portal-surface);
}
html[data-portal-theme="dark"] .col-xs-9 a.sewan-status-chip,
html[data-portal-theme="dark"] .sewan-status-chip {
  background: var(--portal-surface);
  border-color: var(--portal-border);
  color: var(--portal-text);
}
html[data-portal-theme="dark"] .col-xs-9 a.sewan-status-chip:hover,
html[data-portal-theme="dark"] .col-xs-9 a.sewan-status-chip:focus,
html[data-portal-theme="dark"] .sewan-status-chip:hover,
html[data-portal-theme="dark"] .sewan-status-chip:focus {
  color: var(--portal-text);
  border-color: var(--sewan-accent);
}
html[data-portal-theme="dark"] .sewan-status-chip__count {
  background: rgba(255, 255, 255, 0.08);
  color: var(--portal-muted);
}
html[data-portal-theme="dark"] .sewan-status-chip.active {
  background: rgba(0, 180, 229, 0.14);
  box-shadow: 0 0 0 2px rgba(0, 180, 229, 0.28);
}
html[data-portal-theme="dark"] .sewan-table-scroll,
html[data-portal-theme="dark"] .sewan-empty-state {
  background: var(--portal-surface);
  border-color: var(--portal-border);
}
html[data-portal-theme="dark"] .sewan-state-pill {
  background: rgba(255, 255, 255, 0.06);
  border-color: var(--portal-border);
  color: var(--portal-text);
}
html[data-portal-theme="dark"] .sewan-rules-summary__line,
html[data-portal-theme="dark"] .sewan-rules-panel__body p {
  color: var(--portal-text);
}

html[data-portal-theme="dark"] .text-muted {
  color: var(--portal-muted) !important;
}

html[data-portal-theme="dark"] .sewan-card {
  background-color: var(--portal-surface);
  border: 1px solid var(--portal-border);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.25);
}

html[data-portal-theme="dark"] .nav-pills > li > a {
  background-color: var(--portal-nav-bg);
  color: var(--portal-nav-text);
  border: 1px solid var(--portal-border);
}

html[data-portal-theme="dark"] .nav-pills > li > a:hover,
html[data-portal-theme="dark"] .nav-pills > li > a:focus {
  background-color: var(--portal-surface);
  color: var(--portal-link-hover);
}

html[data-portal-theme="dark"] .nav-pills > li.active > a,
html[data-portal-theme="dark"] .nav-pills > li.active > a:hover,
html[data-portal-theme="dark"] .nav-pills > li.active > a:focus {
  background-color: var(--portal-nav-active-bg);
  color: var(--portal-nav-active-text);
  border-color: var(--portal-nav-active-bg);
}

html[data-portal-theme="dark"] .nav-pills > li > a .nav-sidebar-count {
  color: rgba(255, 255, 255, 0.55);
  opacity: 1;
}

html[data-portal-theme="dark"] .nav-pills > li.active > a .nav-sidebar-count {
  color: rgba(15, 23, 42, 0.65);
}

html[data-portal-theme="dark"] .sewan-nav-group__label {
  color: var(--portal-muted);
}
html[data-portal-theme="dark"] .sewan-sidebar-panel {
  background: var(--portal-surface);
  border-color: var(--portal-border);
}
html[data-portal-theme="dark"] .sewan-nav-toggle {
  background: var(--portal-surface);
  border-color: var(--portal-border);
  color: var(--portal-text);
}
html[data-portal-theme="dark"] .sewan-nav-collapse {
  background: var(--portal-input-bg, #1a1f27);
  border-color: var(--portal-border);
  color: var(--portal-text);
}
html[data-portal-theme="dark"] .sewan-nav-collapse:hover {
  border-color: var(--sewan-accent);
  color: var(--portal-text);
  background: rgba(0, 180, 229, 0.12);
}
html[data-portal-theme="dark"] .sewan-sidebar-nav {
  background: var(--portal-surface);
  border-color: var(--portal-border);
}
html[data-portal-theme="dark"] .sewan-layout-row.is-nav-collapsed .sewan-sidebar-nav {
  border-color: rgba(0, 180, 229, 0.4);
}
html[data-portal-theme="dark"] .sewan-nav-rail-label {
  color: var(--sewan-accent);
}
html[data-portal-theme="dark"] .sewan-layout-row.is-nav-collapsed .nav-sidebar-count {
  background: var(--sewan-accent);
  color: #0c1929;
}
html[data-portal-theme="dark"] .sewan-body .btn:focus-visible,
html[data-portal-theme="dark"] .sewan-body .nav-pills > li > a:focus-visible,
html[data-portal-theme="dark"] .sewan-body a:focus-visible {
  outline-color: var(--sewan-accent);
}

html[data-portal-theme="dark"] .sewan-state-pill--pending {
  color: #93c5fd;
  background: rgba(37, 99, 235, 0.22);
  border-color: rgba(37, 99, 235, 0.45);
}
html[data-portal-theme="dark"] .sewan-state-pill--info {
  color: #7dd3fc;
  background: rgba(2, 132, 199, 0.22);
  border-color: rgba(2, 132, 199, 0.45);
}
html[data-portal-theme="dark"] .sewan-state-pill--warning {
  color: #fcd34d;
  background: rgba(217, 119, 6, 0.22);
  border-color: rgba(217, 119, 6, 0.45);
}
html[data-portal-theme="dark"] .sewan-state-pill--success {
  color: #6ee7b7;
  background: rgba(5, 150, 105, 0.22);
  border-color: rgba(5, 150, 105, 0.45);
}
html[data-portal-theme="dark"] .sewan-state-pill--danger {
  color: #fca5a5;
  background: rgba(220, 38, 38, 0.22);
  border-color: rgba(220, 38, 38, 0.45);
}
html[data-portal-theme="dark"] .sewan-inline-loading {
  color: var(--portal-muted);
}
html[data-portal-theme="dark"] .sewan-detail-title,
html[data-portal-theme="dark"] .sewan-detail-section__title {
  color: var(--portal-text);
}
html[data-portal-theme="dark"] .sewan-detail-numbers,
html[data-portal-theme="dark"] .sewan-detail-subsection {
  color: var(--portal-muted);
}
html[data-portal-theme="dark"] .sewan-due-date {
  color: #fcd34d;
  background: rgba(217, 119, 6, 0.22);
  border-color: rgba(217, 119, 6, 0.45);
}
html[data-portal-theme="dark"] .sewan-kv__row {
  border-bottom-color: var(--portal-border);
}
html[data-portal-theme="dark"] .sewan-detail-highlights {
  border-top-color: var(--portal-border);
}

html[data-portal-theme="dark"] .panel {
  background-color: var(--portal-surface);
  border-color: var(--portal-border);
}

html[data-portal-theme="dark"] .panel-default > .panel-heading {
  background-color: #22262e;
  border-color: var(--portal-border);
  color: var(--portal-text);
}

html[data-portal-theme="dark"] .table {
  color: var(--portal-text);
}

html[data-portal-theme="dark"] .table > thead > tr > th,
html[data-portal-theme="dark"] .table > tbody > tr > td {
  border-color: var(--portal-border);
}

html[data-portal-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) {
  background-color: var(--portal-table-stripe);
}

html[data-portal-theme="dark"] .form-control {
  background-color: var(--portal-input-bg);
  color: var(--portal-input-text);
  border-color: var(--portal-border);
}

html[data-portal-theme="dark"] .well {
  background-color: var(--portal-surface);
  border-color: var(--portal-border);
  color: var(--portal-text);
}

html[data-portal-theme="dark"] footer.row {
  border-top: 1px solid var(--portal-border);
  padding-top: 12px;
  margin-top: 24px;
  color: var(--portal-muted);
}

html[data-portal-theme="dark"] .alert-info {
  background-color: rgba(0, 180, 229, 0.14);
  border-color: rgba(0, 180, 229, 0.4);
  color: var(--portal-text);
}

html[data-portal-theme="dark"] .btn-default {
  background-color: var(--portal-surface);
  color: var(--portal-text);
  border-color: var(--portal-border);
}

html[data-portal-theme="dark"] .sewan-form-page h3 {
  color: var(--portal-heading);
  border-bottom-color: rgba(0, 180, 229, 0.4);
}

html[data-portal-theme="dark"] .api-code-tab {
  background: var(--portal-surface);
  color: var(--portal-text);
  border-color: var(--portal-border);
}
html[data-portal-theme="dark"] .api-code-tab.is-active {
  background: var(--portal-heading, #e8eef5);
  border-color: var(--portal-heading, #e8eef5);
  color: #0f1720;
}
html[data-portal-theme="dark"] .api-docs-section h4 {
  color: var(--portal-heading);
}

html[data-portal-theme="dark"] h1:not(.sewan-topbar-title),
html[data-portal-theme="dark"] h2,
html[data-portal-theme="dark"] h3:not(.sewan-topbar-title) {
  color: var(--portal-heading);
}

html[data-portal-theme="dark"] .modal-content {
  background-color: var(--portal-surface);
  border-color: var(--portal-border);
  color: var(--portal-text);
}
html[data-portal-theme="dark"] .sewan-bug-report-trigger {
  background: var(--sewan-accent);
  color: #0c1929;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.38);
}
html[data-portal-theme="dark"] .sewan-bug-report-trigger:hover,
html[data-portal-theme="dark"] .sewan-bug-report-trigger:focus {
  background: #6eddf7;
  color: #0c1929;
}
html[data-portal-theme="dark"] .sewan-bug-report-context,
html[data-portal-theme="dark"] #sewan-bug-report-modal .help-block {
  color: var(--portal-muted);
}
html[data-portal-theme="dark"] .sewan-maintenance-banner,
html[data-portal-theme="dark"] .sewan-maintenance-modal-state {
  background: rgba(217, 119, 6, 0.2);
  color: #ffe2a8;
}
html[data-portal-theme="dark"] .sewan-impersonation-banner {
  background: rgba(180, 35, 24, 0.22);
  color: #ffc9c5;
}
html[data-portal-theme="dark"] .sewan-document-list {
  background: var(--portal-surface);
}
html[data-portal-theme="dark"] .sewan-document-row {
  color: var(--portal-text);
}
html[data-portal-theme="dark"] .sewan-document-row + .sewan-document-row {
  border-top-color: var(--portal-border);
}
html[data-portal-theme="dark"] .sewan-document-row:hover,
html[data-portal-theme="dark"] .sewan-document-row:focus {
  background: rgba(0, 180, 229, 0.12);
  color: var(--portal-text);
}
html[data-portal-theme="dark"] .sewan-document-row__icon {
  background: rgba(0, 180, 229, 0.18);
  color: #9be7f8;
}
html[data-portal-theme="dark"] .sewan-document-row__action {
  color: var(--portal-link);
}
html[data-portal-theme="dark"] .modal-header,
html[data-portal-theme="dark"] .modal-footer {
  border-color: var(--portal-border);
}

html[data-portal-theme="dark"] .dropdown-menu {
  background-color: var(--portal-surface);
  border-color: var(--portal-border);
}

html[data-portal-theme="dark"] .dropdown-menu > li > a {
  color: var(--portal-text);
}

/* Taal/thema zitten in .sewan-topbar; tegelstijl daar staat in sewan-theme.css. */