/* admin/assets/admin-bootstrap.css — Bootstrap 5.3 -sidonta tokeneihin (ADMIN_UI_PLAN luku 3.3).
   Ladataan Bootstrapin JÄLKEEN. Yliajaa Bootstrapin omat muuttujat ja kovakoodatut
   pääväriarvot (#0d6efd), jotta olemassa olevat btn-primary / form-control / card / table /
   badge / nav-tabs -merkinnät vaihtavat ilmettä ilman markup-muutoksia. */

:root, [data-bs-theme=light], [data-bs-theme=dark] {
  --bs-body-font-family: var(--sb-font);
  --bs-body-font-size: var(--sb-fs-md);
  --bs-body-line-height: var(--sb-lh);
  --bs-body-bg: var(--sb-bg);          --bs-body-bg-rgb: 246,247,249;
  --bs-body-color: var(--sb-ink);
  --bs-emphasis-color: var(--sb-ink);
  --bs-secondary-color: var(--sb-ink-muted);
  --bs-tertiary-color: var(--sb-ink-faint);
  --bs-secondary-bg: var(--sb-surface-2);
  --bs-tertiary-bg: var(--sb-surface-2);
  --bs-heading-color: var(--sb-ink);
  --bs-primary: var(--sb-accent);      --bs-primary-rgb: var(--sb-accent-rgb);
  --bs-success: var(--sb-accent);      --bs-success-rgb: var(--sb-accent-rgb);
  --bs-link-color: var(--sb-accent-ink);       --bs-link-color-rgb: var(--sb-accent-rgb);
  --bs-link-hover-color: var(--sb-accent-dark); --bs-link-hover-color-rgb: var(--sb-accent-rgb);
  --bs-link-decoration: none;
  --bs-border-color: var(--sb-line);
  --bs-border-color-translucent: var(--sb-line);
  --bs-border-radius: var(--sb-radius-sm);
  --bs-border-radius-sm: 6px;
  --bs-border-radius-lg: var(--sb-radius);
  --bs-border-radius-xl: var(--sb-radius-lg);
  --bs-box-shadow-sm: var(--sb-shadow-sm);
  --bs-box-shadow: var(--sb-shadow-md);
  --bs-box-shadow-lg: var(--sb-shadow-lg);
  --bs-code-color: var(--sb-ink-soft);
  --bs-focus-ring-color: rgba(var(--sb-accent-rgb), .35);
  --bs-highlight-bg: var(--sb-warn-bg);
  /* Semanttiset alert-/subtle-sävyt tokeneista */
  --bs-primary-bg-subtle: var(--sb-ok-bg);    --bs-primary-text-emphasis: var(--sb-ok-ink);    --bs-primary-border-subtle: var(--sb-ok-line);
  --bs-success-bg-subtle: var(--sb-ok-bg);    --bs-success-text-emphasis: var(--sb-ok-ink);    --bs-success-border-subtle: var(--sb-ok-line);
  --bs-warning-bg-subtle: var(--sb-warn-bg);  --bs-warning-text-emphasis: var(--sb-warn-ink);  --bs-warning-border-subtle: var(--sb-warn-line);
  --bs-danger-bg-subtle: var(--sb-err-bg);    --bs-danger-text-emphasis: var(--sb-err-ink);    --bs-danger-border-subtle: var(--sb-err-line);
  --bs-info-bg-subtle: var(--sb-info-bg);     --bs-info-text-emphasis: var(--sb-info-ink);     --bs-info-border-subtle: var(--sb-info-line);
  --bs-secondary-bg-subtle: var(--sb-neutral-bg); --bs-secondary-text-emphasis: var(--sb-neutral-ink); --bs-secondary-border-subtle: var(--sb-neutral-line);
  --bs-light-bg-subtle: var(--sb-surface-2);  --bs-light-text-emphasis: var(--sb-ink-soft);    --bs-light-border-subtle: var(--sb-line);
  --bs-dark-bg-subtle: var(--sb-neutral-bg);  --bs-dark-text-emphasis: var(--sb-ink);          --bs-dark-border-subtle: var(--sb-line-strong);
}
:root, [data-bs-theme=light] { --bs-warning: #d97706; --bs-warning-rgb: 217,119,6; --bs-danger: #dc2626; --bs-danger-rgb: 220,38,38; --bs-info: #2563eb; --bs-info-rgb: 37,99,235; }
[data-bs-theme=dark] { --bs-body-bg-rgb: 11,18,32; --bs-warning: #f59e0b; --bs-warning-rgb: 245,158,11; --bs-danger: #f87171; --bs-danger-rgb: 248,113,113; --bs-info: #60a5fa; --bs-info-rgb: 96,165,250; }

body { font-size: var(--sb-fs-md); -webkit-font-smoothing: antialiased; font-feature-settings: "cv11"; }
a { text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 2px; }
.btn:hover, .nav-link:hover, .dropdown-item:hover, .page-link:hover, .list-group-item:hover { text-decoration: none; }
code { font-family: var(--sb-font-mono); font-size: .86em; color: var(--sb-ink-soft); }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-weight: 600; letter-spacing: -.01em; }
h5, .h5 { font-size: 1.0625rem; }
.text-muted, .text-body-secondary { color: var(--sb-ink-muted) !important; }
.fw-light, .display-6 { font-weight: 500 !important; }
.display-6 { font-size: var(--sb-fs-kpi); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
::selection { background: rgba(var(--sb-accent-rgb), .22); }

/* ---- Napit ---- */
.btn {
  --bs-btn-font-weight: 600; --bs-btn-font-size: .875rem; --bs-btn-padding-y: .5rem; --bs-btn-padding-x: .875rem;
  --bs-btn-border-radius: var(--sb-radius-sm); --bs-btn-focus-box-shadow: var(--sb-focus);
  --bs-btn-line-height: 1.4;
}
.btn-sm { --bs-btn-font-size: .8125rem; --bs-btn-padding-y: .3125rem; --bs-btn-padding-x: .625rem; --bs-btn-border-radius: 7px; }
.btn-lg { --bs-btn-font-size: .9375rem; --bs-btn-padding-y: .625rem; --bs-btn-padding-x: 1.125rem; --bs-btn-border-radius: var(--sb-radius-sm); }
.btn-link { font-weight: 600; }
.btn-primary, .btn-success {
  --bs-btn-color: #fff; --bs-btn-bg: var(--sb-accent); --bs-btn-border-color: var(--sb-accent);
  --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--sb-accent-dark); --bs-btn-hover-border-color: var(--sb-accent-dark);
  --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--sb-accent-dark); --bs-btn-active-border-color: var(--sb-accent-dark);
  --bs-btn-disabled-color: #fff; --bs-btn-disabled-bg: var(--sb-accent); --bs-btn-disabled-border-color: var(--sb-accent);
  --bs-btn-focus-shadow-rgb: var(--sb-accent-rgb);
}
.btn-outline-primary, .btn-outline-success {
  --bs-btn-color: var(--sb-accent-ink); --bs-btn-border-color: var(--sb-ok-line); --bs-btn-bg: transparent;
  --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--sb-accent); --bs-btn-hover-border-color: var(--sb-accent);
  --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--sb-accent-dark); --bs-btn-active-border-color: var(--sb-accent-dark);
  --bs-btn-disabled-color: var(--sb-accent-ink); --bs-btn-disabled-border-color: var(--sb-ok-line);
  --bs-btn-focus-shadow-rgb: var(--sb-accent-rgb);
}
.btn-secondary {
  --bs-btn-color: var(--sb-ink); --bs-btn-bg: var(--sb-surface-2); --bs-btn-border-color: var(--sb-line-strong);
  --bs-btn-hover-color: var(--sb-ink); --bs-btn-hover-bg: var(--sb-line); --bs-btn-hover-border-color: var(--sb-line-strong);
  --bs-btn-active-color: var(--sb-ink); --bs-btn-active-bg: var(--sb-line); --bs-btn-active-border-color: var(--sb-line-strong);
  --bs-btn-disabled-color: var(--sb-ink-muted); --bs-btn-disabled-bg: var(--sb-surface-2); --bs-btn-disabled-border-color: var(--sb-line);
}
.btn-outline-secondary, .btn-light, .btn-outline-dark {
  --bs-btn-color: var(--sb-ink); --bs-btn-bg: var(--sb-surface); --bs-btn-border-color: var(--sb-line-strong);
  --bs-btn-hover-color: var(--sb-ink); --bs-btn-hover-bg: var(--sb-surface-2); --bs-btn-hover-border-color: var(--sb-line-strong);
  --bs-btn-active-color: var(--sb-ink); --bs-btn-active-bg: var(--sb-line); --bs-btn-active-border-color: var(--sb-line-strong);
  --bs-btn-disabled-color: var(--sb-ink-faint); --bs-btn-disabled-bg: var(--sb-surface); --bs-btn-disabled-border-color: var(--sb-line);
  --bs-btn-focus-shadow-rgb: var(--sb-accent-rgb);
}
.btn-check:checked + .btn-outline-secondary, .btn-outline-secondary.active {
  color: var(--sb-accent-ink); background: var(--sb-accent-soft); border-color: var(--sb-ok-line);
}
.btn-danger { --bs-btn-bg: #dc2626; --bs-btn-border-color: #dc2626; --bs-btn-hover-bg: #b91c1c; --bs-btn-hover-border-color: #b91c1c; --bs-btn-active-bg: #991b1b; --bs-btn-active-border-color: #991b1b; }
.btn-outline-danger {
  --bs-btn-color: var(--sb-err-ink); --bs-btn-border-color: var(--sb-err-line); --bs-btn-bg: transparent;
  --bs-btn-hover-color: #fff; --bs-btn-hover-bg: #dc2626; --bs-btn-hover-border-color: #dc2626;
  --bs-btn-active-bg: #b91c1c; --bs-btn-active-border-color: #b91c1c;
}
.btn-warning { --bs-btn-color: #451a03; --bs-btn-bg: #fbbf24; --bs-btn-border-color: #fbbf24; --bs-btn-hover-bg: #f59e0b; --bs-btn-hover-border-color: #f59e0b; --bs-btn-hover-color: #451a03; }
.btn-outline-warning { --bs-btn-color: var(--sb-warn-ink); --bs-btn-border-color: var(--sb-warn-line); --bs-btn-hover-color: #451a03; --bs-btn-hover-bg: #fbbf24; --bs-btn-hover-border-color: #fbbf24; }
.btn-info { --bs-btn-color: #fff; --bs-btn-bg: #2563eb; --bs-btn-border-color: #2563eb; --bs-btn-hover-color: #fff; --bs-btn-hover-bg: #1d4ed8; --bs-btn-hover-border-color: #1d4ed8; }
.btn-outline-info { --bs-btn-color: var(--sb-info-ink); --bs-btn-border-color: var(--sb-info-line); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: #2563eb; --bs-btn-hover-border-color: #2563eb; }
.btn-dark { --bs-btn-bg: var(--sb-nav-bg); --bs-btn-border-color: var(--sb-nav-bg); --bs-btn-hover-bg: var(--sb-nav-bg-2); --bs-btn-hover-border-color: var(--sb-nav-bg-2); }
.btn-group-sm > .btn { --bs-btn-font-size: .8125rem; --bs-btn-padding-y: .3125rem; --bs-btn-padding-x: .625rem; }

/* ---- Lomakkeet ---- */
.form-control, .form-select {
  --bs-border-color: var(--sb-line-strong);
  min-height: 40px; font-size: var(--sb-fs-md); background-color: var(--sb-surface); color: var(--sb-ink);
  border-color: var(--sb-line-strong);
}
.form-control-sm, .form-select-sm { min-height: 32px; font-size: var(--sb-fs-sm); }
.form-control-lg, .form-select-lg { min-height: 48px; }
.form-control-color { min-height: 40px; }
.form-control:focus, .form-select:focus, .form-check-input:focus {
  border-color: var(--sb-accent); box-shadow: var(--sb-focus); color: var(--sb-ink); background-color: var(--sb-surface);
}
.form-control::placeholder { color: var(--sb-ink-faint); }
.form-control:disabled, .form-select:disabled, .form-control[readonly] { background-color: var(--sb-surface-2); }
.form-label, .col-form-label { font-size: var(--sb-fs-sm); font-weight: 600; color: var(--sb-ink-soft); margin-bottom: .3rem; }
.form-text { font-size: var(--sb-fs-sm); color: var(--sb-ink-muted); }
.form-check-input { border-color: var(--sb-line-strong); background-color: var(--sb-surface); }
.form-check-input:checked, .form-check-input[type=checkbox]:indeterminate { background-color: var(--sb-accent); border-color: var(--sb-accent); }
.form-switch .form-check-input:focus:not(:checked) {
  --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%230a7a3a'/%3e%3c/svg%3e");
}
.form-range::-webkit-slider-thumb { background-color: var(--sb-accent); }
.form-range::-moz-range-thumb { background-color: var(--sb-accent); }
.input-group-text { background: var(--sb-surface-2); border-color: var(--sb-line-strong); color: var(--sb-ink-muted); font-size: var(--sb-fs-sm); }
.input-group > .form-control, .input-group > .form-select { min-height: 0; }

/* ---- Kortit ---- */
.card {
  --bs-card-bg: var(--sb-surface); --bs-card-border-color: var(--sb-line);
  --bs-card-border-radius: var(--sb-radius); --bs-card-inner-border-radius: calc(var(--sb-radius) - 1px);
  --bs-card-cap-bg: transparent; --bs-card-cap-padding-y: .875rem; --bs-card-cap-padding-x: 1.25rem;
  --bs-card-spacer-x: 1.25rem; --bs-card-spacer-y: 1.125rem;
  box-shadow: var(--sb-shadow-sm);
}
.card.border-0 { border: 1px solid var(--sb-line) !important; }
.card-header { font-weight: 600; border-bottom-color: var(--sb-line); }
.card-header h5, .card-header .h5, .card-header h6 { font-size: var(--sb-fs-md); font-weight: 600; }
.card-footer { border-top-color: var(--sb-line); background: transparent; }
.card-title { font-size: var(--sb-fs-md); font-weight: 600; }
.shadow-sm { box-shadow: var(--sb-shadow-sm) !important; }
.shadow { box-shadow: var(--sb-shadow-md) !important; }
.rounded-3 { border-radius: var(--sb-radius) !important; }
.border { border-color: var(--sb-line) !important; }

/* ---- Taulukot ---- */
.table {
  --bs-table-color: var(--sb-ink); --bs-table-bg: transparent; --bs-table-border-color: var(--sb-line);
  --bs-table-striped-bg: var(--sb-surface-2); --bs-table-striped-color: var(--sb-ink);
  --bs-table-hover-bg: var(--sb-surface-2); --bs-table-hover-color: var(--sb-ink);
  --bs-table-active-bg: var(--sb-accent-soft); --bs-table-active-color: var(--sb-ink);
  font-size: var(--sb-fs-base); font-variant-numeric: tabular-nums;
}
.table > :not(caption) > * > * { padding: .625rem .75rem; }
.table-sm > :not(caption) > * > * { padding: .4rem .55rem; }
.table > thead, .table > thead.table-light, .table > thead > tr.table-light {
  --bs-table-bg: var(--sb-surface-2); --bs-table-color: var(--sb-ink-muted);
}
.table > thead th, .table > thead td {
  font-size: var(--sb-fs-xs); font-weight: 600; text-transform: uppercase; letter-spacing: .04em;
  color: var(--sb-ink-muted); background: var(--sb-surface-2); border-bottom-color: var(--sb-line); white-space: nowrap;
  vertical-align: bottom;
}
.table-light { --bs-table-bg: var(--sb-surface-2); --bs-table-color: var(--sb-ink); --bs-table-border-color: var(--sb-line); }
.table-success { --bs-table-bg: var(--sb-ok-bg);   --bs-table-color: var(--sb-ink); --bs-table-border-color: var(--sb-line); }
.table-warning { --bs-table-bg: var(--sb-warn-bg); --bs-table-color: var(--sb-ink); --bs-table-border-color: var(--sb-line); }
.table-danger  { --bs-table-bg: var(--sb-err-bg);  --bs-table-color: var(--sb-ink); --bs-table-border-color: var(--sb-line); }
.table-info    { --bs-table-bg: var(--sb-info-bg); --bs-table-color: var(--sb-ink); --bs-table-border-color: var(--sb-line); }
.table-secondary { --bs-table-bg: var(--sb-neutral-bg); --bs-table-color: var(--sb-ink); --bs-table-border-color: var(--sb-line); }
.table td a:not(.btn) { font-weight: 600; color: var(--sb-ink); }
.table td a:not(.btn):hover { color: var(--sb-accent-ink); }
/* position: relative → taulukon sisäiset absoluuttiset elementit (esim. .visually-hidden) asemoituvat
   vierityskääreeseen eivätkä levennä koko sivua sivuttain vieritettäväksi */
.table-responsive { border-radius: inherit; position: relative; }
.card > .table-responsive:last-child > .table, .card > .table:last-child { margin-bottom: 0; }

/* ---- Badget: tilasemantiikka (luku 3.4). Vanhat bg-*-badget -> pehmeä pilli ---- */
.badge {
  --bs-badge-font-size: var(--sb-fs-xs); --bs-badge-font-weight: 600; --bs-badge-padding-x: .55em; --bs-badge-padding-y: .3em;
  --bs-badge-border-radius: var(--sb-radius-pill);
  letter-spacing: .01em; vertical-align: .08em;
}
.badge.bg-success, .badge.text-bg-success, .badge.bg-primary, .badge.text-bg-primary {
  background-color: var(--sb-ok-bg) !important; color: var(--sb-ok-ink) !important; }
.badge.bg-warning, .badge.text-bg-warning { background-color: var(--sb-warn-bg) !important; color: var(--sb-warn-ink) !important; }
.badge.bg-danger,  .badge.text-bg-danger  { background-color: var(--sb-err-bg) !important;  color: var(--sb-err-ink) !important; }
.badge.bg-info,    .badge.text-bg-info    { background-color: var(--sb-info-bg) !important; color: var(--sb-info-ink) !important; }
.badge.bg-secondary, .badge.text-bg-secondary, .badge.bg-light, .badge.text-bg-light, .badge.bg-dark, .badge.text-bg-dark {
  background-color: var(--sb-neutral-bg) !important; color: var(--sb-neutral-ink) !important; }
.badge.border { border-color: var(--sb-line-strong) !important; }

/* ---- Hälytykset ---- */
.alert {
  --bs-alert-border-radius: var(--sb-radius-sm); --bs-alert-padding-y: .75rem; --bs-alert-padding-x: 1rem;
  font-size: var(--sb-fs-base);
}
.alert-primary, .alert-success { --bs-alert-color: var(--sb-ok-ink); --bs-alert-bg: var(--sb-ok-bg); --bs-alert-border-color: var(--sb-ok-line); --bs-alert-link-color: var(--sb-ok-ink); }
.alert-warning { --bs-alert-color: var(--sb-warn-ink); --bs-alert-bg: var(--sb-warn-bg); --bs-alert-border-color: var(--sb-warn-line); --bs-alert-link-color: var(--sb-warn-ink); }
.alert-danger  { --bs-alert-color: var(--sb-err-ink);  --bs-alert-bg: var(--sb-err-bg);  --bs-alert-border-color: var(--sb-err-line);  --bs-alert-link-color: var(--sb-err-ink); }
.alert-info    { --bs-alert-color: var(--sb-info-ink); --bs-alert-bg: var(--sb-info-bg); --bs-alert-border-color: var(--sb-info-line); --bs-alert-link-color: var(--sb-info-ink); }
.alert-secondary, .alert-light { --bs-alert-color: var(--sb-ink-soft); --bs-alert-bg: var(--sb-surface-2); --bs-alert-border-color: var(--sb-line); --bs-alert-link-color: var(--sb-ink); }
.alert-link { font-weight: 600; text-decoration: underline; }

/* ---- Välilehdet (luku 4.3): teksti, aktiivinen vihreällä alleviivauksella ---- */
.nav-tabs {
  --bs-nav-tabs-border-color: var(--sb-line); --bs-nav-tabs-border-width: 1px;
  --bs-nav-tabs-link-hover-border-color: transparent;
  --bs-nav-tabs-link-active-color: var(--sb-accent-ink); --bs-nav-tabs-link-active-bg: transparent;
  --bs-nav-tabs-link-active-border-color: transparent;
  gap: .25rem;
}
.nav-tabs .nav-link {
  border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; border-radius: 0;
  color: var(--sb-ink-muted); font-weight: 600; font-size: var(--sb-fs-base); padding: .6rem .8rem;
  display: inline-flex; align-items: center; gap: .35rem;
}
.nav-tabs .nav-link:hover { color: var(--sb-ink); border-bottom-color: var(--sb-line-strong); }
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link { color: var(--sb-accent-ink); border-bottom-color: var(--sb-accent); background: transparent; }
.nav-tabs .nav-link > i.small, .nav-tabs .nav-link > .fas { display: none; } /* ei ikoneita välilehdissä */
.nav-pills { --bs-nav-pills-link-active-bg: var(--sb-accent-soft); --bs-nav-pills-link-active-color: var(--sb-accent-ink); --bs-nav-pills-border-radius: var(--sb-radius-sm); }
.nav-pills .nav-link { color: var(--sb-ink-soft); font-weight: 600; font-size: var(--sb-fs-base); }
.nav-link { color: var(--sb-ink-soft); }
.nav-link:hover, .nav-link:focus { color: var(--sb-ink); }

/* ---- Muut Bootstrap-komponentit ---- */
.pagination {
  --bs-pagination-color: var(--sb-ink-soft); --bs-pagination-bg: var(--sb-surface); --bs-pagination-border-color: var(--sb-line-strong);
  --bs-pagination-hover-color: var(--sb-ink); --bs-pagination-hover-bg: var(--sb-surface-2); --bs-pagination-hover-border-color: var(--sb-line-strong);
  --bs-pagination-focus-color: var(--sb-ink); --bs-pagination-focus-bg: var(--sb-surface-2); --bs-pagination-focus-box-shadow: var(--sb-focus);
  --bs-pagination-active-color: #fff; --bs-pagination-active-bg: var(--sb-accent); --bs-pagination-active-border-color: var(--sb-accent);
  --bs-pagination-disabled-color: var(--sb-ink-faint); --bs-pagination-disabled-bg: var(--sb-surface); --bs-pagination-disabled-border-color: var(--sb-line);
  --bs-pagination-border-radius: var(--sb-radius-sm); gap: 4px; flex-wrap: wrap;
}
.pagination .page-link { border-radius: var(--sb-radius-sm) !important; margin-left: 0 !important; min-width: 32px; text-align: center; font-weight: 600; font-variant-numeric: tabular-nums; }
.dropdown-menu {
  --bs-dropdown-bg: var(--sb-surface); --bs-dropdown-color: var(--sb-ink); --bs-dropdown-border-color: var(--sb-line);
  --bs-dropdown-border-radius: var(--sb-radius); --bs-dropdown-box-shadow: var(--sb-shadow-lg);
  --bs-dropdown-link-color: var(--sb-ink); --bs-dropdown-link-hover-color: var(--sb-ink); --bs-dropdown-link-hover-bg: var(--sb-surface-2);
  --bs-dropdown-link-active-color: var(--sb-accent-ink); --bs-dropdown-link-active-bg: var(--sb-accent-soft);
  --bs-dropdown-divider-bg: var(--sb-line); --bs-dropdown-header-color: var(--sb-ink-muted);
  --bs-dropdown-font-size: var(--sb-fs-base); --bs-dropdown-item-padding-y: .45rem; padding: .375rem;
  box-shadow: var(--bs-dropdown-box-shadow);
}
.dropdown-item { border-radius: 6px; }
.list-group {
  --bs-list-group-bg: var(--sb-surface); --bs-list-group-color: var(--sb-ink); --bs-list-group-border-color: var(--sb-line);
  --bs-list-group-action-hover-bg: var(--sb-surface-2); --bs-list-group-action-hover-color: var(--sb-ink);
  --bs-list-group-active-bg: var(--sb-accent-soft); --bs-list-group-active-color: var(--sb-accent-ink); --bs-list-group-active-border-color: var(--sb-ok-line);
  --bs-list-group-border-radius: var(--sb-radius);
}
.progress, .progress-stacked { --bs-progress-bar-bg: var(--sb-accent); --bs-progress-bg: var(--sb-surface-2); --bs-progress-border-radius: var(--sb-radius-pill); }
.modal {
  --bs-modal-bg: var(--sb-surface); --bs-modal-border-color: var(--sb-line); --bs-modal-border-radius: var(--sb-radius-lg);
  --bs-modal-header-border-color: var(--sb-line); --bs-modal-footer-border-color: var(--sb-line); --bs-modal-box-shadow: var(--sb-shadow-lg);
}
.modal-title { font-size: var(--sb-fs-lg); font-weight: 600; }
.offcanvas { --bs-offcanvas-bg: var(--sb-surface); --bs-offcanvas-border-color: var(--sb-line); }
.accordion {
  --bs-accordion-bg: var(--sb-surface); --bs-accordion-border-color: var(--sb-line); --bs-accordion-border-radius: var(--sb-radius);
  --bs-accordion-btn-focus-box-shadow: var(--sb-focus); --bs-accordion-active-color: var(--sb-accent-ink); --bs-accordion-active-bg: var(--sb-accent-soft);
}
.tooltip { --bs-tooltip-bg: var(--sb-nav-bg); --bs-tooltip-font-size: var(--sb-fs-sm); --bs-tooltip-border-radius: 6px; }
.popover { --bs-popover-border-color: var(--sb-line); --bs-popover-border-radius: var(--sb-radius); --bs-popover-bg: var(--sb-surface); --bs-popover-header-bg: var(--sb-surface-2); --bs-popover-box-shadow: var(--sb-shadow-lg); }
.toast { --bs-toast-bg: var(--sb-surface); --bs-toast-border-color: var(--sb-line); --bs-toast-border-radius: var(--sb-radius); --bs-toast-box-shadow: var(--sb-shadow-lg); }
.btn-close:focus { box-shadow: var(--sb-focus); }
.text-primary { color: var(--sb-accent-ink) !important; }
.text-success { color: var(--sb-ok-ink) !important; }
.text-warning { color: var(--sb-warn-ink) !important; }
.text-danger  { color: var(--sb-err-ink) !important; }
.text-info    { color: var(--sb-info-ink) !important; }
.text-warning-emphasis { color: var(--sb-warn-ink) !important; }
.link-primary { color: var(--sb-accent-ink) !important; }
.bg-primary-subtle, .bg-success-subtle { background-color: var(--sb-ok-bg) !important; }
.bg-warning-subtle { background-color: var(--sb-warn-bg) !important; }
.bg-danger-subtle  { background-color: var(--sb-err-bg) !important; }
.bg-info-subtle    { background-color: var(--sb-info-bg) !important; }

/* ---- Tumma tila: Bootstrapin kiinteät vaaleat apuluokat seuraavat tokeneita ---- */
[data-bs-theme=dark] .bg-light, [data-bs-theme=dark] .bg-body-tertiary, [data-bs-theme=dark] .bg-body-secondary { background-color: var(--sb-surface-2) !important; color: var(--sb-ink); }
[data-bs-theme=dark] .bg-white, [data-bs-theme=dark] .bg-body { background-color: var(--sb-surface) !important; color: var(--sb-ink); }
[data-bs-theme=dark] .text-dark, [data-bs-theme=dark] .text-black { color: var(--sb-ink) !important; }
[data-bs-theme=dark] .table-light { --bs-table-bg: var(--sb-surface-2); --bs-table-color: var(--sb-ink); }
[data-bs-theme=dark] .bg-warning.bg-opacity-25, [data-bs-theme=dark] .bg-warning.bg-opacity-10 { background-color: var(--sb-warn-bg) !important; }
[data-bs-theme=dark] .bg-success.bg-opacity-25, [data-bs-theme=dark] .bg-success.bg-opacity-10 { background-color: var(--sb-ok-bg) !important; }
[data-bs-theme=dark] .bg-danger.bg-opacity-25, [data-bs-theme=dark] .bg-danger.bg-opacity-10 { background-color: var(--sb-err-bg) !important; }
[data-bs-theme=dark] .bg-info.bg-opacity-25, [data-bs-theme=dark] .bg-info.bg-opacity-10 { background-color: var(--sb-info-bg) !important; }
[data-bs-theme=dark] .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }
[data-bs-theme=dark] img.sb-keep-light, [data-bs-theme=dark] iframe.sb-keep-light { color-scheme: light; }