/*
 * MFL Grades — design layer over the Mirbal theme (feature 21).
 * Loaded after app.min.css. Hand-written on purpose: the Mirbal SCSS is not rebuilt.
 *
 * Colour rules (decided 2026-10-12):
 *  - Koç red (#BE1E2D) = brand and the primary button only. Links, values and progress use ink.
 *  - Semantic colours meet WCAG AA: text >= 4.5:1, badges and borders >= 3:1.
 *  - States always carry a word, never colour alone.
 * Light-theme tokens use :root:not([data-bs-theme=dark]) so the dark theme keeps its own.
 */

/* ---------------------------------------------------------------- tokens */
:root:not([data-bs-theme=dark]),
[data-bs-theme=light] {
    --mfl-ink: #1f2933;
    --mfl-ink-2: #4a5560;
    --mfl-muted: #5f6b76;
    --mfl-line: #dfe3e7;
    --mfl-surface-2: #f3f5f7;

    --pe-body-color: var(--mfl-ink);
    --pe-body-color-rgb: 31, 41, 51;
    --pe-emphasis-color: var(--mfl-ink);
    --pe-heading-color: var(--mfl-ink);
    --pe-secondary-color: var(--mfl-muted);
    --pe-secondary-color-rgb: 95, 107, 118;

    --pe-link-color: var(--mfl-ink);
    --pe-link-color-rgb: 31, 41, 51;
    --pe-link-hover-color: #be1e2d;
    --pe-link-hover-color-rgb: 190, 30, 45;

    --pe-success: #1a7f4b;
    --pe-success-rgb: 26, 127, 75;
    --pe-success-text-emphasis: #14663c;
    --pe-success-bg-subtle: #e4f0e9;
    --pe-success-border-subtle: #a9d1bb;

    --pe-warning: #ffb547;
    --pe-warning-rgb: 255, 181, 71;
    --pe-warning-text-emphasis: #7a4a00;
    --pe-warning-bg-subtle: #fff4e0;
    --pe-warning-border-subtle: #f0cf96;

    --pe-danger: #b42318;
    --pe-danger-rgb: 180, 35, 24;
    --pe-danger-text-emphasis: #9b1c13;
    --pe-danger-bg-subtle: #f8e6e4;
    --pe-danger-border-subtle: #e6b3ae;

    --pe-info-text-emphasis: #1d5f8a;
    --pe-secondary-text-emphasis: var(--mfl-ink-2);
    --pe-secondary-bg-subtle: #eceef1;
    --pe-secondary-border-subtle: #c9ced4;

    --pe-breadcrumb-item-active-color: var(--mfl-muted);
}

/* Text measured on white must stay AA. */
.text-warning { color: #8a5300 !important; }
.text-muted { color: var(--pe-secondary-color) !important; }

/* ---------------------------------------------------------------- buttons */
.btn-success {
    --pe-btn-bg: #1a7f4b; --pe-btn-border-color: #1a7f4b;
    --pe-btn-hover-bg: #14663c; --pe-btn-hover-border-color: #14663c;
    --pe-btn-active-bg: #11552f; --pe-btn-active-border-color: #11552f;
    --pe-btn-disabled-bg: #1a7f4b; --pe-btn-disabled-border-color: #1a7f4b;
}
.btn-danger {
    --pe-btn-bg: #b42318; --pe-btn-border-color: #b42318;
    --pe-btn-hover-bg: #961d14; --pe-btn-hover-border-color: #961d14;
    --pe-btn-active-bg: #7f1911; --pe-btn-active-border-color: #7f1911;
    --pe-btn-disabled-bg: #b42318; --pe-btn-disabled-border-color: #b42318;
}
/* Amber carries dark text: white on amber is 1.8:1. */
.btn-warning {
    --pe-btn-color: var(--mfl-ink, #1f2933); --pe-btn-hover-color: var(--mfl-ink, #1f2933);
    --pe-btn-active-color: var(--mfl-ink, #1f2933); --pe-btn-disabled-color: var(--mfl-ink, #1f2933);
    --pe-btn-bg: #ffb547; --pe-btn-border-color: #e69a2e;
    --pe-btn-hover-bg: #f5a530; --pe-btn-hover-border-color: #d98a1c;
    --pe-btn-active-bg: #e69a2e; --pe-btn-active-border-color: #cc8418;
}
.btn-outline-success {
    --pe-btn-color: #14663c; --pe-btn-border-color: #1a7f4b;
    --pe-btn-hover-bg: #1a7f4b; --pe-btn-hover-border-color: #1a7f4b; --pe-btn-hover-color: #fff;
    --pe-btn-active-bg: #14663c; --pe-btn-active-border-color: #14663c; --pe-btn-active-color: #fff;
}
.btn-outline-danger {
    --pe-btn-color: #9b1c13; --pe-btn-border-color: #b42318;
    --pe-btn-hover-bg: #b42318; --pe-btn-hover-border-color: #b42318; --pe-btn-hover-color: #fff;
    --pe-btn-active-bg: #961d14; --pe-btn-active-border-color: #961d14; --pe-btn-active-color: #fff;
}
.btn-outline-warning {
    --pe-btn-color: #7a4a00; --pe-btn-border-color: #c98a2e;
    --pe-btn-hover-bg: #fff4e0; --pe-btn-hover-border-color: #b37721; --pe-btn-hover-color: #5c3700;
    --pe-btn-active-bg: #ffe7bf; --pe-btn-active-border-color: #b37721; --pe-btn-active-color: #5c3700;
}
/* Secondary actions in ink: the filled red button stays the only red action on a screen (T1). */
.btn-outline-primary {
    --pe-btn-color: var(--mfl-ink, #1f2933); --pe-btn-border-color: #9aa3ac;
    --pe-btn-hover-bg: #eef0f2; --pe-btn-hover-border-color: #6b7580; --pe-btn-hover-color: var(--mfl-ink, #1f2933);
    --pe-btn-active-bg: #e4e7ea; --pe-btn-active-border-color: #6b7580; --pe-btn-active-color: var(--mfl-ink, #1f2933);
}
[data-bs-theme=dark] .btn-outline-primary { --pe-btn-color: #e3e7eb; --pe-btn-hover-color: #fff; --pe-btn-hover-bg: rgba(255,255,255,.08); --pe-btn-active-color: #fff; }
.btn-outline-secondary {
    --pe-btn-color: var(--mfl-ink-2, #4a5560); --pe-btn-border-color: #c3c9cf;
    --pe-btn-hover-bg: #eef0f2; --pe-btn-hover-border-color: #aeb5bc; --pe-btn-hover-color: var(--mfl-ink, #1f2933);
    --pe-btn-active-bg: #e4e7ea; --pe-btn-active-border-color: #aeb5bc; --pe-btn-active-color: var(--mfl-ink, #1f2933);
}
/* Disabled outline buttons look switched off, not filled. */
.btn-outline-secondary, .btn-outline-primary {
    --pe-btn-disabled-bg: transparent; --pe-btn-disabled-color: #6b7580; --pe-btn-disabled-border-color: #d5d9dd;
}

/* ---------------------------------------------------------------- badges and states */
.badge { --pe-badge-font-size: 0.75rem; }
.badge.bg-warning, .badge.text-bg-warning { color: #3d2a00 !important; }

/* One status vocabulary for semesters and template versions (partials/_status-badge). */
.mfl-status {
    display: inline-flex; align-items: center; gap: .3rem;
    padding: .28rem .6rem; border-radius: 999px; border: 1px solid transparent;
    font-size: .75rem; font-weight: 600; line-height: 1.2; white-space: nowrap;
}
.mfl-status i { font-size: .85rem; line-height: 1; }
.mfl-status--open   { background: #e4f0e9; color: #14663c; border-color: #a9d1bb; }
.mfl-status--locked { background: #fff4e0; color: #7a4a00; border-color: #f0cf96; }
.mfl-status--closed { background: #eceef1; color: #303b46; border-color: #c9ced4; }
.mfl-status--draft  { background: transparent; color: #4a5560; border-color: #9aa3ac; border-style: dashed; }
[data-bs-theme=dark] .mfl-status--open   { background: rgba(26,127,75,.25); color: #8fd8ae; border-color: rgba(143,216,174,.4); }
[data-bs-theme=dark] .mfl-status--locked { background: rgba(255,181,71,.2); color: #ffd18a; border-color: rgba(255,209,138,.4); }
[data-bs-theme=dark] .mfl-status--closed { background: rgba(255,255,255,.08); color: #d5dae0; border-color: rgba(213,218,224,.3); }
[data-bs-theme=dark] .mfl-status--draft  { color: #c3cad1; border-color: #6b7580; }

/* ---------------------------------------------------------------- text, links, tables */
/* Links read as ink; inside running text they keep an underline so colour is not the only cue. */
.card-body p a:not(.btn), .alert a:not(.btn), .offcanvas-body a:not(.btn), .form-text a:not(.btn) {
    text-decoration: underline; text-underline-offset: 2px;
}
a:not(.btn):not(.pe-nav-link):not(.dropdown-item):not(.nav-link):hover { text-decoration: underline; text-underline-offset: 2px; }

.table {
    --pe-table-color: var(--pe-body-color);
    --pe-table-striped-color: var(--pe-body-color);
    --pe-table-active-color: var(--pe-body-color);
    font-variant-numeric: tabular-nums;
}
.table > thead th { color: var(--pe-secondary-color); font-weight: 600; }

/* Card titles: no decorative side bar (craft floor: no coloured border-left on cards). */
.card-title::before { display: none; }

/* Neutral progress that turns green when complete (grades list, dashboard). */
.mfl-progress { height: .5rem; background: var(--mfl-surface-2, #f3f5f7); border-radius: 999px; overflow: hidden; }
.mfl-progress > span { display: block; height: 100%; background: #6b7785; border-radius: inherit; }
.mfl-progress.is-complete > span { background: #1a7f4b; }

/* ---------------------------------------------------------------- list rows */
/* The whole row opens the item (partials/_mfl-ui); the chevron says so. */
tr[data-href] { cursor: pointer; }
tr[data-href]:hover > * { --pe-table-bg-state: var(--mfl-surface-2, #f3f5f7); }
.mfl-row-title { font-weight: 600; color: var(--pe-body-color); text-decoration: none; }
tr[data-href]:hover .mfl-row-title { text-decoration: underline; text-underline-offset: 2px; }
.mfl-chevron { color: #8a949e; font-size: 1.25rem; line-height: 1; }
.mfl-more { display: block; margin: .75rem auto 0; }

/* Tables that become cards on phones (feature 21, T4): add .table-stack to the table and
   data-label="Column" to each td; .mfl-stack-actions holds the row's buttons; .mfl-stack-hide drops a cell. */
@media (max-width: 767.98px) {
    .table-stack thead { display: none; }
    .table-stack, .table-stack tbody, .table-stack tr, .table-stack td { display: block; width: 100%; }
    .table-stack tr {
        position: relative; border: 1px solid var(--mfl-line, #dfe3e7); border-radius: .5rem;
        padding: .75rem .875rem; margin-bottom: .625rem; background: var(--pe-secondary-bg, #fff);
    }
    .table-stack > :not(caption) > * > *,
    .table-stack > :not(caption) > * > *:first-child { padding: .15rem 0 !important; border-bottom: 0; box-shadow: none; text-align: start !important; }
    .table-stack td[data-label]::before {
        content: attr(data-label); display: block; font-size: .75rem; color: var(--pe-secondary-color); line-height: 1.3;
    }
    .table-stack td.mfl-stack-inline { display: inline-block; width: auto; margin-inline-end: 1rem; }
    .table-stack td.mfl-stack-actions { display: flex; flex-wrap: wrap; gap: .5rem; padding-top: .5rem; }
    .table-stack td.mfl-stack-hide, .table-stack .mfl-chevron-cell { display: none; }
    .table-stack tr.js-empty-row { border: 0; }
}

/* ---------------------------------------------------------------- page header */
.mfl-page-header { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: .75rem 1rem; margin-bottom: 1rem; }
.mfl-page-header h1, .mfl-page-header .mfl-page-title { font-size: 1.125rem; font-weight: 600; margin: 0; line-height: 1.35; }
.mfl-page-header .mfl-page-subtitle { margin: .25rem 0 0; color: var(--pe-secondary-color); font-size: .875rem; max-width: 72ch; }
.mfl-page-actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }

/* ---------------------------------------------------------------- empty state */
.mfl-empty { text-align: center; padding: 2.5rem 1rem; color: var(--pe-secondary-color); }
.mfl-empty i { font-size: 2rem; display: block; margin-bottom: .5rem; color: #8a949e; }
.mfl-empty strong { display: block; color: var(--pe-body-color); font-size: 1rem; margin-bottom: .25rem; }
.mfl-empty p { max-width: 52ch; margin: 0 auto .75rem; }

/* ---------------------------------------------------------------- browser surfaces */
::selection { background: rgba(190, 30, 45, .18); }
:focus-visible { outline: 2px solid #be1e2d; outline-offset: 2px; }

/* ---------------------------------------------------------------- mobile chrome (T13, T12) */
@media (max-width: 767.98px) {
    :root { --pe-app-header-height: 56px; }
    .app-header { margin-inline: 12px; }
    .app-wrapper { padding-inline: 0; }
    .app-wrapper > .container-fluid { padding-inline: 12px; }
    .card-body { padding: 1rem; }
    /* iOS zooms into fields under 16px. */
    .form-control, .form-select, .form-control-sm, .form-select-sm, textarea { font-size: 16px; }
    .mfl-page-header { margin-bottom: .75rem; }
}

/* ---------------------------------------------------------------- approvals (AP-1) */
.mfl-proposal { border: 1px solid var(--mfl-line, #dfe3e7); border-radius: .5rem; padding: 1rem; margin-bottom: .75rem; background: var(--pe-secondary-bg, #fff); }
.mfl-proposal:target { border-color: #e69a2e; box-shadow: 0 0 0 3px rgba(255, 181, 71, .35); }
.mfl-proposal-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 1rem; margin-bottom: .75rem; }
.mfl-proposal-change { font-size: 1.125rem; font-variant-numeric: tabular-nums; }
.mfl-proposal-change strong { font-size: 1.375rem; }

/* ---------------------------------------------------------------- header: working semester (C3) */
.mfl-working-semester { align-items: center; gap: .5rem; font-size: .875rem; color: var(--pe-body-color); text-decoration: none; padding: .25rem .5rem; border-radius: .5rem; }
a.mfl-working-semester:hover { background: var(--mfl-surface-2, #f3f5f7); text-decoration: none; }

/* ---------------------------------------------------------------- grade sheet (H-1…H-5) */
/* Title with the group selector. */
.mfl-group-switch { all: unset; cursor: pointer; display: inline-flex; align-items: center; gap: .35rem; border-radius: .375rem; }
.mfl-group-switch:hover { text-decoration: underline; text-underline-offset: 3px; }
.mfl-group-switch:focus-visible { outline: 2px solid #be1e2d; outline-offset: 2px; }
.mfl-group-menu { max-height: min(70vh, 28rem); overflow-y: auto; }
.gs-page-header { flex-wrap: nowrap; align-items: center; margin-bottom: .25rem; }
.gs-page-header + .mfl-page-subtitle { margin: 0 0 .75rem; color: var(--pe-secondary-color); font-size: .875rem; }

/* Tabs on one line that scroll sideways (the ul keeps its border, so the active tab still joins the pane). */
.gs-tabs-scroll { overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; }
.gs-tabs-scroll .nav-tabs { min-width: max-content; }
.gs-tabs-scroll .nav-link { white-space: nowrap; }

/* The sheet scrolls inside its own box: header row and student column stay in place. */
.gs-scroll { position: relative; overflow: auto; max-height: calc(100dvh - var(--pe-app-header-height, 70px) - 1.5rem); }
.gs-table { margin-bottom: 0; }
.gs-table thead { position: sticky; top: 0; z-index: 3; }
.gs-table thead th { background: #eef1f5; white-space: nowrap; box-shadow: inset 0 -1px 0 #c9ced4; }
.gs-table .gs-sticky {
    position: sticky; left: 0; z-index: 2; white-space: nowrap; font-weight: 500;
    background-color: var(--pe-card-bg, var(--pe-secondary-bg, #fff));
}
.gs-table thead .gs-sticky { z-index: 4; background: #eef1f5; }
.gs-table .gs-sticky::before { content: ""; position: absolute; top: 0; left: -1px; bottom: 0; width: 1px; background: var(--mfl-line, #dfe3e7); }
.gs-table .gs-sticky::after { content: ""; position: absolute; top: 0; right: -1px; bottom: 0; width: 1px; background: #c9ced4; }
.gs-name-short { display: none; }
@media (max-width: 399.98px) {
    .gs-name-full { display: none; }
    .gs-name-short { display: inline; }
}
.gs-tab-table th, .gs-tab-table td { font-size: .95rem; padding: .5rem .6rem; }
.gs-max { display: block; font-size: .75rem; font-weight: 500; line-height: 1.2; }

/* Derived columns and the legend swatch. */
.gs-col-derived { background: #f1f3f5; text-align: center; font-weight: 600; }
.gs-col-donem { background: #fff3cd; text-align: center; font-weight: 700; }
.gs-swatch { display: inline-block; width: .9rem; height: .9rem; vertical-align: -2px; background: #f1f3f5; border: 1px solid #aeb5bc; border-radius: 2px; }
/* A block total that still lacks marks: grey and «entered/needed» (H-3). */
.gs-total.is-partial { color: var(--mfl-muted, #5f6b76); font-weight: 500; }
.gs-total-count { margin-inline-start: .3rem; font-size: .75rem; font-weight: 500; }

/* Cells. In edit mode each one reads as a field (H-5); an error says what is wrong under it (H-4). */
.gs-table td.grade-cell { min-width: 80px; padding: 0; vertical-align: top; }
.gs-table .cell-input { box-shadow: none; font-size: .95rem; }
.gs-table .cell-input:disabled { background: #f8f9fa; color: #495057; }
.gs-editing .gs-table .cell-input:not(:disabled) { box-shadow: inset 0 0 0 1px #878f99; border-radius: .25rem; background-color: #fff; }
.gs-sheet .gs-table .cell-input:focus { background: #fffbe6; box-shadow: inset 0 0 0 2px #1f2933; }
.gs-sheet .gs-table .cell-input.is-invalid { background-image: none; padding-inline-end: .5rem; box-shadow: inset 0 0 0 2px #b42318; }
.cell-inner { position: relative; }
.cell-flag { position: absolute; top: 1px; right: 2px; font-size: .75rem; line-height: 1; pointer-events: none; }
.cell-msg { font-size: .75rem; line-height: 1.2; padding: .15rem .25rem .25rem; color: #9b1c13; white-space: nowrap; }
[x-cloak] { display: none !important; }

@media (max-width: 767.98px) {
    /* Edge to edge on phones: the pane drops its frame and padding (H-1). */
    .gs-panes { border: 0 !important; padding: 0 !important; }
    .gs-tab-table thead th { font-size: .8125rem; padding: .35rem .5rem; }
    .gs-table .cell-input { font-size: 16px; }
}
[data-bs-theme=dark] .gs-table thead th, [data-bs-theme=dark] .gs-table thead .gs-sticky { background: #2a2f35; }
[data-bs-theme=dark] .gs-col-derived { background: rgba(255,255,255,.06); }
[data-bs-theme=dark] .gs-editing .gs-table .cell-input:not(:disabled) { background-color: transparent; box-shadow: inset 0 0 0 1px #6b7580; }

/* ---------------------------------------------------------------- dashboard (C1) */
.mfl-section-title { font-size: 1rem; font-weight: 600; margin: 0 0 .75rem; }
.mfl-dashboard-lead { font-size: 1rem; margin: -.25rem 0 1rem; color: var(--pe-body-color); }
/* Below 50: icon and words, in the AA danger ink; never colour alone. */
.mfl-attention { color: #9b1c13; font-weight: 600; white-space: nowrap; }
[data-bs-theme=dark] .mfl-attention { color: #f19a92; }

/* «Before closing» summary: done in green with a check, pending with a warning icon and its link. */
.mfl-checklist { list-style: none; padding: 0; margin: 0; }
.mfl-checklist li { display: flex; align-items: baseline; gap: .6rem; padding: .6rem 0; border-top: 1px solid var(--mfl-line, #dfe3e7); }
.mfl-checklist li:first-child { border-top: 0; padding-top: 0; }
.mfl-checklist li > i { font-size: 1rem; line-height: 1; color: #8a5300; }
.mfl-checklist li.is-done { color: var(--pe-secondary-color); }
.mfl-checklist li.is-done > i { color: #1a7f4b; }
.mfl-checklist a { font-weight: 600; }

/* Marks entered by level × language: each cell opens the groups list with that filter. */
.mfl-matrix th[scope=row] { font-weight: 600; color: var(--pe-body-color); width: 3.5rem; }
.mfl-matrix td { min-width: 6.5rem; }
.mfl-matrix-cell { display: block; text-decoration: none; color: inherit; border-radius: .375rem; padding: .25rem .375rem; margin: -.25rem -.375rem; }
.mfl-matrix-cell:hover { background: var(--mfl-surface-2, #f3f5f7); text-decoration: none !important; }
.mfl-matrix-cell .mfl-progress { display: block; height: .375rem; }
.mfl-matrix-value { display: block; font-weight: 600; font-variant-numeric: tabular-nums; margin-bottom: .25rem; }

/* A short list of destinations with a line of explanation each (instead of same-size cards). */
.mfl-link-list { list-style: none; padding: 0; margin: 0; }
.mfl-link-list a { display: grid; grid-template-columns: 1fr auto; column-gap: .75rem; padding: .7rem 0; border-top: 1px solid var(--mfl-line, #dfe3e7); color: inherit; text-decoration: none; }
.mfl-link-list li:first-child a { border-top: 0; padding-top: 0; }
.mfl-link-list strong { font-weight: 600; }
.mfl-link-list span { grid-column: 1; color: var(--pe-secondary-color); font-size: .875rem; }
.mfl-link-list i { grid-column: 2; grid-row: 1 / span 2; align-self: center; color: #8a949e; font-size: 1.25rem; }
.mfl-link-list a:hover strong { text-decoration: underline; text-underline-offset: 2px; }

/* ---------------------------------------------------------------- evaluation template (PL-1) */
.mfl-tree .mfl-tree-label { display: inline-block; padding-inline-start: calc(var(--depth, 0) * 1.25rem); }
.mfl-tree tr.mfl-tree-root td, .mfl-tree tr.mfl-tree-block td { font-weight: 600; }
.mfl-tree tr.mfl-tree-block td { background: var(--mfl-surface-2, #f3f5f7); }
@media (max-width: 767.98px) {
    /* Phones: the sentence goes under its label instead of a squeezed third column. */
    .mfl-tree thead { display: none; }
    .mfl-tree tr { display: grid; grid-template-columns: 1fr auto; }
    .mfl-tree > :not(caption) > * > * { display: block; border-bottom: 0; padding: .5rem .25rem 0 !important; }
    .mfl-tree td.mfl-tree-how { grid-column: 1 / -1; padding: .15rem .25rem .6rem calc(var(--depth, 0) * 1.25rem + .25rem) !important;
        border-bottom: 1px solid var(--mfl-line, #dfe3e7); font-weight: 400 !important; color: var(--pe-secondary-color); font-size: .875rem; }
}
.mfl-details > summary { cursor: pointer; font-weight: 600; color: var(--pe-body-color); }
.mfl-details > summary:hover { text-decoration: underline; text-underline-offset: 2px; }

/* ---------------------------------------------------------------- K12 panel: values to copy (I-3) */
.mfl-copy {
    display: inline-flex; align-items: center; gap: .3rem; padding: .2rem .4rem; margin: -.2rem -.4rem;
    border: 0; border-radius: .375rem; background: transparent; color: var(--pe-body-color);
    font-weight: 600; font-variant-numeric: tabular-nums; cursor: copy;
}
.mfl-copy i { font-size: .875rem; color: #6b7580; opacity: 0; transition: opacity .15s ease-out; }
.mfl-copy:hover, .mfl-copy:focus-visible { background: var(--mfl-surface-2, #f3f5f7); }
.mfl-copy:hover i, .mfl-copy:focus-visible i { opacity: 1; }
.mfl-copy.is-copied { background: #e4f0e9; color: #14663c; }
.mfl-copy.is-copied i { opacity: 1; color: #14663c; }
@media (hover: none) { .mfl-copy i { opacity: .7; } }

/* ---------------------------------------------------------------- report filters in one row (I-4) */
.mfl-filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .75rem 1rem; }
.mfl-filter { flex: 0 1 auto; min-width: 7rem; }
.mfl-filter .form-label { font-size: .8125rem; margin-bottom: .25rem; color: var(--pe-secondary-color); }
.mfl-filter .form-select { width: auto; min-width: 100%; }
.mfl-filter-submit { min-width: 0; }
.mfl-check-toggle { min-width: 10rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.js-check-dropdown .dropdown-menu .form-check { padding-block: .2rem; }
@media (max-width: 575.98px) {
    .mfl-filter { flex: 1 1 calc(50% - .5rem); }
    .mfl-filter .form-select, .mfl-check-toggle { width: 100%; min-width: 0; }
    .mfl-filter-submit { flex-basis: 100%; }
    .mfl-filter-submit .btn { width: 100%; }
}
.mfl-link-list--large a { padding: 1rem 0; }
.mfl-link-list--large strong { font-size: 1rem; }
.mfl-link-list--large span { padding-inline-start: 1.75rem; }

/* ---------------------------------------------------------------- dark theme: surfaces added in blocks 4–6 */
[data-bs-theme=dark] .mfl-matrix-cell:hover,
[data-bs-theme=dark] .mfl-copy:hover, [data-bs-theme=dark] .mfl-copy:focus-visible,
[data-bs-theme=dark] .mfl-tree tr.mfl-tree-block td { background: rgba(255, 255, 255, .06); }
[data-bs-theme=dark] .mfl-copy.is-copied { background: rgba(26, 127, 75, .25); color: #8fd8ae; }
[data-bs-theme=dark] .mfl-checklist li > i { color: #ffd18a; }
[data-bs-theme=dark] .mfl-checklist li.is-done > i { color: #8fd8ae; }
[data-bs-theme=dark] .gs-swatch { background: rgba(255, 255, 255, .06); border-color: #6b7580; }
[data-bs-theme=dark] .gs-table .gs-sticky { background-color: var(--pe-secondary-bg); }
[data-bs-theme=dark] .mfl-progress { background: rgba(255, 255, 255, .12); }
[data-bs-theme=dark] .mfl-progress > span { background: #9aa3ac; }