/*
 * Bootstrap theming for the admin UI — only --bs-* variables and the handful
 * of component rules Bootstrap does not derive from them.
 *
 * Source: notes/attachments/hallinta/Hallinnan ohjeistus.dc.html,
 * summarised in notes/design/hallinnan-graafinen-ohjeistus.md. The rule from
 * there that governs this file: no new component classes, no !important, so a
 * Bootstrap 5.4 upgrade stays a version bump.
 *
 * Loaded straight after Bootstrap and before erp_style.css, which layers our
 * own components on top. Dark-theme rules for those live in dark-mode.css;
 * both themes' Bootstrap tokens live here so the palette reads as one table.
 */

:root {
    --app-font-sans: "Source Sans 3", system-ui, -apple-system, "Segoe UI", sans-serif;
    --app-font-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
    --app-font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

    --bs-primary: #1f4d5a;
    --bs-primary-rgb: 31, 77, 90;
    --bs-primary-text-emphasis: #12313a;
    --bs-primary-bg-subtle: #e4edef;
    --bs-primary-border-subtle: #9fbac1;

    --bs-link-color: #1f4d5a;
    --bs-link-color-rgb: 31, 77, 90;
    --bs-link-hover-color: #2e6b7c;
    --bs-link-hover-color-rgb: 46, 107, 124;

    /* Sharper than the member-facing UI: the admin side reads as a tool. */
    --bs-border-radius: .25rem;
    --bs-border-radius-sm: .2rem;
    --bs-border-radius-lg: .375rem;

    --bs-body-font-family: var(--app-font-sans);
    --bs-font-monospace: var(--app-font-mono);
    --bs-body-font-size: .95rem;
    --bs-body-color: #1c1b18;
    --bs-body-color-rgb: 28, 27, 24;
    --bs-body-bg: #f7f6f3;
    --bs-body-bg-rgb: 247, 246, 243;

    /* Warm neutrals in place of Bootstrap's blue-grey ramp, so surfaces and
       borders share a hue with the body background. */
    --bs-secondary-bg: #e9e7e1;
    --bs-secondary-bg-rgb: 233, 231, 225;
    --bs-tertiary-bg: #f1efea;
    --bs-tertiary-bg-rgb: 241, 239, 234;
    --bs-secondary-color: rgba(28, 27, 24, .72);
    --bs-tertiary-color: rgba(28, 27, 24, .5);
    --bs-border-color: #dfdad0;
    --bs-border-color-translucent: rgba(28, 27, 24, .14);
}

[data-bs-theme="dark"] {
    /* Same hue, lightness raised to 72–78 % so it carries on dark surfaces. */
    --bs-primary: #7fb3be;
    --bs-primary-rgb: 127, 179, 190;
    --bs-primary-text-emphasis: #a6cbd3;
    --bs-primary-bg-subtle: #16323a;
    --bs-primary-border-subtle: #3d6f79;

    --bs-link-color: #7fb3be;
    --bs-link-color-rgb: 127, 179, 190;
    --bs-link-hover-color: #a6cbd3;
    --bs-link-hover-color-rgb: 166, 203, 211;

    --bs-body-color: #e9e7e1;
    --bs-body-color-rgb: 233, 231, 225;
    --bs-body-bg: #141513;
    --bs-body-bg-rgb: 20, 21, 19;
    --bs-emphasis-color: #fff;

    --bs-secondary-bg: #262824;
    --bs-secondary-bg-rgb: 38, 40, 36;
    --bs-tertiary-bg: #1d1f1c;
    --bs-tertiary-bg-rgb: 29, 31, 28;
    --bs-secondary-color: rgba(233, 231, 225, .75);
    --bs-tertiary-color: rgba(233, 231, 225, .5);
    --bs-border-color: #2e312d;
    --bs-border-color-translucent: rgba(255, 255, 255, .14);
}

/* Bootstrap does not derive button colours from --bs-primary. */
.btn-primary {
    --bs-btn-bg: #1f4d5a;
    --bs-btn-border-color: #1f4d5a;
    --bs-btn-hover-bg: #163a44;
    --bs-btn-hover-border-color: #163a44;
    --bs-btn-active-bg: #12313a;
    --bs-btn-active-border-color: #12313a;
    --bs-btn-disabled-bg: #1f4d5a;
    --bs-btn-disabled-border-color: #1f4d5a;
}

.btn-outline-primary {
    --bs-btn-color: #1f4d5a;
    --bs-btn-border-color: #9fbac1;
    --bs-btn-hover-bg: #1f4d5a;
    --bs-btn-hover-border-color: #1f4d5a;
    --bs-btn-active-bg: #163a44;
    --bs-btn-active-border-color: #163a44;
    --bs-btn-disabled-color: #1f4d5a;
    --bs-btn-disabled-border-color: #9fbac1;
}

[data-bs-theme="dark"] .btn-primary {
    --bs-btn-color: #0f1a1d;
    --bs-btn-bg: #7fb3be;
    --bs-btn-border-color: #7fb3be;
    --bs-btn-hover-color: #0f1a1d;
    --bs-btn-hover-bg: #9ac5ce;
    --bs-btn-hover-border-color: #9ac5ce;
    --bs-btn-active-color: #0f1a1d;
    --bs-btn-active-bg: #a6cbd3;
    --bs-btn-active-border-color: #a6cbd3;
    --bs-btn-disabled-color: #0f1a1d;
    --bs-btn-disabled-bg: #7fb3be;
    --bs-btn-disabled-border-color: #7fb3be;
}

[data-bs-theme="dark"] .btn-outline-primary {
    --bs-btn-color: #7fb3be;
    --bs-btn-border-color: #3d6f79;
    --bs-btn-hover-color: #0f1a1d;
    --bs-btn-hover-bg: #7fb3be;
    --bs-btn-hover-border-color: #7fb3be;
    --bs-btn-active-color: #0f1a1d;
    --bs-btn-active-bg: #9ac5ce;
    --bs-btn-active-border-color: #9ac5ce;
    --bs-btn-disabled-color: #7fb3be;
    --bs-btn-disabled-border-color: #3d6f79;
}

/* White on the lightened dark-theme primary fails contrast. */
[data-bs-theme="dark"] .text-bg-primary,
[data-bs-theme="dark"] .badge.text-bg-primary {
    color: #0f1a1d !important;
}

[data-bs-theme="dark"] .page-item.active .page-link {
    --bs-pagination-active-color: #0f1a1d;
}

/* Section and page headings in the serif; everything else stays sans. */
h1, h2, h3, h4,
.h1, .h2, .h3, .h4,
.modal-title,
legend {
    font-family: var(--app-font-serif);
    font-weight: 600;
}

/* Tables are the admin's basic view: denser rows, quieter headers. */
.table {
    --bs-table-cell-padding-y: .6rem;
    --bs-table-cell-padding-x: .75rem;
}

.table > thead > tr > th {
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--bs-secondary-color);
}

/* Column filters and sort buttons live inside <th>; they are controls, not
   headings, and must not inherit the caps. */
.table > thead > tr > th :is(input, select, textarea, button, .form-control, .form-select, .badge, .dropdown-menu) {
    font-size: var(--bs-body-font-size);
    letter-spacing: normal;
    text-transform: none;
}

/* Colour is never the only thing marking the active item. */
.nav-link.active,
.nav-tabs .nav-link.active {
    font-weight: 600;
}