:root {
    --sidebar-width: 280px;
}

/* ===== Theme utility layer ===== */

.theme-surface {
    background: var(--surface, var(--bs-body-bg)) !important;
    color: var(--text, var(--bs-body-color)) !important;
    border-color: var(--border-color, rgba(0, 0, 0, 0.08)) !important;
}

.theme-surface-soft {
    background: var(--surface-soft, color-mix(in srgb, var(--surface, #fff) 92%, var(--primary, #0d6efd) 8%)) !important;
    color: var(--text, var(--bs-body-color)) !important;
    border-color: var(--border-color, rgba(0, 0, 0, 0.08)) !important;
}

.theme-muted {
    color: var(--muted, var(--bs-secondary-color)) !important;
}

.theme-label {
    color: var(--muted, var(--bs-secondary-color)) !important;
    font-size: 0.78rem;
    font-weight: 600;
}

.theme-border {
    border-color: var(--border-color, rgba(0, 0, 0, 0.08)) !important;
}

.theme-table-head th,
.theme-table-head td {
    background: var(--surface-soft, color-mix(in srgb, var(--surface, #fff) 92%, var(--primary, #0d6efd) 8%)) !important;
    color: var(--muted, var(--bs-secondary-color)) !important;
    border-color: var(--border-color, rgba(0, 0, 0, 0.08)) !important;
    font-weight: 700;
}

.theme-table-head th[aria-sort] {
    position: relative;
    padding: 0 !important;
}

.theme-table-sort-button {
    width: 100%;
    min-height: 36px;
    border: 0;
    background: transparent;
    color: inherit;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.52rem 0.9rem;
    font: inherit;
    font-weight: inherit;
    text-align: left;
    transition: color 0.18s ease, background 0.18s ease;
}

.theme-table-sort-button:hover,
.theme-table-sort-button:focus-visible {
    background: color-mix(in srgb, var(--surface, #fff) 74%, var(--primary, #0d6efd) 26%);
    color: var(--text-main, var(--bs-body-color));
    outline: none;
}

.theme-table-sort-button__label {
    min-width: 0;
}

.theme-table-sort-button__icon {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.78rem;
    line-height: 1;
    flex: 0 0 auto;
}

.theme-table-head th[aria-sort="ascending"] .theme-table-sort-button,
.theme-table-head th[aria-sort="descending"] .theme-table-sort-button {
    color: var(--text-main, var(--bs-body-color));
}

.theme-table-head th[aria-sort="ascending"] .theme-table-sort-button__icon,
.theme-table-head th[aria-sort="descending"] .theme-table-sort-button__icon {
    color: var(--primary, var(--bs-primary));
}

.theme-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    padding: 0.35rem 0.55rem;
    border-radius: 999px;
    font-size: 0.74rem;
    font-weight: 600;
    background: var(--surface-soft, color-mix(in srgb, var(--surface, #fff) 90%, var(--primary, #0d6efd) 10%));
    color: var(--text, var(--bs-body-color));
    border: 1px solid var(--border-color, rgba(0, 0, 0, 0.08));
}

.theme-badge-soft {
    background: var(--surface-soft, color-mix(in srgb, var(--surface, #fff) 90%, var(--primary, #0d6efd) 10%)) !important;
    color: var(--text, var(--bs-body-color)) !important;
    border: 1px solid var(--border-color, rgba(0, 0, 0, 0.08)) !important;
}

.theme-badge-success {
    background: color-mix(in srgb, #198754 18%, var(--surface, #fff)) !important;
    color: var(--text, var(--bs-body-color)) !important;
    border: 1px solid color-mix(in srgb, #198754 35%, var(--border-color, rgba(0, 0, 0, 0.08))) !important;
}

.theme-badge-danger {
    background: color-mix(in srgb, #dc3545 18%, var(--surface, #fff)) !important;
    color: var(--text, var(--bs-body-color)) !important;
    border: 1px solid color-mix(in srgb, #dc3545 35%, var(--border-color, rgba(0, 0, 0, 0.08))) !important;
}

.theme-badge-warning {
    background: color-mix(in srgb, #fd7e14 18%, var(--surface, #fff)) !important;
    color: var(--text, var(--bs-body-color)) !important;
    border: 1px solid color-mix(in srgb, #fd7e14 35%, var(--border-color, rgba(0, 0, 0, 0.08))) !important;
}

.theme-badge-info {
    background: color-mix(in srgb, #0dcaf0 18%, var(--surface, #fff)) !important;
    color: var(--text, var(--bs-body-color)) !important;
    border: 1px solid color-mix(in srgb, #0dcaf0 35%, var(--border-color, rgba(0, 0, 0, 0.08))) !important;
}

.theme-link {
    color: var(--primary, var(--bs-primary)) !important;
    text-decoration: none;
}

.theme-link:hover {
    filter: brightness(0.95);
    text-decoration: underline;
}

.theme-empty {
    color: var(--muted, var(--bs-secondary-color)) !important;
    text-align: center;
    padding: 1rem 0;
}

.theme-page {
    display: grid;
    gap: 1.25rem;
}

.theme-page-hero,
.theme-panel,
.theme-metric {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--bs-border-color));
    border-radius: 1.2rem;
    box-shadow: var(--card-shadow, 0 14px 30px rgba(15, 23, 42, 0.08));
    overflow: hidden;
}

.theme-page-hero__accent {
    height: 0.42rem;
    background: linear-gradient(90deg, var(--primary, var(--bs-primary)), var(--bs-info), var(--bs-warning));
}

.theme-page-hero__body,
.theme-panel-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.theme-page-hero__body {
    padding: 1.35rem 1.45rem;
}

.theme-page-kicker,
.theme-panel-kicker,
.theme-metric-label {
    color: var(--primary, var(--bs-primary));
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.theme-page-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.65rem, 2.1vw, 2.25rem);
    font-weight: 700;
    line-height: 1.12;
    letter-spacing: -0.035em;
    margin: 0.2rem 0 0;
}

.theme-page-subtitle,
.theme-panel-subtitle,
.theme-metric-hint {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.theme-page-subtitle {
    max-width: 48rem;
    font-size: 0.94rem;
    line-height: 1.55;
    margin: 0.45rem 0 0;
}

.theme-page-actions,
.theme-panel-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.55rem;
    flex-wrap: wrap;
}

.theme-metrics-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
    gap: 1rem;
}

.theme-metric {
    padding: 1rem 1.1rem;
}

.theme-metric-label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.theme-metric-value {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.45rem, 2vw, 1.9rem);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.035em;
    margin-top: 0.45rem;
}

.theme-metric-hint {
    font-size: 0.8rem;
    margin-top: 0.2rem;
}

.theme-content-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
}

.theme-content-grid--split {
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.85fr);
    align-items: start;
}

.theme-panel-header {
    padding: 1rem 1.15rem;
    border-bottom: 1px solid var(--table-border, var(--card-border));
    background: var(--table-head-bg, var(--surface-soft));
}

.theme-panel-header--plain {
    background: transparent;
}

.theme-panel-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.05rem;
    font-weight: 700;
    margin: 0.2rem 0 0;
}

.theme-panel-subtitle {
    font-size: 0.84rem;
    line-height: 1.45;
    margin: 0.2rem 0 0;
}

.theme-panel-body {
    padding: 1.15rem;
}

.theme-filter-panel .theme-panel-body {
    padding: 1.15rem;
}

.theme-table-wrap {
    overflow-x: auto;
}

.theme-table-wrap .table {
    margin-bottom: 0;
}

.theme-table-card .theme-table-wrap,
.theme-panel > .theme-table-wrap {
    border-radius: 0 0 1.2rem 1.2rem;
}

.theme-page .btn {
    font-weight: 500;
}

@media (max-width: 991.98px) {
    .theme-content-grid--split {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .theme-page-hero__body,
    .theme-panel-header {
        align-items: stretch;
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .theme-page-actions,
    .theme-panel-actions {
        justify-content: flex-start;
        width: 100%;
    }

    .theme-page-actions .btn,
    .theme-panel-actions .btn {
        flex: 1 1 12rem;
        justify-content: center;
    }

    .theme-panel-body,
    .theme-filter-panel .theme-panel-body {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

html[data-theme="custom"] {

    --surface: #ffffff;
    --surface-soft: #fef7f1;
    --text: #21323a;
    --muted: #5f6f76;
    --border-color: rgba(9, 124, 135, 0.18);
    --primary: #097C87;

    --sidebar-bg: linear-gradient(180deg, #097C87 0%, #23CED9 100%);
    --sidebar-muted: #F9D779;
    --sidebar-text: #f8fffe;
    --sidebar-active: linear-gradient(135deg, #FCA47C 0%, #F9D779 100%);
    --sidebar-hover: rgba(255,255,255,0.16);

    --app-bg: linear-gradient(180deg, #fffdf9 0%, #f7fffe 55%, #f6fbf7 100%);
    --surface: rgba(255,255,255,0.97);
    --surface-strong: #ffffff;
    --surface-muted: #fff9ef;

    --card-border: #dbeeed;
    --card-shadow: 0 14px 30px rgba(9, 124, 135, 0.10);

    --text-main: #21323a;
    --text-muted: #61747c;
    --text-soft: #88a0a4;

    --primary: #097C87;
    --primary-hover: #076771;
    --primary-soft: #e7f9fb;

    --success-soft: #eef8f0;
    --warning-soft: #fff6da;
    --danger-soft: #fff0e9;

    --pill-border: #d6e9e7;
    --pill-border-hover: #bcded9;
    --pill-bg: #ffffff;
    --pill-bg-hover: #f6fffe;
    --pill-selected-bg: #e7f9fb;
    --pill-selected-border: #23CED9;
    --pill-selected-text: #076771;

    --input-bg: #ffffff;
    --input-border: #cfe7e5;
    --table-head-bg: #f9fffe;
    --table-border: #deefed;
    --table-row-hover: #f5fffd;
    --topbar-bg: rgba(255,255,255,0.86);

    --btn-outline-neutral-bg: transparent;
    --btn-outline-neutral-border: #cfe2df;
    --btn-outline-neutral-text: #2d5056;
    --btn-outline-neutral-hover-bg: #f7fffd;
    --btn-outline-neutral-hover-text: #16363b;

    --bs-body-bg: #fffdf9;
    --bs-body-color: #21323a;
    --bs-primary: #097C87;
    --bs-secondary: #23CED9;
    --bs-success: #A1CCA6;
    --bs-info: #23CED9;
    --bs-warning: #F9D779;
    --bs-danger: #FCA47C;
    --bs-light: #fff9ef;
    --bs-dark: #21323a;
    --bs-border-color: #deefed;
    --bs-link-color: #097C87;
    --bs-link-hover-color: #076771;
}

html[data-theme="dark"] {

    --surface: #111827;
    --surface-soft: #1f2937;
    --text: #f3f4f6;
    --muted: #cbd5e1;
    --border-color: rgba(255, 255, 255, 0.12);
    --primary: #60a5fa;

    --sidebar-bg: linear-gradient(180deg, #0d1524 0%, #121c2f 100%);
    --sidebar-muted: #9fb0c7;
    --sidebar-text: #edf3fb;
    --sidebar-active: linear-gradient(135deg, #4f8df7 0%, #2563eb 100%);
    --sidebar-hover: rgba(255,255,255,0.06);

    --app-bg: linear-gradient(180deg, #0b1220 0%, #111827 100%);
    --surface: rgba(20, 29, 45, 0.96);
    --surface-strong: #162133;
    --surface-muted: #1b2840;

    --card-border: #304159;
    --card-shadow: 0 16px 34px rgba(0, 0, 0, 0.34);

    --text-main: #edf3fb;
    --text-muted: #b8c4d6;
    --text-soft: #90a0b7;

    --primary: #7ab2ff;
    --primary-hover: #5b9bff;
    --primary-soft: #162946;

    --success-soft: #123021;
    --warning-soft: #3a2a13;
    --danger-soft: #3a171c;

    --pill-border: #40536d;
    --pill-border-hover: #536883;
    --pill-bg: #152033;
    --pill-bg-hover: #1a2940;
    --pill-selected-bg: #17345f;
    --pill-selected-border: #7ab2ff;
    --pill-selected-text: #e4f0ff;

    --input-bg: #101a2b;
    --input-border: #41546f;
    --table-head-bg: #182539;
    --table-border: #304159;
    --table-row-hover: #16253a;
    --topbar-bg: rgba(11, 18, 32, 0.88);

    --btn-outline-neutral-bg: transparent;
    --btn-outline-neutral-border: #445874;
    --btn-outline-neutral-text: #d9e3f0;
    --btn-outline-neutral-hover-bg: #182539;
    --btn-outline-neutral-hover-text: #ffffff;

    --bs-body-bg: #0b1220;
    --bs-body-color: #edf3fb;
    --bs-primary: #7ab2ff;
    --bs-secondary: #9fb0c7;
    --bs-success: #7dd3a0;
    --bs-info: #67d4ff;
    --bs-warning: #f8cf76;
    --bs-danger: #ff9e9e;
    --bs-light: #1b2840;
    --bs-dark: #edf3fb;
    --bs-border-color: #304159;
    --bs-link-color: #7ab2ff;
    --bs-link-hover-color: #a8ccff;
}

* {
    box-sizing: border-box;
}

body {
    background: var(--app-bg);
    min-height: 100vh;
    color: var(--text-main);
    font-family: Inter, "Segoe UI", Roboto, Arial, sans-serif;
}

a {
    color: var(--primary);
    text-decoration: none;
}

a:hover {
    color: var(--primary-hover);
}

.app-shell {
    min-height: 100vh;
}

.app-sidebar {
    width: var(--sidebar-width);
    background: var(--sidebar-bg);
    color: var(--sidebar-text);
    position: fixed;
    /* Above page/header layers, below Bootstrap backdrops and dialogs. */
    z-index: 1030;
    top: 0;
    left: 0;
    bottom: 0;
    padding: 1.35rem 1rem;
    overflow-y: auto;
    border-right: 1px solid rgba(255,255,255,0.06);
    box-shadow: 8px 0 24px rgba(15, 23, 42, 0.14);
}

.sidebar-brand {
    display: block;
    text-decoration: none;
    color: #fff;
    margin-bottom: 1.75rem;
    padding: 0.35rem 0.45rem;
    border-radius: 1rem;
}

.sidebar-brand-title {
    font-size: 1.28rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.02em;
}

.sidebar-brand-sub {
    color: var(--sidebar-muted);
    font-size: 0.83rem;
    margin-top: 0.22rem;
}

.sidebar-section-title {
    color: var(--sidebar-muted);
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    margin: 1.35rem 0 0.7rem;
    padding: 0 0.6rem;
    font-weight: 700;
}

.sidebar-section {
    margin-top: 0.9rem;
}

.sidebar-section:first-of-type {
    margin-top: 0;
}

.sidebar-section-toggle {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    border: 0;
    background: transparent;
    color: var(--sidebar-muted);
    padding: 0.25rem 0.6rem 0.55rem;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-weight: 700;
    transition: color 0.18s ease, background 0.18s ease;
}

.sidebar-section-toggle:hover {
    color: #ffffff;
}

.sidebar-section-toggle:focus-visible {
    outline: 2px solid rgba(255,255,255,0.38);
    outline-offset: 2px;
    border-radius: 0.75rem;
}

.sidebar-section-title-text {
    text-align: left;
}

.sidebar-section-chevron {
    width: 0.7rem;
    height: 0.7rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform 0.18s ease;
    flex: 0 0 auto;
    margin-right: 0.15rem;
}

.sidebar-section-toggle[aria-expanded="true"] .sidebar-section-chevron {
    transform: rotate(225deg);
}

.sidebar-section .sidebar-nav {
    padding-bottom: 0.15rem;
}

.sidebar-nav {
    display: flex;
    flex-direction: column;
    gap: 0.38rem;
}

.sidebar-link {
    color: var(--sidebar-text);
    text-decoration: none;
    padding: 0.8rem 0.9rem;
    border-radius: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    transition: background 0.18s ease, color 0.18s ease, transform 0.12s ease, box-shadow 0.18s ease;
    font-size: 0.95rem;
}

.sidebar-link:hover {
    background: var(--sidebar-hover);
    color: #fff;
    transform: translateX(1px);
}

.sidebar-link.current-page {
    background: var(--sidebar-active);
    color: #fff;
    box-shadow: 0 10px 22px rgba(37, 99, 235, 0.28);
}

.sidebar-link-main {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.sidebar-icon {
    width: 1.2rem;
    text-align: center;
    opacity: 0.96;
    flex: 0 0 auto;
    font-size: 0.98rem;
}

.sidebar-label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 500;
}

.sidebar-link-muted {
    color: rgba(255,255,255,0.74);
    font-size: 0.74rem;
    flex: 0 0 auto;
}

.sidebar-global-search {
    position: relative;
    margin: 0.2rem 0 1rem;
}

.sidebar-global-search-field {
    position: relative;
}

.sidebar-global-search-icon {
    position: absolute;
    left: 0.85rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--sidebar-muted);
    pointer-events: none;
}

.sidebar-global-search-input {
    width: 100%;
    min-height: 42px;
    border: 1px solid rgba(255,255,255,0.16);
    border-radius: 0.95rem;
    background: rgba(255,255,255,0.12);
    color: var(--sidebar-text);
    padding: 0.62rem 0.85rem 0.62rem 2.35rem;
    font-size: 0.88rem;
    outline: none;
}

.sidebar-global-search-input::placeholder {
    color: color-mix(in srgb, var(--sidebar-text) 74%, transparent);
}

.sidebar-global-search-input:focus {
    border-color: color-mix(in srgb, var(--sidebar-muted) 72%, transparent);
    background: rgba(255,255,255,0.16);
    box-shadow: 0 0 0 0.18rem rgba(255,255,255,0.08);
}

.sidebar-global-search-results {
    display: none;
    margin-top: 0.55rem;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 1rem;
    background: color-mix(in srgb, var(--surface, #fff) 94%, var(--primary, #0d6efd) 6%);
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.22);
    overflow: hidden;
}

.sidebar-global-search.is-open .sidebar-global-search-results {
    display: block;
}

.sidebar-global-search-result {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.65rem;
    padding: 0.72rem 0.82rem;
    color: var(--text-main, var(--text, var(--bs-body-color)));
    text-decoration: none;
    border-bottom: 1px solid color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 76%, transparent);
}

.sidebar-global-search-result:last-child {
    border-bottom: 0;
}

.sidebar-global-search-result:hover,
.sidebar-global-search-result:focus {
    background: var(--table-row-hover, color-mix(in srgb, var(--primary, #0d6efd) 8%, transparent));
    color: var(--text-main, var(--text, var(--bs-body-color)));
}

.sidebar-global-search-result-icon {
    width: 1.35rem;
    height: 1.35rem;
    border-radius: 0.45rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--primary, var(--bs-primary));
    background: var(--primary-soft, color-mix(in srgb, var(--primary, #0d6efd) 14%, transparent));
    font-size: 0.82rem;
}

.sidebar-global-search-result-title {
    display: block;
    color: var(--text-main, var(--text, var(--bs-body-color)));
    font-size: 0.88rem;
    font-weight: 650;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sidebar-global-search-result-meta {
    display: block;
    margin-top: 0.16rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.74rem;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sidebar-global-search-empty,
.sidebar-global-search-status {
    padding: 0.75rem 0.85rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.82rem;
}

.sidebar-quick-access-nav {
    margin-bottom: 0.9rem;
}

html.sidebar-mini .app-sidebar .sidebar-global-search {
    display: none;
}

.offcanvas-sidebar .sidebar-global-search {
    margin: 0 0 1rem;
}

.offcanvas-sidebar .sidebar-global-search-results {
    max-height: 45vh;
    overflow-y: auto;
}

.sidebar-badge {
    font-size: 0.68rem;
    background: rgba(255,255,255,0.18);
    color: #fff;
    padding: 0.2rem 0.46rem;
    border-radius: 999px;
    font-weight: 600;
}

.app-main {
    margin-left: var(--sidebar-width);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.app-topbar {
    background: var(--topbar-bg);
    backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--card-border);
    padding: 1rem 1.5rem;
    position: sticky;
    top: 0;
    z-index: 30;
}

.app-topbar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.app-topbar-heading {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.app-topbar-copy {
    min-width: 0;
}

.app-topbar-title {
    font-size: 1.15rem;
    font-weight: 700;
    margin: 0;
    letter-spacing: -0.02em;
    color: var(--text-main);
}

.app-topbar-subtitle {
    font-size: 0.87rem;
    color: var(--text-muted);
    margin: 0.15rem 0 0;
}

.app-content {
    padding: 1.5rem;
}

.card {
    background: var(--surface);
    border: 1px solid var(--card-border);
    border-radius: 1.15rem;
    box-shadow: var(--card-shadow);
}

/* Theme-aware list groups and light utility surfaces */
.list-group {
    --bs-list-group-bg: var(--surface);
    --bs-list-group-border-color: var(--card-border);
    --bs-list-group-color: var(--text-main);
    --bs-list-group-action-color: var(--text-main);
    --bs-list-group-action-hover-color: var(--text-main);
    --bs-list-group-action-active-color: var(--text-main);
    --bs-list-group-action-hover-bg: var(--table-row-hover);
    --bs-list-group-action-active-bg: var(--surface-muted);
    --bs-list-group-active-bg: var(--primary);
    --bs-list-group-active-border-color: var(--primary);
}

.list-group-item,
.list-group-item-action {
    background: var(--surface) !important;
    color: var(--text-main) !important;
    border-color: var(--card-border) !important;
}

.list-group-item-action:hover,
.list-group-item-action:focus {
    background: var(--table-row-hover) !important;
    color: var(--text-main) !important;
}

.list-group-item .text-muted,
.list-group-item small,
.list-group-item .small {
    color: var(--text-muted) !important;
}

.list-group-item .badge,
.card .badge,
.app-content .badge {
    color: inherit;
}

.bg-light,
.card .bg-light,
.app-content .bg-light,
.text-bg-light {
    background: var(--surface-muted) !important;
    color: var(--text-main) !important;
    border-color: var(--card-border) !important;
}

.table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--text-main);
    --bs-table-border-color: var(--table-border);
    --bs-table-striped-color: var(--text-main);
    --bs-table-hover-color: var(--text-main);
    color: var(--text-main) !important;
}

.table > :not(caption) > * > * {
    padding-top: 0.82rem;
    padding-bottom: 0.82rem;
    border-color: var(--table-border) !important;
    color: var(--text-main) !important;
    background-color: transparent !important;
}

.table thead.table-light th,
.table thead th,
.table-light th {
    background: var(--table-head-bg) !important;
    color: var(--text-main) !important;
    font-size: 0.84rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    border-bottom: 1px solid var(--table-border) !important;
}

.table tbody tr:hover > * {
    background: var(--table-row-hover) !important;
    color: var(--text-main) !important;
}

.table td,
.table th,
.table span,
.table small,
.table strong,
.table div,
.table p,
.table a,
.table .text-muted {
    color: inherit !important;
}

.table a {
    color: var(--primary) !important;
    font-weight: 500;
}

.table a:hover {
    color: var(--primary-hover) !important;
}

.table .badge.text-bg-light {
    background: var(--surface-muted) !important;
    color: var(--text-main) !important;
    border: 1px solid var(--card-border);
}

html[data-theme="dark"] .table .badge.text-bg-light {
    color: var(--text-main) !important;
    border-color: var(--card-border);
}

.form-label {
    font-weight: 600;
    color: var(--text-main);
    margin-bottom: 0.45rem;
}

.form-control,
.form-select {
    border-radius: 0.9rem;
    border: 1px solid var(--input-border);
    padding: 0.68rem 0.85rem;
    background: var(--input-bg);
    color: var(--text-main);
    box-shadow: none;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 0.22rem rgba(59, 130, 246, 0.14);
    background: var(--input-bg);
    color: var(--text-main);
}

.form-control::placeholder {
    color: var(--text-soft);
}

.form-select option {
    background: var(--surface-strong);
    color: var(--text-main);
}

textarea.form-control {
    min-height: 110px;
}

.form-text {
    color: var(--text-muted);
    font-size: 0.82rem;
}

.form-check-input {
    border-color: #94a3b8;
    background-color: transparent;
}

.form-check-input:checked {
    background-color: var(--primary);
    border-color: var(--primary);
}

.btn {
    border-radius: 0.9rem;
    font-weight: 600;
    padding: 0.62rem 0.95rem;
    transition: all 0.18s ease;
}

.btn-primary {
    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-hover) 100%);
    border-color: var(--primary-hover);
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(37, 99, 235, 0.18);
}

.btn-primary:hover,
.btn-primary:focus {
    filter: brightness(0.98);
    transform: translateY(-1px);
    color: #ffffff;
}

.btn-outline-primary {
    border-color: rgba(96, 165, 250, 0.35);
    color: var(--primary);
    background: transparent;
}

.btn-outline-primary:hover {
    background: var(--primary-soft);
    border-color: rgba(96, 165, 250, 0.5);
    color: var(--primary-hover);
}

.btn-outline-secondary {
    border-color: var(--btn-outline-neutral-border);
    color: var(--btn-outline-neutral-text);
    background: var(--btn-outline-neutral-bg);
}

.btn-outline-secondary:hover {
    background: var(--btn-outline-neutral-hover-bg);
    border-color: var(--btn-outline-neutral-border);
    color: var(--btn-outline-neutral-hover-text);
}

.alert {
    border-radius: 1rem;
    border: 1px solid transparent;
}

.alert-info {
    background: var(--primary-soft);
    border-color: rgba(96, 165, 250, 0.18);
    color: var(--text-main);
}

.alert-success {
    background: var(--success-soft);
    border-color: rgba(34,197,94,0.18);
    color: var(--text-main);
}

.alert-warning {
    background: var(--warning-soft);
    border-color: rgba(245,158,11,0.18);
    color: var(--text-main);
}

.alert-danger {
    background: var(--danger-soft);
    border-color: rgba(239,68,68,0.18);
    color: var(--text-main);
}

.badge {
    border-radius: 999px;
    padding: 0.48em 0.7em;
    font-weight: 600;
    letter-spacing: 0.01em;
}

.text-muted {
    color: var(--text-muted) !important;
}

.display-6 {
    letter-spacing: -0.03em;
}

.theme-switcher-wrap {
    min-width: 220px;
}

.theme-switcher {
    background: var(--input-bg);
    color: var(--text-main);
    border: 1px solid var(--input-border);
    border-radius: 0.85rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.9rem;
    font-weight: 600;
}

.mobile-menu-btn {
    display: none;
}

.mobile-menu-btn--icon,
.account-menu-btn,
.topbar-notification-btn {
    align-items: center;
    justify-content: center;
    min-width: 2.35rem;
    min-height: 2.35rem;
    padding: 0;
    border-color: transparent;
    background: transparent;
    color: var(--text-main);
    box-shadow: none;
}

.mobile-menu-btn--icon:hover,
.mobile-menu-btn--icon:focus,
.account-menu-btn:hover,
.account-menu-btn:focus,
.topbar-notification-btn:hover,
.topbar-notification-btn:focus {
    border-color: transparent;
    background: var(--surface-muted);
    color: var(--primary);
    box-shadow: none;
}

.mobile-menu-btn--icon .pi-bars {
    font-size: 1.55rem;
    line-height: 1;
}

.account-menu-btn {
    display: inline-flex;
    gap: 0.3rem;
}

.account-menu-btn__avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.35rem;
    height: 2.35rem;
    flex: 0 0 auto;
    overflow: hidden;
    border: 1px solid var(--card-border, var(--bs-border-color));
    border-radius: 999px;
    background: var(--primary-soft, var(--surface-muted));
    color: var(--primary, var(--bs-primary));
    object-fit: cover;
}

.account-menu-btn__avatar--fallback .pi-user {
    font-size: 1.15rem;
    line-height: 1;
}

.account-menu-btn__chevron {
    font-size: 0.72rem;
}

.topbar-notification-btn {
    display: inline-flex;
    position: relative;
}

.topbar-notification-btn .pi-bell {
    font-size: 1.25rem;
    line-height: 1;
}

.topbar-notification-count {
    position: absolute;
    top: -0.15rem;
    right: -0.1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.05rem;
    min-height: 1.05rem;
    padding: 0 0.25rem;
    border-radius: 999px;
    background: var(--danger, var(--bs-danger));
    color: #fff;
    font-size: 0.64rem;
    font-weight: 700;
    line-height: 1;
}

.topbar-notification-menu {
    width: min(22rem, calc(100vw - 1.5rem));
    padding: 0.45rem;
    border: 1px solid var(--card-border);
    border-radius: 1rem;
    background: var(--surface);
    box-shadow: var(--card-shadow);
}

.topbar-notification-menu__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.55rem 0.65rem 0.7rem;
    color: var(--text-main);
    font-size: 0.82rem;
    font-weight: 700;
}

.topbar-notification-menu__header a {
    color: var(--primary);
    font-size: 0.78rem;
    text-decoration: none;
}

.sidebar-organization { min-width: 0; margin: .5rem 0 1rem; }
.sidebar-organization__toggle,
.sidebar-organization__identity { display: flex; align-items: center; gap: .5rem; width: 100%; min-width: 0; min-height: 44px; padding: .5rem; border: 1px solid var(--sidebar-muted); border-radius: .75rem; background: transparent; color: var(--sidebar-text); font: inherit; font-size: .8125rem; text-align: left; }
.sidebar-organization__toggle:hover { background: var(--sidebar-hover); }
.sidebar-organization__toggle:focus-visible { outline: 3px solid var(--sidebar-text); outline-offset: 2px; }
.sidebar-organization__avatar { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 32px; height: 32px; border-radius: .625rem; background: var(--sidebar-hover); font-weight: 700; }
.sidebar-organization__copy { display: grid; min-width: 0; flex: 1; }
.sidebar-organization__copy small { color: var(--sidebar-muted); }
.sidebar-organization__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-organization__options { max-height: 60vh; overflow-y: auto; }
.sidebar-organization__option { overflow-wrap: anywhere; }
.sidebar-organization__option[aria-current] { color: var(--giso-button-brand); opacity: 1; }
@media (min-width: 992px) {
    html.sidebar-mini .app-sidebar .sidebar-organization__copy,
    html.sidebar-mini .app-sidebar .sidebar-organization__toggle > .pi { display: none; }
    html.sidebar-mini .app-sidebar .sidebar-organization__toggle,
    html.sidebar-mini .app-sidebar .sidebar-organization__identity { justify-content: center; padding: .25rem; }
}

.topbar-account-menu {
    width: min(20rem, calc(100vw - 1.5rem));
    padding: 0.45rem;
    border: 1px solid var(--card-border);
    border-radius: 1rem;
    background: var(--surface);
    box-shadow: var(--card-shadow);
}

.topbar-account-menu__header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.75rem;
    padding: 0.65rem;
}

.topbar-account-menu__avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.85rem;
    height: 2.85rem;
    overflow: hidden;
    border: 1px solid var(--card-border, var(--bs-border-color));
    border-radius: 999px;
    background: var(--primary-soft, var(--surface-muted));
    color: var(--primary, var(--bs-primary));
    object-fit: cover;
}

.topbar-account-menu__avatar--fallback .pi {
    font-size: 1.3rem;
}

.topbar-account-menu__identity {
    display: grid;
    gap: 0.12rem;
    min-width: 0;
}

.topbar-account-menu__identity strong {
    color: var(--text-main);
    font-size: 0.9rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.topbar-account-menu__identity span {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.76rem;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.topbar-account-menu__links {
    display: grid;
    gap: 0.12rem;
    padding-top: 0.35rem;
    border-top: 1px solid var(--card-border, var(--bs-border-color));
}

.topbar-account-item {
    width: 100%;
    border: 0;
    background: transparent;
    font: inherit;
    line-height: 1.2;
    text-align: left;
}

.topbar-account-item .pi {
    width: 1.25rem;
    text-align: center;
}

.topbar-account-menu__footer {
    margin-top: 0.35rem;
    padding-top: 0.35rem;
    border-top: 1px solid var(--card-border, var(--bs-border-color));
}

.topbar-notification-item,
.notification-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.75rem;
    color: var(--text-main);
    text-decoration: none;
}

.topbar-notification-item {
    grid-template-columns: auto minmax(0, 1fr);
    padding: 0.7rem 0.65rem;
    border-radius: 0.85rem;
}

.topbar-notification-item:hover,
.topbar-notification-item:focus-visible {
    background: var(--surface-muted);
}

.topbar-notification-item__icon,
.notification-row__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--primary);
}

.topbar-notification-item__copy,
.notification-row__body {
    display: grid;
    gap: 0.15rem;
    min-width: 0;
}

.topbar-notification-item__title,
.notification-row__title {
    color: var(--text-main);
    font-size: 0.86rem;
    font-weight: 700;
    line-height: 1.2;
}

.topbar-notification-item__message,
.notification-row__message,
.topbar-notification-empty {
    color: var(--text-muted);
    font-size: 0.78rem;
    line-height: 1.25;
}

.topbar-notification-empty {
    padding: 0.8rem 0.65rem;
}

.notifications-filter {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
    gap: 1rem;
    align-items: end;
}

.notifications-filter__actions {
    display: flex;
    gap: 0.5rem;
}

.notifications-list {
    display: grid;
    gap: 0.65rem;
}

.notification-row {
    padding: 0.85rem;
    border: 1px solid var(--card-border);
    border-radius: 1rem;
    background: var(--surface);
}

.notification-row--unread,
.notification-row--action {
    background: var(--surface-muted);
}

.notification-row__icon {
    width: 2rem;
    height: 2rem;
    border-radius: 0.75rem;
    background: color-mix(in srgb, var(--primary) 12%, var(--surface) 88%);
}

.notification-row__badge {
    display: inline-flex;
    align-items: center;
    min-height: 1.55rem;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary) 12%, var(--surface) 88%);
    color: var(--primary);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
}

.app-topbar-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.app-language-form {
    position: relative;
}

.app-language-select {
    min-width: 3.45rem;
    width: auto;
    border-color: transparent;
    background-color: transparent;
    background-image: none;
    color: var(--text-main);
    box-shadow: none;
    font-weight: 600;
    padding-right: 1.1rem;
}

.app-language-select:hover,
.app-language-select:focus {
    border-color: transparent;
    background-color: var(--surface-muted);
    color: var(--primary);
    box-shadow: none;
}

.app-language-chevron {
    position: absolute;
    top: 50%;
    right: 0.25rem;
    transform: translateY(-50%);
    color: var(--text-muted);
    font-size: 0.72rem;
    line-height: 1;
    pointer-events: none;
}

.app-language-select:hover + .app-language-chevron,
.app-language-select:focus + .app-language-chevron {
    color: var(--primary);
}

.account-theme-switcher {
    max-width: 260px;
}

.offcanvas-sidebar {
    background: var(--sidebar-bg);
    color: var(--sidebar-text);
}

.offcanvas-sidebar .offcanvas-title {
    color: #fff;
    font-weight: 700;
}

.offcanvas-sidebar .btn-close {
    filter: invert(1);
}

.cf-pill-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 0.55rem;
    width: 100%;
}

.cf-pill-option {
    position: relative;
    display: block;
    border: 1px solid var(--pill-border);
    border-radius: 0.8rem;
    background: var(--pill-bg);
    transition: all 0.18s ease;
    cursor: pointer;
    overflow: hidden;
    width: 100%;
}

.cf-pill-option:hover {
    border-color: var(--pill-border-hover);
    background: var(--pill-bg-hover);
}

.cf-pill-option input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.cf-pill-option-body {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.65rem 0.75rem;
    min-height: 42px;
    width: 100%;
}

.cf-pill-check {
    width: 0.95rem;
    height: 0.95rem;
    border-radius: 999px;
    border: 2px solid #7b8aa2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.62rem;
    font-weight: 700;
    color: transparent;
    flex: 0 0 auto;
    transition: all 0.18s ease;
    background: transparent;
    line-height: 1;
}

html[data-theme="custom"] .cf-pill-check {
    background: #fff;
    border-color: #c7d2e3;
}

.cf-pill-label {
    font-size: 0.88rem;
    font-weight: 500;
    color: var(--text-main);
    line-height: 1.15;
    width: 100%;
}

.cf-pill-option.is-selected {
    border-color: var(--pill-selected-border);
    background: var(--pill-selected-bg);
    box-shadow: 0 3px 10px rgba(37, 99, 235, 0.08);
}

.cf-pill-option.is-selected .cf-pill-check {
    border-color: var(--pill-selected-border);
    background: var(--pill-selected-border);
    color: #fff;
}

.cf-pill-option.is-selected .cf-pill-label {
    color: var(--pill-selected-text);
    font-weight: 600;
}

.app-content h1,
.app-content h2,
.app-content h3,
.app-content h4,
.app-content h5,
.app-content h6,
.card h1,
.card h2,
.card h3,
.card h4,
.card h5,
.card h6,
.card .h1,
.card .h2,
.card .h3,
.card .h4,
.card .h5,
.card .h6 {
    color: var(--text-main) !important;
}

.app-content .text-dark,
.app-content .text-black,
.app-content .text-body,
.app-content .text-body-emphasis,
.card .text-dark,
.card .text-black,
.card .text-body,
.card .text-body-emphasis {
    color: var(--text-main) !important;
}

.app-content .text-secondary,
.app-content .text-muted,
.card .text-secondary,
.card .text-muted,
.card small,
.card .small {
    color: var(--text-muted) !important;
}

.card .fs-1,
.card .fs-2,
.card .fs-3,
.card .fs-4,
.card .fs-5,
.card .fs-6,
.card .display-1,
.card .display-2,
.card .display-3,
.card .display-4,
.card .display-5,
.card .display-6,
.card .fw-semibold,
.card .fw-bold,
.card .fw-bolder {
    color: var(--text-main) !important;
}

.card label,
.card .form-label {
    color: var(--text-main) !important;
}

.app-content .badge.text-bg-light {
    background: var(--surface-muted) !important;
    color: var(--text-main) !important;
    border: 1px solid var(--card-border);
}

.metric-number,
.summary-number,
.stat-number,
.kpi-number,
.record-count {
    color: var(--text-main) !important;
}

.metric-label,
.summary-label,
.stat-label,
.kpi-label,
.section-kicker {
    color: var(--text-muted) !important;
}

@media (max-width: 991.98px) {
    .app-sidebar {
        display: none;
    }

    .app-main {
        margin-left: 0;
    }

    .app-topbar {
        padding: 0.9rem 1rem;
    }

    .app-content {
        padding: 1rem;
    }

    .mobile-menu-btn {
        display: inline-flex;
    }

    .theme-switcher-wrap {
        min-width: 150px;
    }

    .app-topbar-inner {
        align-items: center;
    }

    .app-topbar-heading {
        flex: 1 1 auto;
    }

    .app-topbar-actions {
        flex: 0 0 auto;
    }
}

@media (max-width: 575.98px) {
    .cf-pill-grid {
        grid-template-columns: 1fr;
    }

    .cf-pill-option-body {
        padding: 0.6rem 0.7rem;
        min-height: 40px;
    }

    .cf-pill-label {
        font-size: 0.86rem;
    }

    .app-topbar {
        padding: 0.75rem;
    }

    .app-topbar-inner {
        align-items: center;
        flex-direction: row;
        gap: 0.65rem;
    }

    .app-topbar-heading {
        gap: 0.55rem;
        min-width: 0;
    }

    .app-topbar-actions {
        gap: 0.4rem;
        flex-wrap: nowrap;
    }

    .app-topbar-subtitle {
        display: none;
    }

    .app-language-select {
        min-width: 3.75rem;
        padding-left: 0.55rem;
        padding-right: 1.55rem;
    }

    .mobile-menu-btn--icon,
    .account-menu-btn,
    .topbar-notification-btn {
        min-width: 2.25rem;
        min-height: 2.25rem;
    }

    .topbar-notification-menu {
        width: calc(100vw - 1rem);
    }

    .notifications-filter,
    .notification-row {
        grid-template-columns: 1fr;
    }

    .notifications-filter__actions {
        flex-wrap: wrap;
    }
}

/* ===== People directory themed layout ===== */
.people-dir-hero,
.people-dir-filter,
.people-dir-card {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    border-radius: 1.25rem;
}

.people-dir-hero {
    overflow: hidden;
}

.people-dir-hero__accent {
    height: 0.5rem;
    background: linear-gradient(90deg, var(--primary, var(--bs-primary)), var(--bs-info), var(--bs-danger), var(--bs-warning));
}

.people-dir-hero__body {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem;
}

.people-dir-kicker {
    color: var(--primary, var(--bs-primary));
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.people-dir-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.75rem, 2.2vw, 2.25rem);
    font-weight: 700;
    letter-spacing: -0.03em;
}

.people-dir-subtitle {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    max-width: 42rem;
}

.people-dir-actions,
.people-dir-card__tools,
.people-dir-row-actions,
.people-dir-filter__buttons,
.people-dir-quickfilters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.people-dir-filter {
    padding: 1.25rem;
}

.people-dir-filter__grid {
    display: grid;
    gap: 1rem;
    align-items: end;
    grid-template-columns: minmax(18rem, 1.5fr) repeat(4, minmax(9rem, 0.8fr)) auto;
}

.people-dir-field {
    display: grid;
    gap: 0.35rem;
}

.people-dir-control {
    background-color: var(--input-bg, var(--surface, var(--bs-body-bg))) !important;
    color: var(--text-main, var(--bs-body-color)) !important;
    border-color: var(--input-border, var(--border-color, var(--bs-border-color))) !important;
    border-radius: 0.85rem !important;
    min-height: 2.75rem;
}

.people-dir-control:focus {
    border-color: var(--primary, var(--bs-primary)) !important;
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--primary, var(--bs-primary)) 20%, transparent) !important;
}

.people-dir-filter__buttons {
    min-width: 10rem;
}

.people-dir-quickfilters {
    margin-top: 1rem;
}

.people-dir-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    min-height: 1.9rem;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    background: var(--pill-bg, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
}

.people-dir-pill:hover,
.people-dir-pill.is-selected {
    color: var(--pill-selected-text, var(--primary, var(--bs-primary)));
    border-color: var(--pill-selected-border, var(--primary, var(--bs-primary)));
    background: var(--pill-selected-bg, var(--primary-soft, var(--surface-soft)));
    text-decoration: none;
}

.people-dir-pill--blue {
    background: color-mix(in srgb, var(--bs-info) 25%, var(--surface, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
}

.people-dir-pill--green {
    background: color-mix(in srgb, var(--bs-success) 26%, var(--surface, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
}

.people-dir-pill--gold {
    background: color-mix(in srgb, var(--bs-warning) 32%, var(--surface, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
}

.people-dir-pill--coral {
    background: color-mix(in srgb, var(--bs-danger) 24%, var(--surface, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
}

.people-dir-card__header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.25rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.people-dir-section-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.people-dir-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.25rem;
    min-height: 2.25rem;
    padding: 0.25rem 0.7rem;
    border-radius: 999px;
    background: var(--primary-soft, var(--surface-soft));
    color: var(--primary, var(--bs-primary));
    font-weight: 700;
}

.people-dir-table-wrap {
    border-radius: 0 0 1.25rem 1.25rem;
}

.people-dir-table {
    color: var(--text-main, var(--bs-body-color));
    min-width: 940px;
}

.people-dir-table th,
.people-dir-table td {
    padding: 0.95rem 1.25rem;
    border-color: var(--table-border, var(--border-color, var(--bs-border-color))) !important;
    vertical-align: middle;
}

.people-dir-table tbody tr:hover td {
    background: var(--table-row-hover, var(--surface-soft)) !important;
}

.people-dir-id {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-variant-numeric: tabular-nums;
}

.people-dir-person {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 14rem;
}

.people-dir-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--bs-info) 30%, var(--surface, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    flex: 0 0 auto;
}

.people-dir-name {
    color: var(--text-main, var(--bs-body-color)) !important;
    font-weight: 700;
}

.people-dir-contact {
    min-width: 13rem;
    color: var(--text-main, var(--bs-body-color));
}

.people-dir-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 0.7rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    border: 1px solid transparent;
    text-decoration: none;
}

.people-dir-icon-btn:hover {
    color: var(--primary, var(--bs-primary));
    border-color: var(--pill-border-hover, var(--border-color, var(--bs-border-color)));
    background: var(--pill-bg-hover, var(--surface-soft));
    text-decoration: none;
}

.theme-action-primary,
.btn-primary.theme-action-primary {
    background-color: var(--primary, var(--bs-primary)) !important;
    border-color: var(--primary, var(--bs-primary)) !important;
    color: #fff !important;
    font-weight: 400 !important;
}

.theme-action-primary:hover,
.btn-primary.theme-action-primary:hover {
    background-color: var(--primary-hover, var(--primary, var(--bs-primary))) !important;
    border-color: var(--primary-hover, var(--primary, var(--bs-primary))) !important;
}

.theme-action-outline,
.btn-outline-secondary.theme-action-outline {
    background: var(--btn-outline-neutral-bg, transparent) !important;
    border-color: var(--btn-outline-neutral-border, var(--border-color, var(--bs-border-color))) !important;
    color: var(--btn-outline-neutral-text, var(--text-main, var(--bs-body-color))) !important;
    font-weight: 400 !important;
}

.theme-action-outline:hover,
.btn-outline-secondary.theme-action-outline:hover {
    background: var(--btn-outline-neutral-hover-bg, var(--surface-soft)) !important;
    color: var(--btn-outline-neutral-hover-text, var(--text-main, var(--bs-body-color))) !important;
}

.directory-filter-row {
    display: grid;
    gap: 0.75rem;
}

.directory-active-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.directory-active-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-height: 1.8rem;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    border: 1px solid var(--primary, var(--bs-primary));
    background: var(--primary-soft, var(--surface-soft));
    color: var(--primary, var(--bs-primary)) !important;
    font-size: 0.78rem;
    text-decoration: none !important;
}

.directory-group-summary {
    display: grid;
    gap: 0.2rem;
    min-width: 11rem;
}

.directory-group-summary span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.directory-click-row {
    cursor: pointer;
}

.directory-click-row:focus {
    outline: 2px solid var(--primary, var(--bs-primary));
    outline-offset: -2px;
}

.directory-click-row:hover td,
.directory-click-row:focus td {
    background: var(--table-row-hover, var(--surface-soft)) !important;
}

.directory-row-hint {
    color: var(--primary, var(--bs-primary));
    font-size: 0.78rem;
    white-space: nowrap;
}

.directory-mobile-list {
    display: none;
}

.directory-mobile-card {
    padding: 1rem;
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.directory-mobile-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.directory-mobile-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 0.75rem;
    margin-top: 0.75rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.86rem;
}

.directory-mobile-card__meta span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.directory-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.directory-pagination__summary {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.86rem;
}

.directory-pagination__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
}

.directory-pagination__page {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    height: 2rem;
    border-radius: 0.7rem;
    border: 1px solid var(--btn-outline-neutral-border, var(--border-color, var(--bs-border-color)));
    color: var(--text-main, var(--bs-body-color));
    text-decoration: none;
}

.directory-pagination__page.is-current {
    border-color: var(--primary, var(--bs-primary));
    background: var(--primary-soft, var(--surface-soft));
    color: var(--primary, var(--bs-primary));
}

.directory-page-size-form {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0;
}

.directory-page-size-select-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.directory-page-size-select-wrap::after {
    content: "\25BE";
    position: absolute;
    right: 0.8rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--text-soft);
    font-size: 0.8rem;
    pointer-events: none;
}

.directory-page-size-select {
    width: auto !important;
    min-width: 4.75rem;
    min-height: 2.25rem !important;
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
    padding-right: 2rem !important;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.directory-page-size-suffix {
    white-space: nowrap;
}

.directory-drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1040;
    background: rgba(0, 0, 0, 0.28);
    opacity: 0;
    transition: opacity 0.18s ease;
}

.directory-drawer-backdrop.is-open {
    opacity: 1;
}

.directory-drawer {
    position: fixed;
    inset: 0 0 0 auto;
    z-index: 1041;
    width: min(30rem, calc(100vw - 1.5rem));
    transform: translateX(105%);
    transition: transform 0.22s ease;
    pointer-events: none;
}

.directory-drawer.is-open {
    transform: translateX(0);
    pointer-events: auto;
}

.directory-drawer__shell {
    height: 100%;
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border-left: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    display: flex;
    flex-direction: column;
}

.directory-drawer__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.directory-drawer__kicker {
    color: var(--primary, var(--bs-primary));
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.directory-drawer__title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.1rem;
    font-weight: 700;
}

.directory-drawer__close {
    width: 2.2rem;
    height: 2.2rem;
    border: 1px solid var(--btn-outline-neutral-border, var(--border-color, var(--bs-border-color)));
    border-radius: 999px;
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.25rem;
    line-height: 1;
}

.directory-drawer__body {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 1.25rem;
}

.directory-drawer__loading {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    padding: 1rem;
    text-align: center;
}

.directory-preview {
    display: grid;
    gap: 1rem;
}

.directory-preview__identity {
    display: flex;
    align-items: center;
    gap: 0.9rem;
}

.directory-preview__avatar {
    width: 3rem;
    height: 3rem;
}

.directory-preview__name {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.2rem;
    font-weight: 700;
}

.directory-preview__meta,
.directory-preview__notes,
.directory-preview__line span {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.directory-preview__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.directory-preview__section {
    display: grid;
    gap: 0.55rem;
    padding: 0.95rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
}

.directory-preview__section h4 {
    margin: 0;
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.78rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.directory-preview__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    min-width: 0;
}

.directory-preview__grid > div,
.directory-preview__line {
    display: grid;
    gap: 0.15rem;
    min-width: 0;
}

.directory-preview__grid span {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.78rem;
}

.directory-preview__strong,
.directory-preview__grid strong,
.directory-preview__line strong {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 600;
}

.directory-preview__grid a,
.directory-preview__grid strong,
.directory-preview__line a,
.directory-preview__line strong,
.directory-preview__notes {
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

@media (max-width: 1199.98px) {
    .people-dir-filter__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .people-dir-field--search,
    .people-dir-filter__buttons {
        grid-column: 1 / -1;
    }
}

.event-bulletin-filter-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.event-bulletin-filter-wide {
    grid-column: 1 / -1;
}

.event-bulletin-check-control {
    display: flex;
    align-items: end;
    min-height: 100%;
    padding-bottom: 0.45rem;
}

.event-bulletin-label-panel {
    margin-top: 1rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
}

.event-bulletin-label-panel summary {
    cursor: pointer;
    padding: 0.85rem 1rem;
    color: var(--text-main, var(--bs-body-color));
    font-weight: 650;
}

.event-bulletin-label-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
    padding: 0 1rem 1rem;
}

.event-bulletin-template-save {
    max-width: 32rem;
}

.event-bulletin-builder-shell {
    align-items: start;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.36fr);
}

.event-bulletin-layout-preview,
.event-bulletin-library-groups,
.event-bulletin-library-list {
    display: grid;
    gap: 0.65rem;
}

.event-bulletin-layout-chip,
.event-bulletin-library-item {
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.85rem;
    color: var(--text-main, var(--bs-body-color));
    padding: 0.7rem 0.85rem;
}

.event-bulletin-layout-chip {
    display: grid;
    gap: 0.15rem;
}

.event-bulletin-layout-chip span {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.78rem;
}

.event-bulletin-layout-pages {
    display: grid;
    gap: 1rem;
}

.event-bulletin-layout-page {
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    padding: 1rem;
    background: var(--surface, var(--bs-body-bg));
}

.event-bulletin-layout-page h3 {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    margin: 0 0 0.85rem;
    text-transform: uppercase;
}

.event-bulletin-layout-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.event-bulletin-layout-column {
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.85rem;
    min-width: 0;
    padding: 0.75rem;
}

.event-bulletin-layout-column-title {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    margin-bottom: 0.65rem;
    text-transform: uppercase;
}

.event-bulletin-layout-blocks {
    display: grid;
    gap: 0.65rem;
}

.event-bulletin-layout-block {
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.85rem;
    padding: 0.75rem;
    background: var(--surface, var(--bs-body-bg));
    cursor: grab;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease;
}

.event-bulletin-layout-block.is-hidden {
    opacity: 0.72;
}

.event-bulletin-layout-block.is-dragging {
    cursor: grabbing;
    opacity: 0.48;
    box-shadow: none;
}

.event-bulletin-layout-blocks.is-drop-target {
    outline: 2px dashed var(--primary, var(--bs-primary));
    outline-offset: 0.25rem;
}

.event-bulletin-layout-block-main {
    display: grid;
    gap: 0.15rem;
    margin-bottom: 0.65rem;
}

.event-bulletin-layout-block-main span,
.event-bulletin-layout-empty {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.76rem;
}

.event-bulletin-layout-block-main strong {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.98rem;
}

.event-bulletin-drag-hint {
    cursor: grab;
}

.event-bulletin-block-editor {
    border-top: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    margin-bottom: 0.65rem;
    padding-top: 0.65rem;
}

.event-bulletin-block-editor summary {
    color: var(--primary, var(--bs-primary));
    cursor: pointer;
    font-size: 0.82rem;
    font-weight: 650;
    margin-bottom: 0.55rem;
}

.event-bulletin-block-editor-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 0.65rem;
}

.event-bulletin-rich-editor {
    display: grid;
    gap: 0.5rem;
}

.event-bulletin-rich-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.event-bulletin-rich-surface {
    min-height: 7rem;
    overflow-y: auto;
}

.event-bulletin-rich-surface:empty::before {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    content: attr(data-placeholder);
}

.event-bulletin-rich-input {
    display: none;
}

.event-bulletin-layout-actions form {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.event-bulletin-layout-actions .btn {
    font-size: 0.74rem;
    line-height: 1.1;
    padding: 0.32rem 0.52rem;
}

.event-bulletin-layout-empty {
    border: 1px dashed var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.85rem;
    padding: 0.75rem;
}

.event-bulletin-library {
    position: sticky;
    top: 1rem;
}

.event-bulletin-library-group {
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.95rem;
    padding: 0.75rem;
}

.event-bulletin-library-group summary {
    color: var(--primary, var(--bs-primary));
    cursor: pointer;
    font-weight: 650;
}

.event-bulletin-library-list {
    margin-top: 0.65rem;
}

.event-bulletin-library-tree {
    display: grid;
    gap: 0.6rem;
    margin-top: 0.65rem;
}

.event-bulletin-library-source-group {
    display: grid;
    gap: 0.32rem;
    min-width: 0;
    width: 100%;
}

.event-bulletin-library-source-summary {
    align-items: center;
    border-radius: 0.7rem;
    box-sizing: border-box;
    color: var(--text-main, var(--bs-body-color));
    cursor: pointer;
    display: flex;
    font-size: 0.86rem;
    gap: 0.5rem;
    font-weight: 650;
    justify-content: space-between;
    list-style-position: inside;
    min-height: 38px;
    min-width: 0;
    overflow-wrap: anywhere;
    padding: 0.45rem 0.6rem;
}

.event-bulletin-library-source-summary[draggable="true"] {
    cursor: grab;
}

.event-bulletin-library-source-summary span {
    min-width: 0;
}

.event-bulletin-library-source-summary form {
    flex: 0 0 auto;
    margin: 0;
}

.event-bulletin-library-item {
    align-items: center;
    display: flex;
    gap: 0.5rem;
    justify-content: space-between;
    min-height: 36px;
    padding: 0.5rem 0.65rem;
}

.event-bulletin-library-item[draggable="true"] {
    cursor: grab;
}

.event-bulletin-library-generated {
    background: color-mix(in srgb, var(--primary-soft, var(--surface-soft)) 34%, var(--surface, var(--bs-body-bg)));
}

.event-bulletin-library-parent {
    border-color: color-mix(in srgb, var(--primary, var(--bs-primary)) 35%, var(--card-border, var(--bs-border-color)));
}

.event-bulletin-library-parent > span {
    font-weight: 700;
}

.event-bulletin-library-children {
    display: grid;
    gap: 0.28rem;
    margin-left: 0.55rem;
    min-width: 0;
    padding-left: 0.55rem;
    border-left: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
}

.event-bulletin-library-child {
    background: var(--surface, var(--bs-body-bg));
    min-height: 34px;
    padding: 0.42rem 0.58rem;
}

.event-bulletin-library-item.is-dragging {
    cursor: grabbing;
    opacity: 0.55;
}

.event-bulletin-library-item span {
    min-width: 0;
}

.event-bulletin-library-item form {
    flex: 0 0 auto;
}

.event-bulletin-library-muted {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.78rem;
    white-space: nowrap;
}

.event-bulletin-source-search {
    min-height: 38px;
}

.event-bulletin-announcement-options ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.event-bulletin-announcement-options li label {
    align-items: flex-start;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.9rem;
    display: flex;
    gap: 0.55rem;
    min-height: 44px;
    padding: 0.7rem 0.85rem;
}

.event-bulletin-sheet {
    display: grid;
    gap: 1.5rem;
}

.event-bulletin-page-sheet {
    display: grid;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1.35rem;
    background: var(--surface, var(--bs-body-bg));
    box-shadow: var(--shadow-sm);
    color: var(--text-main, var(--bs-body-color));
}

.event-bulletin-front,
.event-bulletin-dynamic-page {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.35rem;
    padding: 1.5rem;
}

.event-bulletin-column {
    display: grid;
    gap: 1rem;
    align-content: start;
}

.event-bulletin-column section,
.event-bulletin-block-section,
.event-bulletin-order-item {
    padding-bottom: 0.85rem;
    border-bottom: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
}

.event-bulletin-column h2,
.event-bulletin-block-section h2,
.event-bulletin-order-item h2 {
    color: var(--primary, var(--bs-primary));
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin: 0 0 0.45rem;
    text-transform: uppercase;
}

.event-bulletin-column h3 {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.95rem;
    font-weight: 650;
    margin: 0 0 0.2rem;
}

.event-bulletin-column p,
.event-bulletin-block-section p,
.event-bulletin-order-item p {
    margin: 0 0 0.28rem;
    color: var(--text-main, var(--bs-body-color));
    line-height: 1.35;
}

.event-bulletin-date {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.1rem, 2vw, 1.45rem);
    font-weight: 720;
    line-height: 1.15;
    padding-bottom: 0.8rem;
    border-bottom: 2px solid var(--primary, var(--bs-primary));
}

.event-bulletin-mini-section {
    display: grid;
    gap: 0.1rem;
    padding: 0.15rem 0;
}

.event-bulletin-muted {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color))) !important;
}

.event-bulletin-notes {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.35rem;
    padding: 1.5rem;
}

.event-bulletin-notes-panel {
    min-width: 0;
}

.event-bulletin-notes-title {
    color: var(--primary, var(--bs-primary));
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.event-bulletin-notes h2 {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.35rem, 2vw, 1.85rem);
    font-weight: 720;
    margin: 0.2rem 0 0.25rem;
}

.event-bulletin-notes-reference,
.event-bulletin-notes-version {
    margin: 0;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.event-bulletin-scripture {
    margin-top: 1rem;
    padding: 0.85rem 0;
    border-top: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-bottom: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    color: var(--text-main, var(--bs-body-color));
}

.event-bulletin-scripture h3 {
    color: var(--primary, var(--bs-primary));
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    margin: 0 0 0.45rem;
    text-transform: uppercase;
}

.event-bulletin-scripture div {
    font-size: 0.95rem;
    line-height: 1.45;
}

.event-bulletin-note-lines {
    display: grid;
    gap: 1rem;
    margin-top: 0.2rem;
}

.event-bulletin-note-lines span {
    border-bottom: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    min-height: 1.15rem;
}

.event-bulletin-divider {
    border-bottom: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    min-height: 0.4rem;
}

.event-bulletin-blank-space {
    min-height: 2.5rem;
}

.event-bulletin-service-line {
    align-items: baseline;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.event-bulletin-service-line span {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.event-bulletin-logo-current {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
}

.event-bulletin-logo-current img {
    max-height: 3.5rem;
    max-width: 12rem;
    padding: 0.35rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.75rem;
    background: var(--surface, var(--bs-body-bg));
    object-fit: contain;
}

.event-bulletin-logo-block {
    display: flex;
    justify-content: center;
    padding-bottom: 1rem;
}

.event-bulletin-logo-block img {
    max-height: 4.25rem;
    max-width: min(16rem, 70%);
    object-fit: contain;
}

.event-bulletin-align-left {
    text-align: left;
}

.event-bulletin-align-center {
    text-align: center;
}

.event-bulletin-align-right {
    text-align: right;
}

.event-bulletin-align-center .event-bulletin-service-line {
    justify-content: center;
}

.event-bulletin-align-right .event-bulletin-service-line {
    justify-content: flex-end;
}

.event-bulletin-align-center ul,
.event-bulletin-align-center ol,
.event-bulletin-align-right ul,
.event-bulletin-align-right ol {
    display: inline-block;
    text-align: left;
}

.event-bulletin-logo-block.event-bulletin-align-left {
    justify-content: flex-start;
}

.event-bulletin-logo-block.event-bulletin-align-center {
    justify-content: center;
}

.event-bulletin-logo-block.event-bulletin-align-right {
    justify-content: flex-end;
}

.event-bulletin-layout-block {
    position: relative;
}

.event-bulletin-layout-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 0.65rem;
}

.event-bulletin-layout-menu {
    position: relative;
}

.event-bulletin-layout-menu > summary {
    list-style: none;
}

.event-bulletin-layout-menu > summary::-webkit-details-marker {
    display: none;
}

.event-bulletin-layout-menu > summary::after {
    content: "\25BE";
    display: inline-block;
    font-size: 0.72em;
    margin-left: 0.35rem;
    transition: transform 0.18s ease;
}

.event-bulletin-layout-menu[open] > summary::after {
    transform: rotate(180deg);
}

.event-bulletin-layout-menu-panel {
    display: grid;
    gap: 0.65rem;
    min-width: min(22rem, calc(100vw - 3rem));
    margin-top: 0.55rem;
    padding: 0.75rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.95rem;
    background: var(--surface, var(--bs-body-bg));
    box-shadow: var(--shadow-sm);
}

.event-bulletin-layout-action-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
}

.event-bulletin-layout-action-group > span {
    flex: 1 0 100%;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.72rem;
    font-weight: 650;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

@page event-bulletin {
    size: letter landscape;
    margin: 0.35in;
}

@media print {
    .event-bulletin-sheet {
        display: block !important;
        gap: 0 !important;
    }

    .event-bulletin-page-sheet {
        page: event-bulletin;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        break-after: page;
        page-break-after: always;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    .event-bulletin-page-sheet:last-child {
        break-after: auto;
        page-break-after: auto;
    }

    .event-bulletin-front,
    .event-bulletin-dynamic-page,
    .event-bulletin-notes {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 0.28in !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 0 !important;
    }

    .event-bulletin-column {
        gap: 0.14in !important;
    }

    .event-bulletin-page-sheet > .event-bulletin-column:first-of-type {
        padding-right: 0.08in !important;
    }

    .event-bulletin-page-sheet > .event-bulletin-column:last-of-type {
        padding-left: 0.08in !important;
    }

    .event-bulletin-column section,
    .event-bulletin-block-section,
    .event-bulletin-order-item {
        padding-bottom: 0.08in !important;
        border-bottom: 1px solid var(--card-border, var(--border-color, var(--bs-border-color))) !important;
    }

    .event-bulletin-column h2,
    .event-bulletin-block-section h2,
    .event-bulletin-order-item h2,
    .event-bulletin-notes-title {
        font-size: 9.5px !important;
        line-height: 1.1 !important;
        margin-bottom: 0.05in !important;
    }

    .event-bulletin-column h3 {
        font-size: 10.5px !important;
        line-height: 1.15 !important;
    }

    .event-bulletin-column p,
    .event-bulletin-block-section p,
    .event-bulletin-order-item p {
        font-size: 10.2px !important;
        line-height: 1.2 !important;
        margin-bottom: 0.03in !important;
    }

    .event-bulletin-date {
        font-size: 15px !important;
        padding-bottom: 0.07in !important;
        border-bottom: 1.5px solid var(--primary, var(--bs-primary)) !important;
    }

    .event-bulletin-logo-block {
        break-inside: avoid;
        padding-bottom: 0.08in !important;
    }

    .event-bulletin-logo-block img {
        max-height: 0.65in !important;
        max-width: 2.3in !important;
    }

    .event-bulletin-notes h2 {
        font-size: 18px !important;
        line-height: 1.1 !important;
    }

    .event-bulletin-scripture {
        break-inside: avoid;
        margin-top: 0.12in !important;
        padding: 0.08in 0 !important;
    }

    .event-bulletin-scripture h3 {
        font-size: 9.5px !important;
        line-height: 1.1 !important;
        margin-bottom: 0.04in !important;
    }

    .event-bulletin-scripture div {
        font-size: 10px !important;
        line-height: 1.28 !important;
    }

    .event-bulletin-note-lines {
        gap: 0.19in !important;
        margin-top: 0 !important;
    }
}

@media (max-width: 991.98px) {
    .event-bulletin-filter-grid,
    .event-bulletin-announcement-options ul,
    .event-bulletin-builder-shell,
    .event-bulletin-front,
    .event-bulletin-dynamic-page,
    .event-bulletin-notes,
    .event-bulletin-label-grid {
        grid-template-columns: 1fr;
    }

    .event-bulletin-layout-columns {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .directory-table-desktop {
        display: none;
    }

    .directory-mobile-list {
        display: block;
    }

    .directory-pagination {
        align-items: stretch;
        flex-direction: column;
    }

    .directory-pagination__actions {
        justify-content: center;
    }

    .directory-preview__grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .people-dir-hero__body,
    .people-dir-filter,
    .people-dir-card__header {
        padding: 1rem;
    }

    .people-dir-filter__grid {
        grid-template-columns: 1fr;
    }

    .people-dir-field--search,
    .people-dir-filter__buttons {
        grid-column: auto;
    }

}

/* ===== Person profile themed layout ===== */
.person-profile-page {
    color: var(--text-main, var(--bs-body-color));
}

.profile-shell,
.profile-panel {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    border-radius: 1.25rem;
}

.profile-hero {
    overflow: hidden;
}

.profile-hero--compact {
    overflow: visible;
}

.profile-hero--compact .profile-hero-body {
    align-items: flex-start;
    padding: 1.35rem 1.5rem;
}

.profile-hero-accent {
    height: 0.5rem;
    background: linear-gradient(90deg, var(--primary, var(--bs-primary)), var(--bs-info), var(--bs-danger), var(--bs-warning));
}

.profile-hero-body {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem;
}

.profile-identity-block {
    min-width: 0;
}

.profile-identity-block--with-avatar {
    display: flex;
    align-items: center;
    gap: 1.15rem;
}

.profile-identity-copy {
    min-width: 0;
}

.profile-avatar {
    width: 4.75rem;
    height: 4.75rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    background: var(--primary-soft, var(--surface-soft, var(--surface, var(--bs-body-bg))));
    color: var(--primary, var(--bs-primary));
    border: 1px solid var(--pill-selected-border, var(--card-border, var(--bs-border-color)));
    font-size: 1.18rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.profile-avatar--large {
    width: 7rem;
    height: 7rem;
    font-size: 1.7rem;
}

.profile-avatar--sm {
    width: 2.25rem;
    height: 2.25rem;
    font-size: 0.78rem;
}

.profile-photo-shell,
.household-photo-shell {
    position: relative;
    display: inline-flex;
    flex: 0 0 auto;
}

.profile-avatar--image,
.people-dir-avatar--image,
.household-dir-avatar--image,
.household-workspace-identity__icon--image,
.photo-upload-preview {
    display: inline-flex;
    object-fit: cover;
    overflow: hidden;
    padding: 0;
}

.profile-photo-action {
    position: absolute;
    right: -0.25rem;
    bottom: -0.25rem;
    width: 2rem;
    height: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 1px solid var(--card-border, var(--bs-border-color));
    background: var(--surface, var(--bs-body-bg));
    color: var(--primary, var(--bs-primary));
    box-shadow: var(--shadow-sm, 0 0.25rem 0.75rem rgba(15, 23, 42, 0.1));
}

.profile-photo-action:hover,
.profile-photo-action:focus {
    color: var(--primary-strong, var(--primary, var(--bs-primary)));
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.person-profile-page .theme-page-hero__body,
.household-profile-page .theme-page-hero__body {
    align-items: center;
    gap: 1.5rem;
    padding: 1.5rem 1.65rem;
}

.person-profile-page .theme-page-hero .profile-identity-block--with-avatar,
.household-profile-page .theme-page-hero .household-workspace-identity {
    align-items: center;
    gap: 1.4rem;
}

.person-profile-page .theme-page-hero .profile-avatar,
.household-profile-page .theme-page-hero .household-workspace-identity__icon {
    width: 8rem;
    height: 8rem;
}

.person-profile-page .theme-page-hero .profile-avatar {
    font-size: 1.75rem;
}

.household-profile-page .theme-page-hero .household-workspace-identity__icon {
    font-size: 2.35rem;
}

.person-profile-page .theme-page-hero .profile-photo-action,
.household-profile-page .theme-page-hero .profile-photo-action {
    right: -0.2rem;
    bottom: -0.2rem;
    width: 2.35rem;
    height: 2.35rem;
}

.photo-upload-current {
    display: flex;
    justify-content: center;
}

.photo-upload-preview {
    width: 7rem;
    height: 7rem;
    border-radius: 999px;
    border: 1px solid var(--card-border, var(--bs-border-color));
}

.photo-upload-actions {
    align-items: center;
    gap: 0.5rem;
}

.profile-title-line,
.profile-household-line,
.profile-header-actions,
.profile-access-actions,
.profile-heading-with-dot,
.profile-heading-with-bar,
.profile-section-heading-row,
.profile-mini-pills {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.profile-section-heading-row {
    justify-content: space-between;
}

.profile-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.75rem, 2.4vw, 2.45rem);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.035em;
}

.profile-subtitle,
.profile-muted,
.profile-notes-text {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.profile-subtitle {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.45rem;
    font-size: 0.92rem;
}

.profile-household-line {
    margin-top: 0.65rem;
    font-size: 0.92rem;
}

.profile-contact-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    margin-top: 0.75rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.9rem;
}

.profile-contact-item {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    min-width: 0;
    max-width: 100%;
}

.profile-contact-item i,
.profile-heading-with-icon > .pi {
    color: var(--primary, var(--bs-primary));
}

.profile-contact-item span,
.profile-contact-item a {
    overflow-wrap: anywhere;
}

.profile-tabs {
    display: flex;
    gap: 0.35rem;
    overflow-x: auto;
    padding: 0.35rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    scrollbar-width: thin;
}

.profile-tab {
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    min-height: 2.45rem;
    padding: 0.45rem 0.75rem;
    border: 1px solid transparent;
    border-radius: 0.75rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.86rem;
    font-weight: 500;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
}

.profile-tab:hover,
.profile-tab:focus-visible {
    background: var(--surface-muted, var(--surface-soft));
    border-color: var(--card-border, var(--border-color, var(--bs-border-color)));
    color: var(--primary, var(--bs-primary));
    outline: 0;
}

.profile-tab.active {
    background: var(--primary-soft, var(--surface-soft));
    border-color: var(--pill-selected-border, var(--primary, var(--bs-primary)));
    color: var(--primary, var(--bs-primary));
}

.profile-tab i {
    font-size: 0.95rem;
}

.profile-tab-content {
    min-width: 0;
}

.profile-tab-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.36fr);
    gap: 1rem;
    align-items: start;
}

.profile-heading-with-icon {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-width: 0;
}

.profile-heading-with-icon > .pi {
    font-size: 1.12rem;
    line-height: 1;
}

.profile-photo-preview {
    display: grid;
    justify-items: center;
    gap: 1rem;
    padding: 0.4rem 0 0.15rem;
    text-align: center;
}

.profile-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.profile-summary-card {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
    padding: 0.95rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.profile-summary-card span {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.profile-summary-card strong {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.15rem;
    line-height: 1.2;
}

.profile-access-bar {
    padding: 1.25rem;
}

.profile-access-grid {
    display: grid;
    gap: 0.85rem 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.profile-access-item,
.profile-info-row {
    display: flex;
    align-items: baseline;
    gap: 0.4rem;
    min-width: 0;
}

.profile-access-empty {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

.profile-access-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1.1rem;
    align-items: end;
    width: clamp(29rem, 46%, 42rem);
    padding: 1.2rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1.15rem;
    background: var(--surface, var(--bs-body-bg));
}

.profile-access-card__main {
    display: flex;
    align-items: flex-start;
    gap: 0.95rem;
    min-width: 0;
}

.profile-access-card__icon {
    width: 3.1rem;
    height: 3.1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border-radius: 1rem;
    background: var(--primary-soft, var(--surface-soft));
    color: var(--primary, var(--bs-primary));
    font-size: 1.25rem;
}

.profile-access-card__body {
    display: grid;
    gap: 0.55rem;
    min-width: 0;
}

.profile-access-card__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem;
}

.profile-access-card__head strong {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.12rem;
    font-weight: 700;
    line-height: 1.2;
}

.profile-access-card__meta {
    display: grid;
    gap: 0.42rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.92rem;
}

.profile-access-card__meta span {
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    min-width: 0;
    overflow-wrap: anywhere;
}

.profile-access-card__meta .pi {
    color: var(--primary, var(--bs-primary));
    font-size: 0.98rem;
}

.profile-access-card__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.55rem;
}

.profile-access-card__actions .btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.profile-access-card .dropdown-item {
    display: flex;
    align-items: center;
    min-height: 2.25rem;
}

.profile-access-center {
    display: grid;
    grid-template-columns: minmax(15rem, 1.05fr) minmax(15rem, 1fr) minmax(16rem, 0.9fr);
    gap: 0;
    align-items: stretch;
    width: 100%;
    padding: 1.35rem 1.45rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1.15rem;
    background: var(--surface, var(--bs-body-bg));
}

.profile-access-center__zone {
    min-width: 0;
    padding: 0.2rem 1.2rem;
}

.profile-access-center__zone:first-child {
    padding-left: 0;
}

.profile-access-center__zone + .profile-access-center__zone {
    border-left: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
}

.profile-access-center__zone:last-child {
    padding-right: 0;
}

.profile-access-center__status,
.profile-access-center__metadata,
.profile-access-center__actions {
    min-width: 0;
}

.profile-access-center__status {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.profile-access-center__icon {
    width: 4rem;
    height: 4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border-radius: 1.15rem;
    background: var(--primary-soft, var(--surface-soft));
    color: var(--primary, var(--bs-primary));
    font-size: 1.55rem;
}

.profile-access-center__role {
    display: grid;
    gap: 0.5rem;
    min-width: 0;
    padding-top: 0.1rem;
}

.profile-access-center__role strong {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.28rem;
    font-weight: 700;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.profile-access-center__description {
    max-width: 28rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.9rem;
    line-height: 1.45;
}

.profile-access-center__badges,
.profile-access-center__action-pair {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.profile-access-center__metadata {
    display: grid;
    gap: 0.85rem;
    align-content: start;
}

.profile-access-center__heading {
    margin: 0;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
}

.profile-access-center__meta-row {
    display: grid;
    grid-template-columns: 1.7rem minmax(0, 1fr);
    gap: 0.7rem;
    align-items: center;
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.92rem;
    line-height: 1.25;
}

.profile-access-center__meta-icon {
    width: 1.7rem;
    min-height: 2.2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--primary, var(--bs-primary));
}

.profile-access-center__meta-icon .pi {
    color: var(--primary, var(--bs-primary));
    font-size: 1.18rem;
    line-height: 1;
}

.profile-access-center__meta-label {
    display: block;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    line-height: 1.15;
    text-transform: uppercase;
}

.profile-access-center__meta-value {
    display: block;
    margin-top: 0.18rem;
    overflow-wrap: anywhere;
}

.profile-access-center__actions {
    display: grid;
    gap: 0.85rem;
    align-content: start;
    justify-items: stretch;
}

.profile-access-center__action-grid {
    display: grid;
    gap: 0.6rem;
    width: 100%;
}

.profile-access-center__action-pair {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
}

.profile-access-center__action-grid form,
.profile-access-center__action-grid .btn {
    min-width: 0;
    width: 100%;
}

.profile-access-center__action-grid .btn {
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
}

.profile-access-center__action-primary,
.profile-access-center__state-action {
    justify-content: center;
}

.profile-access-center__state-action {
    border: 1px solid;
    font-weight: 500;
}

.profile-access-center__state-action--danger {
    background: color-mix(in srgb, var(--bs-danger) 8%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-danger) 42%, var(--card-border, var(--bs-border-color)));
    color: var(--bs-danger);
}

.profile-access-center__state-action--danger:hover,
.profile-access-center__state-action--danger:focus-visible {
    background: color-mix(in srgb, var(--bs-danger) 14%, var(--surface, var(--bs-body-bg)));
    border-color: var(--bs-danger);
    color: var(--bs-danger);
}

.profile-access-center__state-action--success {
    background: color-mix(in srgb, var(--bs-success) 10%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-success) 44%, var(--card-border, var(--bs-border-color)));
    color: var(--bs-success);
}

.profile-access-center__state-action--success:hover,
.profile-access-center__state-action--success:focus-visible {
    background: color-mix(in srgb, var(--bs-success) 16%, var(--surface, var(--bs-body-bg)));
    border-color: var(--bs-success);
    color: var(--bs-success);
}

.profile-account-history {
    padding-top: 0.25rem;
}

.profile-account-history .profile-section-heading-row {
    align-items: flex-end;
}

.profile-account-history__filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
    margin: 0;
}

.profile-account-history__filters .form-select {
    min-width: 10rem;
}

.profile-history-event {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

.profile-history-event .pi {
    color: var(--primary, var(--bs-primary));
    font-size: 0.95rem;
}

.profile-history-result {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-height: 1.55rem;
    padding: 0.18rem 0.5rem;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}

.profile-history-result--success {
    background: color-mix(in srgb, var(--bs-success) 14%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-success) 34%, var(--card-border, var(--bs-border-color)));
    color: var(--bs-success);
}

.profile-history-result--failed {
    background: color-mix(in srgb, var(--bs-danger) 12%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-danger) 30%, var(--card-border, var(--bs-border-color)));
    color: var(--bs-danger);
}

.profile-account-history__empty {
    display: grid;
    justify-items: center;
    gap: 0.55rem;
    padding: 2rem 1rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    border: 1px dashed var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
}

.profile-account-history__empty .pi {
    color: var(--primary, var(--bs-primary));
    font-size: 1.4rem;
}

.profile-panel {
    padding: 1.5rem;
}

.person-profile-page--tabs .profile-panel {
    padding: 1.25rem;
}

.person-profile-page--tabs .profile-section-heading-row {
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
}

.profile-section-title,
.profile-subsection-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.profile-subsection-title {
    font-size: 0.82rem;
}

.profile-heading-dot {
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 999px;
    background: var(--bs-info, var(--primary, var(--bs-primary)));
    flex: 0 0 auto;
}

.profile-title-accent {
    width: 6rem;
    height: 0.25rem;
    border-radius: 999px;
    background: var(--bs-warning, var(--primary-soft, var(--surface-soft)));
}

.profile-side-accent {
    width: 0.42rem;
    height: 2rem;
    border-radius: 999px;
    background: var(--bs-info, var(--primary, var(--bs-primary)));
    flex: 0 0 auto;
}

.profile-side-accent-coral {
    background: var(--bs-danger, var(--primary, var(--bs-primary)));
}

.profile-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem 1.75rem;
}

.person-profile-page--tabs .profile-info-grid {
    gap: 0.55rem 1.35rem;
}

.person-profile-page--tabs .profile-info-grid--compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.person-profile-page--tabs .profile-info-row {
    display: grid;
    grid-template-columns: minmax(7rem, 0.42fr) minmax(0, 1fr);
    align-items: start;
    gap: 0.35rem 0.75rem;
    min-width: 0;
}

.person-profile-page--tabs .profile-info-label {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    white-space: normal;
}

.person-profile-page--tabs .profile-info-value {
    font-size: 0.95rem;
    line-height: 1.35;
}

.profile-custom-field-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.7rem 1.25rem;
}

.profile-info-stack {
    display: grid;
    gap: 0.85rem;
}

.profile-task-list {
    display: grid;
    gap: 0.8rem;
}

.profile-compact-list {
    display: grid;
    gap: 0.65rem;
}

.profile-compact-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    padding: 0.85rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    text-decoration: none;
}

.profile-compact-row:hover,
.profile-compact-row:focus-visible,
.profile-task-card-link:hover,
.profile-task-card-link:focus-visible,
.profile-family-row-link:hover,
.profile-family-row-link:focus-visible {
    background: var(--surface-muted, var(--surface-soft));
    color: var(--text-main, var(--bs-body-color));
    outline: 0;
}

.profile-compact-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--primary, var(--bs-primary));
}

.profile-compact-copy {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
}

.profile-compact-title {
    font-weight: 600;
    overflow-wrap: anywhere;
}

.profile-compact-meta {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.86rem;
}

.profile-compact-chevron {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.profile-membership-table th:last-child,
.profile-membership-table td:last-child {
    width: 3.25rem;
}

.profile-groups-workspace {
    width: 100%;
}

.profile-education-workspace {
    display: grid;
    gap: 1.5rem;
    width: 100%;
}

.profile-education-section {
    display: grid;
    gap: 0.75rem;
    min-width: 0;
}

.profile-education-section--secondary {
    margin-top: 0.15rem;
}

.profile-education-section__heading {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    padding: 0 0.15rem;
}

.profile-education-section__heading > .pi {
    color: var(--primary, var(--bs-primary));
    font-size: 1.05rem;
    line-height: 1.25;
}

.profile-education-section__heading h3 {
    margin: 0;
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1.3;
}

.profile-education-section__heading p {
    margin: 0.16rem 0 0;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.84rem;
    line-height: 1.4;
}

.profile-education-primary {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 650;
}

.profile-education-primary .pi {
    margin-right: 0.5rem;
    color: var(--primary, var(--bs-primary));
}

.profile-education-empty {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-height: 3.5rem;
    padding: 0.9rem 1rem;
    border: 1px dashed var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.85rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.9rem;
}

.profile-education-empty .pi {
    color: var(--primary, var(--bs-primary));
    font-size: 1.1rem;
}

.profile-groups-workspace .profile-section-heading-row {
    padding: 0 0.15rem;
}

.profile-membership-table-wrap {
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
    overflow: hidden;
}

.profile-membership-table thead th {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.72rem;
    font-weight: 650;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.profile-membership-table tbody td {
    padding-top: 0.72rem;
    padding-bottom: 0.72rem;
}

.profile-membership-table tbody tr:hover > td {
    background: var(--table-row-hover, var(--surface-soft)) !important;
}

.profile-membership-primary {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    min-width: 0;
    color: var(--text-main, var(--bs-body-color));
    text-decoration: none;
}

.profile-membership-primary:hover,
.profile-membership-primary:focus-visible {
    color: var(--primary, var(--bs-primary));
    outline: 0;
}

.profile-membership-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    color: var(--primary, var(--bs-primary));
    font-size: 1.15rem;
    line-height: 1;
}

.profile-membership-copy {
    display: grid;
    gap: 0.1rem;
    min-width: 0;
}

.profile-membership-name {
    color: inherit;
    font-size: 0.98rem;
    font-weight: 650;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.profile-membership-meta,
.profile-membership-muted {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.84rem;
}

.profile-membership-value {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 600;
}

.profile-membership-empty {
    display: grid;
    justify-items: center;
    gap: 0.65rem;
    padding: 2.25rem 1rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    border: 1px dashed var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    text-align: center;
}

.profile-membership-empty > .pi {
    color: var(--primary, var(--bs-primary));
    font-size: 1.55rem;
}

.profile-membership-empty__title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1rem;
    font-weight: 650;
}

.profile-task-card {
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    padding: 0.9rem 1rem;
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.profile-task-card-link {
    display: grid;
    color: var(--text-main, var(--bs-body-color));
    text-decoration: none;
}

.profile-task-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.profile-task-title {
    font-weight: 600;
}

.profile-task-date {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.84rem;
    white-space: nowrap;
}

.profile-task-meta {
    margin-top: 0.4rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.9rem;
    line-height: 1.45;
}

.profile-info-row-wide {
    grid-column: 1 / -1;
}
.profile-assessment-snapshot,
.profile-assessment-detail {
    display: grid;
    gap: 1rem;
}

.profile-assessment-snapshot {
    grid-template-columns: minmax(0, 1.1fr) minmax(16rem, 0.75fr);
    align-items: stretch;
}

.profile-assessment-summary,
.profile-assessment-top-match {
    display: grid;
    align-content: start;
    gap: 0.35rem;
    min-width: 0;
    padding: 1rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
}

.profile-assessment-top-match,
.profile-assessment-summary--full {
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.profile-assessment-label,
.profile-assessment-matches__header {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.profile-assessment-title,
.profile-assessment-top-match strong {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.02rem;
    font-weight: 650;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.profile-assessment-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.86rem;
    line-height: 1.4;
}

.profile-assessment-label {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.profile-assessment-label .pi {
    color: var(--primary, var(--bs-primary));
    font-size: 0.9rem;
    line-height: 1;
}

.profile-assessment-top-list {
    display: grid;
    gap: 0.4rem;
    margin-top: 0.2rem;
}

.profile-assessment-top-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.55rem;
    min-width: 0;
    padding: 0.42rem 0;
    color: var(--text-main, var(--bs-body-color));
    text-decoration: none;
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.profile-assessment-top-row:first-child {
    border-top: 0;
}

.profile-assessment-top-row:hover,
.profile-assessment-top-row:focus-visible {
    color: var(--primary, var(--bs-primary));
    outline: 0;
}

.profile-assessment-top-role {
    min-width: 0;
    overflow-wrap: anywhere;
    font-size: 0.92rem;
    font-weight: 600;
    line-height: 1.25;
}

.profile-assessment-top-score {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.84rem;
    font-weight: 650;
    white-space: nowrap;
}

.profile-assessment-top-score .pi {
    color: var(--primary, var(--bs-primary));
    font-size: 0.82rem;
    line-height: 1;
}

.profile-assessment-matches {
    overflow: hidden;
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
}

.profile-assessment-matches__header,
.profile-assessment-match {
    display: grid;
    grid-template-columns: minmax(12rem, 1fr) minmax(5.5rem, auto) minmax(5rem, auto);
    gap: 0.8rem;
    align-items: center;
}

.profile-assessment-matches__header {
    padding: 0.65rem 0.9rem;
    background: var(--table-head-bg, var(--surface-soft));
}

.profile-assessment-matches__header span:not(:first-child),
.profile-assessment-match__score {
    text-align: right;
}

.profile-assessment-match {
    padding: 0.75rem 0.9rem;
    color: var(--text-main, var(--bs-body-color));
    text-decoration: none;
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.profile-assessment-match:hover,
.profile-assessment-match:focus-visible {
    background: var(--surface-muted, var(--surface-soft));
    color: var(--text-main, var(--bs-body-color));
    outline: 0;
}

.profile-assessment-match__role {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-width: 0;
    font-weight: 600;
}

.profile-assessment-match__rank {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    flex: 0 0 auto;
    border-radius: 999px;
    background: var(--primary-soft, var(--surface-soft));
    color: var(--primary, var(--bs-primary));
    font-size: 0.78rem;
    font-weight: 700;
}

.profile-assessment-match__score {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.86rem;
    font-weight: 600;
    white-space: nowrap;
}

.profile-assessment-header-actions,
.profile-assessment-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem;
    justify-content: flex-end;
}


@media (max-width: 767.98px) {
    .profile-assessment-snapshot,
    .profile-assessment-matches__header,
    .profile-assessment-match {
        grid-template-columns: 1fr;
    }

    .profile-assessment-matches__header span:not(:first-child) {
        display: none;
    }

    .profile-assessment-match__score {
        text-align: left;
    }

    .profile-assessment-actions .btn {
        flex: 1 1 10rem;
        justify-content: center;
    }
}

.profile-info-label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.88rem;
    font-weight: 500;
    white-space: nowrap;
}

.profile-info-value,
.profile-family-name {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 500;
    min-width: 0;
    overflow-wrap: anywhere;
}

.profile-icon-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 0.7rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color))) !important;
    border: 1px solid transparent;
    text-decoration: none !important;
    line-height: 1;
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.profile-icon-action-sm {
    width: 1.65rem;
    height: 1.65rem;
    border-radius: 0.55rem;
    font-size: 0.84rem;
}

.profile-icon-action:hover {
    color: var(--primary, var(--bs-primary)) !important;
    border-color: var(--pill-border-hover, var(--border-color, var(--bs-border-color)));
    background: var(--pill-bg-hover, var(--surface-soft));
}

.profile-status-pill,
.profile-mini-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.75rem;
    padding: 0.32rem 0.7rem;
    border-radius: 999px;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    background: var(--pill-bg, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.76rem;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
}

.profile-status-success {
    background: color-mix(in srgb, var(--bs-success) 28%, var(--surface, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
    border-color: color-mix(in srgb, var(--bs-success) 45%, var(--card-border, var(--bs-border-color)));
}

.profile-status-warning {
    background: color-mix(in srgb, var(--bs-warning) 34%, var(--surface, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
    border-color: color-mix(in srgb, var(--bs-warning) 45%, var(--card-border, var(--bs-border-color)));
}

.profile-status-info,
.profile-status-soft {
    background: var(--primary-soft, var(--surface-soft));
    color: var(--primary, var(--bs-primary));
    border-color: var(--pill-selected-border, var(--primary, var(--bs-primary)));
}

.profile-status-muted {
    background: var(--surface-muted, var(--surface-soft));
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.profile-notes-text {
    font-size: 0.95rem;
    line-height: 1.65;
    white-space: pre-wrap;
}

.profile-table-wrap,
.profile-family-table {
    overflow: hidden;
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
}

.profile-table th,
.profile-table td {
    padding: 0.85rem 1rem;
    border-color: var(--table-border, var(--border-color, var(--bs-border-color))) !important;
}

.profile-table thead th {
    background: var(--table-head-bg, var(--surface-soft)) !important;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color))) !important;
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.profile-family-table {
    display: grid;
}

.profile-family-row-link {
    color: var(--text-main, var(--bs-body-color));
    text-decoration: none;
}

.profile-family-row {
    display: grid;
    grid-template-columns: 3rem minmax(7rem, 1fr) minmax(4.5rem, 0.7fr) 3rem 4.5rem;
    gap: 0.55rem;
    align-items: center;
    padding: 0.82rem 0.95rem;
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.9rem;
}

.profile-family-row:first-child {
    border-top: 0;
}

.profile-family-head {
    background: var(--table-head-bg, var(--surface-soft));
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.profile-family-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.2rem;
}

.profile-family-empty {
    padding: 1rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    text-align: center;
}

.person-profile-page .btn-primary,
.person-profile-page .btn-primary.theme-action-primary {
    background-color: var(--primary, var(--bs-primary)) !important;
    border-color: var(--primary, var(--bs-primary)) !important;
    color: #fff !important;
    font-weight: 400 !important;
}

.person-profile-page .btn-primary:hover,
.person-profile-page .btn-primary.theme-action-primary:hover {
    background-color: var(--primary-hover, var(--primary, var(--bs-primary))) !important;
    border-color: var(--primary-hover, var(--primary, var(--bs-primary))) !important;
}

.person-profile-page .btn-outline-secondary {
    background: var(--btn-outline-neutral-bg, transparent) !important;
    border-color: var(--btn-outline-neutral-border, var(--border-color, var(--bs-border-color))) !important;
    color: var(--btn-outline-neutral-text, var(--text-main, var(--bs-body-color))) !important;
    font-weight: 400 !important;
}

.person-profile-page .btn-outline-secondary:hover {
    background: var(--btn-outline-neutral-hover-bg, var(--surface-soft)) !important;
    color: var(--btn-outline-neutral-hover-text, var(--text-main, var(--bs-body-color))) !important;
}

.person-profile-page .btn-outline-danger {
    background: transparent !important;
    border-color: color-mix(in srgb, var(--bs-danger) 45%, var(--border-color, var(--bs-border-color))) !important;
    color: var(--bs-danger) !important;
    font-weight: 400 !important;
}

.person-profile-page .btn-outline-danger:hover {
    background: color-mix(in srgb, var(--bs-danger) 16%, var(--surface, var(--bs-body-bg))) !important;
    color: var(--text-main, var(--bs-body-color)) !important;
}

@media (max-width: 1199.98px) {
    .profile-access-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .profile-summary-grid {
        grid-template-columns: 1fr;
    }

    .profile-tab-grid {
        grid-template-columns: minmax(0, 1fr) minmax(230px, 0.42fr);
    }

    .profile-custom-field-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .profile-hero--compact .profile-hero-body {
        align-items: flex-start;
        flex-direction: column;
    }

    .profile-header-actions {
        justify-content: flex-start;
    }

    .profile-access-card {
        width: min(100%, 42rem);
    }

    .profile-access-center {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }

    .profile-access-center__actions {
        grid-column: 1 / -1;
        justify-items: start;
    }

    .profile-access-center__actions.profile-access-center__zone {
        padding: 1.2rem 0 0;
        border-top: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
        border-left: 0;
    }

    .profile-access-center__action-grid {
        justify-self: start;
    }
}

@media (max-width: 767.98px) {
    .profile-hero-body,
    .profile-access-bar,
    .profile-panel {
        padding: 1rem;
    }

    .profile-info-grid,
    .profile-access-grid {
        grid-template-columns: 1fr;
    }

    .profile-tab-grid,
    .profile-custom-field-grid,
    .person-profile-page--tabs .profile-info-grid--compact {
        grid-template-columns: 1fr;
    }

    .profile-family-row {
        grid-template-columns: 2.5rem minmax(6rem, 1fr) minmax(4rem, 0.7fr) 2.5rem 4rem;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
        font-size: 0.84rem;
    }

    .profile-family-members-table th,
    .profile-family-members-table td {
        padding: 0.68rem 0.8rem;
    }

    .profile-access-card {
        grid-template-columns: 1fr;
    }

    .profile-access-card__actions {
        justify-content: flex-start;
    }

    .profile-access-center {
        grid-template-columns: 1fr;
        padding: 1rem;
    }

    .profile-access-center__zone {
        padding: 1rem 0;
    }

    .profile-access-center__zone:first-child {
        padding-top: 0;
    }

    .profile-access-center__zone:last-child {
        padding-bottom: 0;
    }

    .profile-access-center__zone + .profile-access-center__zone {
        border-top: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
        border-left: 0;
    }

    .profile-access-center__status {
        align-items: flex-start;
    }

    .profile-access-center__action-pair {
        grid-template-columns: 1fr;
    }

    .profile-account-history__filters {
        justify-content: stretch;
        margin-top: 0.75rem;
        width: 100%;
    }

    .profile-account-history__filters label,
    .profile-account-history__filters .form-select,
    .profile-account-history__filters .btn {
        width: 100%;
    }
}

@media (max-width: 991.98px) {
    .person-profile-page .theme-page-hero .profile-avatar,
    .household-profile-page .theme-page-hero .household-workspace-identity__icon {
        width: 6.5rem;
        height: 6.5rem;
    }

    .person-profile-page .theme-page-hero__body,
    .household-profile-page .theme-page-hero__body {
        align-items: flex-start;
    }
}

@media (max-width: 575.98px) {
    .profile-identity-block--with-avatar {
        align-items: flex-start;
    }

    .profile-avatar {
        width: 3.25rem;
        height: 3.25rem;
    }

    .person-profile-page .theme-page-hero .profile-avatar,
    .household-profile-page .theme-page-hero .household-workspace-identity__icon {
        width: 4.75rem;
        height: 4.75rem;
    }

    .person-profile-page .theme-page-hero .profile-identity-block--with-avatar,
    .household-profile-page .theme-page-hero .household-workspace-identity {
        gap: 1rem;
    }

    .profile-avatar--large {
        width: 5.5rem;
        height: 5.5rem;
        font-size: 1.35rem;
    }

    .profile-title {
        font-size: 1.55rem;
    }

    .profile-family-table {
        overflow-x: auto;
    }

    .profile-family-row {
        min-width: 620px;
    }

    .profile-membership-table {
        min-width: 640px;
    }
}


/* ===== Event detail themed layout ===== */
.event-detail-page {
    color: var(--text-main, var(--bs-body-color));
}

.event-detail-hero,
.event-detail-panel,
.event-detail-metric {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    border-radius: 1.25rem;
}

.event-detail-hero {
    overflow: hidden;
}

.event-detail-hero__accent {
    height: 0.5rem;
    background: linear-gradient(90deg, var(--primary, var(--bs-primary)), var(--bs-info), var(--bs-danger), var(--bs-warning));
}

.event-detail-hero__body {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem;
}

.event-detail-identity {
    min-width: 0;
}

.event-detail-title-row,
.event-detail-actions,
.event-detail-row-actions,
.event-detail-section-row,
.event-detail-heading-with-bar,
.event-detail-category-title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.event-detail-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
}

.event-detail-section-row {
    justify-content: space-between;
}

.event-detail-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.75rem, 2.4vw, 2.45rem);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.035em;
}

.event-detail-subtitle,
.event-detail-muted,
.event-detail-note-text {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color))) !important;
}

.event-detail-subtitle {
    margin-top: 0.55rem;
    max-width: 46rem;
    font-size: 0.95rem;
    line-height: 1.6;
}

.event-detail-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.event-detail-metric {
    padding: 1.15rem;
    position: relative;
    overflow: hidden;
}

.event-detail-metric::after {
    content: "";
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 0.72rem;
    height: 0.72rem;
    border-radius: 999px;
    background: var(--primary, var(--bs-primary));
}

.event-detail-metric--blue::after { background: var(--bs-info, var(--primary, var(--bs-primary))); }
.event-detail-metric--green::after { background: var(--bs-success, var(--primary, var(--bs-primary))); }
.event-detail-metric--gold::after { background: var(--bs-warning, var(--primary, var(--bs-primary))); }
.event-detail-metric--coral::after { background: var(--bs-danger, var(--primary, var(--bs-primary))); }

.event-detail-metric__label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 0.55rem;
}

.event-detail-metric__value {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.event-detail-panel {
    padding: 1.5rem;
}

.event-detail-section-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.event-detail-title-accent {
    width: 6rem;
    height: 0.25rem;
    border-radius: 999px;
    background: var(--bs-warning, var(--primary-soft, var(--surface-soft)));
}

.event-detail-section-icon,
.comments-panel__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.7rem;
    min-width: 1.7rem;
    color: var(--primary, var(--bs-primary));
    font-size: 1.35rem;
    line-height: 1;
    flex: 0 0 auto;
}

.event-detail-side-accent {
    width: 0.42rem;
    height: 2rem;
    border-radius: 999px;
    background: var(--bs-info, var(--primary, var(--bs-primary)));
    flex: 0 0 auto;
}

.event-detail-side-accent-coral { background: var(--bs-danger, var(--primary, var(--bs-primary))); }
.event-detail-side-accent-green { background: var(--bs-success, var(--primary, var(--bs-primary))); }

.event-detail-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem 1.75rem;
}

.event-detail-info-stack {
    display: grid;
    gap: 0.85rem;
}

.event-detail-info-row {
    display: flex;
    align-items: baseline;
    gap: 0.4rem;
    min-width: 0;
}

.event-detail-label,
.event-detail-note-label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.88rem;
    font-weight: 500;
    white-space: nowrap;
}

.event-detail-note-label {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 0.45rem;
}

.event-detail-value,
.event-detail-visitor-name {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 500;
    min-width: 0;
    overflow-wrap: anywhere;
}

.event-detail-note-box,
.event-detail-category-card,
.event-detail-empty {
    background: var(--surface-soft, var(--surface-muted, var(--bs-light)));
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
}

.event-detail-note-box,
.event-detail-category-card {
    padding: 1rem;
}

.event-detail-empty {
    padding: 2rem 1rem;
    text-align: center;
}

.event-detail-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
}

.event-detail-table {
    min-width: 860px;
    color: var(--text-main, var(--bs-body-color));
}

.event-detail-table th,
.event-detail-table td {
    padding: 0.95rem 1rem;
    border-color: var(--table-border, var(--border-color, var(--bs-border-color))) !important;
    vertical-align: middle;
}

.event-detail-table tbody tr:hover td {
    background: var(--table-row-hover, var(--surface-soft)) !important;
}

.event-detail-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.75rem;
    padding: 0.34rem 0.72rem;
    border-radius: 999px;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    color: var(--primary, var(--bs-primary));
    font-size: 0.76rem;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}

.event-detail-pill--blue {
    background: color-mix(in srgb, var(--bs-info) 25%, var(--surface, var(--bs-body-bg)));
}

.event-detail-pill--green {
    background: color-mix(in srgb, var(--bs-success) 26%, var(--surface, var(--bs-body-bg)));
}

.event-detail-pill--gold {
    background: color-mix(in srgb, var(--bs-warning) 32%, var(--surface, var(--bs-body-bg)));
}

.event-detail-pill--coral {
    background: color-mix(in srgb, var(--bs-danger) 24%, var(--surface, var(--bs-body-bg)));
}

.event-detail-category-dot {
    width: 0.8rem;
    height: 0.8rem;
    border-radius: 999px;
    flex: 0 0 auto;
}

@media (max-width: 1199.98px) {
    .event-detail-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .event-detail-hero__body,
    .event-detail-panel {
        padding: 1rem;
    }

    .event-detail-metrics,
    .event-detail-info-grid {
        grid-template-columns: 1fr;
    }

    .event-detail-actions,
    .event-detail-actions .btn,
    .event-detail-row-actions,
    .event-detail-row-actions .btn,
    .event-detail-row-actions form,
    .event-detail-row-actions form .btn {
        width: 100%;
    }
}

/* ===== Master calendar themed layout ===== */
.master-calendar-page {
    color: var(--text-main, var(--bs-body-color));
}

.mc-hero,
.mc-filter,
.mc-card,
.mc-side-card {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    border-radius: 1.25rem;
}

.mc-hero { overflow: hidden; }
.mc-hero__accent {
    height: 0.5rem;
    background: linear-gradient(90deg, var(--primary, var(--bs-primary)), var(--bs-info), var(--bs-danger), var(--bs-warning));
}
.mc-hero__body,
.mc-card__header,
.mc-actions,
.mc-card__tools,
.mc-viewbar,
.mc-filter__actions,
.mc-filter__toggles,
.mc-legend-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem;
}
.mc-hero__body,
.mc-card__header { justify-content: space-between; padding: 1.5rem; }
.mc-kicker {
    color: var(--primary, var(--bs-primary));
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.mc-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.75rem, 2.2vw, 2.3rem);
    font-weight: 700;
    letter-spacing: -0.03em;
}
.mc-subtitle { color: var(--text-muted, var(--muted, var(--bs-secondary-color))); max-width: 48rem; }
.mc-viewbar { border-top: 1px solid var(--table-border, var(--border-color)); background: var(--table-head-bg, var(--surface-soft)); padding: 1rem 1.5rem; }
.mc-viewbar-label { color: var(--text-muted, var(--muted)); font-weight: 600; }
.mc-view-pill {
    border: 1px solid var(--pill-border, var(--border-color));
    background: var(--pill-bg, var(--surface));
    color: var(--btn-outline-neutral-text, var(--text-main)) !important;
    border-radius: 999px;
    padding: 0.45rem 1rem;
    text-decoration: none !important;
    font-size: 0.9rem;
    font-weight: 600;
}
.mc-view-pill:hover,
.mc-view-pill.is-selected {
    background: var(--pill-selected-bg, var(--primary-soft));
    border-color: var(--pill-selected-border, var(--primary));
    color: var(--pill-selected-text, var(--primary)) !important;
}
.mc-filter { padding: 1.25rem; }
.mc-filter__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(10rem, 1fr)) auto;
    gap: 1rem;
    align-items: end;
}
.mc-filter__toggles { grid-column: 1 / -1; }
.mc-toggle,
.mc-legend {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    border: 1px solid var(--pill-border, var(--border-color));
    background: var(--pill-bg, var(--surface));
    color: var(--text-main, var(--bs-body-color));
    border-radius: 999px;
    padding: 0.42rem 0.75rem;
    font-size: 0.86rem;
    font-weight: 600;
}
.mc-toggle .form-check-input { margin: 0; }
.mc-field { display: grid; gap: 0.35rem; }
.mc-control {
    background-color: var(--input-bg, var(--surface)) !important;
    color: var(--text-main, var(--bs-body-color)) !important;
    border-color: var(--input-border, var(--border-color)) !important;
    border-radius: 0.85rem !important;
    min-height: 2.75rem;
}
.mc-legend-row { margin-top: 1rem; }
.mc-legend-dot { width: 0.65rem; height: 0.65rem; border-radius: 999px; }
.mc-legend-dot-event { background: var(--bs-info); }
.mc-legend-dot-class { background: var(--bs-success); }
.mc-legend-dot-selected { background: var(--bs-warning); }
.mc-legend-dot-today { background: var(--bs-danger); }
.mc-section-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}
.mc-month-head,
.mc-month-grid,
.mc-week-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.mc-month-head,
.mc-week-head { background: var(--table-head-bg, var(--surface-soft)); color: var(--text-muted, var(--muted)); font-size: 0.76rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
.mc-month-head > div,
.mc-week-head-cell { padding: 0.85rem 1rem; border-right: 1px solid var(--table-border, var(--border-color)); }
.mc-month-head > div:last-child,
.mc-week-head-cell:last-child { border-right: 0; }
.mc-day {
    min-height: 8.7rem;
    padding: 0.65rem;
    border-right: 1px solid var(--table-border, var(--border-color));
    border-top: 1px solid var(--table-border, var(--border-color));
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color)) !important;
    text-decoration: none !important;
    transition: background 0.18s ease, box-shadow 0.18s ease;
}
.mc-day:hover { background: var(--table-row-hover, var(--surface-soft)); }
.mc-day.is-outside { opacity: 0.64; background: color-mix(in srgb, var(--surface, #fff) 88%, var(--text-muted, #888) 3%); }
.mc-day.is-today { background: color-mix(in srgb, var(--bs-danger) 14%, var(--surface, #fff)); }
.mc-day.is-selected { background: color-mix(in srgb, var(--bs-warning) 22%, var(--surface, #fff)); box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--bs-warning) 62%, var(--border-color)); }
.mc-day__header { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; margin-bottom: 0.45rem; }
.mc-day-number { display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; border-radius: 999px; font-weight: 700; }
.mc-day.is-today .mc-day-number { background: var(--bs-danger); color: var(--primary, #097C87); }
.mc-day.is-selected .mc-day-number { background: var(--bs-warning); color: var(--primary, #097C87); }
.mc-day-count,
.mc-count-pill { display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; background: var(--primary-soft, var(--surface-soft)); color: var(--primary, var(--bs-primary)); font-size: 0.75rem; font-weight: 700; padding: 0.15rem 0.5rem; }
.mc-day-list { display: grid; gap: 0.32rem; }
.mc-month-item {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    min-width: 0;
    border-left: 0.32rem solid var(--item-color, var(--bs-info));
    border-radius: 0.55rem;
    padding: 0.28rem 0.42rem;
    background: color-mix(in srgb, var(--item-color, var(--bs-info)) 15%, var(--surface, #fff));
    color: var(--primary, var(--bs-primary));
}
.mc-item-class { --item-color: var(--bs-success); }
.mc-month-time,
.mc-week-time { flex: 0 0 auto; font-size: 0.7rem; font-weight: 700; color: var(--text-muted, var(--muted)); }
.mc-month-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.78rem; font-weight: 600; }
.mc-day-empty,
.mc-empty-day,
.mc-day-more { color: var(--text-muted, var(--muted)); font-size: 0.82rem; }
.mc-week-wrap { overflow-x: auto; }
.mc-week-wrap > .mc-week-grid { min-width: 1080px; }
.mc-week-head-cell { display: grid; gap: 0.2rem; }
.mc-week-day { min-height: 22rem; border-right: 1px solid var(--table-border, var(--border-color)); border-top: 1px solid var(--table-border, var(--border-color)); padding: 0.8rem; background: var(--surface, var(--bs-body-bg)); }
.mc-week-day.is-today { background: color-mix(in srgb, var(--bs-danger) 10%, var(--surface, #fff)); }
.mc-week-day.is-selected { background: color-mix(in srgb, var(--bs-warning) 18%, var(--surface, #fff)); }
.mc-week-item,
.mc-selected-card,
.mc-list-row {
    display: block;
    color: var(--text-main, var(--bs-body-color)) !important;
    border: 1px solid var(--table-border, var(--border-color));
    border-left: 0.35rem solid var(--item-color, var(--bs-info));
    border-radius: 0.9rem;
    background: var(--surface, var(--bs-body-bg));
    padding: 0.85rem;
    text-decoration: none !important;
}
.mc-week-item + .mc-week-item { margin-top: 0.75rem; }
.mc-week-item:hover,
.mc-selected-card:hover,
.mc-list-row:hover { background: var(--table-row-hover, var(--surface-soft)); }
.mc-week-item__top,
.mc-selected-card__top { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; margin-bottom: 0.45rem; }
.mc-kind-pill { display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; padding: 0.25rem 0.6rem; font-size: 0.7rem; font-weight: 700; }
.mc-kind-event { background: color-mix(in srgb, var(--bs-info) 24%, var(--surface, #fff)); color: var(--primary, var(--bs-primary)); }
.mc-kind-class { background: color-mix(in srgb, var(--bs-success) 26%, var(--surface, #fff)); color: var(--primary, var(--bs-primary)); }
.mc-week-title,
.mc-selected-title,
.mc-list-title { font-weight: 700; color: var(--text-main, var(--bs-body-color)); }
.mc-week-meta { color: var(--text-muted, var(--muted)); font-size: 0.78rem; margin-top: 0.2rem; }
.mc-open-link { display: inline-flex; margin-top: 0.65rem; border: 1px solid var(--pill-border, var(--border-color)); border-radius: 0.65rem; padding: 0.35rem 0.65rem; color: var(--btn-outline-neutral-text, var(--text-main)); font-size: 0.76rem; font-weight: 600; }
.mc-side-card { padding: 1.25rem; }
.mc-side-heading { display: flex; align-items: flex-start; gap: 0.75rem; margin-bottom: 1rem; }
.mc-side-accent { display: inline-block; width: 0.42rem; height: 2rem; border-radius: 999px; }
.mc-side-accent-gold { background: var(--bs-warning); }
.mc-side-accent-blue { background: var(--bs-info); }
.mc-selected-list,
.mc-info-stack,
.mc-list-view { display: grid; gap: 0.8rem; }
.mc-list-row { display: grid; grid-template-columns: 5rem minmax(0, 1fr) auto; align-items: center; gap: 1rem; }
.mc-list-date { color: var(--text-muted, var(--muted)); font-weight: 700; }
@media (max-width: 1199.98px) {
    .mc-filter__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mc-filter__toggles,
    .mc-filter__actions { grid-column: 1 / -1; }
    .mc-month-head,
    .mc-month-grid { min-width: 960px; }
    .mc-card { overflow-x: auto; }
}
@media (max-width: 575.98px) {
    .mc-hero__body,
    .mc-card__header,
    .mc-filter { padding: 1rem; }
    .mc-filter__grid { grid-template-columns: 1fr; }
    .mc-filter__toggles,
    .mc-filter__actions { grid-column: auto; }
    .mc-list-row { grid-template-columns: 1fr; }
}



/* ===== Household directory/profile themed layout ===== */
.household-theme-page,
.household-profile-page {
    color: var(--text-main, var(--bs-body-color));
}

.household-dir-hero,
.household-dir-filter,
.household-dir-card,
.household-profile-shell,
.household-profile-panel {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    border-radius: 1.25rem;
}

.household-dir-hero,
.household-profile-hero {
    overflow: hidden;
}

.household-dir-hero__accent,
.household-profile-hero__accent {
    height: 0.5rem;
    background: linear-gradient(90deg, var(--primary, var(--bs-primary)), var(--bs-info), var(--bs-danger), var(--bs-warning));
}

.household-dir-hero__body,
.household-profile-hero__body {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem;
}

.household-dir-kicker {
    color: var(--primary, var(--bs-primary));
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.household-dir-title,
.household-profile-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.75rem, 2.2vw, 2.35rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.1;
}

.household-dir-subtitle,
.household-profile-subtitle,
.household-profile-muted,
.household-profile-notes,
.household-profile-preline {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.household-dir-actions,
.household-dir-card__tools,
.household-dir-row-actions,
.household-dir-filter__buttons,
.household-dir-quickfilters,
.household-profile-actions,
.household-profile-title-line,
.household-profile-subtitle,
.household-profile-heading-row,
.household-profile-heading-with-bar,
.household-profile-member-actions,
.household-members-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.household-dir-filter,
.household-profile-panel {
    padding: 1.25rem;
}

.household-dir-filter__grid {
    display: grid;
    gap: 1rem;
    align-items: end;
    grid-template-columns: minmax(18rem, 1.5fr) repeat(3, minmax(10rem, 0.8fr)) auto;
}

.household-dir-field {
    display: grid;
    gap: 0.35rem;
}

.household-dir-control {
    background-color: var(--input-bg, var(--surface, var(--bs-body-bg))) !important;
    color: var(--text-main, var(--bs-body-color)) !important;
    border-color: var(--input-border, var(--border-color, var(--bs-border-color))) !important;
    border-radius: 0.85rem !important;
    min-height: 2.75rem;
}

.household-dir-quickfilters {
    margin-top: 1rem;
}

.household-dir-pill,
.household-profile-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    min-height: 1.9rem;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    background: var(--pill-bg, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
}

.household-dir-pill:hover,
.household-dir-pill.is-selected {
    color: var(--pill-selected-text, var(--primary, var(--bs-primary)));
    border-color: var(--pill-selected-border, var(--primary, var(--bs-primary)));
    background: var(--pill-selected-bg, var(--primary-soft, var(--surface-soft)));
    text-decoration: none;
}

.household-dir-pill--blue,
.household-profile-pill--blue { background: color-mix(in srgb, var(--bs-info) 25%, var(--surface, var(--bs-body-bg))); color: var(--primary, var(--bs-primary)); }
.household-dir-pill--green,
.household-profile-pill--green { background: color-mix(in srgb, var(--bs-success) 26%, var(--surface, var(--bs-body-bg))); color: var(--primary, var(--bs-primary)); }
.household-dir-pill--gold,
.household-profile-pill--gold { background: color-mix(in srgb, var(--bs-warning) 32%, var(--surface, var(--bs-body-bg))); color: var(--primary, var(--bs-primary)); }
.household-dir-pill--coral,
.household-profile-pill--coral { background: color-mix(in srgb, var(--bs-danger) 24%, var(--surface, var(--bs-body-bg))); color: var(--primary, var(--bs-primary)); }

.household-dir-card__header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.25rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.household-dir-section-title,
.household-profile-section-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.household-dir-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.25rem;
    min-height: 2.25rem;
    padding: 0.25rem 0.7rem;
    border-radius: 999px;
    background: var(--primary-soft, var(--surface-soft));
    color: var(--primary, var(--bs-primary));
    font-weight: 700;
}

.household-dir-table {
    color: var(--text-main, var(--bs-body-color));
    min-width: 900px;
}

.household-dir-table th,
.household-dir-table td {
    padding: 0.95rem 1.25rem;
    border-color: var(--table-border, var(--border-color, var(--bs-border-color))) !important;
    vertical-align: middle;
}

.household-dir-table tbody tr:hover td {
    background: var(--table-row-hover, var(--surface-soft)) !important;
}

.household-dir-id {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-variant-numeric: tabular-nums;
}

.household-dir-family {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 14rem;
}

.household-dir-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--bs-info) 30%, var(--surface, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
    font-size: 0.9rem;
    font-weight: 700;
    flex: 0 0 auto;
}


.household-workspace-identity__icon--image {
    border-radius: 1.15rem;
}

.household-workspace-identity__icon--preview {
    width: 7rem;
    height: 7rem;
    font-size: 2rem;
}
.household-dir-name,
.household-member-name {
    color: var(--text-main, var(--bs-body-color)) !important;
    font-weight: 700;
}

.household-dir-contact {
    min-width: 13rem;
    color: var(--text-main, var(--bs-body-color));
}

.household-dir-icon-btn,
.household-profile-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 0.7rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color))) !important;
    border: 1px solid transparent;
    text-decoration: none !important;
}

.household-dir-icon-btn:hover,
.household-profile-icon-btn:hover {
    color: var(--primary, var(--bs-primary)) !important;
    border-color: var(--pill-border-hover, var(--border-color, var(--bs-border-color)));
    background: var(--pill-bg-hover, var(--surface-soft));
}

.household-profile-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem 1.75rem;
}

.household-profile-info-row {
    display: flex;
    align-items: baseline;
    gap: 0.4rem;
    min-width: 0;
}

.household-profile-info-row-wide {
    grid-column: 1 / -1;
}

.household-profile-info-label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.88rem;
    font-weight: 500;
    white-space: nowrap;
}

.household-profile-info-value {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 500;
    min-width: 0;
    overflow-wrap: anywhere;
}

.household-profile-title-accent {
    width: 6rem;
    height: 0.25rem;
    border-radius: 999px;
    background: var(--bs-warning, var(--primary-soft));
}

.household-profile-side-accent {
    width: 0.42rem;
    height: 2rem;
    border-radius: 999px;
    background: var(--bs-info, var(--primary));
    flex: 0 0 auto;
}

.household-profile-side-accent-coral {
    background: var(--bs-danger, var(--primary));
}

.household-profile-preline,
.household-profile-notes {
    white-space: pre-line;
}

.household-members-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
}

.household-members-table {
    min-width: 860px;
}

.household-members-row {
    display: grid;
    grid-template-columns: 56px minmax(180px, 1.4fr) 90px 64px 130px 100px 82px;
    gap: 0.65rem;
    align-items: center;
    padding: 0.85rem 1rem;
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    color: var(--text-main, var(--bs-body-color));
}

.household-members-row:first-child {
    border-top: 0;
}

.household-members-head {
    background: var(--table-head-bg, var(--surface-soft));
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.household-members-empty {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    padding: 1.25rem;
    text-align: center;
}

.household-workspace-page {
    display: grid;
    gap: 1rem;
}

.household-workspace-hero {
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1.25rem;
    background: var(--surface, var(--bs-body-bg));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
}

.household-workspace-hero__body {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.25rem;
    padding: 1.5rem;
}

.household-workspace-identity {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    min-width: 0;
}

.household-workspace-identity__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4rem;
    height: 4rem;
    flex: 0 0 auto;
    border-radius: 1.15rem;
    background: var(--primary-soft, var(--surface-soft));
    color: var(--primary, var(--bs-primary));
    font-size: 1.6rem;
}

.household-workspace-identity__copy {
    display: grid;
    gap: 0.55rem;
    min-width: 0;
}

.household-workspace-address,
.household-workspace-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 1rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.92rem;
    line-height: 1.4;
}

.household-workspace-address {
    align-items: flex-start;
}

.household-workspace-meta {
    align-items: center;
}

.household-workspace-address .pi,
.household-workspace-meta .pi {
    color: var(--primary, var(--bs-primary));
    margin-right: 0.35rem;
}

.household-workspace-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.55rem;
    flex: 0 0 auto;
}

.household-workspace-actions .btn,
.household-workspace-actions .dropdown-item {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.household-workspace-section .household-profile-heading-row {
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
}

.household-workspace-section-heading {
    align-items: center;
    justify-content: space-between;
    gap: 0.9rem;
}

.household-workspace-section-heading > .btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-left: auto;
}

.household-workspace-info-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem 1.5rem;
}

.household-workspace-info-grid .household-profile-info-row {
    display: grid;
    gap: 0.2rem;
    align-items: start;
}

.household-workspace-info-grid .household-profile-info-label {
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    line-height: 1.15;
    text-transform: uppercase;
    white-space: normal;
}

.household-workspace-info-grid .household-profile-info-value {
    font-size: 0.98rem;
    font-weight: 600;
    line-height: 1.35;
}

.household-workspace-members-wrap {
    overflow-x: auto;
}

.household-workspace-members-table {
    min-width: 760px;
    color: var(--text-main, var(--bs-body-color));
}

.household-workspace-members-table th,
.household-workspace-members-table td {
    padding: 0.85rem 1rem;
    border-color: var(--table-border, var(--border-color, var(--bs-border-color))) !important;
    vertical-align: middle;
}

.household-workspace-members-table th:last-child,
.household-workspace-members-table td:last-child {
    width: 3.25rem;
}

.household-workspace-members-table tbody tr:hover td {
    background: var(--table-row-hover, var(--surface-soft)) !important;
}

.household-mobile-list {
    display: none;
}

.household-mobile-card {
    padding: 1rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
}

.household-mobile-card + .household-mobile-card {
    margin-top: 0.75rem;
}

.household-mobile-card__header,
.household-mobile-card__open {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.household-mobile-card__details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
    margin: 1rem 0 0;
}

.household-mobile-card__details > div {
    min-width: 0;
}

.household-mobile-card__details dt {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.household-mobile-card__details dd {
    margin: 0.2rem 0 0;
    color: var(--text-main, var(--bs-body-color));
    overflow-wrap: anywhere;
}

.household-mobile-card__detail-wide {
    grid-column: 1 / -1;
}

.household-mobile-card__open {
    margin-top: 1rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    color: var(--primary, var(--bs-primary));
    font-weight: 650;
    text-decoration: none;
}

.household-mobile-gift__amount {
    color: var(--text-main, var(--bs-body-color));
    white-space: nowrap;
}

.household-member-primary {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    min-width: 0;
    color: var(--text-main, var(--bs-body-color));
    text-decoration: none;
}

.household-member-primary:hover,
.household-member-primary:focus-visible {
    color: var(--primary, var(--bs-primary));
    outline: 0;
}

.household-member-copy {
    display: grid;
    gap: 0.1rem;
    min-width: 0;
}

.household-member-meta,
.household-workspace-muted {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.84rem;
}

.household-workspace-value {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 600;
}

.household-giving-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.household-giving-summary__item {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
    padding: 0.85rem 1rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.95rem;
    background: var(--surface, var(--bs-body-bg));
}

.household-workspace-empty {
    display: grid;
    justify-items: center;
    gap: 0.65rem;
    padding: 2.25rem 1rem;
    border: 1px dashed var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
}

.household-workspace-empty > .pi {
    color: var(--primary, var(--bs-primary));
    font-size: 1.55rem;
}

.household-workspace-empty__title {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 650;
}

@media (max-width: 767.98px) {
    .household-mobile-list {
        display: block;
    }
}

@media (max-width: 1199.98px) {
    .household-dir-filter__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .household-dir-field--search,
    .household-dir-filter__buttons {
        grid-column: 1 / -1;
    }
}

@media (max-width: 991.98px) {
    .household-workspace-hero__body {
        flex-direction: column;
    }

    .household-workspace-actions {
        justify-content: flex-start;
    }

    .household-workspace-info-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .household-giving-summary {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .household-dir-hero__body,
    .household-profile-hero__body,
    .household-workspace-hero__body,
    .household-dir-filter,
    .household-dir-card__header,
    .household-profile-panel {
        padding: 1rem;
    }
    .household-dir-filter__grid,
    .household-profile-info-grid,
    .household-workspace-info-grid {
        grid-template-columns: 1fr;
    }

    .household-workspace-identity {
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
    }

    .household-workspace-identity__icon {
        width: 4.75rem;
        height: 4.75rem;
        font-size: 1.65rem;
    }

    .household-workspace-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
    }

    .household-workspace-actions .btn,
    .household-workspace-actions .dropdown,
    .household-workspace-actions .dropdown > .btn {
        width: 100%;
        justify-content: center;
    }

    .household-workspace-actions > :last-child:nth-child(odd) {
        grid-column: 1 / -1;
    }

    .household-profile-page .profile-header-menu {
        max-width: calc(100vw - 2rem);
    }

    .household-giving-summary {
        grid-template-columns: 1fr;
    }

    .household-workspace-section-heading {
        align-items: flex-start;
    }

    .household-workspace-section-heading > .btn {
        justify-content: center;
        margin-left: 0;
        width: 100%;
    }

    .household-profile-info-row-wide,
    .household-dir-field--search,
    .household-dir-filter__buttons {
        grid-column: auto;
    }
}


/* ===== Master calendar app themed layout ===== */
.calendar-hero,
.calendar-toolbar-card,
.calendar-surface,
.calendar-side-card {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    border-radius: 1.25rem;
}

.calendar-hero {
    overflow: hidden;
}

.calendar-hero__accent {
    height: 0.5rem;
    background: linear-gradient(90deg, var(--primary, var(--bs-primary)), var(--bs-info), var(--bs-danger), var(--bs-warning));
}

.calendar-hero__body {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem;
}

.calendar-hero__kicker {
    color: var(--primary, var(--bs-primary));
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.calendar-hero__title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.75rem, 2.2vw, 2.35rem);
    font-weight: 700;
    letter-spacing: -0.03em;
}

.calendar-hero__subtitle {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    max-width: 42rem;
}

.calendar-hero__actions,
.calendar-view-tabs,
.calendar-toolbar-actions,
.calendar-source-pills,
.calendar-nav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.calendar-view-tabs {
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--table-head-bg, var(--surface-soft));
    padding: 1rem 1.5rem;
}

.calendar-view-tabs__label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.88rem;
    font-weight: 700;
}

.calendar-view-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2rem;
    padding: 0.35rem 0.95rem;
    border-radius: 999px;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    background: var(--pill-bg, var(--surface, var(--bs-body-bg)));
    color: var(--btn-outline-neutral-text, var(--text-main, var(--bs-body-color)));
    text-decoration: none;
    font-size: 0.86rem;
    font-weight: 600;
}

.calendar-view-tab:hover,
.calendar-view-tab.is-selected {
    color: var(--pill-selected-text, var(--primary, var(--bs-primary)));
    border-color: var(--pill-selected-border, var(--primary, var(--bs-primary)));
    background: var(--pill-selected-bg, var(--primary-soft, var(--surface-soft)));
    text-decoration: none;
}

.calendar-toolbar-card__body {
    padding: 1.25rem;
}

.calendar-toolbar-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
    gap: 1rem;
    align-items: end;
}

.calendar-source-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.55rem 0.8rem;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    border-radius: 999px;
    background: var(--pill-bg, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
}

.calendar-source-pill .swatch {
    width: 0.8rem;
    height: 0.8rem;
    border-radius: 999px;
    display: inline-block;
}

.calendar-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 1rem;
}

.calendar-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.8rem;
    flex-wrap: wrap;
    padding: 1.25rem 1.25rem 0;
}

.calendar-head-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.2rem;
    font-weight: 700;
    margin: 0;
}

.calendar-grid-weekdays,
.calendar-month-row {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0.75rem;
}

.calendar-grid-weekdays {
    padding: 0 1.25rem;
    margin: 1rem 0 0.5rem;
}

.calendar-weekday-label {
    padding: 0.15rem 0.5rem;
    font-size: 0.76rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-weight: 800;
}

.calendar-month-wrap,
.calendar-week-wrap,
.calendar-list-wrap {
    padding: 0 1.25rem 1.25rem;
}

.calendar-day {
    position: relative;
    display: block;
    min-height: 10.5rem;
    cursor: pointer;
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    padding: 0.8rem;
    background: var(--surface-strong, var(--surface, var(--bs-body-bg)));
    text-decoration: none;
    color: inherit;
    transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.calendar-day:hover {
    border-color: var(--primary, var(--bs-primary));
    box-shadow: 0 0.55rem 1.15rem rgba(0,0,0,.10);
    transform: translateY(-1px);
}

.calendar-day.is-outside {
    opacity: 0.72;
    background: color-mix(in srgb, var(--surface-muted, var(--surface, #fff)) 72%, transparent);
}

.calendar-day.is-today {
    border-color: color-mix(in srgb, var(--bs-danger) 55%, var(--primary, var(--bs-primary)));
    background: color-mix(in srgb, var(--bs-danger) 10%, var(--surface-strong, var(--surface, var(--bs-body-bg))));
}

.calendar-day.is-selected {
    background: color-mix(in srgb, var(--bs-warning) 18%, var(--surface-strong, var(--surface, var(--bs-body-bg))));
    border-color: var(--bs-warning, var(--primary, var(--bs-primary)));
}

.calendar-day-top,
.calendar-day-items {
    position: relative;
    z-index: 2;
}

.calendar-day-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.7rem;
}

.calendar-day-date-link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: inherit;
    text-decoration: none;
}

.calendar-day-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    height: 2rem;
    padding: 0 0.55rem;
    border-radius: 0.75rem;
    background: var(--surface-muted, color-mix(in srgb, var(--surface, #fff) 85%, var(--primary, #0d6efd) 15%));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--border-color, rgba(0,0,0,.08));
    font-size: 1rem;
    font-weight: 800;
}

.calendar-day.is-today .calendar-day-number {
    background: color-mix(in srgb, var(--bs-danger) 22%, var(--surface-strong, #fff));
}

.calendar-day.is-selected .calendar-day-number {
    background: color-mix(in srgb, var(--bs-warning) 28%, var(--surface-strong, #fff));
}

.calendar-day-meta,
.calendar-empty {
    font-size: 0.76rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-weight: 600;
}

.calendar-day-items {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.calendar-item {
    --item-accent: var(--primary, var(--bs-primary));
    --item-surface: color-mix(in srgb, var(--item-accent) 18%, var(--surface-strong, #fff));
    display: flex;
    align-items: stretch;
    gap: 0.55rem;
    border-radius: 0.85rem;
    padding: 0.48rem 0.6rem;
    font-size: 0.79rem;
    line-height: 1.15;
    color: var(--text-main, var(--bs-body-color));
    background: linear-gradient(135deg, var(--item-surface) 0%, color-mix(in srgb, var(--item-accent) 8%, var(--surface-strong, #fff)) 100%);
    border: 1px solid color-mix(in srgb, var(--item-accent) 40%, var(--border-color, rgba(0,0,0,.08)));
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0,0,0,.06);
}

.calendar-item:hover {
    border-color: var(--item-accent);
    box-shadow: 0 8px 18px rgba(0,0,0,.11);
}

.calendar-item.is-link {
    text-decoration: none;
}

.calendar-item-swatch {
    width: 0.38rem;
    align-self: stretch;
    border-radius: 0.5rem;
    flex: 0 0 0.38rem;
    background: var(--item-accent);
}

.calendar-item-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.calendar-item-row {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.calendar-item-time {
    font-weight: 800;
    white-space: nowrap;
    font-size: 0.7rem;
    color: color-mix(in srgb, var(--text-main, var(--bs-body-color)) 88%, var(--item-accent) 12%);
}

.calendar-item-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 800;
    color: var(--text-main, var(--bs-body-color));
}

.calendar-item-teachers {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.69rem;
    color: color-mix(in srgb, var(--text-main, var(--bs-body-color)) 72%, var(--item-accent) 28%);
    font-weight: 600;
}

.calendar-item-more {
    font-size: 0.74rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    padding-left: 0.2rem;
    font-weight: 700;
}

.calendar-week-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0.75rem;
}

.calendar-week-column {
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface-strong, var(--surface, var(--bs-body-bg)));
    min-height: 26rem;
    display: flex;
    flex-direction: column;
}

.calendar-week-column.is-today {
    border-color: color-mix(in srgb, var(--bs-danger) 55%, var(--primary, var(--bs-primary)));
    background: color-mix(in srgb, var(--bs-danger) 7%, var(--surface-strong, var(--surface, var(--bs-body-bg))));
}

.calendar-week-column.is-selected {
    background: color-mix(in srgb, var(--bs-warning) 14%, var(--surface-strong, var(--surface, var(--bs-body-bg))));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--bs-warning) 70%, transparent);
}

.calendar-week-heading {
    padding: 0.9rem 0.9rem 0.65rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--table-head-bg, var(--surface-soft));
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
}

.calendar-week-link {
    text-decoration: none;
    color: inherit;
    display: block;
}

.calendar-week-heading .dow {
    font-size: 0.72rem;
    text-transform: uppercase;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    letter-spacing: 0.08em;
    font-weight: 800;
}

.calendar-week-heading .dom {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--text-main, var(--bs-body-color));
}

.calendar-week-body {
    padding: 0.8rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.calendar-agenda,
.calendar-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.calendar-side-card + .calendar-side-card {
    margin-top: 1rem;
}

.calendar-agenda-item,
.calendar-list-item {
    display: block;
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-left: 0.42rem solid var(--item-accent, var(--primary, var(--bs-primary)));
    border-radius: 0.95rem;
    padding: 0.85rem 0.9rem;
    text-decoration: none;
    color: inherit;
    background: var(--surface-strong, var(--surface, var(--bs-body-bg)));
}

.calendar-agenda-item:hover,
.calendar-list-item:hover {
    border-color: color-mix(in srgb, var(--item-accent, var(--primary, var(--bs-primary))) 42%, var(--table-border, var(--border-color, var(--bs-border-color))));
    border-left-color: var(--item-accent, var(--primary, var(--bs-primary)));
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,.08);
    text-decoration: none;
}

.calendar-list-item {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
}

.calendar-list-item__date {
    text-align: center;
    border-right: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    padding-right: 0.75rem;
}

.calendar-list-item__day {
    font-weight: 800;
    color: var(--text-main, var(--bs-body-color));
}

.calendar-list-item__dow,
.calendar-list-item__meta,
.calendar-list-item__detail {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.82rem;
}

.calendar-list-item__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    align-items: center;
    margin-bottom: 0.25rem;
}

.calendar-list-item__title {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
}

.calendar-list-item__action {
    color: var(--primary, var(--bs-primary));
    font-size: 0.82rem;
    font-weight: 700;
}

.calendar-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border-radius: 999px;
    padding: 0.22rem 0.6rem;
    font-size: 0.72rem;
    font-weight: 800;
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface-muted, var(--surface-soft));
}

.calendar-upcoming-item {
    text-decoration: none;
    color: inherit;
    display: block;
}

.calendar-upcoming-item + .calendar-upcoming-item {
    margin-top: 0.9rem;
}

@media (max-width: 1399.98px) {
    .calendar-toolbar-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .calendar-toolbar-actions { grid-column: 1 / -1; }
}

@media (max-width: 1199.98px) {
    .calendar-shell { grid-template-columns: 1fr; }
}

@media (max-width: 991.98px) {
    .calendar-grid-weekdays,
    .calendar-month-row,
    .calendar-week-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767.98px) {
    .calendar-toolbar-grid,
    .calendar-grid-weekdays,
    .calendar-month-row,
    .calendar-week-grid { grid-template-columns: 1fr; }
    .calendar-grid-weekdays { display: none; }
    .calendar-list-item { grid-template-columns: 1fr; }
    .calendar-list-item__date { text-align: left; border-right: 0; padding-right: 0; }
}

/* ===== Master calendar workspace redesign ===== */
.calendar-commandbar,
.calendar-surface,
.calendar-agenda-panel {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, 0 12px 28px rgba(0, 0, 0, 0.07));
    border-radius: 1.1rem;
}

.calendar-commandbar {
    overflow: hidden;
}

.calendar-commandbar__form {
    display: grid;
    gap: 0.75rem;
    padding: 0.9rem 1rem;
}

.calendar-commandbar__main,
.calendar-commandbar__sources,
.calendar-commandbar__actions {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    flex-wrap: wrap;
}

.calendar-commandbar__main {
    justify-content: space-between;
}

.calendar-commandbar__actions {
    justify-content: flex-end;
}

.calendar-control-group {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.2rem;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    border-radius: 999px;
    background: var(--surface-soft, var(--bs-light));
}

.calendar-commandbar__utilities {
    border-color: transparent;
    background: transparent;
    padding: 0;
}

.calendar-commandbar__sources {
    justify-content: space-between;
    padding-top: 0.65rem;
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.calendar-commandbar__title-group {
    min-width: min(100%, 18rem);
}

.calendar-commandbar__kicker {
    color: var(--primary, var(--bs-primary));
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.1;
    text-transform: uppercase;
}

.calendar-commandbar__title {
    margin: 0.12rem 0 0;
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.35rem, 1.8vw, 1.85rem);
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.12;
}

.calendar-commandbar__summary {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.8rem;
    font-weight: 650;
}

.calendar-commandbar .calendar-view-tabs.calendar-control-group {
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface-soft, var(--bs-light));
    padding: 0.2rem;
}

.calendar-commandbar .calendar-view-tab {
    min-height: 2rem;
    padding: 0.32rem 0.72rem;
    border-color: transparent;
    background: transparent;
    font-size: 0.8rem;
    font-weight: 600;
}

.calendar-filter-toggle {
    gap: 0.4rem;
}

.calendar-filter-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.45rem;
    height: 1.45rem;
    padding: 0 0.38rem;
    border-radius: 999px;
    background: var(--primary-soft, var(--surface-soft));
    color: var(--primary, var(--bs-primary));
    font-size: 0.72rem;
    font-weight: 700;
}

.calendar-commandbar #calendarFilters {
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    padding-top: 0.85rem;
}

.calendar-commandbar .calendar-toolbar-grid {
    grid-template-columns: repeat(4, minmax(10rem, 1fr)) auto;
    gap: 0.75rem;
}

.calendar-commandbar .form-label {
    margin-bottom: 0.25rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.78rem;
    font-weight: 650;
}

.calendar-commandbar .form-select {
    min-height: 2.45rem;
    border-radius: 0.8rem;
}

.calendar-source-pill {
    min-height: 2rem;
    padding: 0.35rem 0.72rem;
    font-size: 0.82rem;
}

.calendar-source-pill .form-check-input {
    margin-top: 0;
}

.calendar-shell {
    grid-template-columns: minmax(0, 1fr) minmax(18rem, 20rem);
    gap: 0.85rem;
    align-items: start;
    min-width: 0;
}

.calendar-surface {
    overflow: hidden;
    min-width: 0;
}

.calendar-head {
    padding: 0.85rem 1rem 0;
}

.calendar-head-title {
    font-size: 1.05rem;
}

.calendar-grid-weekdays,
.calendar-month-row {
    gap: 0.45rem;
}

.calendar-grid-weekdays {
    padding: 0 1rem;
    margin: 0.75rem 0 0.35rem;
}

.calendar-weekday-label {
    padding: 0 0.35rem;
    font-size: 0.7rem;
}

.calendar-month-wrap,
.calendar-week-wrap,
.calendar-list-wrap {
    padding: 0 1rem 1rem;
}

.calendar-month-row.mb-3 {
    margin-bottom: 0.45rem !important;
}

.calendar-day {
    display: flex;
    flex-direction: column;
    min-height: 8.7rem;
    border-radius: 0.85rem;
    padding: 0.52rem;
    background: var(--surface, var(--bs-body-bg));
    box-shadow: none;
    min-width: 0;
    overflow: hidden;
}

.calendar-day:hover {
    box-shadow: 0 0.45rem 0.9rem rgba(0, 0, 0, 0.07);
}

.calendar-day.is-today {
    border-color: color-mix(in srgb, var(--primary, var(--bs-primary)) 50%, var(--card-border, var(--bs-border-color)));
    background: var(--surface, var(--bs-body-bg));
}

.calendar-day.is-selected {
    border-color: var(--primary, var(--bs-primary));
    background: color-mix(in srgb, var(--primary-soft, var(--surface-soft)) 44%, var(--surface, var(--bs-body-bg)) 56%);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary, var(--bs-primary)) 45%, transparent);
}

.calendar-day-top {
    margin-bottom: 0.42rem;
    min-width: 0;
}

.calendar-day-number {
    min-width: 1.72rem;
    height: 1.72rem;
    border-radius: 0.62rem;
    font-size: 0.88rem;
    background: transparent;
}

.calendar-day.is-today .calendar-day-number {
    background: var(--primary, var(--bs-primary));
    border-color: var(--primary, var(--bs-primary));
    color: var(--bs-white, #fff);
}

.calendar-day.is-selected .calendar-day-number {
    background: color-mix(in srgb, var(--primary, var(--bs-primary)) 14%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--primary, var(--bs-primary)) 42%, var(--card-border, var(--bs-border-color)));
    color: var(--text-main, var(--bs-body-color));
}

.calendar-day.is-selected.is-today .calendar-day-number {
    background: var(--primary, var(--bs-primary));
    color: var(--bs-white, #fff);
}

.calendar-day-items {
    gap: 0.28rem;
    min-width: 0;
    overflow: hidden;
}

.calendar-item {
    border-radius: 0.55rem;
    padding: 0.28rem 0.38rem;
    gap: 0.38rem;
    border-color: transparent;
    background: transparent;
    box-shadow: none;
    font-size: 0.73rem;
    min-width: 0;
    max-width: 100%;
}

.calendar-item:hover {
    background: color-mix(in srgb, var(--item-accent) 11%, var(--surface, var(--bs-body-bg)));
    box-shadow: none;
}

.calendar-item-swatch {
    width: 0.22rem;
    flex-basis: 0.22rem;
    border-radius: 999px;
    flex-shrink: 0;
}

.calendar-item-main {
    gap: 0.05rem;
    min-width: 0;
    overflow: hidden;
    flex: 1 1 auto;
}

.calendar-item-row {
    min-width: 0;
    overflow: hidden;
}

.calendar-item-time {
    font-size: 0.66rem;
    font-weight: 700;
}

.calendar-item-title {
    font-weight: 700;
    min-width: 0;
}

.calendar-item-teachers {
    font-size: 0.66rem;
    font-weight: 500;
    min-width: 0;
}

.calendar-item-more {
    display: inline-flex;
    width: fit-content;
    margin-top: 0.1rem;
    padding: 0.18rem 0.45rem;
    border-radius: 999px;
    background: var(--surface-soft, var(--bs-light));
    color: var(--primary, var(--bs-primary));
    font-size: 0.7rem;
    text-decoration: none;
}

.calendar-week-column {
    min-height: 22rem;
}

.calendar-week-heading {
    padding: 0.72rem 0.75rem 0.58rem;
}

.calendar-week-body {
    padding: 0.6rem;
    gap: 0.35rem;
}

.calendar-agenda-panel {
    position: sticky;
    top: 1rem;
    overflow: hidden;
    min-width: 0;
}

.calendar-agenda-panel__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.8rem;
    padding: 0.95rem 1rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.calendar-agenda-panel__title {
    margin: 0.1rem 0 0;
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.02rem;
    font-weight: 700;
    line-height: 1.2;
}

.calendar-agenda-panel__count {
    display: inline-flex;
    white-space: nowrap;
    border-radius: 999px;
    padding: 0.26rem 0.58rem;
    background: var(--pill-bg, var(--surface-soft));
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.74rem;
    font-weight: 650;
}

.calendar-agenda-panel__body {
    max-height: min(38rem, calc(100vh - 15rem));
    overflow-y: auto;
    padding: 0.85rem;
}

.calendar-agenda-panel__sources {
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    padding: 0.85rem 1rem 1rem;
    font-size: 0.82rem;
}

.calendar-agenda-panel__subtitle {
    margin: 0 0 0.55rem;
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.92rem;
    font-weight: 700;
}

.calendar-agenda,
.calendar-list {
    gap: 0.55rem;
    min-width: 0;
}

.calendar-agenda-item,
.calendar-list-item {
    border-radius: 0.8rem;
    padding: 0.72rem 0.78rem;
    background: var(--surface, var(--bs-body-bg));
    min-width: 0;
    overflow-wrap: anywhere;
}

.calendar-agenda-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: 0.3rem;
    min-width: 0;
}

.calendar-agenda-item__title {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.calendar-agenda-item__detail {
    margin-top: 0.12rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.82rem;
}

.calendar-chip {
    padding: 0.16rem 0.48rem;
    font-size: 0.68rem;
    font-weight: 700;
}

@media (max-width: 1399.98px) {
    .calendar-commandbar .calendar-toolbar-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .calendar-commandbar .calendar-toolbar-actions {
        grid-column: 1 / -1;
    }
}

@media (max-width: 1199.98px) {
    .calendar-agenda-panel {
        position: static;
    }
}

@media (max-width: 991.98px) {
    .calendar-grid-weekdays,
    .calendar-month-row,
    .calendar-week-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .calendar-day {
        min-height: 7.75rem;
    }
}

@media (max-width: 767.98px) {
    .calendar-commandbar__form,
    .calendar-head,
    .calendar-month-wrap,
    .calendar-week-wrap,
    .calendar-list-wrap,
    .calendar-agenda-panel__header,
    .calendar-agenda-panel__sources {
        padding-left: 0.85rem;
        padding-right: 0.85rem;
    }

    .calendar-commandbar__main,
    .calendar-commandbar__actions,
    .calendar-commandbar__sources,
    .calendar-source-pills,
    .calendar-nav,
    .calendar-commandbar .calendar-view-tabs {
        align-items: stretch;
        width: 100%;
    }

    .calendar-commandbar__actions,
    .calendar-source-pills {
        justify-content: flex-start;
    }

    .calendar-control-group {
        border-radius: 0.85rem;
        flex-wrap: wrap;
    }

    .calendar-commandbar .calendar-toolbar-grid,
    .calendar-grid-weekdays,
    .calendar-month-row,
    .calendar-week-grid {
        grid-template-columns: 1fr;
    }

    .calendar-grid-weekdays {
        display: none;
    }

    .calendar-list-item {
        grid-template-columns: 1fr;
    }

    .calendar-list-item__date {
        text-align: left;
        border-right: 0;
        padding-right: 0;
    }
}

/* ===== Giso calendar workspace ===== */
.giso-calendar-page {
    color: var(--text-main, var(--bs-body-color));
}

.giso-calendar-page-head {
    margin-bottom: 0.9rem;
}

.giso-calendar-page-title {
    margin: 0;
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.35rem, 1.8vw, 1.75rem);
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.15;
}

.giso-calendar-page-subtitle {
    margin: 0.25rem 0 0;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.92rem;
}

.giso-calendar-workspace {
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    overflow: hidden;
}

.giso-calendar-toolbar {
    display: grid;
    gap: 0.75rem;
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.giso-calendar-toolbar-main {
    display: grid;
    grid-template-columns: minmax(12rem, 1fr) auto minmax(12rem, 1fr);
    gap: 0.75rem 1rem;
    align-items: center;
}

.giso-calendar-left-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 0.9rem;
    min-width: 0;
}

.giso-calendar-center-stage {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    text-align: center;
}

.giso-calendar-right-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    min-width: 0;
}

.giso-calendar-period {
    min-width: 0;
}

.giso-calendar-period h2 {
    margin: 0;
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.25rem, 1.7vw, 1.65rem);
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.15;
}

.giso-calendar-period span,
.giso-calendar-filter-summary {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.78rem;
}

.giso-calendar-controls {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.giso-calendar-control-group,
.giso-calendar-action-group {
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
    flex-wrap: nowrap;
    padding: 0.22rem;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    border-radius: 999px;
    background: var(--surface-soft, var(--bs-light));
    min-width: 0;
}

.giso-calendar-action-group {
    gap: 0.45rem;
    padding: 0;
    border-color: transparent;
    background: transparent;
}

.giso-calendar-nav-group {
    gap: 0.35rem;
    padding: 0;
    border-color: transparent;
    background: transparent;
}

.giso-calendar-view-switcher {
    background: transparent;
}

.giso-calendar-nav-group .btn {
    background: transparent !important;
    box-shadow: none;
}

.giso-calendar-nav-group .btn:hover,
.giso-calendar-nav-group .btn:focus {
    background: var(--btn-outline-neutral-hover-bg, var(--surface-soft, var(--bs-light))) !important;
}

.giso-calendar-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.15rem;
    padding-right: 0;
    padding-left: 0;
}

.giso-calendar-icon-btn .bi {
    line-height: 1;
}

.giso-calendar-segment {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.1rem;
    padding: 0.35rem 0.78rem;
    border-radius: 999px;
    color: var(--btn-outline-neutral-text, var(--text-main, var(--bs-body-color)));
    font-size: 0.82rem;
    font-weight: 500;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
}

.giso-calendar-segment:hover,
.giso-calendar-segment.is-active {
    background: var(--primary, var(--bs-primary));
    color: var(--bs-white, #fff);
    text-decoration: none;
}

.giso-calendar-source-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.65rem;
    padding-top: 0.65rem;
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.giso-calendar-program-chip {
    --chip-accent: var(--primary, var(--bs-primary));
    max-width: 12rem;
    overflow: hidden;
    text-overflow: ellipsis;
    text-decoration: none;
}

.giso-calendar-program-chip:hover,
.giso-calendar-program-chip.is-active {
    border-color: color-mix(in srgb, var(--chip-accent) 46%, var(--pill-border, var(--border-color, var(--bs-border-color))));
    background: color-mix(in srgb, var(--chip-accent) 14%, var(--pill-bg, var(--surface, var(--bs-body-bg))));
    color: color-mix(in srgb, var(--chip-accent) 84%, var(--text-main, var(--bs-body-color)));
    text-decoration: none;
}

.giso-calendar-program-chip > span:last-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.giso-calendar-source-toggles {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
}

.giso-calendar-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 2rem;
    padding: 0.35rem 0.7rem;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    border-radius: 999px;
    background: var(--pill-bg, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.82rem;
    white-space: nowrap;
}

.giso-calendar-toggle-dot {
    display: inline-block;
    width: 0.72rem;
    height: 0.72rem;
    border-radius: 999px;
    flex: 0 0 0.72rem;
}

.giso-calendar-toggle-dot--event {
    background: var(--primary, var(--bs-primary));
}

.giso-calendar-toggle-dot--education {
    background: var(--bs-success);
}

.giso-calendar-toggle-dot--all {
    background: var(--primary, var(--bs-primary));
}

.giso-calendar-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    min-height: min(72vh, 48rem);
}

.giso-calendar-main {
    min-width: 0;
    padding: 1rem;
}

.giso-calendar-scroll {
    max-width: 100%;
    overflow-x: visible;
}

.giso-calendar-weekdays,
.giso-calendar-month-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    min-width: 0;
}

.giso-calendar-weekdays div {
    padding: 0.65rem 0.7rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-align: center;
    text-transform: uppercase;
}

.giso-calendar-month-grid {
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-left: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.85rem;
    overflow: hidden;
}

.giso-calendar-day {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 7.9rem;
    padding: 0.58rem;
    border-right: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface, var(--bs-body-bg));
    cursor: pointer;
    overflow: hidden;
    transition: background 0.16s ease, box-shadow 0.16s ease;
}

.giso-calendar-day:hover {
    background: var(--table-row-hover, var(--surface-soft, var(--bs-light)));
}

.giso-calendar-day.is-outside {
    background: var(--surface-soft, var(--bs-light));
    opacity: 0.58;
}

.giso-calendar-day.is-selected {
    background: color-mix(in srgb, var(--primary-soft, var(--surface-soft)) 55%, var(--surface, var(--bs-body-bg)));
    box-shadow: inset 0 0 0 2px var(--primary, var(--bs-primary));
}

.giso-calendar-day.is-selected.is-today {
    box-shadow: inset 0 0 0 2px var(--primary, var(--bs-primary)), 0 0 0 3px color-mix(in srgb, var(--primary, var(--bs-primary)) 16%, transparent);
}

.giso-calendar-day-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.4rem;
    margin-bottom: 0.35rem;
    min-width: 0;
}

.giso-calendar-day-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.75rem;
    height: 1.75rem;
    border: 1px solid transparent;
    border-radius: 999px;
    color: inherit;
    font-size: 0.86rem;
    font-weight: 700;
    text-decoration: none;
}

.giso-calendar-day.is-today .giso-calendar-day-number {
    border-color: var(--primary, var(--bs-primary));
    background: var(--primary, var(--bs-primary));
    color: var(--bs-white, #fff);
}

.giso-calendar-day-count {
    display: none;
    padding: 0.05rem 0.36rem;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    border-radius: 999px;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.72rem;
}

.giso-calendar-day-dots,
.giso-calendar-mobile-summary {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.22rem;
    min-height: 0.58rem;
}

.giso-calendar-day-dots {
    margin-bottom: 0.26rem;
}

.giso-calendar-day-dot {
    --dot-color: var(--primary, var(--bs-primary));
    display: inline-flex;
    width: 0.42rem;
    height: 0.42rem;
    flex: 0 0 0.42rem;
    border-radius: 999px;
    background: var(--dot-color);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--dot-color) 36%, var(--surface, var(--bs-body-bg)));
}

.giso-calendar-day-items {
    display: grid;
    gap: 0.22rem;
    min-width: 0;
    overflow: hidden;
}

.giso-calendar-item {
    --item-accent: var(--primary, var(--bs-primary));
    display: flex;
    align-items: flex-start;
    gap: 0.38rem;
    min-width: 0;
    max-width: 100%;
    padding: 0.18rem 0.2rem;
    border-radius: 0.45rem;
    color: inherit;
    text-decoration: none;
    overflow: hidden;
}

.giso-calendar-item:hover {
    background: color-mix(in srgb, var(--item-accent) 11%, var(--surface, var(--bs-body-bg)));
    color: inherit;
    text-decoration: none;
}

.giso-calendar-item-accent {
    width: 0.18rem;
    min-height: 1.75rem;
    border-radius: 999px;
    background: var(--item-accent);
    flex: 0 0 0.18rem;
}

.giso-calendar-item-body {
    display: grid;
    gap: 0.03rem;
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
}

.giso-calendar-item-line {
    display: flex;
    align-items: baseline;
    gap: 0.35rem;
    min-width: 0;
    overflow: hidden;
}

.giso-calendar-item-time {
    flex: 0 0 auto;
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.68rem;
    font-weight: 650;
    white-space: nowrap;
}

.giso-calendar-mini-chip {
    --chip-accent: var(--primary, var(--bs-primary));
    display: inline-flex;
    align-items: center;
    flex: 0 1 auto;
    max-width: 5.75rem;
    padding: 0.05rem 0.32rem;
    border: 1px solid color-mix(in srgb, var(--chip-accent) 38%, var(--pill-border, var(--border-color, var(--bs-border-color))));
    border-radius: 999px;
    background: color-mix(in srgb, var(--chip-accent) 14%, var(--surface, var(--bs-body-bg)));
    color: color-mix(in srgb, var(--chip-accent) 82%, var(--text-main, var(--bs-body-color)));
    font-size: 0.58rem;
    font-weight: 650;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.giso-calendar-item-title,
.giso-calendar-item-detail {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.giso-calendar-item-title {
    font-size: 0.72rem;
    font-weight: 650;
}

.giso-calendar-item-detail {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.68rem;
}

.giso-calendar-more {
    width: fit-content;
    margin-top: 0.08rem;
    padding: 0.12rem 0.48rem;
    border: 1px solid var(--pill-selected-border, var(--primary, var(--bs-primary)));
    border-radius: 999px;
    background: var(--primary-soft, var(--surface-soft));
    color: var(--primary, var(--bs-primary));
    font-size: 0.7rem;
    font-weight: 600;
    text-decoration: none;
}

.giso-calendar-mobile-month {
    display: none;
}

.giso-calendar-week-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0.55rem;
    min-width: 860px;
}

.giso-calendar-week-day {
    min-height: 24rem;
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.9rem;
    background: var(--surface, var(--bs-body-bg));
    overflow: hidden;
}

.giso-calendar-week-day.is-selected {
    box-shadow: inset 0 0 0 2px var(--primary, var(--bs-primary));
}

.giso-calendar-week-head {
    display: grid;
    gap: 0.08rem;
    padding: 0.75rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface-soft, var(--bs-light));
    color: inherit;
    text-decoration: none;
}

.giso-calendar-week-head span {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.giso-calendar-week-head strong {
    font-size: 0.95rem;
}

.giso-calendar-week-head em {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.72rem;
    font-style: normal;
}

.giso-calendar-week-items {
    display: grid;
    gap: 0.35rem;
    padding: 0.55rem;
}

.giso-calendar-list {
    display: grid;
    gap: 1rem;
}

.giso-calendar-list-date-group {
    display: grid;
    min-width: 0;
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
    overflow: hidden;
}

.giso-calendar-list-date-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.82rem 0.95rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: color-mix(in srgb, var(--surface-soft, var(--surface, var(--bs-body-bg))) 62%, var(--surface, var(--bs-body-bg)));
}

.giso-calendar-list-date-head h3 {
    margin: 0;
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.25;
}

.giso-calendar-list-date-head span {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.78rem;
    white-space: nowrap;
}

.giso-calendar-list-rows {
    display: grid;
}

.giso-calendar-list-item {
    --item-accent: var(--primary, var(--bs-primary));
    display: grid;
    grid-template-columns: minmax(4.4rem, 5.1rem) 1.05rem 2.15rem minmax(0, 1fr) auto auto;
    gap: 0.62rem;
    align-items: stretch;
    min-width: 0;
    padding: 0;
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--table-border, var(--border-color, var(--bs-border-color))) 72%, transparent);
    border-radius: 0;
    background: transparent;
    color: inherit;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.giso-calendar-list-item:hover {
    background: var(--table-row-hover, var(--surface-soft, var(--bs-light)));
    color: inherit;
    text-decoration: none;
}

.giso-calendar-list-item:last-child {
    border-bottom: 0;
}

.giso-calendar-list-body {
    display: grid;
    align-content: center;
    gap: 0.14rem;
    min-width: 0;
    padding: 0.62rem 0;
}

.giso-calendar-list-source-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    width: 2.15rem;
    height: 2.15rem;
    border: 1px solid color-mix(in srgb, var(--item-accent) 32%, var(--pill-border, var(--border-color, var(--bs-border-color))));
    border-radius: 999px;
    background: color-mix(in srgb, var(--item-accent) 14%, var(--surface, var(--bs-body-bg)));
    color: color-mix(in srgb, var(--item-accent) 82%, var(--text-main, var(--bs-body-color)));
    font-size: 0.98rem;
    line-height: 1;
}

.giso-calendar-list-timeline {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: stretch;
    min-height: 100%;
}

.giso-calendar-list-timeline::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 1px;
    transform: translateX(-50%);
    background: color-mix(in srgb, var(--table-border, var(--border-color, var(--bs-border-color))) 78%, transparent);
}

.giso-calendar-list-timeline > span {
    position: relative;
    z-index: 1;
    width: 0.48rem;
    height: 0.48rem;
    border-radius: 999px;
    background: var(--surface, var(--bs-body-bg));
    border: 2px solid var(--item-accent, var(--primary, var(--bs-primary)));
}

.giso-calendar-list-source-icon .bi,
.giso-calendar-list-chevron .bi {
    line-height: 1;
}

.giso-calendar-list-time {
    color: var(--text-main, var(--bs-body-color));
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0.62rem 0 0.62rem 0.95rem;
    font-size: 0.74rem;
    font-weight: 700;
    line-height: 1.15;
    white-space: nowrap;
}

.giso-calendar-list-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.78rem;
}

.giso-calendar-list-body > strong,
.giso-calendar-list-body > span {
    overflow-wrap: anywhere;
}

.giso-calendar-list-badge {
    align-self: center;
    white-space: nowrap;
}

.giso-calendar-list-chevron {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    width: 1.35rem;
    min-height: 2.15rem;
    margin-right: 0.55rem;
    color: color-mix(in srgb, var(--item-accent) 82%, var(--text-main, var(--bs-body-color)));
    font-size: 0.9rem;
}

.giso-calendar-agenda {
    display: flex;
    flex-direction: column;
    min-width: 0;
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-left: 0;
    background: var(--surface, var(--bs-body-bg));
}

.giso-calendar-agenda-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 1rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.giso-calendar-agenda-kicker {
    color: var(--primary, var(--bs-primary));
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.giso-calendar-agenda-head h2 {
    margin: 0.15rem 0 0;
    color: var(--text-main, var(--bs-body-color));
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.2;
}

.giso-calendar-agenda-head > span {
    padding: 0.22rem 0.52rem;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    border-radius: 999px;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.72rem;
    white-space: nowrap;
}

.giso-calendar-agenda-body {
    display: grid;
    gap: 0.65rem;
    padding: 0.85rem;
}

.giso-calendar-agenda-timeline {
    gap: 0;
    padding: 0;
}

.giso-calendar-agenda-item {
    --item-accent: var(--primary, var(--bs-primary));
    display: grid;
    grid-template-columns: 2.15rem minmax(0, 1fr) auto;
    gap: 0.65rem;
    align-items: center;
    min-width: 0;
    padding: 0.72rem;
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.85rem;
    background: var(--surface, var(--bs-body-bg));
    color: inherit;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.giso-calendar-agenda-timeline .giso-calendar-agenda-item {
    grid-template-columns: minmax(4.4rem, 5.1rem) 1.05rem 2.15rem minmax(0, 1fr) auto auto;
    align-items: stretch;
    gap: 0.62rem;
    padding: 0;
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--table-border, var(--border-color, var(--bs-border-color))) 72%, transparent);
    border-radius: 0;
    background: transparent;
}

.giso-calendar-agenda-timeline .giso-calendar-agenda-item:last-child {
    border-bottom: 0;
}

.giso-calendar-agenda-item:hover {
    background: var(--table-row-hover, var(--surface-soft, var(--bs-light)));
    color: inherit;
    text-decoration: none;
}

.giso-calendar-agenda-source-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    width: 2.15rem;
    height: 2.15rem;
    border: 1px solid color-mix(in srgb, var(--item-accent) 32%, var(--pill-border, var(--border-color, var(--bs-border-color))));
    border-radius: 999px;
    background: color-mix(in srgb, var(--item-accent) 14%, var(--surface, var(--bs-body-bg)));
    color: color-mix(in srgb, var(--item-accent) 82%, var(--text-main, var(--bs-body-color)));
    font-size: 0.98rem;
    line-height: 1;
}

.giso-calendar-agenda-source-icon .bi,
.giso-calendar-agenda-chevron .bi {
    line-height: 1;
}

.giso-calendar-agenda-time {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.15;
}

.giso-calendar-agenda-content {
    display: grid;
    gap: 0.16rem;
    min-width: 0;
}

.giso-calendar-agenda-timeline .giso-calendar-agenda-content {
    align-content: center;
    padding: 0.62rem 0;
}

.giso-calendar-agenda-chevron {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    width: 1.35rem;
    min-height: 2.15rem;
    color: color-mix(in srgb, var(--item-accent) 82%, var(--text-main, var(--bs-body-color)));
    font-size: 0.9rem;
}

.giso-calendar-agenda-timeline .giso-calendar-agenda-chevron {
    margin-right: 0.55rem;
}

.giso-calendar-agenda-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.74rem;
}

.giso-calendar-agenda-content strong {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.9rem;
    line-height: 1.25;
}

.giso-calendar-agenda-content span,
.giso-calendar-agenda-content small {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.8rem;
    overflow-wrap: anywhere;
}

.giso-calendar-chip {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 0.12rem 0.42rem;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    border-radius: 999px;
    background: var(--pill-bg, var(--surface-soft, var(--bs-light)));
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.68rem;
    font-weight: 600;
}

.giso-calendar-chip--accent {
    --chip-accent: var(--primary, var(--bs-primary));
    border-color: color-mix(in srgb, var(--chip-accent) 42%, var(--pill-border, var(--border-color, var(--bs-border-color))));
    background: color-mix(in srgb, var(--chip-accent) 16%, var(--surface, var(--bs-body-bg)));
    color: color-mix(in srgb, var(--chip-accent) 82%, var(--text-main, var(--bs-body-color)));
}

.giso-calendar-empty {
    padding: 0.4rem 0.2rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.82rem;
}

.giso-calendar-empty--large {
    padding: 1rem;
    border: 1px dashed var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.85rem;
    text-align: center;
}

.giso-calendar-mobile-day {
    display: grid;
    grid-template-columns: 3.25rem minmax(0, 1fr);
    gap: 0.65rem;
    padding: 0.75rem;
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.85rem;
    background: var(--surface, var(--bs-body-bg));
    color: inherit;
    text-decoration: none;
}

.giso-calendar-mobile-day:hover {
    background: var(--table-row-hover, var(--surface-soft, var(--bs-light)));
    color: inherit;
    text-decoration: none;
}

.giso-calendar-mobile-day.is-selected {
    box-shadow: inset 0 0 0 2px var(--primary, var(--bs-primary));
}

.giso-calendar-mobile-date,
.giso-calendar-mobile-summary {
    display: grid;
    min-width: 0;
}

.giso-calendar-mobile-date strong {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.1rem;
}

.giso-calendar-mobile-date small,
.giso-calendar-mobile-summary span,
.giso-calendar-mobile-summary em {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.78rem;
    font-style: normal;
}

.giso-calendar-mobile-summary span,
.giso-calendar-mobile-summary em {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 1199.98px) {
    .giso-calendar-body {
        grid-template-columns: 1fr;
    }

    .giso-calendar-agenda {
        border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
        border-left: 0;
    }

}

@media (max-width: 991.98px) {
    .giso-calendar-toolbar-main {
        grid-template-columns: 1fr;
    }

    .giso-calendar-left-actions,
    .giso-calendar-controls {
        justify-content: flex-start;
    }

    .giso-calendar-center-stage {
        justify-content: flex-start;
        text-align: left;
    }

    .giso-calendar-right-actions {
        justify-content: flex-start;
    }

    .giso-calendar-weekdays,
    .giso-calendar-month-grid,
    .giso-calendar-week-grid {
        min-width: 0;
    }

    .giso-calendar-weekdays div {
        padding: 0.5rem 0.35rem;
    }

    .giso-calendar-day {
        min-height: 4.9rem;
        padding: 0.42rem;
    }

    .giso-calendar-day-head {
        justify-content: center;
        margin-bottom: 0.22rem;
    }

    .giso-calendar-day-items,
    .giso-calendar-more,
    .giso-calendar-empty {
        display: none;
    }

    .giso-calendar-day-dots {
        margin: 0;
    }
}

@media (max-width: 767.98px) {
    .giso-calendar-page-head {
        margin-bottom: 0.75rem;
    }

    .giso-calendar-workspace {
        border-radius: 0.85rem;
    }

    .giso-calendar-toolbar,
    .giso-calendar-main,
    .giso-calendar-agenda-head {
        padding-right: 0.85rem;
        padding-left: 0.85rem;
    }

    .giso-calendar-controls,
    .giso-calendar-left-actions,
    .giso-calendar-center-stage,
    .giso-calendar-right-actions,
    .giso-calendar-control-group,
    .giso-calendar-action-group,
    .giso-calendar-source-toggles {
        width: 100%;
    }

    .giso-calendar-control-group,
    .giso-calendar-action-group {
        justify-content: space-between;
    }

    .giso-calendar-view-switcher .giso-calendar-segment,
    .giso-calendar-left-actions .btn,
    .giso-calendar-right-actions .btn,
    .giso-calendar-action-group .btn {
        flex: 1 1 0;
    }

    .giso-calendar-source-row {
        align-items: stretch;
    }

    .giso-calendar-program-chip {
        flex: 0 0 auto;
    }

    .giso-calendar-toggle {
        flex: 1 1 auto;
        justify-content: center;
    }

    .giso-calendar-desktop-month {
        display: block;
    }

    .giso-calendar-mobile-month {
        display: none;
    }

    .giso-calendar-week-grid {
        min-width: 680px;
    }

    .giso-calendar-weekdays div {
        padding: 0.38rem 0.1rem;
        font-size: 0.64rem;
    }

    .giso-calendar-main {
        padding-top: 0.7rem;
        padding-bottom: 0.7rem;
    }

    .giso-calendar-month-grid {
        border-radius: 0.7rem;
    }

    .giso-calendar-day {
        min-height: 3.85rem;
        padding: 0.3rem 0.14rem;
    }

    .giso-calendar-day-number {
        min-width: 1.55rem;
        height: 1.55rem;
        font-size: 0.78rem;
    }

    .giso-calendar-day-dot {
        width: 0.36rem;
        height: 0.36rem;
        flex-basis: 0.36rem;
    }

    .giso-calendar-list-item {
        grid-template-columns: minmax(3.6rem, 4.35rem) 0.9rem 1.9rem minmax(0, 1fr) auto auto;
        gap: 0.45rem;
    }

    .giso-calendar-agenda-timeline .giso-calendar-agenda-item {
        grid-template-columns: minmax(3.6rem, 4.35rem) 0.9rem 1.9rem minmax(0, 1fr) auto auto;
        gap: 0.45rem;
    }

    .giso-calendar-list-time {
        padding-left: 0.65rem;
        font-size: 0.68rem;
    }

    .giso-calendar-list-source-icon {
        width: 1.9rem;
        height: 1.9rem;
        font-size: 0.86rem;
    }

    .giso-calendar-agenda-source-icon {
        width: 1.9rem;
        height: 1.9rem;
        font-size: 0.86rem;
    }

    .giso-calendar-list-badge {
        max-width: 7rem;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .giso-calendar-agenda-item {
        grid-template-columns: 2.15rem minmax(0, 1fr) auto;
    }
}

/* ===== My schedule assignments merged themed layout ===== */
.assignment-page {
    color: var(--text-main, var(--bs-body-color));
}

.assignment-surface,
.assignment-section,
.assignment-side-card {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    border-radius: 1.25rem;
}

.assignment-hero { overflow: hidden; }

.assignment-hero-accent {
    height: 0.5rem;
    background: linear-gradient(90deg, var(--primary, var(--bs-primary)), var(--bs-info), var(--bs-danger), var(--bs-warning));
}

.assignment-hero-body {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem;
}

.assignment-kicker,
.assignment-section-kicker {
    color: var(--primary, var(--bs-primary));
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.assignment-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.75rem, 2.2vw, 2.25rem);
    font-weight: 700;
    letter-spacing: -0.03em;
}

.assignment-subtitle,
.assignment-card-meta,
.assignment-date-inline,
.assignment-empty-text,
.assignment-class-next,
.assignment-empty-small,
.assignment-row-note,
.assignment-section-subtitle,
.assignment-muted-action {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.assignment-actions,
.assignment-filter-buttons,
.assignment-quickfilters,
.assignment-card-topline,
.assignment-section-header,
.assignment-section-badges,
.assignment-side-heading,
.assignment-class-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.assignment-metrics-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.assignment-metric-card {
    padding: 1.1rem 1.2rem;
    position: relative;
    overflow: hidden;
}

.assignment-metric-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.35rem;
    background: var(--primary, var(--bs-primary));
}

.assignment-metric-card--pending::before { background: var(--bs-warning); }
.assignment-metric-card--approved::before { background: var(--bs-success); }
.assignment-metric-card--week::before { background: var(--bs-info); }
.assignment-metric-card--classes::before { background: var(--bs-danger); }

.assignment-metric-label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.assignment-metric-value {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.55rem;
    font-weight: 700;
    margin-top: 0.35rem;
}

.assignment-filter { padding: 1.25rem; }

.assignment-filter-grid {
    display: grid;
    gap: 1rem;
    align-items: end;
}

.assignment-filter-grid-merged {
    grid-template-columns: minmax(14rem, 1fr) minmax(12rem, 0.7fr) auto;
}

.assignment-filter-field {
    display: grid;
    gap: 0.35rem;
}

.assignment-control {
    background-color: var(--input-bg, var(--surface, var(--bs-body-bg))) !important;
    color: var(--text-main, var(--bs-body-color)) !important;
    border-color: var(--input-border, var(--border-color, var(--bs-border-color))) !important;
    border-radius: 0.85rem !important;
    min-height: 2.75rem;
}

.assignment-quickfilters { margin-top: 1rem; }

.assignment-pill,
.assignment-section-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    min-height: 1.85rem;
    padding: 0.35rem 0.72rem;
    border-radius: 999px;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    background: var(--pill-bg, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.76rem;
    font-weight: 650;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
}

.assignment-pill:hover,
.assignment-pill.is-selected {
    color: var(--pill-selected-text, var(--primary, var(--bs-primary)));
    border-color: var(--pill-selected-border, var(--primary, var(--bs-primary)));
    background: var(--pill-selected-bg, var(--primary-soft, var(--surface-soft)));
    text-decoration: none;
}

.assignment-pill-blue {
    background: color-mix(in srgb, var(--bs-info) 24%, var(--surface, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
}

.assignment-pill-green {
    background: color-mix(in srgb, var(--bs-success) 28%, var(--surface, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
}

.assignment-pill-gold {
    background: color-mix(in srgb, var(--bs-warning) 34%, var(--surface, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
}

.assignment-pill-coral {
    background: color-mix(in srgb, var(--bs-danger) 24%, var(--surface, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
}

.assignment-section { overflow: hidden; }

.assignment-section-header {
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface-muted, var(--surface-soft, var(--surface, var(--bs-body-bg))));
}

.assignment-section-record-merged > .assignment-section-header {
    background: #ffffff;
}

.assignment-section-title,
.assignment-side-title,
.assignment-card-title,
.assignment-class-name,
.assignment-empty-title,
.assignment-class-title-inline {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
}

.assignment-section-title { font-size: 1.06rem; }
.assignment-section-subtitle { font-size: 0.86rem; margin-top: 0.2rem; }
.assignment-section-body { padding: 0; }
.assignment-record-body-merged { padding: 0; }

.assignment-record-table-merged {
    min-width: 1120px;
}

.assignment-record-table-drawer {
    min-width: 850px;
    --bs-table-bg: transparent;
    --bs-table-hover-bg: transparent;
    --bs-table-hover-color: inherit;
}

.assignment-record-table th,
.assignment-record-table td {
    vertical-align: middle;
    padding: 0.8rem 0.9rem;
}

.assignment-record-table thead th {
    font-size: 0.78rem;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.assignment-record-table tbody td {
    font-size: 0.9rem;
}

.assignment-record-table-drawer th,
.assignment-record-table-drawer td {
    padding: 0.52rem 0.75rem;
}

.assignment-drawer-row {
    --assignment-row-accent: var(--primary, var(--bs-primary));
    --assignment-row-bg: var(--surface, var(--bs-body-bg));
    --assignment-row-border: var(--table-border, var(--border-color, var(--bs-border-color)));
    cursor: pointer;
}

.assignment-drawer-row > td {
    background: var(--assignment-row-bg) !important;
    border-color: var(--assignment-row-border) !important;
    box-shadow: none !important;
}

.assignment-drawer-row > td:first-child {
    position: relative;
    box-shadow: none;
}

.assignment-drawer-row > td:first-child::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.28rem;
    background: var(--assignment-row-accent);
}

.assignment-drawer-row:hover,
.assignment-drawer-row:focus-visible {
    --assignment-row-bg: var(--table-row-hover, var(--surface-muted, var(--surface, var(--bs-body-bg))));
}

.assignment-drawer-row:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--assignment-row-accent) 65%, var(--surface, var(--bs-body-bg)) 35%);
    outline-offset: -2px;
}

.assignment-record-table tbody tr.assignment-row-pending > td {
    background: var(--assignment-row-bg) !important;
    border-color: var(--assignment-row-border) !important;
}

.assignment-record-table tbody tr.assignment-row-pending > td:first-child {
    box-shadow: none;
}

.assignment-record-class,
.assignment-record-date,
.assignment-record-time,
.assignment-record-status-cell,
.assignment-record-responded-cell {
    white-space: nowrap;
}

.assignment-record-program {
    max-width: 230px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.assignment-row-note {
    max-width: 260px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.78rem;
    margin-top: 0.1rem;
}

.assignment-program-name {
    color: var(--assignment-row-accent, var(--primary, var(--bs-primary)));
    font-weight: 700;
    line-height: 1.2;
}

.assignment-row-menu-col,
.assignment-row-menu-cell {
    width: 2.4rem;
    min-width: 2.4rem;
    padding-left: 0.25rem !important;
    padding-right: 0.75rem !important;
    text-align: right;
}

.assignment-row-menu-cell .bi {
    color: var(--assignment-row-accent, var(--primary, var(--bs-primary)));
    font-size: 0.95rem;
    line-height: 1;
    opacity: 0.82;
}

.assignment-drawer-row:hover .assignment-row-menu-cell .bi,
.assignment-drawer-row:focus-visible .assignment-row-menu-cell .bi {
    opacity: 1;
    transform: translateX(2px);
}

.assignment-response-drawer .confirmation-drawer-teacher {
    border-left: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
}

.assignment-action-col,
.assignment-action-cell {
    min-width: 260px;
}

.assignment-row-response-form {
    display: grid;
    grid-template-columns: minmax(9rem, 1fr) auto;
    align-items: center;
    gap: 0.4rem;
    justify-content: end;
}

.assignment-row-response-note {
    min-height: 2.1rem !important;
    padding: 0.38rem 0.55rem !important;
    border-radius: 0.7rem !important;
    font-size: 0.82rem;
}

.assignment-row-response-actions {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    justify-content: flex-end;
}

.assignment-row-action-approve,
.assignment-row-action-decline {
    min-height: 2.1rem;
    padding: 0.38rem 0.72rem !important;
    border-radius: 0.7rem !important;
    font-size: 0.82rem;
    font-weight: 600;
}

.assignment-row-action-approve {
    background: color-mix(in srgb, var(--bs-success) 12%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-success) 34%, var(--card-border, var(--bs-border-color)));
    color: color-mix(in srgb, var(--bs-success) 80%, var(--text-main, var(--bs-body-color)));
}

.assignment-row-action-approve:hover {
    background: color-mix(in srgb, var(--bs-success) 20%, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
}

.assignment-row-action-decline {
    background: color-mix(in srgb, var(--bs-danger) 10%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-danger) 34%, var(--card-border, var(--bs-border-color)));
    color: color-mix(in srgb, var(--bs-danger) 78%, var(--text-main, var(--bs-body-color)));
}

.assignment-row-action-decline:hover {
    background: color-mix(in srgb, var(--bs-danger) 18%, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
}

.assignment-muted-action {
    font-size: 0.84rem;
}

.assignment-side-card {
    padding: 1.1rem;
}

.assignment-side-card-compact {
    padding: 1rem;
}

.assignment-side-heading {
    margin-bottom: 0.9rem;
}

.assignment-side-heading-compact {
    margin-bottom: 0.75rem;
}

.assignment-side-title {
    font-size: 0.9rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.assignment-side-accent {
    width: 0.38rem;
    height: 1.75rem;
    border-radius: 999px;
    background: var(--primary, var(--bs-primary));
    flex: 0 0 auto;
}

.assignment-side-accent-gold { background: var(--bs-warning); }
.assignment-side-accent-blue { background: var(--bs-info); }
.assignment-side-accent-green { background: var(--bs-success); }

.assignment-next-card,
.assignment-class-card {
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface-strong, var(--surface, var(--bs-body-bg)));
    padding: 0.9rem;
}

.assignment-next-card-compact,
.assignment-class-card-compact {
    padding: 0.85rem;
}

.assignment-class-list,
.assignment-class-list-compact {
    display: grid;
    gap: 0.6rem;
}

.assignment-class-card-compact .assignment-class-name,
.assignment-class-card-text {
    min-width: 0;
}

.assignment-class-card-compact .assignment-class-name,
.assignment-class-card-compact .assignment-card-meta,
.assignment-class-card-compact .assignment-class-next {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.assignment-class-top {
    justify-content: space-between;
    flex-wrap: nowrap;
}

.assignment-class-next {
    font-size: 0.78rem;
    margin-top: 0.25rem;
}

.assignment-empty-small,
.assignment-empty-state {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    border: 1px dashed var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    padding: 1rem;
    text-align: center;
}

@media (max-width: 1199.98px) {
    .assignment-action-col,
    .assignment-action-cell {
        min-width: 320px;
    }
}

@media (max-width: 991.98px) {
    .assignment-metrics-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .assignment-filter-grid,
    .assignment-filter-grid-merged {
        grid-template-columns: 1fr;
    }

    .assignment-filter-buttons {
        align-items: stretch;
    }

    .assignment-filter-buttons .btn {
        flex: 1 1 auto;
    }
}

@media (max-width: 575.98px) {
    .assignment-hero-body,
    .assignment-filter,
    .assignment-section-header,
    .assignment-side-card {
        padding: 1rem;
    }

    .assignment-metrics-grid {
        grid-template-columns: 1fr;
    }

    .assignment-row-response-form {
        grid-template-columns: 1fr;
    }

    .assignment-row-response-actions {
        width: 100%;
        justify-content: stretch;
    }

    .assignment-row-action-approve,
    .assignment-row-action-decline {
        flex: 1 1 0;
    }
}

/* ===== Home dashboard themed layout ===== */
.dashboard-page {
    color: var(--text-main, var(--bs-body-color));
}

.dashboard-accent-blue {
    --dashboard-accent: var(--bs-info, var(--primary, var(--bs-primary)));
    --dashboard-accent-soft: color-mix(in srgb, var(--bs-info, var(--primary, var(--bs-primary))) 14%, var(--surface, var(--bs-body-bg)) 86%);
    --dashboard-accent-border: color-mix(in srgb, var(--bs-info, var(--primary, var(--bs-primary))) 38%, var(--card-border, var(--bs-border-color)) 62%);
}

.dashboard-accent-green {
    --dashboard-accent: var(--bs-success, var(--primary, var(--bs-primary)));
    --dashboard-accent-soft: color-mix(in srgb, var(--bs-success, var(--primary, var(--bs-primary))) 16%, var(--surface, var(--bs-body-bg)) 84%);
    --dashboard-accent-border: color-mix(in srgb, var(--bs-success, var(--primary, var(--bs-primary))) 40%, var(--card-border, var(--bs-border-color)) 60%);
}

.dashboard-accent-gold {
    --dashboard-accent: var(--bs-warning, var(--primary, var(--bs-primary)));
    --dashboard-accent-soft: color-mix(in srgb, var(--bs-warning, var(--primary, var(--bs-primary))) 22%, var(--surface, var(--bs-body-bg)) 78%);
    --dashboard-accent-border: color-mix(in srgb, var(--bs-warning, var(--primary, var(--bs-primary))) 48%, var(--card-border, var(--bs-border-color)) 52%);
}

.dashboard-accent-coral {
    --dashboard-accent: var(--bs-danger, var(--primary, var(--bs-primary)));
    --dashboard-accent-soft: color-mix(in srgb, var(--bs-danger, var(--primary, var(--bs-primary))) 18%, var(--surface, var(--bs-body-bg)) 82%);
    --dashboard-accent-border: color-mix(in srgb, var(--bs-danger, var(--primary, var(--bs-primary))) 42%, var(--card-border, var(--bs-border-color)) 58%);
}

.dashboard-home-hero,
.dashboard-panel,
.dashboard-metric {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--bs-border-color));
    border-radius: 1.25rem;
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
}

.dashboard-home-hero {
    overflow: hidden;
}

.dashboard-home-hero__accent {
    height: 0.5rem;
    background: linear-gradient(90deg, var(--primary, var(--bs-primary)), var(--bs-info), var(--bs-danger), var(--bs-warning));
}

.dashboard-home-hero__body,
.dashboard-panel-heading,
.dashboard-panel-header,
.dashboard-chart-heading {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.dashboard-home-hero__body {
    padding: 1.5rem;
}

.dashboard-home-kicker {
    color: var(--primary, var(--bs-primary));
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.dashboard-home-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.8rem, 2.5vw, 2.35rem);
    font-weight: 700;
    letter-spacing: -0.035em;
}

.dashboard-home-subtitle,
.dashboard-panel-subtitle,
.dashboard-chart-subtitle,
.dashboard-metric__hint,
.dashboard-recent-muted,
.dashboard-upcoming-time,
.dashboard-upcoming-detail,
.dashboard-attention-detail,
.dashboard-record-tabs__subtitle {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.dashboard-home-actions,
.dashboard-recent-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
}

.dashboard-metrics-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.dashboard-metric {
    padding: 1.2rem;
}

.dashboard-metric__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.dashboard-metric__dot {
    width: 0.62rem;
    height: 0.62rem;
    border-radius: 999px;
    background: var(--dashboard-accent, var(--primary, var(--bs-primary)));
    box-shadow: 0 0 0 0.28rem var(--surface, var(--bs-body-bg));
}

.dashboard-metric__value {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.55rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    margin-top: 0.75rem;
}

.dashboard-metric__hint {
    font-size: 0.78rem;
    margin-top: 0.2rem;
}

.dashboard-main-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(20rem, 0.85fr);
    gap: 1.25rem;
    align-items: start;
}

.dashboard-main-column,
.dashboard-side-column,
.dashboard-attention-list,
.dashboard-upcoming-list,
.dashboard-mini-stat-grid,
.dashboard-record-tab-list {
    display: grid;
    gap: 1rem;
}

.dashboard-panel {
    overflow: hidden;
}

.dashboard-panel-pad {
    padding: 1.25rem;
}

.dashboard-panel-header {
    padding: 1.15rem 1.25rem;
    border-bottom: 1px solid var(--table-border, var(--card-border, var(--bs-border-color)));
    background: var(--table-head-bg, var(--surface-soft, var(--bs-body-bg)));
}

.dashboard-panel-header--compact {
    padding: 1rem 1.25rem;
}

.dashboard-section-title,
.dashboard-side-title,
.dashboard-chart-title,
.dashboard-module__title,
.dashboard-upcoming-title,
.dashboard-attention-title,
.dashboard-recent-title {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
}

.dashboard-section-title {
    font-size: 1.08rem;
    letter-spacing: -0.01em;
}

.dashboard-side-title {
    font-size: 0.84rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.dashboard-small-pill,
.dashboard-record-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    border-radius: 999px;
    border: 1px solid var(--dashboard-accent-border, var(--pill-border, var(--bs-border-color)));
    background: var(--dashboard-accent-soft, var(--surface-soft, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
    font-size: 0.69rem;
    font-weight: 500;
    line-height: 1;
    min-height: 1.42rem;
    padding: 0.28rem 0.58rem;
    white-space: nowrap;
}

.dashboard-small-pill {
    border-color: var(--card-border, var(--bs-border-color));
    background: var(--table-head-bg, var(--surface-soft, var(--bs-body-bg)));
}

.dashboard-record-badge--blue { --dashboard-accent: var(--bs-info); --dashboard-accent-soft: color-mix(in srgb, var(--bs-info) 14%, var(--surface, var(--bs-body-bg)) 86%); --dashboard-accent-border: color-mix(in srgb, var(--bs-info) 38%, var(--card-border, var(--bs-border-color)) 62%); }
.dashboard-record-badge--green { --dashboard-accent: var(--bs-success); --dashboard-accent-soft: color-mix(in srgb, var(--bs-success) 16%, var(--surface, var(--bs-body-bg)) 84%); --dashboard-accent-border: color-mix(in srgb, var(--bs-success) 40%, var(--card-border, var(--bs-border-color)) 60%); }
.dashboard-record-badge--gold { --dashboard-accent: var(--bs-warning); --dashboard-accent-soft: color-mix(in srgb, var(--bs-warning) 22%, var(--surface, var(--bs-body-bg)) 78%); --dashboard-accent-border: color-mix(in srgb, var(--bs-warning) 48%, var(--card-border, var(--bs-border-color)) 52%); }
.dashboard-record-badge--coral { --dashboard-accent: var(--bs-danger); --dashboard-accent-soft: color-mix(in srgb, var(--bs-danger) 18%, var(--surface, var(--bs-body-bg)) 82%); --dashboard-accent-border: color-mix(in srgb, var(--bs-danger) 42%, var(--card-border, var(--bs-border-color)) 58%); }

.dashboard-module-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.dashboard-module-grid--primary {
    grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
    gap: 1.1rem;
}

.dashboard-module {
    display: grid;
    grid-template-columns: minmax(0, 6.4rem) minmax(0, 1fr);
    gap: 1rem;
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--bs-border-color));
    border-left: 0.28rem solid var(--card-border, var(--bs-border-color));
    border-radius: 1.15rem;
    background: var(--surface, var(--bs-body-bg));
    padding: 1.05rem;
    text-decoration: none;
    min-height: 11.25rem;
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease;
}

.dashboard-module:hover {
    color: var(--text-main, var(--bs-body-color));
    border-color: var(--card-border, var(--bs-border-color));
    transform: translateY(-2px);
    box-shadow: 0 18px 34px rgba(15, 23, 42, 0.10);
    text-decoration: none;
}

.dashboard-module__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 5.9rem;
    height: 5.9rem;
    flex: 0 0 auto;
    overflow: hidden;
    align-self: start;
}

.dashboard-module__icon-img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
    object-position: center;
}

.dashboard-module__body {
    display: grid;
    gap: 0.48rem;
    min-width: 0;
    align-content: start;
}

.dashboard-module__desc {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.88rem;
    line-height: 1.52;
}

.dashboard-module .dashboard-record-badge {
    border-color: var(--card-border, var(--bs-border-color));
    background: var(--table-head-bg, var(--surface-soft, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
}

.task-dashboard-module--with-badge {
    position: relative;
}

.task-dashboard-module-badge {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    z-index: 1;
}

.dashboard-financial-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(15rem, 0.75fr);
    gap: 1.25rem;
    padding: 1.25rem;
}

.dashboard-giving-chart {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(2.4rem, 1fr));
    align-items: end;
    gap: 0.75rem;
    min-height: 14rem;
    border: 1px solid var(--table-border, var(--card-border, var(--bs-border-color)));
    border-radius: 1rem;
    background: color-mix(in srgb, var(--surface, var(--bs-body-bg)) 96%, var(--bs-warning) 4%);
    padding: 1rem;
}

.dashboard-giving-bar-wrap {
    display: grid;
    align-items: end;
    gap: 0.45rem;
    min-width: 0;
}

.dashboard-giving-bar {
    width: 100%;
    min-height: 1.1rem;
    border-radius: 0.85rem 0.85rem 0.42rem 0.42rem;
    background: linear-gradient(180deg, var(--bs-success) 0%, var(--primary, var(--bs-primary)) 100%);
    border: 1px solid color-mix(in srgb, var(--bs-success) 45%, var(--table-border, var(--bs-border-color)) 55%);
}

.dashboard-giving-label,
.dashboard-giving-total {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.68rem;
    font-weight: 500;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dashboard-mini-stat {
    border: 1px solid var(--table-border, var(--card-border, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--table-head-bg, var(--surface-soft, var(--bs-body-bg)));
    padding: 1rem;
}

.dashboard-mini-stat__label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.dashboard-mini-stat__value {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.25rem;
    font-weight: 700;
    margin-top: 0.18rem;
}

.dashboard-empty-box {
    border: 1px dashed var(--table-border, var(--card-border, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--table-head-bg, var(--surface-soft, var(--bs-body-bg)));
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    padding: 1rem;
    text-align: center;
}

.dashboard-recent-layout {
    display: grid;
    grid-template-columns: 12rem minmax(0, 1fr);
}

.dashboard-record-tabs {
    background: var(--table-head-bg, var(--surface-soft, var(--bs-body-bg)));
    border-right: 1px solid var(--table-border, var(--card-border, var(--bs-border-color)));
    padding: 1rem;
}

.dashboard-record-tabs__header {
    margin-bottom: 0.8rem;
}

.dashboard-record-tabs__title {
    color: var(--primary, var(--bs-primary));
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.dashboard-record-tabs__subtitle {
    font-size: 0.72rem;
    margin-top: 0.15rem;
}

.dashboard-record-tab {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 0.65rem;
    border: 1px solid var(--dashboard-accent-border, var(--card-border, var(--bs-border-color)));
    border-radius: 0.85rem;
    background: var(--dashboard-accent-soft, var(--surface, var(--bs-body-bg)));
    color: var(--btn-outline-neutral-text, var(--text-main, var(--bs-body-color)));
    padding: 0.55rem 0.72rem;
    font-size: 0.83rem;
    font-weight: 500;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    appearance: none;
    transition: background 0.16s ease, border-color 0.16s ease, transform 0.16s ease;
}

.dashboard-record-tab:hover,
.dashboard-record-tab.is-selected {
    color: var(--primary, var(--bs-primary));
    background: color-mix(in srgb, var(--dashboard-accent, var(--primary, var(--bs-primary))) 20%, var(--surface, var(--bs-body-bg)) 80%);
    border-color: var(--dashboard-accent, var(--primary, var(--bs-primary)));
    transform: translateY(-1px);
    text-decoration: none;
}

.dashboard-record-tab--blue { --dashboard-accent: var(--bs-info); --dashboard-accent-soft: color-mix(in srgb, var(--bs-info) 10%, var(--surface, var(--bs-body-bg)) 90%); --dashboard-accent-border: color-mix(in srgb, var(--bs-info) 34%, var(--card-border, var(--bs-border-color)) 66%); }
.dashboard-record-tab--green { --dashboard-accent: var(--bs-success); --dashboard-accent-soft: color-mix(in srgb, var(--bs-success) 12%, var(--surface, var(--bs-body-bg)) 88%); --dashboard-accent-border: color-mix(in srgb, var(--bs-success) 35%, var(--card-border, var(--bs-border-color)) 65%); }
.dashboard-record-tab--gold { --dashboard-accent: var(--bs-warning); --dashboard-accent-soft: color-mix(in srgb, var(--bs-warning) 18%, var(--surface, var(--bs-body-bg)) 82%); --dashboard-accent-border: color-mix(in srgb, var(--bs-warning) 44%, var(--card-border, var(--bs-border-color)) 56%); }
.dashboard-record-tab--coral { --dashboard-accent: var(--bs-danger); --dashboard-accent-soft: color-mix(in srgb, var(--bs-danger) 14%, var(--surface, var(--bs-body-bg)) 86%); --dashboard-accent-border: color-mix(in srgb, var(--bs-danger) 38%, var(--card-border, var(--bs-border-color)) 62%); }

.dashboard-record-tab__count {
    border-radius: 999px;
    background: var(--surface, var(--bs-body-bg));
    color: var(--primary, var(--bs-primary));
    min-width: 1.4rem;
    padding: 0.14rem 0.44rem;
    font-size: 0.68rem;
    font-weight: 700;
    text-align: center;
}

.dashboard-recent-table-wrap {
    overflow-x: auto;
}

.dashboard-recent-panels {
    min-width: 0;
}

.dashboard-recent-panel {
    min-width: 0;
}

.dashboard-recent-panel__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.15rem 0.85rem;
    border-bottom: 1px solid var(--table-border, var(--card-border, var(--bs-border-color)));
    background: color-mix(in srgb, var(--surface-soft, var(--table-head-bg, var(--bs-body-bg))) 70%, var(--surface, var(--bs-body-bg)) 30%);
}

.dashboard-recent-table {
    min-width: 46rem;
}

.dashboard-recent-row {
    display: grid;
    grid-template-columns: 4.5rem minmax(10rem, 1.25fr) 7.5rem minmax(10rem, 1fr) 6.5rem 5.5rem;
    gap: 0.75rem;
    align-items: center;
    padding: 0.9rem 1.15rem;
    border-top: 1px solid var(--table-border, var(--card-border, var(--bs-border-color)));
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.88rem;
}

.dashboard-recent-head {
    border-top: 0;
    background: var(--table-head-bg, var(--surface-soft, var(--bs-body-bg)));
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.dashboard-recent-row:not(.dashboard-recent-head):hover {
    background: var(--table-row-hover, var(--surface-soft, var(--bs-body-bg)));
}

.dashboard-recent-id {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-variant-numeric: tabular-nums;
}

.dashboard-small-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.85rem;
    border: 1px solid var(--btn-outline-neutral-border, var(--card-border, var(--bs-border-color)));
    border-radius: 0.65rem;
    background: var(--btn-outline-neutral-bg, transparent);
    color: var(--btn-outline-neutral-text, var(--text-main, var(--bs-body-color)));
    padding: 0.35rem 0.65rem;
    font-size: 0.75rem;
    font-weight: 500;
    text-decoration: none;
}

.dashboard-small-action:hover {
    background: var(--btn-outline-neutral-hover-bg, var(--surface-soft, var(--bs-body-bg)));
    color: var(--btn-outline-neutral-hover-text, var(--text-main, var(--bs-body-color)));
    text-decoration: none;
}

.dashboard-side-heading {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.dashboard-side-accent {
    width: 0.42rem;
    min-height: 2.1rem;
    border-radius: 999px;
    background: var(--dashboard-accent, var(--primary, var(--bs-primary)));
    flex: 0 0 auto;
}

.dashboard-side-accent--gold {
    --dashboard-accent: var(--bs-warning);
}

.dashboard-attention-item {
    display: block;
    border: 1px solid color-mix(in srgb, var(--bs-warning) 48%, var(--card-border, var(--bs-border-color)) 52%);
    border-left: 0.28rem solid var(--bs-warning);
    border-radius: 1rem;
    background: color-mix(in srgb, var(--bs-warning) 18%, var(--surface, var(--bs-body-bg)) 82%);
    color: var(--text-main, var(--bs-body-color));
    padding: 1rem;
    text-decoration: none;
    transition: border-color 0.16s ease, background 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease;
}

.dashboard-attention-link:hover,
.dashboard-attention-link:focus {
    background: color-mix(in srgb, var(--bs-warning) 24%, var(--surface, var(--bs-body-bg)) 76%);
    border-color: color-mix(in srgb, var(--bs-warning) 62%, var(--card-border, var(--bs-border-color)) 38%);
    color: var(--text-main, var(--bs-body-color));
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 0.6rem 1.25rem rgba(15, 23, 42, 0.07);
}

.dashboard-attention-title {
    font-size: 0.88rem;
    margin-top: 0.55rem;
}

.dashboard-attention-detail {
    font-size: 0.76rem;
    margin-top: 0.2rem;
}

.dashboard-schedule-panel {
    --dashboard-schedule-row-gap: 0.72rem;
}

.dashboard-schedule-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.15rem 0.85rem;
    border-bottom: 1px solid var(--table-border, var(--card-border, var(--bs-border-color)));
}

.dashboard-schedule-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.02rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.dashboard-schedule-action {
    color: var(--primary, var(--bs-primary));
    font-size: 0.82rem;
    font-weight: 500;
    line-height: 1.4;
    text-decoration: none;
    white-space: nowrap;
}

.dashboard-schedule-action:hover,
.dashboard-schedule-action:focus {
    color: var(--primary-hover, var(--primary, var(--bs-primary)));
    text-decoration: underline;
}

.dashboard-schedule-list {
    display: grid;
    padding: 0.85rem;
}

.dashboard-schedule-group + .dashboard-schedule-group {
    margin-top: 0.85rem;
}

.dashboard-schedule-date {
    margin: 0;
    border-radius: 0.72rem;
    background: color-mix(in srgb, var(--table-head-bg, var(--surface-soft, var(--bs-body-bg))) 82%, var(--surface, var(--bs-body-bg)) 18%);
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.09em;
    line-height: 1.2;
    padding: 0.62rem 0.72rem;
    text-transform: uppercase;
}

.dashboard-schedule-rows {
    display: grid;
}

.dashboard-schedule-row {
    display: grid;
    grid-template-columns: 0.22rem minmax(4.6rem, 5.2rem) minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.65rem;
    min-height: 4.1rem;
    color: var(--text-main, var(--bs-body-color));
    padding: 0.68rem 0.15rem 0.68rem 0;
    text-decoration: none;
}

.dashboard-schedule-row + .dashboard-schedule-row {
    border-top: 1px solid color-mix(in srgb, var(--table-border, var(--card-border, var(--bs-border-color))) 72%, transparent);
}

.dashboard-schedule-row:hover,
.dashboard-schedule-row:focus {
    color: var(--text-main, var(--bs-body-color));
    background: color-mix(in srgb, var(--dashboard-item-accent, var(--primary, var(--bs-primary))) 6%, transparent);
    text-decoration: none;
}

.dashboard-schedule-row:focus-visible {
    outline: 0.16rem solid color-mix(in srgb, var(--dashboard-item-accent, var(--primary, var(--bs-primary))) 34%, transparent);
    outline-offset: 0.12rem;
}

.dashboard-schedule-accent {
    align-self: stretch;
    border-radius: 999px;
    background: var(--dashboard-item-accent, var(--primary, var(--bs-primary)));
}

.dashboard-schedule-time {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.76rem;
    line-height: 1.18;
    white-space: nowrap;
}

.dashboard-schedule-time strong {
    display: block;
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.83rem;
    font-weight: 700;
}

.dashboard-schedule-content {
    display: grid;
    gap: 0.14rem;
    min-width: 0;
}

.dashboard-schedule-item-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1.22;
    overflow-wrap: anywhere;
}

.dashboard-schedule-detail {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.76rem;
    line-height: 1.22;
    overflow-wrap: anywhere;
}

.dashboard-schedule-chevron {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 1rem;
    line-height: 1;
}

.dashboard-schedule-row--event {
    --dashboard-accent-soft: color-mix(in srgb, var(--dashboard-item-accent, var(--bs-danger)) 14%, var(--surface, var(--bs-body-bg)) 86%);
    --dashboard-accent-border: color-mix(in srgb, var(--dashboard-item-accent, var(--bs-danger)) 40%, var(--card-border, var(--bs-border-color)) 60%);
}

.dashboard-schedule-row--class {
    --dashboard-accent-soft: color-mix(in srgb, var(--bs-success) 16%, var(--surface, var(--bs-body-bg)) 84%);
    --dashboard-accent-border: color-mix(in srgb, var(--bs-success) 40%, var(--card-border, var(--bs-border-color)) 60%);
}

.dashboard-schedule-empty {
    margin: 0.15rem;
}

@media (max-width: 1199.98px) {
    .dashboard-main-grid,
    .dashboard-financial-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-metrics-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .dashboard-home-hero__body,
    .dashboard-panel-pad,
    .dashboard-panel-header,
    .dashboard-financial-grid,
    .dashboard-schedule-list {
        padding: 1rem;
    }

    .dashboard-metrics-grid,
    .dashboard-module-grid,
    .dashboard-recent-layout {
        grid-template-columns: 1fr;
    }

    .dashboard-module {
        grid-template-columns: 5.4rem minmax(0, 1fr);
        min-height: 9.75rem;
        padding: 1rem;
        gap: 0.95rem;
    }

    .dashboard-module__icon {
        width: 5.4rem;
        height: 5.4rem;
    }

    .dashboard-record-tabs {
        border-right: 0;
        border-bottom: 1px solid var(--table-border, var(--card-border, var(--bs-border-color)));
    }

    .dashboard-recent-row {
        grid-template-columns: 3.5rem minmax(8rem, 1fr) 6.2rem 8rem 5.5rem 4.75rem;
        padding-left: 0.8rem;
        padding-right: 0.8rem;
        font-size: 0.82rem;
    }

    .dashboard-schedule-row {
        grid-template-columns: 0.22rem minmax(4rem, 4.55rem) minmax(0, 1fr) auto auto;
        gap: 0.5rem;
    }
}

/* ===== My assignments clickable side cards ===== */
.assignment-click-card {
    display: block;
    color: var(--text-main, var(--bs-body-color)) !important;
    text-decoration: none !important;
    cursor: pointer;
    transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.assignment-click-card:hover,
.assignment-click-card:focus-visible {
    color: var(--text-main, var(--bs-body-color)) !important;
    border-color: var(--primary, var(--bs-primary)) !important;
    background: var(--table-row-hover, var(--surface-soft, var(--bs-body-bg))) !important;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary, var(--bs-primary)) 14%, transparent);
    transform: translateY(-1px);
    outline: 0;
}

.assignment-click-card:focus-visible {
    box-shadow: 0 0 0 0.22rem color-mix(in srgb, var(--primary, var(--bs-primary)) 22%, transparent), var(--card-shadow, none);
}

.assignment-click-card .assignment-card-title,
.assignment-click-card .assignment-class-name {
    color: var(--text-main, var(--bs-body-color)) !important;
}

.assignment-click-card .assignment-card-meta,
.assignment-click-card .assignment-class-next {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color))) !important;
}

/* ===== Events list themed layout ===== */
.events-page {
    color: var(--text-main, var(--bs-body-color));
}

.events-hero,
.events-filter-card,
.events-panel,
.events-metric {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    border-radius: 1.25rem;
}

.events-hero {
    overflow: hidden;
}

.events-hero__accent {
    height: 0.5rem;
    background: linear-gradient(90deg, var(--primary, var(--bs-primary)), var(--bs-info), var(--bs-danger), var(--bs-warning));
}

.events-hero__body,
.events-panel-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem;
}

.events-panel-header {
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--table-head-bg, var(--surface-soft));
}

.events-panel-header--compact {
    padding: 1rem 1.25rem;
}

.events-kicker {
    color: var(--primary, var(--bs-primary));
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.events-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.75rem, 2.4vw, 2.35rem);
    font-weight: 700;
    letter-spacing: -0.035em;
}

.events-subtitle,
.events-muted {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color))) !important;
}

.events-actions,
.events-filter-actions,
.events-panel-tools,
.events-followup-top,
.events-upcoming-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.events-metrics-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.events-metric {
    padding: 1.25rem;
    position: relative;
    overflow: hidden;
}

.events-metric::after {
    content: "";
    position: absolute;
    top: 1.1rem;
    right: 1.1rem;
    width: 0.65rem;
    height: 0.65rem;
    border-radius: 999px;
    background: var(--events-accent, var(--primary, var(--bs-primary)));
    box-shadow: 0 0 0 0.28rem var(--surface, var(--bs-body-bg));
}

.events-accent-blue { --events-accent: var(--bs-info); --events-accent-soft: color-mix(in srgb, var(--bs-info) 18%, var(--surface, var(--bs-body-bg))); --events-accent-border: color-mix(in srgb, var(--bs-info) 45%, var(--card-border, var(--bs-border-color))); }
.events-accent-green { --events-accent: var(--bs-success); --events-accent-soft: color-mix(in srgb, var(--bs-success) 22%, var(--surface, var(--bs-body-bg))); --events-accent-border: color-mix(in srgb, var(--bs-success) 45%, var(--card-border, var(--bs-border-color))); }
.events-accent-gold { --events-accent: var(--bs-warning); --events-accent-soft: color-mix(in srgb, var(--bs-warning) 28%, var(--surface, var(--bs-body-bg))); --events-accent-border: color-mix(in srgb, var(--bs-warning) 45%, var(--card-border, var(--bs-border-color))); }
.events-accent-coral { --events-accent: var(--bs-danger); --events-accent-soft: color-mix(in srgb, var(--bs-danger) 20%, var(--surface, var(--bs-body-bg))); --events-accent-border: color-mix(in srgb, var(--bs-danger) 45%, var(--card-border, var(--bs-border-color))); }

.events-metric__label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.events-metric__value {
    margin-top: 0.4rem;
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.65rem;
    font-weight: 700;
    line-height: 1.1;
}

.events-metric__hint {
    margin-top: 0.28rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.78rem;
}

.events-filter-card {
    padding: 1.25rem;
}

.events-filter-grid {
    display: grid;
    grid-template-columns: minmax(16rem, 1.4fr) repeat(3, minmax(9rem, 0.8fr)) auto;
    gap: 1rem;
    align-items: end;
}

.events-field {
    display: grid;
    gap: 0.35rem;
}

.events-form-panel-body {
    padding: 1.5rem;
}

.events-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem 1.25rem;
}

.events-form-field--full {
    grid-column: 1 / -1;
}

.events-form-check {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 44px;
}

.events-form-actions {
    margin-top: 1.5rem;
}

.events-form-alert {
    margin-bottom: 1.25rem;
}

.events-form-note-list {
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
}

.events-form-note-card {
    display: grid;
    gap: 0.25rem;
    padding: 1rem;
    border: 1px solid var(--card-border, var(--bs-border-color));
    border-left: 0.28rem solid var(--events-item-accent, var(--primary, var(--bs-primary)));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
}

.events-form-note-card--blue { --events-item-accent: var(--bs-info); }
.events-form-note-card--green { --events-item-accent: var(--bs-success); }
.events-form-note-card--gold { --events-item-accent: var(--bs-warning); }

.events-control {
    background-color: var(--input-bg, var(--surface, var(--bs-body-bg))) !important;
    color: var(--text-main, var(--bs-body-color)) !important;
    border-color: var(--input-border, var(--border-color, var(--bs-border-color))) !important;
}

.events-main-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(360px, 0.85fr);
    gap: 1.25rem;
    align-items: start;
}

.events-side-stack {
    display: grid;
    gap: 1.25rem;
}

.events-section-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.05rem;
    font-weight: 700;
}

.events-section-title--small {
    font-size: 0.9rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.events-table {
    min-width: 980px;
}

.events-table th,
.events-table td {
    padding: 0.95rem 1.25rem;
    vertical-align: middle;
}

.events-title-cell {
    display: grid;
    gap: 0.18rem;
    padding-left: 0.75rem;
    border-left: 0.25rem solid var(--events-item-accent, var(--primary, var(--bs-primary)));
    color: var(--text-main, var(--bs-body-color)) !important;
    text-decoration: none !important;
}

.events-title-cell:hover .events-title-cell__name {
    color: var(--primary, var(--bs-primary));
}

.events-title-cell__name,
.events-followup-name,
.events-upcoming-title {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 600;
}

.events-title-cell__meta,
.events-upcoming-meta,
.events-followup-event-title,
.events-followup-detail {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.78rem;
    font-weight: 400;
}

.events-category-badge,
.events-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 1px solid var(--events-accent-border, var(--pill-border, var(--bs-border-color)));
    background: var(--events-accent-soft, var(--primary-soft, var(--surface-soft)));
    color: var(--primary, var(--bs-primary));
    font-size: 0.72rem;
    font-weight: 500;
    line-height: 1;
    padding: 0.34rem 0.58rem;
    white-space: nowrap;
}

.events-category-badge {
    --events-accent-soft: color-mix(in srgb, var(--events-item-accent, var(--primary, var(--bs-primary))) 16%, var(--surface, var(--bs-body-bg)));
    --events-accent-border: color-mix(in srgb, var(--events-item-accent, var(--primary, var(--bs-primary))) 42%, var(--card-border, var(--bs-border-color)));
}

.events-pill--blue { --events-accent-soft: color-mix(in srgb, var(--bs-info) 20%, var(--surface, var(--bs-body-bg))); --events-accent-border: color-mix(in srgb, var(--bs-info) 42%, var(--card-border, var(--bs-border-color))); }
.events-pill--green { --events-accent-soft: color-mix(in srgb, var(--bs-success) 24%, var(--surface, var(--bs-body-bg))); --events-accent-border: color-mix(in srgb, var(--bs-success) 42%, var(--card-border, var(--bs-border-color))); }
.events-pill--gold { --events-accent-soft: color-mix(in srgb, var(--bs-warning) 32%, var(--surface, var(--bs-body-bg))); --events-accent-border: color-mix(in srgb, var(--bs-warning) 42%, var(--card-border, var(--bs-border-color))); }
.events-pill--muted { --events-accent-soft: var(--surface-muted, var(--surface-soft)); --events-accent-border: var(--card-border, var(--bs-border-color)); color: var(--text-muted, var(--bs-secondary-color)); }

.events-upcoming-card,
.events-followup-card {
    display: block;
    border: 1px solid var(--card-border, var(--bs-border-color));
    border-left: 0.28rem solid var(--events-item-accent, var(--primary, var(--bs-primary)));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    padding: 1rem;
    text-decoration: none !important;
    transition: border-color 0.16s ease, background 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease;
}

.events-upcoming-card:hover,
.events-upcoming-card:focus,
.events-followup-card:hover,
.events-followup-card:focus {
    border-color: var(--events-item-accent, var(--primary, var(--bs-primary)));
    background: var(--table-row-hover, var(--surface-soft));
    color: var(--text-main, var(--bs-body-color));
    transform: translateY(-1px);
    box-shadow: 0 0.6rem 1.25rem rgba(15, 23, 42, 0.06);
}

.events-side-list {
    display: grid;
    gap: 0.8rem;
    padding: 1rem;
}

.events-upcoming-top,
.events-followup-top {
    justify-content: space-between;
}

.events-upcoming-count-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-top: 0.8rem;
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--table-border, var(--card-border, var(--bs-border-color)));
    border-radius: 0.8rem;
    background: var(--table-head-bg, var(--surface-soft));
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.events-upcoming-count-row strong {
    color: var(--primary, var(--bs-primary));
}

.events-followup-card {
    background: var(--surface, var(--bs-body-bg));
    border-color: var(--card-border, var(--bs-border-color));
}

.events-followup-event-title {
    display: block;
    margin-top: 0.2rem;
}

.events-side-accent {
    width: 0.42rem;
    height: 2rem;
    border-radius: 999px;
    background: var(--primary, var(--bs-primary));
    flex: 0 0 auto;
}

.events-side-accent--gold {
    background: var(--bs-warning);
}

.events-collapse-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: 1px solid var(--btn-outline-neutral-border, var(--card-border, var(--bs-border-color)));
    border-radius: 0.65rem;
    background: var(--surface, var(--bs-body-bg));
    color: var(--primary, var(--bs-primary));
    font-size: 1rem;
    font-weight: 600;
    line-height: 1;
}

.events-collapse-btn:hover,
.events-collapse-btn:focus-visible {
    background: var(--primary-soft, var(--surface-soft));
    outline: 0;
}

.events-empty {
    padding: 1.25rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    text-align: center;
}

.min-width-0 {
    min-width: 0;
}

@media (max-width: 1199.98px) {
    .events-main-grid,
    .events-filter-grid {
        grid-template-columns: 1fr;
    }

    .events-metrics-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .events-field--search,
    .events-filter-actions {
        grid-column: auto;
    }

    .events-form-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .events-hero__body,
    .events-filter-card,
    .events-panel-header {
        padding: 1rem;
    }

    .events-metrics-grid {
        grid-template-columns: 1fr;
    }
}

/* ===== Event dashboard themed layout ===== */
.event-dashboard-page {
    color: var(--text-main, var(--bs-body-color));
}

.event-dashboard-hero,
.event-dashboard-panel,
.event-dashboard-metric {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    border-radius: 1.25rem;
}

.event-dashboard-hero {
    overflow: hidden;
}

.event-dashboard-hero__accent {
    height: 0.5rem;
    background: linear-gradient(90deg, var(--primary, var(--bs-primary)), var(--bs-info), var(--bs-danger));
}

.event-dashboard-hero__body,
.event-dashboard-panel-header,
.event-dashboard-section-row,
.event-dashboard-actions,
.event-dashboard-side-card__top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.event-dashboard-hero__body {
    padding: 1.5rem;
}

.event-dashboard-kicker {
    color: var(--primary, var(--bs-primary));
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.event-dashboard-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.8rem, 2.4vw, 2.35rem);
    font-weight: 700;
    letter-spacing: -0.035em;
}

.event-dashboard-subtitle,
.event-dashboard-muted,
.event-dashboard-card-text {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.event-dashboard-subtitle {
    max-width: 46rem;
    font-size: 0.92rem;
    line-height: 1.55;
}

.event-dashboard-metrics-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.event-dashboard-metric {
    padding: 1.25rem;
}

.event-dashboard-metric__label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.event-dashboard-metric__value {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.65rem, 2vw, 2.05rem);
    font-weight: 700;
    line-height: 1.1;
    margin-top: 0.55rem;
}

.event-dashboard-metric__hint {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.76rem;
    margin-top: 0.3rem;
}

.event-dashboard-metric::before {
    content: "";
    display: block;
    width: 0.65rem;
    height: 0.65rem;
    border-radius: 999px;
    float: right;
    box-shadow: 0 0 0 0.25rem var(--surface, var(--bs-body-bg));
    background: var(--event-dashboard-accent, var(--primary, var(--bs-primary)));
}

.event-dashboard-accent-blue { --event-dashboard-accent: var(--bs-info); }
.event-dashboard-accent-green { --event-dashboard-accent: var(--bs-success); }
.event-dashboard-accent-gold { --event-dashboard-accent: var(--bs-warning); }
.event-dashboard-accent-coral { --event-dashboard-accent: var(--bs-danger); }

.event-dashboard-main-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(22rem, 0.85fr);
    gap: 1.25rem;
    align-items: start;
}

.event-dashboard-main-stack,
.event-dashboard-side-stack {
    display: grid;
    gap: 1.25rem;
}

.event-dashboard-panel {
    overflow: hidden;
}

.event-dashboard-actions-panel {
    padding: 1.25rem;
}

.event-dashboard-panel-header {
    padding: 1.25rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--table-head-bg, var(--surface-soft, var(--bs-body-bg)));
}

.event-dashboard-panel-header--compact {
    padding: 1rem 1.25rem;
}

.event-dashboard-section-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: -0.015em;
}

.event-dashboard-section-title--small {
    font-size: 0.9rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.event-dashboard-action-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.event-dashboard-action-card,
.event-dashboard-side-card,
.event-dashboard-followup-card {
    display: block;
    text-decoration: none;
    color: inherit;
    background: var(--surface, var(--bs-body-bg));
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-left: 0.25rem solid var(--event-dashboard-item-accent, var(--primary, var(--bs-primary)));
    transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, transform 0.12s ease;
}

.event-dashboard-action-card:hover,
.event-dashboard-side-card:hover,
.event-dashboard-followup-card:hover,
.event-dashboard-action-card:focus,
.event-dashboard-side-card:focus,
.event-dashboard-followup-card:focus {
    background: var(--table-row-hover, var(--surface-soft));
    color: inherit;
    box-shadow: 0 0.45rem 1rem rgba(0, 0, 0, 0.05);
    transform: translateY(-1px);
    text-decoration: none;
}

.event-dashboard-action-card {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    padding: 1rem;
    border-radius: 1rem;
}

.event-dashboard-action-card.event-dashboard-card-accent-blue { --event-dashboard-item-accent: var(--bs-info); }
.event-dashboard-action-card.event-dashboard-card-accent-green { --event-dashboard-item-accent: var(--bs-success); }
.event-dashboard-action-card.event-dashboard-card-accent-gold { --event-dashboard-item-accent: var(--bs-warning); }
.event-dashboard-action-card.event-dashboard-card-accent-coral { --event-dashboard-item-accent: var(--bs-danger); }

.event-dashboard-action-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.9rem;
    flex: 0 0 auto;
    color: var(--primary, var(--bs-primary));
    font-size: 1.1rem;
    font-weight: 700;
}

.event-dashboard-soft-blue { background: color-mix(in srgb, var(--bs-info) 22%, var(--surface, var(--bs-body-bg))); }
.event-dashboard-soft-green { background: color-mix(in srgb, var(--bs-success) 24%, var(--surface, var(--bs-body-bg))); }
.event-dashboard-soft-gold { background: color-mix(in srgb, var(--bs-warning) 32%, var(--surface, var(--bs-body-bg))); }
.event-dashboard-soft-coral { background: color-mix(in srgb, var(--bs-danger) 24%, var(--surface, var(--bs-body-bg))); }

.event-dashboard-action-copy,
.event-dashboard-card-title,
.event-dashboard-card-text,
.event-dashboard-action-link {
    display: block;
}

.event-dashboard-card-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.94rem;
    font-weight: 650;
    line-height: 1.25;
}

.event-dashboard-card-text {
    font-size: 0.78rem;
    line-height: 1.45;
    margin-top: 0.25rem;
}

.event-dashboard-action-link {
    color: var(--primary, var(--bs-primary));
    font-size: 0.8rem;
    font-weight: 600;
    margin-top: 0.65rem;
}

.event-dashboard-table {
    min-width: 780px;
}

.event-dashboard-table th,
.event-dashboard-table td {
    padding: 0.95rem 1.25rem;
    vertical-align: middle;
}

.event-dashboard-title-cell {
    display: block;
    padding-left: 0.75rem;
    border-left: 0.25rem solid var(--event-dashboard-item-accent, var(--primary, var(--bs-primary)));
    color: inherit !important;
    text-decoration: none;
}

.event-dashboard-title-cell:hover {
    color: inherit !important;
    text-decoration: none;
}

.event-dashboard-title-cell__name {
    display: block;
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.9rem;
    font-weight: 650;
    line-height: 1.25;
}

.event-dashboard-title-cell__meta {
    display: block;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.76rem;
    margin-top: 0.2rem;
}

.event-dashboard-recent-list {
    display: grid;
}

.event-dashboard-recent-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 7.5rem 6rem 5.5rem;
    gap: 1rem;
    align-items: center;
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.event-dashboard-recent-row:first-child {
    border-top: 0;
}

.event-dashboard-recent-row:hover {
    background: var(--table-row-hover, var(--surface-soft));
}

.event-dashboard-side-list {
    display: grid;
    gap: 0.75rem;
    padding: 1rem;
}

.event-dashboard-side-card,
.event-dashboard-followup-card {
    border-radius: 0.95rem;
    padding: 1rem;
}

.event-dashboard-side-card__top {
    align-items: flex-start;
    flex-wrap: nowrap;
}

.event-dashboard-visitor-count {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    margin-top: 0.85rem;
    padding: 0.55rem 0.7rem;
    border-radius: 0.8rem;
    background: var(--table-head-bg, var(--surface-soft));
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.74rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.event-dashboard-visitor-count span:last-child {
    color: var(--primary, var(--bs-primary));
}

.event-dashboard-category-badge,
.event-dashboard-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    font-size: 0.69rem;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
}

.event-dashboard-category-badge {
    background: color-mix(in srgb, var(--event-dashboard-item-accent, var(--primary, var(--bs-primary))) 18%, var(--surface, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
    border-color: color-mix(in srgb, var(--event-dashboard-item-accent, var(--primary, var(--bs-primary))) 35%, var(--border-color, var(--bs-border-color)));
    padding: 0.3rem 0.55rem;
}

.event-dashboard-pill {
    padding: 0.32rem 0.6rem;
    background: var(--surface-soft, var(--bs-body-bg));
    color: var(--primary, var(--bs-primary));
}

.event-dashboard-pill--blue { background: color-mix(in srgb, var(--bs-info) 22%, var(--surface, var(--bs-body-bg))); }
.event-dashboard-pill--green { background: color-mix(in srgb, var(--bs-success) 24%, var(--surface, var(--bs-body-bg))); }
.event-dashboard-pill--gold { background: color-mix(in srgb, var(--bs-warning) 32%, var(--surface, var(--bs-body-bg))); }
.event-dashboard-pill--coral { background: color-mix(in srgb, var(--bs-danger) 24%, var(--surface, var(--bs-body-bg))); }
.event-dashboard-pill--muted { background: var(--surface-soft, var(--bs-body-bg)); color: var(--text-muted, var(--muted, var(--bs-secondary-color))); }

.event-dashboard-followup-header {
    align-items: center;
    justify-content: flex-start;
}

.event-dashboard-followup-bar {
    display: inline-block;
    width: 0.38rem;
    height: 2rem;
    border-radius: 999px;
    background: var(--bs-warning, var(--primary, var(--bs-primary)));
    flex: 0 0 auto;
}

.event-dashboard-followup-card .event-dashboard-card-title,
.event-dashboard-side-card .event-dashboard-card-title {
    font-size: 0.9rem;
}

@media (max-width: 1199.98px) {
    .event-dashboard-main-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 991.98px) {
    .event-dashboard-metrics-grid,
    .event-dashboard-action-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .event-dashboard-hero__body,
    .event-dashboard-panel-header,
    .event-dashboard-actions-panel {
        padding: 1rem;
    }

    .event-dashboard-metrics-grid,
    .event-dashboard-action-grid {
        grid-template-columns: 1fr;
    }

    .event-dashboard-recent-row {
        grid-template-columns: 1fr;
        gap: 0.65rem;
    }

    .event-dashboard-side-card__top {
        flex-wrap: wrap;
    }
}

/* ===== Shared record comments ===== */
.comments-panel {
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1.25rem;
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    overflow: hidden;
}

.comments-panel__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.1rem 1.25rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--table-head-bg, var(--surface-soft, var(--surface, var(--bs-body-bg))));
}

.comments-panel__kicker {
    color: var(--primary, var(--bs-primary));
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.comments-panel__title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.comments-panel__count,
.comments-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    background: var(--pill-bg, var(--surface, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
    font-size: 0.72rem;
    font-weight: 500;
    line-height: 1;
    padding: 0.32rem 0.62rem;
    white-space: nowrap;
}

.comments-pill--gold {
    background: color-mix(in srgb, var(--bs-warning) 32%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-warning) 48%, var(--card-border, var(--bs-border-color)));
}

.comments-panel__body {
    padding: 1.25rem;
}

.comments-form {
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface-muted, var(--surface-soft, var(--surface, var(--bs-body-bg))));
    padding: 1rem;
}

.comments-textarea {
    min-height: 5.75rem;
    resize: vertical;
}

.comments-form__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.comments-pin-option {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.84rem;
}

.comments-list {
    display: grid;
    gap: 0.85rem;
}

.comment-card {
    display: grid;
    grid-template-columns: 2.75rem minmax(0, 1fr);
    gap: 0.75rem;
    align-items: flex-start;
    padding: 0.95rem 1rem;
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
}

.comment-card__identity {
    display: flex;
    justify-content: center;
    padding-top: 0.05rem;
}

.comment-card__avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 999px;
    background: var(--primary-soft, var(--surface-soft));
    color: var(--primary, var(--bs-primary));
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1;
    text-transform: uppercase;
}

.comment-card--pinned .comment-card__avatar {
    background: color-mix(in srgb, var(--bs-warning) 32%, var(--surface, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
}

.comment-card__avatar--system {
    font-size: 1rem;
}

.comment-card__content {
    min-width: 0;
}

.comment-card__meta {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.55rem;
}

.comment-card__author {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.4rem;
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.9rem;
    font-weight: 600;
}

.comment-card__date {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.78rem;
    white-space: nowrap;
}

.comment-card__text {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.92rem;
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.comment-card__edit summary {
    color: var(--primary, var(--bs-primary));
    cursor: pointer;
    font-size: 0.82rem;
    font-weight: 500;
}

.comments-empty {
    border: 1px dashed var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    padding: 1.25rem;
    text-align: center;
    background: var(--surface-muted, var(--surface-soft, var(--surface, var(--bs-body-bg))));
}

.comments-empty__title {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 600;
}

.comments-empty__text {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.86rem;
    margin-top: 0.25rem;
}

@media (max-width: 575.98px) {
    .comments-panel__header,
    .comment-card__meta,
    .comments-form__footer {
        align-items: flex-start;
        flex-direction: column;
    }

    .comment-card__date {
        white-space: normal;
    }
}

/* ===== Shared record comments modal workflow refinements ===== */
.comments-panel__heading {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.comments-panel__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.55rem;
    flex-wrap: wrap;
}

.comment-card__actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.comments-modal .modal-content {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color))) !important;
    border-radius: 1.15rem;
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
}

.comments-modal .modal-header,
.comments-modal .modal-footer {
    border-color: var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--table-head-bg, var(--surface-soft, var(--surface, var(--bs-body-bg))));
}

.comments-modal .modal-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.98rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.comments-modal .modal-body {
    background: var(--surface, var(--bs-body-bg));
}

.comments-modal .btn-close {
    color: var(--text-main, var(--bs-body-color));
}

@media (max-width: 575.98px) {
    .comments-panel__actions {
        justify-content: flex-start;
        width: 100%;
    }

    .comments-panel__actions .btn {
        width: 100%;
    }
}

/* ===== Shared record comments delete confirmation ===== */
.comments-delete-warning {
    border: 1px solid color-mix(in srgb, var(--bs-danger, #dc3545) 28%, var(--table-border, var(--border-color, var(--bs-border-color))));
    border-radius: 1rem;
    background: color-mix(in srgb, var(--bs-danger, #dc3545) 10%, var(--surface, var(--bs-body-bg)));
    padding: 1rem;
}

.comments-delete-warning__title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.35;
}

.comments-delete-warning__text {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.86rem;
    margin-top: 0.25rem;
}

.comments-delete-modal .btn-outline-danger {
    font-weight: 400;
}

/* ===== Education schedule batch page ===== */
.schedule-batch-page {
    display: grid;
    gap: 0;
    color: var(--text-main);
    font-size: 0.96rem;
    line-height: 1.5;
}

.schedule-batch-hero,
.schedule-list-panel,
.schedule-state-panel,
.schedule-note-panel,
.schedule-metric-card {
    border: 1px solid var(--card-border);
    border-radius: 1.25rem;
    box-shadow: var(--card-shadow);
    overflow: hidden;
}

.schedule-batch-hero-accent {
    height: 0.5rem;
    background: linear-gradient(90deg, var(--primary), var(--bs-info), var(--bs-warning));
}

.schedule-batch-hero-body {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem;
}

.schedule-batch-hero-copy {
    min-width: 0;
}

.schedule-batch-kicker,
.schedule-date-kicker {
    color: var(--primary);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.schedule-batch-title {
    color: var(--text-main);
    font-size: clamp(1.5rem, 2.2vw, 2rem);
    font-weight: 700;
    letter-spacing: -0.03em;
}

.schedule-batch-subtitle,
.schedule-metric-hint,
.schedule-row-muted,
.schedule-row-note,
.schedule-session-meta-grid,
.schedule-session-note {
    color: var(--text-muted);
}

.schedule-batch-subtitle,
.schedule-note-text,
.schedule-row-note,
.schedule-session-note,
.schedule-form-guidance__copy {
    font-size: 0.94rem;
    line-height: 1.55;
}

.schedule-batch-meta-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    color: var(--text-muted);
    font-size: 0.93rem;
    line-height: 1.45;
}

.schedule-batch-actions,
.schedule-bottom-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.schedule-action-warning,
.schedule-action-danger {
    border-radius: 0.85rem;
    font-weight: 600;
}

.schedule-action-warning {
    background: color-mix(in srgb, var(--bs-warning) 16%, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid color-mix(in srgb, var(--bs-warning) 42%, var(--table-border, var(--card-border)));
}

.schedule-action-warning:hover,
.schedule-action-warning:focus-visible {
    background: color-mix(in srgb, var(--bs-warning) 24%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-warning) 54%, var(--table-border, var(--card-border)));
    color: var(--text-main, var(--bs-body-color));
}

.schedule-action-danger {
    background: color-mix(in srgb, var(--bs-danger) 12%, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid color-mix(in srgb, var(--bs-danger) 36%, var(--table-border, var(--card-border)));
}

.schedule-action-danger:hover,
.schedule-action-danger:focus-visible {
    background: color-mix(in srgb, var(--bs-danger) 18%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-danger) 48%, var(--table-border, var(--card-border)));
    color: var(--text-main, var(--bs-body-color));
}

.schedule-metrics-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.schedule-metric-card {
    padding: 1.15rem;
}

.schedule-metric-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.7rem;
}

.schedule-metric-label {
    color: var(--text-muted);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.schedule-metric-dot {
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 999px;
    box-shadow: 0 0 0 0.35rem var(--surface-muted);
    flex: 0 0 auto;
}

.schedule-dot-primary { background: var(--primary); }
.schedule-dot-info { background: var(--bs-info); }
.schedule-dot-warning { background: var(--bs-warning); }
.schedule-dot-danger { background: var(--bs-danger); }

.schedule-metric-value {
    color: var(--text-main);
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -0.03em;
}

.schedule-metric-date,
.schedule-metric-text {
    font-size: 1.05rem;
}

.schedule-state-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.25rem;
    border-left: 0.35rem solid var(--bs-info);
}

.schedule-state-panel-posted {
    border-left-color: var(--bs-warning);
}

.schedule-state-title,
.schedule-list-title,
.schedule-date-title,
.schedule-session-title,
.schedule-row-name {
    color: var(--text-main);
    font-weight: 700;
}

.schedule-state-title,
.schedule-list-title {
    font-size: 1.15rem;
    letter-spacing: -0.02em;
}

.schedule-date-title {
    font-size: 1.02rem;
    letter-spacing: -0.02em;
}

.schedule-session-title,
.schedule-row-name {
    font-size: 0.98rem;
    letter-spacing: -0.01em;
}

.schedule-note-panel {
    padding: 1.15rem;
}

.schedule-note-text {
    white-space: pre-line;
    color: var(--text-main);
    margin-top: 0.4rem;
}

.schedule-list-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.25rem;
    background: var(--surface);
    border-bottom: 1px solid var(--table-border);
}

.schedule-date-group-wrap {
    padding: 1.25rem;
    display: grid;
    gap: 1.25rem;
}

.schedule-date-group {
    border: 1px solid var(--table-border);
    border-radius: 1.1rem;
    overflow: hidden;
    background: var(--surface);
}

.schedule-date-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: var(--surface);
    border-bottom: 1px solid var(--table-border);
}

.schedule-session-list {
    display: grid;
}

.schedule-session-row {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(240px, 0.85fr);
    gap: 1.25rem;
    padding: 1.15rem 1.25rem;
    border-top: 1px solid var(--table-border);
}

.schedule-session-row:first-child {
    border-top: 0;
}

.schedule-session-row:hover {
    background: var(--table-row-hover);
}

.schedule-session-main {
    display: grid;
    grid-template-columns: 0.35rem minmax(0, 1fr);
    gap: 0.9rem;
    min-width: 0;
}

.schedule-session-accent {
    border-radius: 999px;
    background: var(--bs-info);
}

.schedule-session-title-row,
.schedule-teacher-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.schedule-session-meta-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.35rem 0.9rem;
    margin-top: 0.65rem;
    font-size: 0.93rem;
    line-height: 1.45;
}

.schedule-session-meta-grid span {
    color: var(--text-main);
    font-weight: 600;
}

.schedule-session-note {
    margin-top: 0.65rem;
    font-size: 0.94rem;
}

.schedule-session-teachers {
    min-width: 0;
    overflow-wrap: anywhere;
}

.schedule-teacher-head {
    margin-bottom: 0.6rem;
    color: var(--text-muted);
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.schedule-teacher-check-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
    min-width: 0;
}

.schedule-teacher-check {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    border: 1px solid var(--table-border);
    border-radius: 1rem;
    background: var(--surface);
    color: var(--text-main);
    padding: 0.8rem 0.9rem;
    min-height: 4rem;
    transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.schedule-teacher-check:hover {
    background: var(--table-row-hover);
    border-color: color-mix(in srgb, var(--primary) 30%, var(--table-border));
    transform: translateY(-1px);
}

.schedule-teacher-check input[type="checkbox"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.schedule-teacher-check__body {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
    flex: 1 1 auto;
}

.schedule-teacher-check__name {
    color: var(--text-main);
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.35;
}

.schedule-teacher-check__meta {
    color: var(--text-muted);
    font-size: 0.8rem;
    line-height: 1.3;
}

.schedule-teacher-check__indicator {
    width: 0.9rem;
    height: 0.9rem;
    margin-top: 0.25rem;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--table-border));
    background: var(--surface-muted);
    box-shadow: inset 0 0 0 0.2rem var(--surface);
    flex: 0 0 auto;
}

.schedule-teacher-check:has(input[type="checkbox"]:checked) {
    background: color-mix(in srgb, var(--primary-soft) 72%, var(--surface));
    border-color: color-mix(in srgb, var(--primary) 36%, var(--table-border));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 16%, transparent);
}

.schedule-teacher-check:has(input[type="checkbox"]:checked) .schedule-teacher-check__indicator {
    background: var(--primary);
    border-color: var(--primary);
    box-shadow: inset 0 0 0 0.2rem color-mix(in srgb, var(--surface) 82%, transparent);
}

.schedule-teacher-pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    min-width: 0;
}

.schedule-status-pill,
.schedule-teacher-pill {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    border: 1px solid var(--table-border);
    padding: 0.32rem 0.7rem;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.2;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--surface) 70%, transparent);
}

.schedule-status-pill-draft {
    background: color-mix(in srgb, var(--bs-warning) 18%, var(--surface, var(--bs-body-bg)));
    color: var(--text-main);
    border-color: color-mix(in srgb, var(--bs-warning) 48%, var(--table-border));
}

.schedule-status-pill-count {
    background: color-mix(in srgb, var(--primary) 16%, var(--surface, var(--bs-body-bg)));
    color: var(--text-main);
    border-color: color-mix(in srgb, var(--primary) 42%, var(--table-border));
}

.schedule-status-pill-date {
    background: color-mix(in srgb, var(--bs-info) 14%, var(--surface, var(--bs-body-bg)));
    color: var(--text-main);
    border-color: color-mix(in srgb, var(--bs-info) 40%, var(--table-border));
}

.schedule-status-pill-soft {
    background: color-mix(in srgb, var(--bs-secondary) 14%, var(--surface, var(--bs-body-bg)));
    color: var(--text-main);
    border-color: color-mix(in srgb, var(--bs-secondary) 42%, var(--table-border));
}

.schedule-status-pill-selection {
    background: color-mix(in srgb, var(--bs-warning) 16%, var(--surface, var(--bs-body-bg)));
    color: var(--text-main);
    border-color: color-mix(in srgb, var(--bs-warning) 44%, var(--table-border));
}

.schedule-teacher-pill {
    background: color-mix(in srgb, var(--bs-danger) 12%, var(--surface, var(--bs-body-bg)));
    color: var(--text-main);
    border-color: color-mix(in srgb, var(--bs-danger) 36%, var(--table-border));
}

.schedule-status-pill-posted {
    background: color-mix(in srgb, var(--bs-success) 18%, var(--surface, var(--bs-body-bg)));
    color: var(--text-main);
    border-color: color-mix(in srgb, var(--bs-success) 48%, var(--table-border));
}

.schedule-batch-table-wrap {
    overflow-x: auto;
}

.schedule-batch-table-head,
.schedule-batch-row {
    display: grid;
    grid-template-columns: minmax(220px, 1.2fr) minmax(190px, 0.85fr) 110px minmax(150px, 0.75fr) minmax(220px, 0.9fr);
    gap: 1rem;
    align-items: center;
    min-width: 950px;
}

.schedule-batch-table-head {
    background: var(--table-head-bg);
    color: var(--text-muted);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 0.85rem 1.25rem;
}

.schedule-batch-row {
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--table-border);
}

.schedule-batch-row:hover {
    background: var(--table-row-hover);
}

.schedule-row-actions {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.schedule-row-locked {
    display: inline-flex;
    align-items: center;
    border-radius: 0.75rem;
    padding: 0.42rem 0.65rem;
    color: var(--text-muted);
    background: var(--surface-muted);
    border: 1px solid var(--table-border);
    font-size: 0.82rem;
    font-weight: 600;
}

.schedule-empty-state {
    padding: 2.5rem 1.25rem;
    text-align: center;
    color: var(--text-muted);
}

.schedule-bottom-actions {
    margin-top: 1rem;
    justify-content: flex-end;
    padding: 1rem 1.25rem 1.25rem;
}

.schedule-program-picker {
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 1rem;
    background: var(--surface-muted, var(--surface-soft, var(--surface)));
    padding: 1rem;
}

.schedule-program-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
}

.schedule-program-option {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    margin: 0;
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 0.95rem;
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    padding: 0.75rem 0.85rem;
    min-height: 3.1rem;
    transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.schedule-program-option .fw-medium {
    font-size: 0.94rem;
    font-weight: 600 !important;
    line-height: 1.35;
}

.schedule-program-option:hover {
    background: var(--table-row-hover, var(--surface-soft));
    border-color: var(--primary, var(--bs-primary));
    transform: translateY(-1px);
}

.schedule-program-option input[type="checkbox"] {
    accent-color: var(--primary, var(--bs-primary));
    margin-top: 0.2rem;
    flex: 0 0 auto;
}

.schedule-program-option:has(input[type="checkbox"]:checked) {
    background: var(--primary-soft, var(--surface-soft, var(--surface)));
    border-color: color-mix(in srgb, var(--primary, var(--bs-primary)) 40%, var(--table-border, var(--card-border)));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary, var(--bs-primary)) 24%, transparent);
}

.schedule-batch-form-page {
    display: flex;
    flex-direction: column;
}

.schedule-form-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(280px, 0.8fr);
    gap: 1.25rem;
    align-items: start;
}

.schedule-form-panel {
    border: 1px solid var(--card-border, var(--table-border));
    border-radius: 1.25rem;
    overflow: hidden;
    box-shadow: var(--card-shadow);
}

.schedule-form-panel__header {
    padding: 1.15rem 1.25rem;
    border-bottom: 1px solid var(--table-border, var(--card-border));
    background: var(--table-head-bg, var(--surface-soft));
}

.schedule-form-panel__body {
    padding: 1.25rem;
}

.schedule-form-side {
    display: grid;
    gap: 1rem;
    align-self: start;
}

.schedule-form-panel .form-label {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 600;
    font-size: 0.93rem;
}

.schedule-form-panel .form-control,
.schedule-form-panel .form-select,
.schedule-batch-page .btn,
.schedule-row-muted {
    font-size: 0.94rem;
}

.schedule-batch-page .modal-header,
.schedule-batch-page .modal-footer {
    background: var(--table-head-bg, var(--surface-soft));
    border-color: var(--table-border, var(--card-border));
}

.schedule-batch-page .modal-body {
    background: var(--surface, var(--bs-body-bg));
}

.schedule-form-guidance {
    display: grid;
    gap: 0.75rem;
    margin-top: 0.9rem;
}

.schedule-form-guidance__item {
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 1rem;
    background: var(--surface-muted, var(--surface-soft, var(--surface)));
    padding: 0.9rem 1rem;
}

.schedule-form-guidance__title {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
    margin-bottom: 0.2rem;
}

.schedule-form-guidance__copy {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.94rem;
}

@media (max-width: 991.98px) {
    .schedule-batch-hero-body,
    .schedule-state-panel,
    .schedule-list-header,
    .schedule-date-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .schedule-batch-actions,
    .schedule-bottom-actions {
        justify-content: flex-start;
    }

    .schedule-metrics-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .schedule-session-row {
        grid-template-columns: 1fr;
    }

    .schedule-form-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .schedule-metrics-grid,
    .schedule-session-meta-grid,
    .schedule-teacher-check-grid,
    .schedule-program-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== Education dashboard theme refresh ===== */

.edu-dashboard-hero,
.edu-panel,
.edu-metric-card {
    border: 1px solid var(--card-border);
    border-radius: 1.25rem;
    box-shadow: var(--card-shadow);
    overflow: hidden;
}

.edu-dashboard-hero-accent {
    height: 0.45rem;
    background: linear-gradient(90deg, var(--primary), var(--bs-info), var(--bs-warning));
}

.edu-dashboard-hero-body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    flex-wrap: wrap;
    padding: 1.5rem;
}

.edu-dashboard-kicker {
    color: var(--primary);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.edu-dashboard-title {
    color: var(--text-main);
    font-size: clamp(1.75rem, 2.4vw, 2.35rem);
    font-weight: 700;
    line-height: 1.12;
    letter-spacing: -0.035em;
    margin: 0.25rem 0 0;
}

.edu-dashboard-subtitle,
.edu-panel-subtitle,
.edu-side-subtitle,
.edu-row-subtitle,
.edu-attention-detail,
.edu-batch-meta {
    color: var(--text-muted);
}

.edu-dashboard-subtitle {
    max-width: 44rem;
    font-size: 0.95rem;
    line-height: 1.65;
    margin: 0.55rem 0 0;
}

.edu-dashboard-actions {
    display: flex;
    gap: 0.55rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.edu-dashboard-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.edu-metric-card {
    padding: 1.15rem;
    position: relative;
}

.edu-metric-card::after {
    content: "";
    position: absolute;
    top: 1.2rem;
    right: 1.2rem;
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 999px;
    box-shadow: 0 0 0 0.35rem var(--surface-strong);
    background: var(--edu-accent);
}

.edu-metric-label {
    color: var(--text-muted);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding-right: 1.5rem;
}

.edu-metric-value {
    color: var(--text-main);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.04em;
    margin-top: 0.6rem;
}

.edu-metric-hint {
    color: var(--text-muted);
    font-size: 0.78rem;
    margin-top: 0.25rem;
}

.edu-dashboard-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(360px, 0.85fr);
    gap: 1.25rem;
    align-items: start;
}

.edu-dashboard-main,
.edu-dashboard-side {
    display: grid;
    gap: 1.25rem;
}

.edu-panel {
    background: var(--surface);
}

.edu-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 1.15rem 1.25rem;
    border-bottom: 1px solid var(--table-border);
    background: var(--table-head-bg);
}

.edu-panel-header-compact {
    padding: 1rem 1.15rem;
}

.edu-panel-header--plain {
    background: transparent;
}

.edu-panel-title {
    color: var(--text-main);
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0.25rem 0 0;
}

.edu-panel-subtitle {
    margin: 0.25rem 0 0;
    font-size: 0.86rem;
}

.edu-pill {
    display: inline-flex;
    align-items: center;
    width: max-content;
    border: 1px solid var(--pill-border);
    border-radius: 999px;
    padding: 0.22rem 0.58rem;
    font-size: 0.7rem;
    font-weight: 600;
    line-height: 1.1;
    background: var(--pill-bg);
    color: var(--primary);
}

.edu-pill-blue {
    background: color-mix(in srgb, var(--bs-info) 14%, var(--surface));
    border-color: color-mix(in srgb, var(--bs-info) 40%, var(--card-border));
}

.edu-pill-green {
    background: color-mix(in srgb, var(--bs-success) 18%, var(--surface));
    border-color: color-mix(in srgb, var(--bs-success) 42%, var(--card-border));
}

.edu-pill-gold {
    background: color-mix(in srgb, var(--bs-warning) 24%, var(--surface));
    border-color: color-mix(in srgb, var(--bs-warning) 46%, var(--card-border));
}

.edu-pill-coral {
    background: color-mix(in srgb, var(--bs-danger) 18%, var(--surface));
    border-color: color-mix(in srgb, var(--bs-danger) 42%, var(--card-border));
}

.edu-accent-blue {
    --edu-accent: var(--bs-info);
}

.edu-accent-green {
    --edu-accent: var(--bs-success);
}

.edu-accent-gold {
    --edu-accent: var(--bs-warning);
}

.edu-accent-coral {
    --edu-accent: var(--bs-danger);
}

.edu-tool-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    padding: 1.25rem;
}

.edu-tool-grid--primary {
    grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
    gap: 1.1rem;
}

.edu-tool-card,
.edu-attention-item,
.edu-batch-item,
.edu-session-row {
    color: inherit;
    text-decoration: none;
}

.edu-tool-card {
    display: grid;
    grid-template-columns: minmax(0, 6.4rem) minmax(0, 1fr);
    align-items: start;
    gap: 1rem;
    border: 1px solid var(--table-border);
    border-left: 0.28rem solid var(--table-border);
    border-radius: 1.15rem;
    padding: 1rem;
    background: var(--surface);
    min-height: 11.25rem;
    box-shadow: var(--card-shadow);
    transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.edu-tool-card:hover {
    color: inherit;
    background: var(--table-row-hover);
    border-color: var(--table-border);
    transform: translateY(-2px);
    box-shadow: 0 18px 34px rgba(15, 23, 42, 0.10);
}

.edu-attention-item:hover,
.edu-batch-item:hover,
.edu-session-row:hover,
.edu-program-row:hover {
    color: inherit;
    background: var(--table-row-hover);
    border-color: var(--table-border);
}

.edu-tool-icon {
    width: 5.9rem;
    height: 5.9rem;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.edu-tool-icon-img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
    object-position: center;
}

.edu-tool-copy {
    display: block;
    min-width: 0;
}

.edu-tool-title,
.edu-row-title,
.edu-attention-title,
.edu-batch-title {
    color: var(--text-main);
    font-weight: 700;
}

.edu-tool-title {
    display: block;
    margin-bottom: 0.25rem;
}

.edu-tool-desc {
    display: block;
    color: var(--text-muted);
    font-size: 0.86rem;
    line-height: 1.55;
}

.edu-tool-card .btn-outline-secondary {
    border-color: var(--table-border);
    background: var(--table-head-bg);
}

.edu-table-scroll {
    overflow-x: auto;
}

.edu-program-table {
    min-width: 820px;
}

.edu-program-table-head,
.edu-program-row {
    display: grid;
    grid-template-columns: 1.25fr 100px 110px 110px 120px 90px;
    align-items: center;
    gap: 0.8rem;
}

.edu-program-table-head {
    background: var(--table-head-bg);
    color: var(--text-muted);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 0.75rem 1.25rem;
}

.edu-program-row {
    border-top: 1px solid var(--table-border);
    color: var(--text-muted);
    font-size: 0.9rem;
    padding: 0.95rem 1.25rem;
}

.edu-row-primary {
    border-left: 0;
    padding-left: 0;
    min-width: 0;
}

.edu-row-subtitle {
    font-size: 0.76rem;
    margin-top: 0.12rem;
}

.edu-session-list {
    display: grid;
}

.edu-session-row {
    display: grid;
    grid-template-columns: 110px minmax(0, 1.2fr) minmax(0, 1fr) 150px;
    align-items: center;
    gap: 1rem;
    border-top: 1px solid var(--table-border);
    padding: 1rem 1.25rem;
}

.edu-session-row:first-child {
    border-top: 0;
}

.edu-session-class {
    border-left: 0;
    padding-left: 0;
    min-width: 0;
}

.edu-session-date,
.edu-session-class,
.edu-session-teachers {
    display: grid;
    min-width: 0;
}

.edu-session-teachers {
    color: var(--text-muted);
    font-size: 0.85rem;
}

.edu-side-title-row {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    padding: 1.15rem 1.25rem;
    border-bottom: 1px solid var(--table-border);
    background: var(--table-head-bg);
}

.edu-side-title-row--plain {
    background: transparent;
}

.edu-side-accent {
    width: 0.36rem;
    height: 2rem;
    border-radius: 999px;
    background: var(--bs-warning);
    flex: 0 0 auto;
}

.edu-side-title {
    color: var(--text-main);
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin: 0;
}

.edu-side-subtitle {
    font-size: 0.76rem;
    margin: 0.2rem 0 0;
}

.edu-attention-list,
.edu-batch-list {
    display: grid;
    gap: 0.75rem;
    padding: 1rem;
}

.edu-attention-item,
.edu-batch-item {
    display: grid;
    gap: 0.35rem;
    border: 1px solid var(--table-border);
    border-radius: 1rem;
    background: var(--surface);
    padding: 0.95rem;
    transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.edu-attention-title {
    font-size: 0.9rem;
}

.edu-attention-detail,
.edu-batch-meta {
    font-size: 0.78rem;
    line-height: 1.55;
}

@media (max-width: 1199.98px) {
    .edu-dashboard-layout {
        grid-template-columns: 1fr;
    }

    .edu-dashboard-side {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .edu-dashboard-metrics,
    .edu-tool-grid,
    .edu-dashboard-side {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .edu-session-row {
        grid-template-columns: 1fr;
        gap: 0.55rem;
    }
}

@media (max-width: 767.98px) {
    .edu-dashboard-hero-body,
    .edu-panel-header {
        align-items: stretch;
    }

    .edu-dashboard-actions,
    .edu-panel-header .btn {
        width: 100%;
    }

    .edu-dashboard-actions .btn,
    .edu-panel-header .btn {
        justify-content: center;
    }

    .edu-dashboard-metrics,
    .edu-tool-grid,
    .edu-dashboard-side {
        grid-template-columns: 1fr;
    }

    .edu-tool-card {
        grid-template-columns: 5.4rem minmax(0, 1fr);
        min-height: 9.75rem;
        padding: 1rem;
        gap: 0.95rem;
    }

    .edu-tool-icon {
        width: 5.4rem;
        height: 5.4rem;
    }

    .edu-program-table {
        min-width: 760px;
    }
}



/* ===== Education class detail themed layout ===== */
.class-detail-page {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.class-detail-shell,
.class-detail-panel,
.class-detail-metric,
.class-detail-card {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    border-radius: 1.25rem;
}

.class-detail-hero {
    overflow: hidden;
}

.class-detail-hero__accent {
    height: 0.5rem;
    background: linear-gradient(90deg, var(--primary, var(--bs-primary)), var(--bs-info), var(--bs-warning));
}

.class-detail-hero__body {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.5rem;
}

.class-detail-kicker,
.class-detail-section-kicker {
    color: var(--primary, var(--bs-primary));
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.class-detail-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.75rem, 2.2vw, 2.35rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    margin: 0.15rem 0 0;
}

.class-detail-subtitle,
.class-detail-muted {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.class-detail-actions,
.class-detail-inline-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.class-detail-meta-line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
    margin-top: 0.75rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.9rem;
}

.class-detail-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.class-detail-metric {
    padding: 1.25rem;
}

.class-detail-metric__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.class-detail-metric__label,
.class-detail-table-head,
.class-detail-info-label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.class-detail-metric__value {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.7rem;
    font-weight: 700;
    letter-spacing: -0.03em;
}

.class-detail-metric__hint {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.82rem;
    margin-top: 0.2rem;
}

.class-detail-dot {
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 999px;
    box-shadow: 0 0 0 0.25rem var(--surface, var(--bs-body-bg));
    background: var(--primary, var(--bs-primary));
}

.class-detail-dot--green { background: var(--bs-success, var(--primary)); }
.class-detail-dot--gold { background: var(--bs-warning, var(--primary)); }
.class-detail-dot--coral { background: var(--bs-danger, var(--primary)); }

.class-detail-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    margin-top: 1rem;
}

.class-detail-info-card {
    border: 1px solid var(--table-border, var(--card-border));
    background: var(--table-head-bg, var(--surface-soft));
    border-radius: 1rem;
    padding: 0.9rem 1rem;
}

.class-detail-info-value {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 600;
    margin-top: 0.2rem;
}

.class-detail-main-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(340px, 0.85fr);
    gap: 1.25rem;
    align-items: start;
}

.class-detail-stack {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.class-detail-panel {
    overflow: hidden;
}

.class-detail-panel__header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: var(--table-head-bg, var(--surface-soft));
    border-bottom: 1px solid var(--table-border, var(--card-border));
}

.class-detail-panel__body {
    padding: 1.25rem;
}

.class-detail-panel-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.05rem;
    font-weight: 700;
    margin: 0.15rem 0 0;
}

.class-detail-row-list {
    display: flex;
    flex-direction: column;
}

.class-detail-list-row {
    display: grid;
    grid-template-columns: 110px minmax(0, 1.25fr) minmax(220px, 0.95fr) 150px minmax(110px, auto);
    gap: 0.8rem;
    align-items: center;
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--table-border, var(--card-border));
}

.class-detail-list-row:first-child {
    border-top: 0;
}

.class-detail-list-row:hover,
.class-detail-table-row:hover,
.class-detail-teacher-card:hover {
    background: var(--table-row-hover, var(--surface-soft));
}

.class-detail-row-title,
.class-detail-name {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
}

.class-detail-row-sub {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.82rem;
    margin-top: 0.12rem;
}

.class-detail-accent-line {
    border-left: 4px solid var(--primary, var(--bs-primary));
    padding-left: 0.8rem;
}

.class-detail-accent-line--green { border-left-color: var(--bs-success, var(--primary)); }
.class-detail-accent-line--gold { border-left-color: var(--bs-warning, var(--primary)); }
.class-detail-accent-line--coral { border-left-color: var(--bs-danger, var(--primary)); }

.class-detail-table-scroll {
    overflow-x: auto;
}

.class-detail-roster-table {
    min-width: 780px;
}

.class-detail-table-head,
.class-detail-table-row {
    display: grid;
    grid-template-columns: 72px minmax(220px, 1.4fr) 90px 120px 130px 95px;
    gap: 0.85rem;
    align-items: center;
    padding: 0.9rem 1.25rem;
}

.class-detail-table-head {
    background: var(--table-head-bg, var(--surface-soft));
}

.class-detail-table-row {
    border-top: 1px solid var(--table-border, var(--card-border));
    color: var(--text-main, var(--bs-body-color));
}

.class-detail-teacher-card,
.class-detail-action-card {
    border: 1px solid var(--table-border, var(--card-border));
    border-left: 4px solid var(--primary, var(--bs-primary));
    border-radius: 1rem;
    padding: 1rem;
    background: var(--surface, var(--bs-body-bg));
}

.class-detail-action-card {
    background: var(--table-head-bg, var(--surface-soft));
}

.class-detail-side-accent {
    width: 0.38rem;
    height: 2rem;
    border-radius: 999px;
    background: var(--bs-warning, var(--primary));
    flex: 0 0 auto;
}

.class-detail-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    border-radius: 999px;
    border: 1px solid var(--pill-border, var(--card-border));
    background: var(--pill-bg, var(--surface));
    color: var(--primary, var(--bs-primary));
    padding: 0.28rem 0.58rem;
    font-size: 0.72rem;
    font-weight: 600;
    white-space: nowrap;
}

.class-detail-pill--soft { background: var(--surface-soft, var(--surface)); color: var(--text-main, var(--bs-body-color)); }
.class-detail-pill--blue {
    background: color-mix(in srgb, var(--bs-info) 18%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-info) 42%, var(--card-border, var(--bs-border-color)));
}
.class-detail-pill--green { background: var(--success-soft, var(--surface-soft)); }
.class-detail-pill--gold { background: var(--warning-soft, var(--surface-soft)); }
.class-detail-pill--coral { background: var(--danger-soft, var(--surface-soft)); }

.class-detail-empty {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    text-align: center;
    padding: 2rem 1rem;
}

.class-detail-chart-wrap {
    height: 280px;
}

@media (max-width: 1199.98px) {
    .class-detail-main-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 991.98px) {
    .class-detail-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .class-detail-info-grid {
        grid-template-columns: 1fr;
    }
    .class-detail-list-row {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .class-detail-hero__body,
    .class-detail-panel__header,
    .class-detail-panel__body {
        padding: 1rem;
    }
    .class-detail-metrics {
        grid-template-columns: 1fr;
    }
}


/* ===== Education person picker and class-detail assignment tools ===== */
.person-picker-shell {
    position: relative;
    z-index: 4;
}

.person-picker-results {
    position: absolute;
    top: calc(100% + 0.35rem);
    left: 0;
    right: 0;
    z-index: 80;
    max-height: 260px;
    overflow: auto;
    border: 1px solid var(--border-color, rgba(0,0,0,.08));
    border-radius: 0.85rem;
    background: var(--surface, var(--bs-body-bg));
    box-shadow: var(--card-shadow, 0 10px 24px rgba(0,0,0,.12));
    display: none;
}

.person-picker-results.is-open {
    display: block;
}

.person-picker-option {
    width: 100%;
    border: 0;
    background: transparent;
    text-align: left;
    padding: 0.75rem 0.9rem;
    border-bottom: 1px solid var(--border-color, rgba(0,0,0,.06));
    color: var(--text-main, var(--bs-body-color));
}

.person-picker-option:last-child {
    border-bottom: 0;
}

.person-picker-option:hover,
.person-picker-option:focus {
    background: var(--table-row-hover, var(--surface-soft));
}

.person-picker-title {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 600;
}

.person-picker-subtitle {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.85rem;
}

.person-picker-selected {
    display: none;
    margin-top: 0.5rem;
    padding: 0.65rem 0.8rem;
    border-radius: 0.85rem;
    border: 1px solid var(--border-color, rgba(0,0,0,.08));
    background: var(--surface-soft, var(--surface));
}

.person-picker-selected.is-visible {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
}

.person-picker-empty {
    padding: 0.75rem 0.9rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.student-filter-shell .student-filter-input {
    margin-bottom: 0.85rem;
}

.student-filter-grid {
    max-height: 360px;
    overflow: auto;
    padding-right: 0.2rem;
}

.student-choice.is-hidden {
    display: none !important;
}


/* ===== Class detail cleanup refinements ===== */
.class-detail-info-grid--wide {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.class-detail-list-row--schedule {
    grid-template-columns: 110px minmax(0, 1.25fr) minmax(220px, 0.95fr) 130px minmax(110px, auto);
}

.class-detail-card-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
}

.class-detail-person-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
    padding: 0.85rem 1rem;
}

.class-detail-table td,
.class-detail-table th {
    vertical-align: middle;
}

@media (max-width: 1199.98px) {
    .class-detail-info-grid--wide {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .class-detail-info-grid--wide {
        grid-template-columns: 1fr;
    }
    .class-detail-list-row--schedule {
        grid-template-columns: 1fr;
    }
    .class-detail-person-card {
        align-items: flex-start;
        flex-direction: column;
    }
}


/* ===== Professional student manager modal ===== */
.student-manager-summary-card .class-detail-panel__body {
    display: flex;
    flex-direction: column;
}

.student-manager-summary-grid,
.student-manager-stats {
    display: grid;
    gap: 0.75rem;
}

.student-manager-summary-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.student-manager-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.student-manager-summary-item,
.student-manager-stat {
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 1rem;
    background: var(--surface-muted, var(--surface-soft));
    padding: 0.85rem;
}

.student-manager-summary-label,
.student-manager-stat__label {
    display: block;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.student-manager-summary-value,
.student-manager-stat__value {
    display: block;
    margin-top: 0.25rem;
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.student-manager-modal__header {
    align-items: flex-start;
    border-bottom-color: var(--table-border, var(--card-border));
    background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--surface-soft, var(--table-head-bg)) 82%, var(--surface, var(--bs-body-bg)) 18%),
        var(--surface, var(--bs-body-bg))
    );
    padding: 1.15rem 1.25rem;
}

.student-manager-modal__dialog {
    max-width: min(1180px, calc(100vw - 1.5rem));
}

.student-manager-modal__content {
    overflow: visible;
    border-radius: 1.3rem;
    box-shadow: var(--card-shadow, 0 18px 42px rgba(0, 0, 0, 0.14));
}

.student-manager-modal__body {
    overflow: visible;
    padding: 1.25rem;
    background:
        radial-gradient(circle at top right, color-mix(in srgb, var(--primary-soft) 55%, transparent) 0, transparent 42%),
        var(--surface, var(--bs-body-bg));
}

.student-manager-modal .modal-content,
.student-manager-modal .tab-content,
.student-manager-modal .tab-pane {
    overflow: visible;
}

.student-manager-tabs {
    gap: 0.5rem;
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 1rem;
    background: color-mix(in srgb, var(--surface-soft, var(--table-head-bg)) 78%, var(--surface, var(--bs-body-bg)) 22%);
    padding: 0.35rem;
}

.student-manager-tabs .nav-link {
    border-radius: 0.8rem;
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.88rem;
    font-weight: 600;
}

.student-manager-tabs .nav-link.active {
    background: var(--primary, var(--bs-primary));
    color: #ffffff;
}

.student-manager-pane-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.student-manager-pane-header + .person-picker-shell,
.student-manager-pane-header + .student-manager-choice-grid,
.student-manager-pane-header + .student-filter-input {
    position: relative;
    z-index: 2;
}

.student-manager-pane-title {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
    margin-bottom: 0.2rem;
}

.student-manager-choice-grid {
    max-height: 360px;
    overflow: auto;
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 1rem;
    background: color-mix(in srgb, var(--surface, var(--bs-body-bg)) 88%, var(--surface-soft, var(--table-head-bg)) 12%);
    padding: 0.75rem;
}

.student-manager-choice-grid ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.student-manager-choice-grid li,
.student-manager-choice-grid label {
    margin: 0;
}

.student-manager-choice-grid label {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    width: 100%;
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 0.85rem;
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    padding: 0.65rem 0.75rem;
    transition: background 0.18s ease, border-color 0.18s ease;
}

.student-manager-choice-grid label:hover {
    background: var(--table-row-hover, var(--surface-soft));
    border-color: var(--primary, var(--bs-primary));
}

.student-manager-choice-grid input[type="checkbox"] {
    flex: 0 0 auto;
}

.student-manager-assigned-list {
    display: grid;
    gap: 0.75rem;
}

.student-manager-assigned-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 1rem;
    background: color-mix(in srgb, var(--surface, var(--bs-body-bg)) 90%, var(--surface-soft, var(--table-head-bg)) 10%);
    padding: 0.85rem 1rem;
}

@media (max-width: 991.98px) {
    .student-manager-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .student-manager-choice-grid ul {
        grid-template-columns: 1fr;
    }

    .student-manager-pane-header,
    .student-manager-assigned-row {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 575.98px) {
    .student-manager-summary-grid,
    .student-manager-stats {
        grid-template-columns: 1fr;
    }

    .student-manager-tabs {
        align-items: stretch;
        flex-direction: column;
    }

    .student-manager-tabs .nav-item,
    .student-manager-tabs .nav-link {
        width: 100%;
    }
}


/* ===== Attendance session themed experience ===== */
.attendance-session-page,
.attendance-session-form-page {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.attendance-session-hero,
.attendance-session-panel,
.attendance-session-stat-card {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1.25rem;
    box-shadow: var(--card-shadow, none);
}

.attendance-session-hero {
    overflow: hidden;
}

.attendance-session-hero__accent {
    height: 0.5rem;
    background: linear-gradient(90deg, var(--primary, var(--bs-primary)), var(--bs-info), var(--bs-warning));
}

.attendance-session-hero__body {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.5rem;
}

.attendance-session-hero__content {
    flex: 1 1 480px;
}

.attendance-session-hero--compact .attendance-session-hero__content {
    flex-basis: 420px;
}

.attendance-session-kicker,
.attendance-session-section-kicker {
    color: var(--primary, var(--bs-primary));
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.attendance-session-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.8rem, 2.3vw, 2.45rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    margin: 0.2rem 0 0;
}

.attendance-session-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: 0.75rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.94rem;
}

.attendance-session-meta span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.attendance-session-hero-subtitle {
    margin-top: 0.45rem;
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.3rem;
    font-weight: 600;
    line-height: 1.45;
}

.attendance-session-actions,
.attendance-session-pill-row,
.attendance-session-quick-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

@media (min-width: 1200px) {
    .attendance-session-mobile-action {
        display: none;
    }
}

.attendance-session-summary-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: stretch;
}

.attendance-session-note {
    margin-top: 1rem;
    padding: 1rem 1.1rem;
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 1rem;
    background: var(--surface-soft, var(--surface));
}

.attendance-session-note__label {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 0.18rem;
}

.attendance-session-note__title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.35;
    margin-bottom: 0.65rem;
}

.attendance-session-note__text {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    margin-top: 0.4rem;
}

.attendance-session-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border-radius: 999px;
    border: 1px solid var(--pill-border, var(--card-border));
    background: var(--pill-bg, var(--surface));
    color: var(--primary, var(--bs-primary));
    padding: 0.32rem 0.68rem;
    font-size: 0.75rem;
    font-weight: 700;
}

.attendance-session-pill--soft {
    background: var(--surface-soft, var(--surface));
    color: var(--text-main, var(--bs-body-color));
}

.attendance-session-pill--blue {
    background: color-mix(in srgb, var(--bs-info) 18%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-info) 42%, var(--card-border, var(--bs-border-color)));
}

.attendance-session-pill--green {
    background: color-mix(in srgb, var(--bs-success) 20%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-success) 42%, var(--card-border, var(--bs-border-color)));
}

.attendance-session-pill--gold {
    background: color-mix(in srgb, var(--bs-warning) 24%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-warning) 46%, var(--card-border, var(--bs-border-color)));
}

.attendance-session-pill--coral {
    background: color-mix(in srgb, var(--bs-danger) 14%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-danger) 36%, var(--card-border, var(--bs-border-color)));
}

.attendance-session-metric {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.9rem;
    min-width: 0;
    flex: 1 1 180px;
    padding: 0.9rem 1rem;
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
}

.attendance-session-metric__label {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.attendance-session-metric__label .bi {
    font-size: 1rem;
    line-height: 1;
}

.attendance-session-metric__value {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1;
    white-space: nowrap;
}

.attendance-session-metric--success {
    background: color-mix(in srgb, var(--bs-success) 11%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-success) 35%, var(--card-border, var(--bs-border-color)));
}

.attendance-session-metric--coral {
    background: color-mix(in srgb, var(--bs-danger) 10%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-danger) 35%, var(--card-border, var(--bs-border-color)));
}

.attendance-session-metric--blue {
    background: color-mix(in srgb, var(--bs-info) 10%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-info) 35%, var(--card-border, var(--bs-border-color)));
}

.attendance-session-metric--gold {
    background: color-mix(in srgb, var(--bs-warning) 14%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-warning) 40%, var(--card-border, var(--bs-border-color)));
}

.attendance-session-metric--amber {
    background: color-mix(in srgb, var(--theme-education, var(--bs-primary)) 12%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--theme-education, var(--bs-primary)) 34%, var(--card-border, var(--bs-border-color)));
}

.attendance-session-panel {
    overflow: hidden;
}

.attendance-session-control-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(22rem, 0.95fr);
    gap: 1.25rem;
    align-items: start;
}

.attendance-session-control-main,
.attendance-session-control-side {
    display: grid;
    gap: 1.25rem;
    min-width: 0;
}

.attendance-session-page .comments-panel__header {
    background: transparent;
}

.attendance-session-panel__header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: transparent;
    border-bottom: 1px solid var(--table-border, var(--card-border));
}

.attendance-session-panel__body {
    padding: 1.25rem;
}

.attendance-session-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 1.25rem;
    row-gap: 0.9rem;
}

.attendance-session-detail-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.7rem;
    min-width: 0;
}

.attendance-session-detail-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.9rem;
    height: 1.9rem;
    border-radius: 0.65rem;
    color: var(--primary, var(--bs-primary));
    background: color-mix(in srgb, var(--primary, var(--bs-primary)) 11%, var(--surface, var(--bs-body-bg)));
}

.attendance-session-detail-copy {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
}

.attendance-session-detail-copy span {
    display: block;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin-bottom: 0.28rem;
    text-transform: uppercase;
}

.attendance-session-detail-copy strong {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.94rem;
    line-height: 1.35;
}

.attendance-session-note-block {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.attendance-session-note-block + .attendance-session-note-block {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--table-border, var(--card-border));
}

.attendance-session-context {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
    margin-bottom: 1rem;
}

.attendance-session-context--stacked {
    grid-template-columns: 1fr;
}

.attendance-session-context--compact {
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
    margin-bottom: 0;
}

.attendance-session-context__item {
    padding: 0.9rem 1rem;
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 1rem;
    background: var(--surface-soft, var(--surface));
}

.attendance-session-context__item--plain {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.attendance-session-context__item--no-bg {
    background: transparent;
}

.attendance-session-context__label {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 0.35rem;
}

.attendance-session-context__value {
    color: var(--text-main, var(--bs-body-color));
    line-height: 1.55;
}

.attendance-session-quick-actions--header {
    justify-content: flex-end;
}

.attendance-session-panel__title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.08rem;
    font-weight: 700;
    margin: 0.15rem 0 0;
}

.attendance-session-panel__subtitle,
.attendance-session-selected__copy,
.attendance-session-empty__copy {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    margin: 0.35rem 0 0;
}

.attendance-session-teacher-toolbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.attendance-session-teacher-toolbar--card {
    padding: 1rem;
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 1rem;
    background: var(--surface-soft, var(--surface));
}

.attendance-session-teacher-status-strip {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.45rem;
}

.attendance-session-teacher-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(20rem, 0.65fr);
    gap: 1.25rem;
    align-items: start;
}

.attendance-session-teacher-control {
    display: grid;
    gap: 1.2rem;
}

.attendance-session-teacher-overview {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(20rem, 0.85fr);
    gap: 1.25rem;
    align-items: start;
}

.attendance-session-session-overview {
    display: grid;
    gap: 1rem;
}

.attendance-session-session-info {
    display: grid;
    gap: 0.85rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--table-border, var(--card-border));
}

.attendance-session-session-info__row {
    display: grid;
    gap: 0.25rem;
    text-align: left;
}

.attendance-session-teacher-manage {
    padding-top: 1.15rem;
    border-top: 1px solid var(--table-border, var(--card-border));
}

.attendance-session-teacher-main {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.attendance-session-teacher-form {
    display: grid;
    gap: 1rem;
}

.attendance-session-teacher-form__footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
}

.attendance-session-search {
    flex: 1 1 320px;
}

.attendance-session-teacher-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.attendance-session-summary-chip {
    min-width: 124px;
    padding: 0.8rem 0.9rem;
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 1rem;
    background: var(--surface-soft, var(--surface));
}

.attendance-session-summary-chip__label {
    display: block;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.attendance-session-summary-chip__value {
    display: block;
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.25rem;
    font-weight: 700;
    margin-top: 0.2rem;
}

.attendance-session-teacher-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.attendance-session-teacher-card {
    display: block;
    margin: 0;
    cursor: pointer;
}

.attendance-session-teacher-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.attendance-session-teacher-card__body {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    height: 100%;
    padding: 1rem;
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
    transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
}

.attendance-session-teacher-card:hover .attendance-session-teacher-card__body,
.attendance-session-teacher-card.is-selected .attendance-session-teacher-card__body {
    background: var(--table-row-hover, var(--surface-soft));
    border-color: var(--pill-selected-border, var(--primary, var(--bs-primary)));
    transform: translateY(-1px);
}

.attendance-session-teacher-card.is-selected .attendance-session-teacher-card__body {
    box-shadow: inset 0 0 0 1px var(--pill-selected-border, var(--primary, var(--bs-primary)));
}

.attendance-session-teacher-copy {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.attendance-session-teacher-name,
.attendance-session-selected__name,
.attendance-session-guidance-item__title,
.attendance-session-empty__title {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
}

.attendance-session-teacher-meta,
.attendance-session-selected__meta,
.attendance-session-guidance-item__copy {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.84rem;
}

.attendance-session-teacher-state {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 1px solid var(--pill-border, var(--card-border));
    padding: 0.28rem 0.58rem;
    font-size: 0.72rem;
    font-weight: 700;
    white-space: nowrap;
    background: var(--surface-soft, var(--surface));
    color: var(--text-main, var(--bs-body-color));
}

.attendance-session-teacher-state--pending {
    background: color-mix(in srgb, var(--bs-warning) 20%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-warning) 42%, var(--card-border, var(--bs-border-color)));
}

.attendance-session-teacher-state--approved {
    background: color-mix(in srgb, var(--bs-success) 18%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-success) 42%, var(--card-border, var(--bs-border-color)));
}

.attendance-session-teacher-state--declined {
    background: color-mix(in srgb, var(--bs-danger) 16%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-danger) 42%, var(--card-border, var(--bs-border-color)));
}

.attendance-session-selected {
    display: grid;
    grid-template-columns: minmax(220px, 0.7fr) minmax(0, 1.3fr);
    gap: 1rem;
    margin-top: 1.25rem;
    padding: 1rem;
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 1rem;
    background: var(--surface-soft, var(--surface));
}

.attendance-session-selected--panel {
    grid-template-columns: 1fr;
    gap: 0;
    margin-top: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.attendance-session-selected__label {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.attendance-session-selected__header {
    margin-bottom: 0.9rem;
}

.attendance-session-selected__list {
    display: grid;
    gap: 0.75rem;
}

.attendance-session-selected__item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0.72rem 0.85rem;
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
}

.attendance-session-drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1050;
    background: color-mix(in srgb, var(--text-main, var(--bs-body-color)) 28%, transparent);
}

.attendance-session-drawer {
    position: fixed;
    inset: 0 0 0 auto;
    z-index: 1051;
    display: flex;
    flex-direction: column;
    width: min(34rem, calc(100vw - 1.5rem));
    max-width: 100%;
    background: var(--surface, var(--bs-body-bg));
    border-left: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, none);
    transform: translateX(100%);
    transition: transform 0.2s ease;
}

.attendance-session-drawer.is-open {
    transform: translateX(0);
}

.attendance-session-drawer__header,
.attendance-session-drawer__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.1rem;
    border-bottom: 1px solid var(--table-border, var(--card-border));
}

.attendance-session-drawer__footer {
    border-top: 1px solid var(--table-border, var(--card-border));
    border-bottom: 0;
}

.attendance-session-drawer__body {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    padding: 1rem 1.1rem;
}

.attendance-session-empty {
    padding: 1.5rem;
    border: 1px dashed var(--table-border, var(--card-border));
    border-radius: 1rem;
    background: var(--surface-soft, var(--surface));
    text-align: center;
}

.attendance-session-empty--compact {
    padding: 1rem;
    margin-top: 1rem;
}

.attendance-session-summary-bar--panel {
    margin-bottom: 1rem;
}

.attendance-session-form-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.85fr);
    gap: 1.25rem;
    align-items: start;
}

.attendance-session-guidance-list {
    display: grid;
    gap: 0.85rem;
    margin-top: 1rem;
}

.attendance-session-guidance-item {
    padding: 0.95rem 1rem;
    border: 1px solid var(--table-border, var(--card-border));
    border-radius: 1rem;
    background: var(--surface-soft, var(--surface));
}

@media (max-width: 1199.98px) {
    .attendance-session-form-layout,
    .attendance-session-selected,
    .attendance-session-context,
    .attendance-session-control-layout,
    .attendance-session-teacher-layout,
    .attendance-session-teacher-overview,
    .attendance-session-session-info {
        grid-template-columns: 1fr;
    }

    .attendance-session-session-info__row {
        display: grid;
        gap: 0.25rem;
    }
}

@media (max-width: 991.98px) {
    .attendance-session-teacher-grid,
    .attendance-session-detail-grid {
        grid-template-columns: 1fr;
    }

    .attendance-session-selected__item,
    .attendance-session-teacher-card__body {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 575.98px) {
    .attendance-session-hero__body,
    .attendance-session-panel__header,
    .attendance-session-panel__body {
        padding: 1rem;
    }

    .attendance-session-metric {
        flex-basis: 100%;
    }

    .attendance-session-quick-actions--header {
        justify-content: flex-start;
    }

    .attendance-session-teacher-status-strip,
    .attendance-session-teacher-form__footer {
        justify-content: flex-start;
    }

    .attendance-session-teacher-form__footer .btn {
        width: 100%;
    }

    .attendance-session-summary-chip {
        min-width: 0;
    }
}


/* ===== Teacher confirmation monitor ===== */
.confirmation-page {
    display: flex;
    flex-direction: column;
}

.confirmation-surface,
.confirmation-section {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    border-radius: 1.25rem;
}

.confirmation-hero {
    overflow: hidden;
}

.confirmation-hero-accent {
    height: 0.5rem;
    background: linear-gradient(
        90deg,
        color-mix(in srgb, var(--primary, var(--bs-primary)) 84%, var(--surface, var(--bs-body-bg)) 16%) 0%,
        color-mix(in srgb, var(--bs-info) 68%, var(--primary, var(--bs-primary)) 32%) 50%,
        color-mix(in srgb, var(--bs-danger) 58%, var(--primary, var(--bs-primary)) 42%) 100%
    );
}

.confirmation-hero-body {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem;
}

.confirmation-hero-title,
.confirmation-date-heading,
.confirmation-teacher-cell,
.confirmation-row-actions,
.confirmation-drawer-teacher,
.confirmation-drawer-meta > div,
.confirmation-response-info-row {
    display: flex;
    align-items: center;
}

.confirmation-hero-title {
    gap: 1rem;
}

.confirmation-page-icon,
.confirmation-metric-icon,
.confirmation-date-icon,
.confirmation-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.confirmation-page-icon {
    width: 3.1rem;
    height: 3.1rem;
    border-radius: 1rem;
    background: color-mix(in srgb, var(--primary, var(--bs-primary)) 12%, var(--surface, var(--bs-body-bg)) 88%);
    border: 1px solid color-mix(in srgb, var(--primary, var(--bs-primary)) 22%, var(--card-border, var(--bs-border-color)) 78%);
}

.confirmation-page-icon img {
    width: 1.8rem;
    height: 1.8rem;
}

.confirmation-kicker,
.confirmation-section-kicker,
.confirmation-date-kicker {
    color: var(--primary, var(--bs-primary));
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.confirmation-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.75rem, 2.2vw, 2.25rem);
    font-weight: 700;
    letter-spacing: -0.03em;
}

.confirmation-subtitle,
.confirmation-section-subtitle,
.confirmation-filter-copy,
.confirmation-row-note {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.confirmation-actions,
.confirmation-filter-top,
.confirmation-filter-buttons,
.confirmation-quickfilters,
.confirmation-section-header,
.confirmation-section-badges,
.confirmation-date-header,
.confirmation-date-badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.confirmation-metrics-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.confirmation-metric-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.85rem;
    padding: 1rem 1.1rem;
    position: relative;
    overflow: hidden;
    color: inherit;
    text-decoration: none;
    transition: border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.confirmation-metric-card:hover,
.confirmation-metric-card:focus-visible,
.confirmation-metric-card.is-active {
    border-color: color-mix(in srgb, var(--confirmation-status-color, var(--primary, var(--bs-primary))) 44%, var(--card-border, var(--bs-border-color)) 56%);
    box-shadow: var(--card-shadow-hover, 0 18px 36px rgba(0, 0, 0, 0.12));
    transform: translateY(-1px);
}

.confirmation-metric-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.35rem;
    background: var(--confirmation-status-color, var(--primary, var(--bs-primary)));
}

.confirmation-metric-card--pending { --confirmation-status-color: var(--bs-warning); }
.confirmation-metric-card--approved { --confirmation-status-color: var(--bs-success); }
.confirmation-metric-card--declined { --confirmation-status-color: var(--bs-danger); }

.confirmation-metric-icon {
    width: 2.25rem;
    height: 2.25rem;
    margin-left: 0.2rem;
    border-radius: 999px;
    color: var(--confirmation-status-color, var(--primary, var(--bs-primary)));
    background: color-mix(in srgb, var(--confirmation-status-color, var(--primary, var(--bs-primary))) 14%, var(--surface, var(--bs-body-bg)) 86%);
}

.confirmation-metric-copy {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

.confirmation-metric-label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.confirmation-metric-helper {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.82rem;
}

.confirmation-metric-value {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.55rem;
    font-weight: 700;
}

.confirmation-filter {
    padding: 1.25rem;
}

.confirmation-filter-top {
    justify-content: space-between;
    margin-bottom: 1rem;
}

.confirmation-filter-summary {
    display: inline-flex;
    align-items: baseline;
    gap: 0.45rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.confirmation-filter-count {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.3rem;
    font-weight: 700;
}

.confirmation-filter-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
    align-items: end;
}

.confirmation-filter-field {
    display: grid;
    gap: 0.35rem;
}

.confirmation-control {
    background-color: var(--input-bg, var(--surface, var(--bs-body-bg))) !important;
    color: var(--text-main, var(--bs-body-color)) !important;
    border-color: var(--input-border, var(--border-color, var(--bs-border-color))) !important;
    border-radius: 0.85rem !important;
    min-height: 2.75rem;
}

.confirmation-filter-buttons {
    justify-content: flex-end;
}

.confirmation-quickfilters {
    margin-top: 1rem;
}

.confirmation-section {
    overflow: hidden;
}

.confirmation-section-header {
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: transparent;
}

.confirmation-section-title,
.confirmation-date-title,
.confirmation-class-title {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
}

.confirmation-section-title {
    font-size: 1.06rem;
}

.confirmation-section-subtitle {
    font-size: 0.86rem;
    margin-top: 0.2rem;
}

.confirmation-section-body {
    padding: 0;
}

.confirmation-group-list {
    display: grid;
    gap: 1rem;
    padding: 1rem;
}

.confirmation-date-group {
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    overflow: hidden;
    background: var(--surface-strong, var(--surface, var(--bs-body-bg)));
}

.confirmation-date-header {
    justify-content: space-between;
    padding: 1rem 1.1rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface, var(--bs-body-bg));
}

.confirmation-date-heading {
    gap: 0.75rem;
    min-width: 0;
}

.confirmation-date-title {
    font-size: 1.02rem;
    letter-spacing: -0.01em;
}

.confirmation-date-summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem 0.75rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.9rem;
    margin-top: 0.25rem;
}

.confirmation-date-summary span {
    display: inline-flex;
    align-items: center;
    gap: 0.32rem;
}

.confirmation-date-summary .bi {
    color: var(--primary, var(--bs-primary));
    font-size: 0.95rem;
    line-height: 1;
}

.confirmation-date-icon {
    width: 2rem;
    height: 2rem;
    border-radius: 0.75rem;
    color: var(--primary, var(--bs-primary));
    background: color-mix(in srgb, var(--primary, var(--bs-primary)) 12%, var(--surface, var(--bs-body-bg)) 88%);
}

.confirmation-bulk-form {
    margin: 0;
}

.confirmation-record-table {
    min-width: 880px;
    --bs-table-hover-bg: transparent;
    --bs-table-bg-state: transparent;
}

.confirmation-record-table th,
.confirmation-record-table td {
    vertical-align: middle;
    padding: 0.48rem 0.75rem;
}

.confirmation-record-table thead th {
    font-size: 0.78rem;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.confirmation-record-table tbody td {
    position: relative;
    font-size: 0.86rem;
    line-height: 1.25;
    background: var(--confirmation-row-bg, var(--surface-strong, var(--surface, var(--bs-body-bg)))) !important;
    box-shadow: none !important;
}

.confirmation-record-table tbody tr.confirmation-row {
    --confirmation-row-accent: var(--primary, var(--bs-primary));
    --confirmation-row-bg: var(--surface-strong, var(--surface, var(--bs-body-bg)));
    cursor: pointer;
}

.confirmation-record-table tbody tr.confirmation-row:hover,
.confirmation-record-table tbody tr.confirmation-row:focus-visible {
    --confirmation-row-bg: var(--table-row-hover, var(--surface-soft, var(--surface, var(--bs-body-bg))));
}

.confirmation-record-table tbody tr.confirmation-row:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--confirmation-row-accent) 64%, var(--surface, var(--bs-body-bg)) 36%);
    outline-offset: -2px;
}

.confirmation-row--pending > td {
    border-color: var(--table-border, var(--border-color, var(--bs-border-color))) !important;
}

.confirmation-row--approved > td:first-child,
.confirmation-row--declined > td:first-child,
.confirmation-row--pending > td:first-child {
    box-shadow: none !important;
}

.confirmation-row--approved > td:first-child::before,
.confirmation-row--declined > td:first-child::before,
.confirmation-row--pending > td:first-child::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.22rem;
    background: var(--confirmation-row-accent);
}

.confirmation-class-program {
    color: var(--confirmation-row-accent, var(--primary, var(--bs-primary)));
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.confirmation-class-title {
    color: var(--confirmation-row-accent, var(--text-main, var(--bs-body-color)));
    font-size: 0.9rem;
    line-height: 1.2;
}

.confirmation-teacher-cell {
    gap: 0.45rem;
    font-weight: 600;
    color: var(--text-main, var(--bs-body-color));
}

.confirmation-avatar {
    width: 1.65rem;
    height: 1.65rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary, var(--bs-primary)) 14%, var(--surface, var(--bs-body-bg)) 86%);
    color: var(--primary, var(--bs-primary));
    border: 1px solid color-mix(in srgb, var(--primary, var(--bs-primary)) 22%, var(--card-border, var(--bs-border-color)) 78%);
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.confirmation-row-actions {
    justify-content: flex-end;
    gap: 0.3rem;
    flex-wrap: wrap;
}

.confirmation-inline-action {
    margin: 0;
}

.confirmation-row-actions .btn {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-weight: 500;
    padding-block: 0.25rem;
    min-height: 1.95rem;
    white-space: nowrap;
}

.confirmation-record-table .assignment-pill {
    gap: 0.3rem;
    min-height: 1.7rem;
    padding: 0.2rem 0.55rem;
    font-size: 0.75rem;
    line-height: 1;
}

.confirmation-row-note,
.confirmation-note-cell {
    max-width: 240px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.confirmation-empty-state,
.confirmation-record-table .theme-empty {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.confirmation-empty-state {
    margin: 1rem;
    border: 1px dashed var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    padding: 1.5rem;
    text-align: center;
}

.confirmation-drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1050;
    background: color-mix(in srgb, var(--text-main, var(--bs-body-color)) 28%, transparent);
}

.confirmation-drawer {
    position: fixed;
    inset: 0 0 0 auto;
    z-index: 1051;
    display: flex;
    flex-direction: column;
    width: min(440px, 100vw);
    max-width: 100%;
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border-left: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: -18px 0 40px rgba(0, 0, 0, 0.18);
    transform: translateX(100%);
    transition: transform 0.2s ease;
}

.confirmation-drawer.is-open {
    transform: translateX(0);
}

.confirmation-drawer-header,
.confirmation-drawer-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.15rem 1.25rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.confirmation-drawer-footer {
    justify-content: flex-end;
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-bottom: 0;
    padding-inline: 0;
    padding-bottom: 0;
}

.confirmation-drawer-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.2rem;
    font-weight: 700;
}

.confirmation-drawer-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.35rem;
    height: 2.35rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 999px;
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
}

.confirmation-drawer-body {
    display: grid;
    gap: 1.1rem;
    overflow-y: auto;
    padding: 1.25rem;
}

.confirmation-drawer-teacher {
    gap: 0.75rem;
    padding: 1rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface-strong, var(--surface, var(--bs-body-bg)));
}

.confirmation-drawer-teacher .confirmation-avatar {
    width: 2.55rem;
    height: 2.55rem;
}

.confirmation-drawer-name {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1rem;
    font-weight: 700;
}

.confirmation-drawer-context,
.confirmation-drawer-meta,
.confirmation-response-info-row {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.9rem;
}

.confirmation-drawer-meta,
.confirmation-response-form,
.confirmation-response-options,
.confirmation-response-note-field,
.confirmation-response-info {
    display: grid;
    gap: 0.75rem;
}

.confirmation-drawer-meta > div,
.confirmation-response-info-row {
    gap: 0.55rem;
}

.confirmation-drawer-meta .bi,
.confirmation-response-info-row .bi {
    color: var(--primary, var(--bs-primary));
}

.confirmation-response-options {
    margin: 0;
    padding: 1rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
}

.confirmation-response-options legend {
    float: none;
    width: auto;
    margin-bottom: 0.5rem;
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.9rem;
    font-weight: 700;
}

.confirmation-response-option {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 2rem;
    color: var(--text-main, var(--bs-body-color));
}

.confirmation-response-info {
    padding: 0.85rem;
    border: 1px dashed var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.9rem;
}

@media (max-width: 1399.98px) {
    .confirmation-filter-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .confirmation-metrics-grid {
        grid-template-columns: 1fr;
    }

    .confirmation-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .confirmation-filter-buttons {
        justify-content: stretch;
    }

    .confirmation-filter-buttons .btn {
        flex: 1 1 0;
    }

    .confirmation-record-table {
        min-width: 920px;
    }
}

@media (max-width: 575.98px) {
    .confirmation-hero-body,
    .confirmation-filter,
    .confirmation-section-header,
    .confirmation-group-list {
        padding: 1rem;
    }

    .confirmation-filter-grid {
        grid-template-columns: 1fr;
    }

    .confirmation-date-header {
        align-items: stretch;
    }

    .confirmation-bulk-form .btn,
    .confirmation-drawer-footer .btn {
        width: 100%;
        justify-content: center;
    }

    .confirmation-drawer-footer {
        flex-direction: column-reverse;
    }
}


/* Settings additions stay scoped to the opt-in Settings workspace. */
.giso-organization-logo {
    display: block;
    max-width: 100%;
    width: 7rem;
    height: 7rem;
    object-fit: contain;
}

.giso-settings-page input[type="file"]::file-selector-button {
    background: var(--surface-soft) !important;
    color: var(--text-main);
    border-color: var(--input-border);
}

html[data-theme="dark"] .giso-settings-page .theme-action-primary {
    color: var(--input-bg) !important;
}

/* ===== Users & Access themed layout ===== */
.user-access-page {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.user-access-surface,
.user-access-panel,
.user-access-metric,
.user-access-form-panel,
.user-access-list-card,
.user-access-stat-card {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    border-radius: 1.25rem;
}

.user-access-hero {
    overflow: hidden;
}

.user-access-hero__accent {
    height: 0.5rem;
    background: linear-gradient(90deg, var(--primary, var(--bs-primary)), var(--bs-info), var(--bs-success), var(--bs-warning));
}

.user-access-hero__body {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem;
}

.user-access-kicker,
.user-access-section-kicker {
    color: var(--primary, var(--bs-primary));
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.user-access-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.7rem, 2.1vw, 2.25rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    margin: 0;
}

.user-access-subtitle,
.user-access-muted,
.user-access-meta,
.user-access-list-meta,
.user-access-table-note,
.user-access-empty {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.user-access-actions,
.user-access-stat-list,
.user-access-badge-row,
.user-access-toolbar,
.user-access-filter-actions,
.user-access-form-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.user-access-panel__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.85rem;
    flex-wrap: wrap;
    padding: 1.1rem 1.25rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface-muted, var(--surface-soft, var(--surface, var(--bs-body-bg))));
    border-radius: 1.25rem 1.25rem 0 0;
}

.user-access-panel__header--plain {
    background: var(--surface, var(--bs-body-bg));
}

.user-access-panel__body {
    padding: 1.25rem;
}

.user-access-metric-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.user-access-metric {
    padding: 1rem 1.1rem;
    position: relative;
    overflow: hidden;
}

.user-access-metric::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.32rem;
    background: var(--primary, var(--bs-primary));
}

.user-access-metric--info::before { background: var(--bs-info); }
.user-access-metric--success::before { background: var(--bs-success); }
.user-access-metric--warning::before { background: var(--bs-warning); }
.user-access-metric--danger::before { background: var(--bs-danger); }

.user-access-metric__label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.user-access-metric__value {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.55rem;
    font-weight: 700;
    margin-top: 0.35rem;
}

.user-access-table-wrap {
    overflow-x: auto;
}

.user-access-table {
    min-width: 980px;
    margin: 0;
}

.user-access-table thead th {
    background: var(--table-head-bg, var(--surface-soft));
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding: 0.9rem 1rem;
    border-bottom-color: var(--table-border, var(--border-color, var(--bs-border-color)));
    white-space: nowrap;
}

.user-access-table tbody td {
    padding: 1rem;
    border-top-color: var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface, var(--bs-body-bg));
    vertical-align: middle;
}

.user-access-table tbody tr:hover td {
    background: var(--table-row-hover, var(--surface-soft));
}

.user-access-directory-wrap {
    overflow-x: auto;
}

.user-access-directory-table {
    min-width: 760px;
    table-layout: fixed;
}

.user-access-directory-table th,
.user-access-directory-table td {
    border-color: var(--table-border, var(--border-color, var(--bs-border-color)));
}

.user-access-directory-table th {
    font-size: 0.64rem;
    letter-spacing: 0.08em;
    line-height: 1.1;
}

.user-access-directory-table th:nth-child(1),
.user-access-directory-table td:nth-child(1) {
    width: 7%;
}

.user-access-directory-table th:nth-child(2),
.user-access-directory-table td:nth-child(2) {
    width: 23%;
}

.user-access-directory-table th:nth-child(3),
.user-access-directory-table td:nth-child(3) {
    width: 21%;
}

.user-access-directory-table th:nth-child(4),
.user-access-directory-table td:nth-child(4) {
    width: 16%;
}

.user-access-directory-table th:nth-child(5),
.user-access-directory-table td:nth-child(5) {
    width: 12%;
}

.user-access-directory-table th:nth-child(6),
.user-access-directory-table td:nth-child(6) {
    width: 17%;
}

.user-access-directory-table th:nth-child(7),
.user-access-directory-table td:nth-child(7) {
    width: 4%;
}

.user-access-directory-table tbody td {
    padding: 0;
    background: var(--surface, var(--bs-body-bg));
    vertical-align: middle;
}

.user-access-directory-table tbody tr:hover td {
    background: var(--table-row-hover, var(--surface-soft));
}

.user-access-directory__head .theme-table-sort-button {
    min-height: 1.9rem;
    padding: 0.4rem 0.72rem;
}

.user-access-directory__head th[data-sortable="false"] {
    padding: 0.4rem 0.72rem !important;
}

.user-access-directory__cell,
.user-access-directory__status,
.user-access-directory__chevron {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 2.8rem;
    padding: 0.48rem 0.72rem;
    color: var(--text-main, var(--bs-body-color));
    text-decoration: none;
}

.user-access-directory__status {
    justify-content: center;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 1.05rem;
    line-height: 1;
}

.user-access-directory__status .bi {
    line-height: 1;
}

.user-access-directory__status--unlocked,
.user-access-directory__status--unlocked .bi {
    color: var(--bs-success) !important;
}

.user-access-directory__status--locked,
.user-access-directory__status--locked .bi {
    color: var(--bs-warning) !important;
}

.user-access-directory__status--inactive,
.user-access-directory__status--inactive .bi {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color))) !important;
}

.user-access-directory__status-cell,
.user-access-directory__status-heading {
    text-align: center;
}

.user-access-directory__cell {
    min-width: 0;
    overflow-wrap: anywhere;
    font-size: 0.72rem;
    line-height: 1.22;
}

.user-access-directory__cell:hover,
.user-access-directory__cell:focus,
.user-access-directory__status:hover,
.user-access-directory__status:focus,
.user-access-directory__chevron:hover,
.user-access-directory__chevron:focus {
    color: var(--text-main, var(--bs-body-color));
    text-decoration: none;
}

.user-access-directory__cell:focus-visible,
.user-access-directory__status:focus-visible,
.user-access-directory__chevron:focus-visible {
    outline: 2px solid var(--primary, var(--bs-primary));
    outline-offset: -2px;
    background: var(--table-row-hover, var(--surface-soft));
}

.user-access-directory__name {
    font-size: 0.75rem;
    font-weight: 600;
}

.user-access-directory__username,
.user-access-directory__last-active {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.68rem;
}

.user-access-directory__role {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.user-access-directory__chevron,
.user-access-directory__chevron-heading {
    justify-content: flex-end;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.user-access-directory__chevron {
    font-size: 0.85rem;
    padding-right: 0.85rem;
}

.user-access-directory__chevron-cell {
    text-align: right;
}

.user-access-directory__empty {
    padding: 2rem 1rem;
    text-align: center;
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.user-access-primary {
    display: grid;
    gap: 0.18rem;
}

.user-access-name {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
}

.user-access-meta {
    font-size: 0.84rem;
}

.user-access-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    min-height: 1.85rem;
    padding: 0.28rem 0.7rem;
    border-radius: 999px;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    background: var(--pill-bg, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.74rem;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}

.user-access-pill--compact {
    min-height: 1.45rem;
    padding: 0.16rem 0.48rem;
    font-size: 0.64rem;
    line-height: 1;
}

.user-access-pill--success {
    background: color-mix(in srgb, var(--bs-success) 16%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-success) 36%, var(--card-border, var(--bs-border-color)));
}

.user-access-pill--muted {
    background: var(--surface-soft, var(--surface));
    border-color: var(--table-border, var(--border-color, var(--bs-border-color)));
}

.user-access-pill--warning {
    background: color-mix(in srgb, var(--bs-warning) 18%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-warning) 42%, var(--card-border, var(--bs-border-color)));
}

.user-access-pill--danger {
    background: color-mix(in srgb, var(--bs-danger) 14%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-danger) 40%, var(--card-border, var(--bs-border-color)));
}

.user-access-pill--info {
    background: color-mix(in srgb, var(--bs-info) 14%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-info) 36%, var(--card-border, var(--bs-border-color)));
}

.user-access-pill--light {
    background: var(--surface-soft, var(--surface));
}

.user-access-grid-two {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.user-access-list-card {
    overflow: hidden;
}

.user-access-list-card__header {
    padding: 1rem 1.15rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface-muted, var(--surface-soft, var(--surface)));
}

.user-access-list-card__header--plain {
    background: var(--surface, var(--bs-body-bg));
}

.user-access-list-card__title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.02rem;
    font-weight: 700;
    margin: 0;
}

.user-access-list {
    display: grid;
    gap: 0;
}

.user-access-list__item {
    padding: 0.95rem 1.15rem;
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.user-access-list__item:first-child {
    border-top: 0;
}

.user-access-list__item:hover {
    background: var(--table-row-hover, var(--surface-soft));
}

.user-access-filter-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 1rem;
    align-items: end;
}

.user-access-filter-field {
    display: grid;
    gap: 0.35rem;
}

.user-access-control {
    background-color: var(--input-bg, var(--surface, var(--bs-body-bg))) !important;
    color: var(--text-main, var(--bs-body-color)) !important;
    border-color: var(--input-border, var(--border-color, var(--bs-border-color))) !important;
    border-radius: 0.85rem !important;
    min-height: 2.75rem;
}

.user-access-form-layout {
    display: grid;
    grid-template-columns: minmax(300px, 0.9fr) minmax(0, 1.3fr);
    gap: 1rem;
    align-items: start;
}

.user-access-edit-page {
    padding-bottom: 0.75rem;
}

.user-access-edit-header {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(220px, auto) minmax(280px, auto);
    gap: 1rem;
    align-items: center;
    padding: 1.15rem 1.2rem;
}

.user-access-edit-header__identity {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 0.85rem;
}

.user-access-edit-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 3rem;
    height: 3rem;
    border-radius: 999px;
    background: var(--surface-soft, var(--surface));
    color: var(--primary, var(--bs-primary));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.user-access-edit-header__main {
    min-width: 0;
}

.user-access-edit-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.45rem, 1.95vw, 1.95rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.12;
    margin: 0;
}

.user-access-edit-header__meta {
    display: grid;
    gap: 0.65rem;
}

.user-access-edit-meta-item {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    min-width: 0;
}

.user-access-edit-meta-item > .bi {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 1.9rem;
    height: 1.9rem;
    border-radius: 999px;
    background: var(--surface-soft, var(--surface));
    color: var(--primary, var(--bs-primary));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    font-size: 0.88rem;
}

.user-access-edit-meta-label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.1;
    text-transform: uppercase;
}

.user-access-edit-meta-value {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.84rem;
    font-weight: 600;
    line-height: 1.25;
}

.user-access-edit-header__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 0.45rem;
}

.user-access-edit-header__actions .btn,
.user-access-edit-actions .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    font-weight: 500;
}

.user-access-overflow-button {
    width: 2.45rem;
    padding-right: 0;
    padding-left: 0;
}

.user-access-overflow-button .bi,
.user-access-edit-header__actions .btn .bi,
.user-access-edit-actions .bi,
.user-access-pill .bi {
    line-height: 1;
}

.user-access-edit-top-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
    gap: 1rem;
    align-items: stretch;
}

.user-access-edit-card {
    min-width: 0;
}

.user-access-edit-field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.95rem;
    align-items: start;
}

.user-access-edit-field {
    min-width: 0;
}

.user-access-edit-status-display {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    min-height: 2.75rem;
    gap: 0.45rem;
}

.user-access-form-panel {
    overflow: hidden;
}

.user-access-form-panel__header {
    padding: 1rem 1.15rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface-muted, var(--surface-soft, var(--surface)));
}

.user-access-form-panel__header--neutral {
    background: var(--surface, var(--bs-body-bg));
}

.user-access-form-panel__body {
    padding: 1.15rem;
}

.user-access-field-stack {
    display: grid;
    gap: 1rem;
}

.user-access-notice {
    padding: 0.9rem 1rem;
    border-radius: 1rem;
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface-soft, var(--surface));
    color: var(--text-main, var(--bs-body-color));
}

.user-access-notice--warning {
    background: color-mix(in srgb, var(--bs-warning) 14%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-warning) 36%, var(--card-border, var(--bs-border-color)));
}

.user-access-notice--info {
    background: color-mix(in srgb, var(--bs-info) 12%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-info) 34%, var(--card-border, var(--bs-border-color)));
}

.user-access-notice--danger {
    background: color-mix(in srgb, var(--bs-danger) 12%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-danger) 36%, var(--card-border, var(--bs-border-color)));
}

.user-access-notice--muted {
    background: var(--surface-soft, var(--surface));
}

.user-access-matrix-table,
.user-access-audit-table {
    margin: 0;
}

.user-access-edit-matrix-card {
    margin-top: 1rem;
}

.user-access-panel-subtitle,
.user-access-matrix-help {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.user-access-panel-subtitle {
    margin-top: 0.25rem;
    font-size: 0.82rem;
    line-height: 1.35;
}

.user-access-matrix-help {
    margin: 0 0 0.85rem;
    font-size: 0.84rem;
    line-height: 1.45;
}

.user-access-matrix-wrap {
    max-height: min(68vh, 46rem);
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.95rem;
}

.user-access-matrix-table thead th,
.user-access-audit-table thead th {
    background: var(--table-head-bg, var(--surface-soft));
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    white-space: nowrap;
}

.user-access-matrix-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
}

.user-access-matrix-table td,
.user-access-matrix-table th,
.user-access-audit-table td,
.user-access-audit-table th {
    padding: 0.62rem 0.8rem;
    border-color: var(--table-border, var(--border-color, var(--bs-border-color)));
    vertical-align: middle;
}

.user-access-matrix-table td:first-child,
.user-access-matrix-table th:first-child {
    position: sticky;
    left: 0;
    z-index: 1;
    background: var(--surface, var(--bs-body-bg));
}

.user-access-matrix-table thead th:first-child {
    z-index: 3;
    background: var(--table-head-bg, var(--surface-soft));
}

.user-access-matrix-table tbody tr:hover td {
    background: var(--table-row-hover, var(--surface-soft));
}

.user-access-matrix-table tbody tr:hover td:first-child {
    background: var(--table-row-hover, var(--surface-soft));
}

.user-access-matrix-module {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
    min-width: 11rem;
}

.user-access-matrix-module__content {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-width: 0;
}

.user-access-matrix-module__content .bi {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.65rem;
    height: 1.65rem;
    flex: 0 0 auto;
    border-radius: 999px;
    background: var(--surface-soft, var(--surface));
    color: var(--primary, var(--bs-primary));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    font-size: 0.82rem;
}

.user-access-matrix-check {
    min-width: 5.25rem;
}

.user-access-matrix-check .form-check-input {
    float: none;
    margin: 0;
}

.user-access-edit-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem;
    padding: 0.85rem 1.15rem;
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface, var(--bs-body-bg));
}

.user-access-edit-actions__status,
.user-access-edit-actions__buttons {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.user-access-edit-actions__status {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.84rem;
    font-weight: 600;
}

.user-access-edit-actions__buttons {
    margin-left: auto;
}

.user-access-delete-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.user-access-stat-card {
    padding: 0.95rem 1rem;
}

.user-access-stat-card__label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.user-access-stat-card__value {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
    margin-top: 0.28rem;
}

@media (max-width: 1199.98px) {
    .user-access-edit-header {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .user-access-edit-header__actions {
        justify-content: flex-start;
    }

    .user-access-metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .user-access-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .user-access-grid-two,
    .user-access-form-layout,
    .user-access-edit-top-grid,
    .user-access-delete-grid {
        grid-template-columns: 1fr;
    }

    .user-access-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .user-access-hero__body,
    .user-access-edit-header,
    .user-access-panel__header,
    .user-access-panel__body,
    .user-access-form-panel__header,
    .user-access-form-panel__body,
    .user-access-list-card__header,
    .user-access-list__item {
        padding: 1rem;
    }

    .user-access-metric-grid,
    .user-access-filter-grid {
        grid-template-columns: 1fr;
    }

    .user-access-directory-table {
        min-width: 680px;
    }

    .user-access-edit-field-grid,
    .user-access-edit-actions {
        grid-template-columns: 1fr;
    }

    .user-access-edit-field-grid {
        display: grid;
    }

    .user-access-edit-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .user-access-edit-actions__buttons {
        justify-content: stretch;
    }

    .user-access-edit-actions__buttons .btn {
        flex: 1 1 0;
    }
}

/* ===== Group detail themed workspace ===== */
.group-workspace-page {
    --group-accent: color-mix(in srgb, var(--primary, var(--bs-primary)) 88%, #0f766e 12%);
    --group-accent-deep: color-mix(in srgb, var(--primary, var(--bs-primary)) 82%, #083344 18%);
    --group-ink: var(--text-main, var(--text, var(--bs-body-color)));
}

.group-workspace-shell,
.group-workspace-card {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(9, 124, 135, 0.10));
    border-radius: 1.25rem;
}

.group-workspace-hero {
    overflow: hidden;
}

.group-workspace-hero-accent {
    height: 0.5rem;
    background: linear-gradient(90deg, var(--primary, var(--bs-primary)), var(--bs-info), var(--bs-danger), var(--bs-warning));
}

.group-workspace-hero-body {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem;
}

.group-workspace-identity-block {
    min-width: 0;
}

.group-workspace-metric__label,
.group-workspace-info-label {
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.group-workspace-title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.group-workspace-title {
    font-size: clamp(1.75rem, 2.4vw, 2.45rem);
    font-weight: 700;
    line-height: 1.1;
    color: var(--group-ink);
    letter-spacing: -0.035em;
}

.group-workspace-subtitle,
.group-workspace-context-line,
.group-workspace-actions {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.group-workspace-subtitle,
.group-workspace-card__subtitle,
.group-workspace-role-meta,
.group-workspace-empty,
.group-workspace-metric__hint,
.group-workspace-person__meta {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.group-workspace-subtitle {
    margin-top: 0.45rem;
    font-size: 0.92rem;
}

.group-workspace-context-line {
    margin-top: 0.65rem;
    font-size: 0.92rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.group-workspace-context-label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-weight: 500;
}

.group-workspace-context-divider {
    color: var(--text-soft, var(--muted, var(--bs-secondary-color)));
}

.group-workspace-metric,
.group-workspace-info-row,
.group-workspace-role-item {
    border: 1px solid color-mix(in srgb, var(--group-accent) 14%, var(--border-color, var(--bs-border-color)));
    background: color-mix(in srgb, var(--surface, var(--bs-body-bg)) 92%, transparent);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--group-accent) 7%, transparent);
}

.group-workspace-metric__label,
.group-workspace-info-label {
    color: var(--text-soft, var(--muted, var(--bs-secondary-color)));
    margin-bottom: 0.35rem;
}

.group-workspace-metric__value,
.group-workspace-card__title,
.group-workspace-role-name,
.group-workspace-info-value {
    color: var(--group-ink);
}

.group-workspace-role-name {
    font-weight: 700;
}

.group-workspace-actions {
    justify-content: flex-end;
}

.group-workspace-metric {
    border-radius: 1.35rem;
    padding: 1.15rem 1.2rem;
    height: 100%;
}

.group-workspace-metric__value {
    font-size: 2rem;
    line-height: 1;
    font-weight: 700;
    margin-bottom: 0.35rem;
}

.group-workspace-card {
    padding: 1.35rem;
}

.group-workspace-card__header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.1rem;
}

.group-workspace-card__title {
    font-size: 1.15rem;
    font-weight: 700;
    margin-bottom: 0.2rem;
}

.group-workspace-card__subtitle {
    font-size: 0.92rem;
    margin-bottom: 0;
}

.group-workspace-info-list,
.group-workspace-role-list {
    display: grid;
    gap: 0.8rem;
}

.group-workspace-info-row {
    border-radius: 1rem;
    padding: 0.9rem 1rem;
}

.group-workspace-info-value {
    font-weight: 600;
}

.group-workspace-description {
    line-height: 1.65;
    color: var(--text-main, var(--text, var(--bs-body-color)));
    white-space: pre-line;
}

.group-workspace-role-item {
    border-radius: 1rem;
    padding: 0.95rem 1rem;
}

.group-workspace-role-top {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
}

.group-workspace-role-meta {
    font-size: 0.88rem;
    margin-top: 0.25rem;
}

.group-workspace-role-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    justify-content: flex-end;
}

.group-workspace-modal__dialog {
    max-width: 960px;
}

.group-workspace-modal__content {
    border-radius: 1.25rem;
    overflow: hidden;
}

.group-workspace-modal__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.1rem 1.25rem;
    border-bottom: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface, var(--bs-body-bg));
}

.group-workspace-modal__body {
    padding: 1.2rem 1.25rem 1.25rem;
    background: var(--surface, var(--bs-body-bg));
}

.group-workspace-table {
    --bs-table-bg: transparent;
    --bs-table-border-color: color-mix(in srgb, var(--group-accent) 12%, var(--border-color, var(--bs-border-color)));
}

.group-workspace-table tbody tr:hover {
    background: color-mix(in srgb, var(--surface-soft, var(--surface, var(--bs-body-bg))) 84%, var(--group-accent) 16%);
}

.group-workspace-person {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    min-width: 0;
}

.group-workspace-avatar {
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 0.95rem;
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--group-accent) 20%, var(--surface, var(--bs-body-bg))),
        color-mix(in srgb, var(--bs-warning, #f59e0b) 18%, var(--surface, var(--bs-body-bg)))
    );
    color: var(--group-accent-deep);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex: 0 0 auto;
    border: 1px solid color-mix(in srgb, var(--group-accent) 18%, var(--border-color, var(--bs-border-color)));
}
.group-workspace-avatar--image {
    display: block;
    border-radius: 999px;
    object-fit: cover;
}

.group-workspace-person__name {
    font-weight: 700;
}

.group-workspace-role-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 0.7rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--group-accent) 12%, var(--surface, var(--bs-body-bg)));
    color: var(--group-accent-deep);
    font-weight: 700;
    font-size: 0.82rem;
    border: 1px solid color-mix(in srgb, var(--group-accent) 18%, var(--border-color, var(--bs-border-color)));
}

.group-workspace-role-badge-list,
.group-workspace-note-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.group-workspace-note-list {
    flex-direction: column;
    gap: 0.55rem;
}

.group-workspace-note-item {
    min-width: 0;
}

.group-workspace-empty {
    border: 1px dashed color-mix(in srgb, var(--group-accent) 22%, var(--border-color, var(--bs-border-color)));
    border-radius: 1.2rem;
    padding: 2rem 1.25rem;
    text-align: center;
    background: color-mix(in srgb, var(--surface-soft, var(--surface, var(--bs-body-bg))) 72%, transparent);
}

.group-workspace-page .btn-primary,
.group-workspace-page .btn-primary.theme-action-primary {
    background-color: var(--primary, var(--bs-primary)) !important;
    border-color: var(--primary, var(--bs-primary)) !important;
    color: #fff !important;
}

.group-workspace-page .btn-primary:hover,
.group-workspace-page .btn-primary.theme-action-primary:hover {
    background-color: var(--primary-hover, var(--primary, var(--bs-primary))) !important;
    border-color: var(--primary-hover, var(--primary, var(--bs-primary))) !important;
}

.group-workspace-page .btn-outline-secondary,
.group-workspace-page .btn-outline-secondary.theme-action-outline {
    background: var(--btn-outline-neutral-bg, transparent) !important;
    border-color: var(--btn-outline-neutral-border, var(--border-color, var(--bs-border-color))) !important;
    color: var(--btn-outline-neutral-text, var(--text-main, var(--bs-body-color))) !important;
}

.group-workspace-page .btn-outline-secondary:hover,
.group-workspace-page .btn-outline-secondary.theme-action-outline:hover {
    background: var(--btn-outline-neutral-hover-bg, var(--surface-soft)) !important;
    color: var(--btn-outline-neutral-hover-text, var(--text-main, var(--bs-body-color))) !important;
}

.group-workspace-page .btn-outline-danger {
    background: transparent !important;
    border-color: color-mix(in srgb, var(--bs-danger) 45%, var(--border-color, var(--bs-border-color))) !important;
    color: var(--bs-danger) !important;
}

.group-workspace-page .btn-outline-danger:hover {
    background: color-mix(in srgb, var(--bs-danger) 16%, var(--surface, var(--bs-body-bg))) !important;
    color: var(--text-main, var(--bs-body-color)) !important;
}

@media (max-width: 991.98px) {
    .group-workspace-hero-body,
    .group-workspace-card {
        padding: 1rem;
    }

    .group-workspace-actions {
        justify-content: flex-start;
    }

    .group-workspace-modal__dialog {
        margin: 0.75rem;
    }

    .group-workspace-modal__header,
    .group-workspace-modal__body {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

/* ===== Groups module themed layout ===== */
.groups-theme-page,
.groups-form-page,
.groups-confirm-page {
    --groups-accent: color-mix(in srgb, var(--primary, var(--bs-primary)) 88%, #0f766e 12%);
    --groups-accent-deep: color-mix(in srgb, var(--primary, var(--bs-primary)) 82%, #083344 18%);
    color: var(--text-main, var(--bs-body-color));
}

.groups-theme-shell,
.groups-theme-card,
.groups-theme-filter,
.groups-theme-metric,
.groups-form-shell,
.groups-form-panel,
.groups-confirm-shell,
.groups-confirm-panel {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, 0 14px 30px rgba(9, 124, 135, 0.10));
    border-radius: 1.25rem;
}

.groups-theme-hero,
.groups-form-shell,
.groups-confirm-shell {
    overflow: hidden;
}

.groups-theme-hero-accent,
.groups-form-accent {
    height: 0.5rem;
    background: linear-gradient(90deg, var(--primary, var(--bs-primary)), var(--bs-info), var(--bs-danger), var(--bs-warning));
}

.groups-confirm-accent {
    height: 0.5rem;
    background: linear-gradient(90deg, var(--bs-danger), var(--bs-warning));
}

.groups-theme-hero-body,
.groups-form-shell-body,
.groups-confirm-shell-body {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem;
}

.groups-theme-identity,
.groups-form-identity,
.groups-confirm-identity {
    min-width: 0;
}

.groups-theme-label,
.groups-form-label,
.groups-confirm-label,
.groups-theme-stat-label,
.groups-theme-section-title,
.groups-form-panel-title,
.groups-confirm-panel-title {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.groups-theme-label,
.groups-form-label,
.groups-confirm-label,
.groups-theme-stat-label {
    color: var(--text-soft, var(--muted, var(--bs-secondary-color)));
}

.groups-theme-title,
.groups-form-title,
.groups-confirm-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.75rem, 2.4vw, 2.45rem);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.035em;
}

.groups-theme-subtitle,
.groups-theme-context,
.groups-form-subtitle,
.groups-form-context,
.groups-confirm-subtitle,
.groups-confirm-context,
.groups-theme-empty,
.groups-theme-hint,
.groups-form-help-copy,
.groups-confirm-copy,
.groups-confirm-blocker-meta {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.groups-theme-subtitle,
.groups-theme-context,
.groups-theme-actions,
.groups-form-context,
.groups-form-actions,
.groups-confirm-context,
.groups-confirm-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.groups-theme-subtitle,
.groups-form-subtitle,
.groups-confirm-subtitle {
    margin-top: 0.45rem;
    font-size: 0.94rem;
}

.groups-theme-context,
.groups-form-context,
.groups-confirm-context {
    margin-top: 0.65rem;
    font-size: 0.92rem;
}

.groups-theme-context-label,
.groups-form-context-label,
.groups-confirm-context-label {
    font-weight: 500;
}

.groups-theme-context-sep,
.groups-form-context-sep,
.groups-confirm-context-sep {
    color: var(--text-soft, var(--muted, var(--bs-secondary-color)));
}

.groups-theme-actions {
    justify-content: flex-end;
}

.groups-theme-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
}

.groups-theme-metric {
    padding: 1rem 1.1rem;
}

.groups-theme-stat-value {
    color: var(--text-main, var(--bs-body-color));
    font-size: 2rem;
    line-height: 1;
    font-weight: 700;
    margin-top: 0.35rem;
}

.groups-theme-hint {
    font-size: 0.88rem;
    margin-top: 0.3rem;
}

.groups-theme-filter {
    padding: 1.25rem;
}

.groups-theme-filter-grid {
    display: grid;
    grid-template-columns: minmax(0, 2.4fr) minmax(11rem, 1fr) auto;
    gap: 0.85rem;
    align-items: end;
}

.groups-theme-filter-actions {
    display: flex;
    gap: 0.65rem;
}

.groups-theme-card {
    padding: 1.35rem;
}

.groups-theme-card-header,
.groups-form-panel-header,
.groups-confirm-panel-header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.85rem;
    margin-bottom: 1rem;
}

.groups-theme-section-title,
.groups-form-panel-title,
.groups-confirm-panel-title {
    color: var(--text-main, var(--bs-body-color));
    margin-bottom: 0;
}

.groups-theme-card-subtitle,
.groups-form-panel-subtitle,
.groups-confirm-panel-subtitle {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.92rem;
    margin-top: 0.28rem;
    margin-bottom: 0;
}

.groups-theme-category-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.groups-theme-item-card,
.groups-theme-list-row,
.groups-confirm-blockers li {
    border: 1px solid color-mix(in srgb, var(--groups-accent) 14%, var(--border-color, var(--bs-border-color)));
    background: color-mix(in srgb, var(--surface, var(--bs-body-bg)) 94%, transparent);
    border-radius: 1rem;
}

.groups-theme-item-card {
    padding: 1rem;
    height: 100%;
}

.groups-theme-item-top,
.groups-theme-list-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.85rem;
}

.groups-theme-item-title {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
}

.groups-theme-item-meta,
.groups-theme-table-note,
.groups-form-field-note {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.88rem;
}

.groups-theme-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.85rem;
}

.groups-theme-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.8rem;
    padding: 0.35rem 0.7rem;
    border-radius: 999px;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    background: var(--pill-bg, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.8rem;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.groups-theme-chip:hover {
    background: var(--pill-bg-hover, var(--surface-soft));
    border-color: var(--pill-border-hover, var(--border-color, var(--bs-border-color)));
    color: var(--primary, var(--bs-primary));
}

.groups-theme-list {
    display: grid;
    gap: 0.75rem;
}

.groups-theme-list-row {
    padding: 0.95rem 1rem;
    text-decoration: none;
    color: inherit;
    transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

.groups-theme-list-row:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--groups-accent) 28%, var(--border-color, var(--bs-border-color)));
    background: color-mix(in srgb, var(--surface-soft, var(--surface, var(--bs-body-bg))) 88%, transparent);
    color: inherit;
}

.groups-theme-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.8rem;
    padding: 0.32rem 0.72rem;
    border-radius: 999px;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    background: var(--pill-bg, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.78rem;
    font-weight: 600;
}

.groups-theme-status--active {
    background: color-mix(in srgb, var(--bs-success) 28%, var(--surface, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
    border-color: color-mix(in srgb, var(--bs-success) 45%, var(--card-border, var(--bs-border-color)));
}

.groups-theme-status--inactive {
    background: var(--surface-muted, var(--surface-soft));
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.groups-theme-table-wrap {
    overflow: hidden;
    border-radius: 1rem;
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.groups-theme-table {
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--table-border, var(--border-color, var(--bs-border-color)));
}

.groups-theme-table tbody tr:hover {
    background: color-mix(in srgb, var(--surface-soft, var(--surface, var(--bs-body-bg))) 88%, transparent);
}

.groups-theme-table-person {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    min-width: 0;
}

.groups-theme-avatar {
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 0.85rem;
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--groups-accent) 20%, var(--surface, var(--bs-body-bg))),
        color-mix(in srgb, var(--bs-warning, #f59e0b) 18%, var(--surface, var(--bs-body-bg)))
    );
    color: var(--groups-accent-deep);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex: 0 0 auto;
    border: 1px solid color-mix(in srgb, var(--groups-accent) 18%, var(--border-color, var(--bs-border-color)));
}

.groups-theme-empty {
    text-align: center;
    padding: 2rem 1.25rem;
    border: 1px dashed color-mix(in srgb, var(--groups-accent) 20%, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: color-mix(in srgb, var(--surface-soft, var(--surface, var(--bs-body-bg))) 72%, transparent);
}

.groups-form-shell-body,
.groups-confirm-shell-body {
    align-items: flex-start;
}

.groups-form-panel,
.groups-confirm-panel {
    padding: 1.35rem;
}

.groups-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.groups-form-field--full {
    grid-column: 1 / -1;
}

.groups-form-check {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    min-height: 2.75rem;
    padding: 0.8rem 0.9rem;
    border-radius: 0.95rem;
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.groups-form-role-checklist {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.groups-form-role-option {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    min-height: 2.85rem;
    padding: 0.8rem 0.95rem;
    border-radius: 0.95rem;
    border: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface, var(--bs-body-bg));
    color: inherit;
    cursor: pointer;
    transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
}

.groups-form-role-option:hover {
    border-color: var(--primary, var(--bs-primary));
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
    transform: translateY(-1px);
}

.groups-form-role-option .form-check-input {
    margin: 0;
    flex: 0 0 auto;
}

.groups-form-role-option span {
    min-width: 0;
    font-weight: 600;
}

.groups-form-actions {
    margin-top: 1.35rem;
}

.groups-form-aside-list,
.groups-confirm-blockers {
    display: grid;
    gap: 0.75rem;
}

.groups-form-help-copy {
    line-height: 1.65;
}

.groups-confirm-copy {
    font-size: 0.96rem;
    line-height: 1.65;
}

.groups-confirm-blockers {
    list-style: none;
    padding: 0;
    margin: 0;
}

.groups-confirm-blockers li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem;
    padding: 0.9rem 1rem;
}

.groups-confirm-blocker-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    height: 2rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--bs-danger) 18%, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
}

.groups-confirm-state {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    min-height: 1.85rem;
    padding: 0.35rem 0.78rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
    border: 1px solid color-mix(in srgb, var(--bs-danger) 35%, var(--border-color, var(--bs-border-color)));
    background: color-mix(in srgb, var(--bs-danger) 14%, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
}

.groups-theme-page .btn-primary,
.groups-theme-page .btn-primary.theme-action-primary,
.groups-form-page .btn-primary,
.groups-form-page .btn-primary.theme-action-primary,
.groups-confirm-page .btn-primary,
.groups-confirm-page .btn-primary.theme-action-primary {
    background-color: var(--primary, var(--bs-primary)) !important;
    border-color: var(--primary, var(--bs-primary)) !important;
    color: #fff !important;
}

.groups-theme-page .btn-primary:hover,
.groups-theme-page .btn-primary.theme-action-primary:hover,
.groups-form-page .btn-primary:hover,
.groups-form-page .btn-primary.theme-action-primary:hover,
.groups-confirm-page .btn-primary:hover,
.groups-confirm-page .btn-primary.theme-action-primary:hover {
    background-color: var(--primary-hover, var(--primary, var(--bs-primary))) !important;
    border-color: var(--primary-hover, var(--primary, var(--bs-primary))) !important;
}

.groups-theme-page .btn-outline-secondary,
.groups-theme-page .btn-outline-secondary.theme-action-outline,
.groups-form-page .btn-outline-secondary,
.groups-form-page .btn-outline-secondary.theme-action-outline,
.groups-confirm-page .btn-outline-secondary,
.groups-confirm-page .btn-outline-secondary.theme-action-outline {
    background: var(--btn-outline-neutral-bg, transparent) !important;
    border-color: var(--btn-outline-neutral-border, var(--border-color, var(--bs-border-color))) !important;
    color: var(--btn-outline-neutral-text, var(--text-main, var(--bs-body-color))) !important;
}

.groups-theme-page .btn-outline-secondary:hover,
.groups-theme-page .btn-outline-secondary.theme-action-outline:hover,
.groups-form-page .btn-outline-secondary:hover,
.groups-form-page .btn-outline-secondary.theme-action-outline:hover,
.groups-confirm-page .btn-outline-secondary:hover,
.groups-confirm-page .btn-outline-secondary.theme-action-outline:hover {
    background: var(--btn-outline-neutral-hover-bg, var(--surface-soft)) !important;
    color: var(--btn-outline-neutral-hover-text, var(--text-main, var(--bs-body-color))) !important;
}

.groups-theme-page .btn-outline-danger,
.groups-form-page .btn-outline-danger,
.groups-confirm-page .btn-outline-danger {
    background: transparent !important;
    border-color: color-mix(in srgb, var(--bs-danger) 45%, var(--border-color, var(--bs-border-color))) !important;
    color: var(--bs-danger) !important;
}

.groups-theme-page .btn-outline-danger:hover,
.groups-form-page .btn-outline-danger:hover,
.groups-confirm-page .btn-outline-danger:hover {
    background: color-mix(in srgb, var(--bs-danger) 16%, var(--surface, var(--bs-body-bg))) !important;
    color: var(--text-main, var(--bs-body-color)) !important;
}

@media (max-width: 1199.98px) {
    .groups-theme-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .groups-theme-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .groups-theme-category-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 991.98px) {
    .groups-theme-hero-body,
    .groups-form-shell-body,
    .groups-confirm-shell-body,
    .groups-theme-card,
    .groups-theme-filter,
    .groups-form-panel,
    .groups-confirm-panel {
        padding: 1rem;
    }

    .groups-theme-actions {
        justify-content: flex-start;
    }

    .groups-form-grid {
        grid-template-columns: 1fr;
    }

    .groups-form-role-checklist {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .groups-theme-metrics,
    .groups-theme-filter-grid {
        grid-template-columns: 1fr;
    }

    .groups-theme-filter-actions {
        flex-direction: column;
    }

    .groups-theme-filter-actions .btn {
        width: 100%;
    }
}

/* ===== Tasks themed module ===== */
.tasks-theme-page,
.tasks-confirm-page {
    --tasks-accent: color-mix(in srgb, var(--primary, var(--bs-primary)) 84%, var(--bs-info) 16%);
    --tasks-accent-strong: color-mix(in srgb, var(--primary, var(--bs-primary)) 78%, var(--bs-dark) 22%);
    color: var(--text-main, var(--bs-body-color));
}

.tasks-theme-shell,
.tasks-theme-card,
.tasks-theme-filter,
.tasks-theme-metric {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow);
    border-radius: 1.25rem;
}

.tasks-theme-hero {
    overflow: hidden;
}

.tasks-theme-hero-accent {
    height: 0.5rem;
    background: linear-gradient(
        90deg,
        var(--primary, var(--bs-primary)),
        color-mix(in srgb, var(--primary, var(--bs-primary)) 68%, var(--bs-info) 32%),
        color-mix(in srgb, var(--bs-info) 62%, var(--bs-warning) 38%)
    );
}

.tasks-theme-hero-body {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem;
}

.tasks-theme-header-block {
    min-width: 0;
}

.tasks-theme-title-row,
.tasks-theme-subtitle,
.tasks-theme-context-line,
.tasks-theme-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.tasks-theme-title-row {
    row-gap: 0.6rem;
}

.tasks-theme-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.75rem, 2.4vw, 2.45rem);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.035em;
}

.tasks-theme-subtitle,
.tasks-theme-card-subtitle,
.tasks-theme-note,
.tasks-theme-empty,
.tasks-theme-hint,
.tasks-theme-table-note {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.tasks-theme-subtitle {
    margin-top: 0.45rem;
    font-size: 0.94rem;
}

.tasks-theme-context-line {
    margin-top: 0.65rem;
    font-size: 0.92rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.tasks-theme-context-label,
.tasks-theme-stat-label,
.tasks-theme-section-title,
.tasks-theme-subpanel-title,
.tasks-theme-info-label {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.tasks-theme-context-label,
.tasks-theme-stat-label,
.tasks-theme-info-label {
    color: var(--text-soft, var(--muted, var(--bs-secondary-color)));
}

.tasks-theme-actions {
    justify-content: flex-end;
}

.tasks-theme-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.tasks-theme-metric {
    padding: 1.15rem 1.2rem;
}

.tasks-theme-stat-value {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.55rem, 2vw, 2rem);
    font-weight: 760;
    line-height: 1.05;
    margin-top: 0.45rem;
}

.tasks-theme-hint {
    font-size: 0.88rem;
    margin-top: 0.45rem;
}

.tasks-theme-card {
    overflow: hidden;
}

.tasks-theme-card-header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.1rem 1.25rem;
    border-bottom: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
}

.tasks-theme-card-body {
    padding: 1.2rem 1.25rem 1.25rem;
}

.tasks-theme-section-title {
    color: var(--text-main, var(--bs-body-color));
    margin: 0;
}

.tasks-theme-card-subtitle {
    margin: 0.2rem 0 0;
    font-size: 0.92rem;
}

.tasks-theme-filter {
    margin: 0 1.25rem 1.25rem;
    padding: 1.1rem 1.15rem;
}

.tasks-theme-filter-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 0.95rem 1rem;
    align-items: end;
}

.tasks-theme-filter-grid > div {
    grid-column: span 3;
}

.tasks-theme-filter-grid .tasks-theme-filter-wide {
    grid-column: span 6;
}

.tasks-theme-filter-actions {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
}

.tasks-theme-table-wrap {
    padding: 0 1.25rem 1.25rem;
}

.tasks-theme-table-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 0;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    margin-bottom: 0.75rem;
}

.tasks-theme-section-title-sm {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.92rem;
    font-weight: 700;
}

.tasks-theme-table {
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--table-border, var(--border-color, var(--bs-border-color)));
    margin: 0;
}

.tasks-theme-table tbody tr:hover {
    background: var(--table-row-hover, var(--surface-soft, var(--surface, var(--bs-body-bg))));
}

.tasks-theme-pill,
.tasks-theme-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.85rem;
    padding: 0.28rem 0.7rem;
    border-radius: 999px;
    font-size: 0.74rem;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
}

.tasks-theme-pill--blue {
    background: color-mix(in srgb, var(--bs-info) 12%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-info) 30%, var(--card-border, var(--border-color, var(--bs-border-color))));
}

.tasks-theme-pill--neutral {
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.tasks-theme-status--active {
    background: color-mix(in srgb, var(--bs-success) 13%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-success) 34%, var(--card-border, var(--border-color, var(--bs-border-color))));
}

.tasks-theme-status--approved {
    background: color-mix(in srgb, var(--bs-info) 12%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-info) 34%, var(--card-border, var(--border-color, var(--bs-border-color))));
}

.tasks-theme-status--draft {
    background: color-mix(in srgb, var(--bs-warning) 13%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-warning) 36%, var(--card-border, var(--border-color, var(--bs-border-color))));
}

.tasks-theme-status--inactive {
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.tasks-theme-status--attention {
    background: color-mix(in srgb, var(--bs-warning) 12%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-warning) 32%, var(--card-border, var(--border-color, var(--bs-border-color))));
}

.tasks-theme-status--pending {
    --tasks-pending-accent: color-mix(in srgb, var(--primary, var(--bs-primary)) 82%, var(--bs-info) 18%);
    background: color-mix(in srgb, var(--tasks-pending-accent) 12%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--tasks-pending-accent) 34%, var(--card-border, var(--border-color, var(--bs-border-color))));
}

.tasks-theme-empty {
    margin: 1.25rem;
    padding: 2rem 1.25rem;
    text-align: center;
    border: 1px dashed color-mix(in srgb, var(--tasks-accent) 22%, var(--card-border, var(--border-color, var(--bs-border-color))));
    border-radius: 1.2rem;
    background: color-mix(in srgb, var(--surface-soft, var(--surface, var(--bs-body-bg))) 76%, transparent);
}

.tasks-theme-list {
    display: grid;
    gap: 0.8rem;
}

.tasks-theme-report-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.tasks-theme-report-list {
    display: grid;
    gap: 0.75rem;
}

.tasks-theme-report-item {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.85rem;
    padding: 0.95rem 1rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.95rem;
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.tasks-dashboard-page .tasks-theme-report-item {
    background: transparent;
}

.tasks-theme-note {
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.9rem;
}

.tasks-theme-mini-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.tasks-theme-mini-metric {
    padding: 0.95rem 1rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.95rem;
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.tasks-theme-mini-value {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.35rem;
    font-weight: 760;
    line-height: 1.1;
    margin-top: 0.35rem;
}

.tasks-theme-list-item,
.tasks-theme-item-card,
.tasks-theme-info-row,
.tasks-theme-subpanel {
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
}

.tasks-theme-list-item,
.tasks-theme-item-card {
    padding: 0.95rem 1rem;
}

.tasks-theme-item-title {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
}

.tasks-theme-control-card {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--surface-soft, var(--surface, var(--bs-body-bg))) 78%, transparent), transparent 68%),
        var(--surface, var(--bs-body-bg));
}

.tasks-theme-control-header {
    align-items: flex-start;
}

.tasks-theme-control-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.9rem;
}

.tasks-theme-control-tile {
    padding: 1rem 1.05rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.tasks-theme-control-label,
.tasks-theme-control-kicker {
    color: var(--text-soft, var(--muted, var(--bs-secondary-color)));
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.tasks-theme-control-kicker {
    margin-bottom: 0.3rem;
}

.tasks-theme-control-value {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.7rem;
    font-weight: 780;
    line-height: 1.05;
    margin: 0.45rem 0 0.35rem;
}

.tasks-theme-role-title {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.tasks-theme-role-dot {
    width: 0.72rem;
    height: 0.72rem;
    border-radius: 999px;
    flex: 0 0 auto;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.tasks-theme-role-dot--assigned {
    background: color-mix(in srgb, var(--bs-success) 82%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-success) 42%, var(--card-border, var(--border-color, var(--bs-border-color))));
}

.tasks-theme-role-dot--open {
    background: color-mix(in srgb, var(--bs-warning) 78%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-warning) 42%, var(--card-border, var(--border-color, var(--bs-border-color))));
}

.tasks-theme-rotation-list,
.tasks-theme-assignment-list {
    display: grid;
    gap: 0.75rem;
}

.tasks-theme-rotation-item,
.tasks-theme-assignment-item {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.85rem;
    padding: 0.9rem 1rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.95rem;
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.tasks-theme-occurrence-card,
.tasks-theme-occurrence-assignment {
    background: transparent;
}

.tasks-theme-control-occurrence {
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface, var(--bs-body-bg));
    border-radius: 0.95rem;
    padding: 1rem;
}

.tasks-theme-list > .tasks-theme-control-occurrence + .tasks-theme-control-occurrence {
    margin-top: 0.85rem;
}

.tasks-theme-occurrence-header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
}

.tasks-theme-occurrence-main {
    min-width: 0;
    flex: 1 1 18rem;
}

.tasks-theme-occurrence-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 0.75rem;
    margin-top: 0.45rem;
    align-items: center;
}

.tasks-theme-occurrence-side {
    display: grid;
    gap: 0.9rem;
    justify-items: start;
    flex: 1 1 100%;
}

.tasks-theme-occurrence-control-actions {
    display: inline-flex;
    gap: 0.55rem;
    flex-wrap: wrap;
}

.tasks-theme-occurrence-pills {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 0.55rem;
    width: 100%;
}

.tasks-theme-occurrence-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    min-height: 2rem;
    padding: 0.4rem 0.85rem;
    border-radius: 999px;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
    white-space: nowrap;
    min-width: 0;
}

.tasks-theme-occurrence-pill--pending {
    --tasks-pending-accent: color-mix(in srgb, var(--primary, var(--bs-primary)) 82%, var(--bs-info) 18%);
    background: color-mix(in srgb, var(--tasks-pending-accent) 12%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--tasks-pending-accent) 34%, var(--card-border, var(--border-color, var(--bs-border-color))));
}

.tasks-theme-occurrence-pill--approved {
    background: color-mix(in srgb, var(--bs-info) 11%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-info) 34%, var(--card-border, var(--border-color, var(--bs-border-color))));
}

.tasks-theme-occurrence-pill--completed {
    background: color-mix(in srgb, var(--bs-success) 11%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-success) 34%, var(--card-border, var(--border-color, var(--bs-border-color))));
}

.tasks-theme-occurrence-pill--attention {
    background: color-mix(in srgb, var(--bs-warning) 14%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-warning) 36%, var(--card-border, var(--border-color, var(--bs-border-color))));
}

.tasks-theme-occurrence-pill--open {
    background: color-mix(in srgb, var(--bs-danger) 10%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-danger) 30%, var(--card-border, var(--border-color, var(--bs-border-color))));
}

.tasks-theme-occurrence-pill__label {
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text-soft, var(--muted, var(--bs-secondary-color)));
}

.tasks-theme-occurrence-pill__value {
    font-size: 0.92rem;
    font-weight: 760;
    line-height: 1;
}

.tasks-theme-occurrence-warning-list {
    display: grid;
    gap: 0.45rem;
    margin-top: 0.85rem;
}

.tasks-theme-occurrence-warning {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 0.55rem;
    align-items: baseline;
    padding: 0.65rem 0.8rem;
    border-radius: 0.85rem;
    border: 1px solid color-mix(in srgb, var(--bs-warning) 36%, var(--card-border, var(--border-color, var(--bs-border-color))));
    background: color-mix(in srgb, var(--bs-warning) 11%, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.88rem;
}

.tasks-theme-occurrence-warning__label {
    color: color-mix(in srgb, var(--bs-warning) 68%, var(--text-main, var(--bs-body-color)));
    font-size: 0.72rem;
    font-weight: 760;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.tasks-theme-occurrence-assignment {
    gap: 1rem;
    align-items: flex-start;
    border: 1px solid color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 78%, transparent);
    border-radius: 0.95rem;
    background: transparent;
    padding: 0.9rem 1rem;
}

.tasks-theme-occurrence-role-group {
    background: transparent;
}

.tasks-theme-occurrence-role-group .tasks-theme-occurrence-assignment {
    background: transparent;
}

.tasks-theme-occurrence-role-list {
    display: grid;
    gap: 0.55rem;
}

.tasks-theme-occurrence-role-row {
    --tasks-occurrence-role-column-width: 11rem;
    display: grid;
    grid-template-columns: minmax(var(--tasks-occurrence-role-column-width), 0.24fr) minmax(0, 1fr);
    gap: 0.75rem 1rem;
    align-items: start;
    padding: 0.72rem 0;
    border-top: 1px solid color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 72%, transparent);
}

.tasks-theme-occurrence-role-row:first-child {
    border-top: 0;
    padding-top: 0;
}

.tasks-theme-occurrence-role-summary {
    min-width: 0;
}

.tasks-theme-occurrence-role-count {
    display: inline-flex;
    align-items: center;
    margin-top: 0.28rem;
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--text-soft, var(--muted, var(--bs-secondary-color)));
}

.tasks-theme-occurrence-people-list {
    display: grid;
    gap: 0.45rem;
    min-width: 0;
}

.tasks-theme-occurrence-assignment-row {
    display: grid;
    gap: 0.35rem;
    padding: 0.52rem 0;
}

.tasks-theme-occurrence-assignment-row + .tasks-theme-occurrence-assignment-row {
    border-top: 1px dashed color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 64%, transparent);
}

.tasks-theme-occurrence-person-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.65rem 0.9rem;
    align-items: center;
}

.tasks-theme-occurrence-person-main {
    min-width: 0;
}

.tasks-theme-occurrence-person-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 0.55rem;
    align-items: center;
    margin-top: 0.22rem;
}

.tasks-theme-occurrence-comments-section {
    grid-column: 1 / -1;
}

.tasks-theme-occurrence-comment-row {
    padding-top: 0.45rem;
    border-top: 1px dashed color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 58%, transparent);
    text-align: left;
}

.tasks-theme-occurrence-assignment-main {
    min-width: 0;
    flex: 1 1 24rem;
}

.tasks-theme-occurrence-assignment-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.9rem 1rem;
}

.tasks-theme-occurrence-role-name {
    color: var(--tasks-accent-strong, var(--primary, var(--bs-primary)));
    font-size: 1.17rem;
    font-weight: 700;
    line-height: 1.2;
}

.tasks-theme-occurrence-person-link {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.08rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
}

.tasks-theme-occurrence-person-link:hover,
.tasks-theme-occurrence-person-link:focus-visible {
    color: var(--text-main, var(--bs-body-color));
    text-decoration: underline;
}

.tasks-theme-occurrence-actions {
    flex: 0 0 auto;
}

.tasks-theme-occurrence-manager-line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-top: 1rem;
    padding-top: 0.9rem;
    border-top: 1px dashed color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 78%, transparent);
}

.tasks-theme-occurrence-response {
    margin-top: 1rem;
    padding-top: 0.95rem;
    border-top: 1px dashed color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 78%, transparent);
}

.tasks-theme-response-form {
    margin-top: 0.65rem;
}

.tasks-theme-modal {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow);
}

.tasks-theme-modal .modal-header,
.tasks-theme-modal .modal-body {
    padding-left: 1.15rem;
    padding-right: 1.15rem;
}

.tasks-theme-modal .modal-header {
    border-bottom-color: var(--card-border, var(--border-color, var(--bs-border-color)));
}

.tasks-theme-modal .tasks-theme-response-form {
    margin-top: 0;
}

.task-rotation-modal__dialog {
    max-width: 960px;
}

.task-rotation-modal__content {
    border-radius: 1.25rem;
    overflow: hidden;
}

.task-rotation-modal__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.task-rotation-modal__body {
    padding-top: 1rem;
}

.tasks-theme-response-label {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-soft, var(--muted, var(--bs-secondary-color)));
    margin-bottom: 0.45rem;
}

.tasks-theme-response-comment {
    resize: vertical;
    min-height: 4.25rem;
}

.tasks-theme-response-actions .btn {
    min-height: 2.5rem;
}

.tasks-theme-rotation-card,
.tasks-theme-rotation-entry {
    background: transparent;
}

.tasks-theme-control-rotation {
    background: transparent;
}

.tasks-theme-page .tasks-theme-control-rotation,
.tasks-theme-page .tasks-theme-rotation-entry {
    background: transparent;
}

.tasks-theme-info-stack {
    display: grid;
    gap: 0.75rem;
}

.tasks-theme-control-stack .tasks-theme-info-row {
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.tasks-theme-info-row {
    padding: 0.9rem 1rem;
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

.tasks-theme-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.tasks-theme-field--full {
    grid-column: 1 / -1;
}

.tasks-theme-check {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    min-height: 2.75rem;
}

.tasks-theme-choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
    min-width: 0;
}

.tasks-theme-choice-option {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    border: 1px solid var(--table-border, var(--card-border, var(--border-color, var(--bs-border-color))));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    padding: 0.8rem 0.9rem;
    min-height: 4rem;
    transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.tasks-theme-choice-option:hover {
    background: var(--table-row-hover, var(--surface-soft, var(--surface, var(--bs-body-bg))));
    border-color: color-mix(in srgb, var(--primary, var(--bs-primary)) 30%, var(--table-border, var(--card-border, var(--border-color, var(--bs-border-color)))));
    transform: translateY(-1px);
}

.tasks-theme-choice-option input[type="checkbox"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.tasks-theme-choice-option__body {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
    flex: 1 1 auto;
}

.tasks-theme-choice-option__name {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.35;
}

.tasks-theme-choice-option__indicator {
    width: 0.9rem;
    height: 0.9rem;
    margin-top: 0.25rem;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--primary, var(--bs-primary)) 22%, var(--table-border, var(--card-border, var(--border-color, var(--bs-border-color)))));
    background: var(--surface-muted, var(--surface-soft, var(--surface, var(--bs-body-bg))));
    box-shadow: inset 0 0 0 0.2rem var(--surface, var(--bs-body-bg));
    flex: 0 0 auto;
}

.tasks-theme-choice-option:has(input[type="checkbox"]:checked) {
    background: color-mix(in srgb, var(--primary-soft, var(--surface-soft, var(--surface, var(--bs-body-bg)))) 72%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--primary, var(--bs-primary)) 36%, var(--table-border, var(--card-border, var(--border-color, var(--bs-border-color)))));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary, var(--bs-primary)) 16%, transparent);
}

.tasks-theme-choice-option:has(input[type="checkbox"]:checked) .tasks-theme-choice-option__indicator {
    background: var(--primary, var(--bs-primary));
    border-color: var(--primary, var(--bs-primary));
    box-shadow: inset 0 0 0 0.2rem color-mix(in srgb, var(--surface, var(--bs-body-bg)) 82%, transparent);
}

.tasks-theme-selected-people {
    display: none;
    gap: 0.75rem;
    flex-direction: column;
}

.tasks-theme-selected-people.is-visible {
    display: flex;
}

.tasks-theme-selected-person {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 0.85rem;
    border-radius: 0.9rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.tasks-theme-selected-person__copy {
    min-width: 0;
}

.tasks-theme-selected-person__name {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 600;
    line-height: 1.35;
}

.tasks-theme-selected-person__meta {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.84rem;
}

.tasks-theme-role-summary {
    margin-bottom: 0.9rem;
    padding: 0.8rem 0.9rem;
    border-radius: 0.95rem;
    border: 1px solid color-mix(in srgb, var(--tasks-accent, var(--primary, var(--bs-primary))) 22%, var(--card-border, var(--border-color, var(--bs-border-color))));
    background: color-mix(in srgb, var(--tasks-accent, var(--primary, var(--bs-primary))) 8%, var(--surface, var(--bs-body-bg)));
}

.tasks-theme-role-summary__title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 0.55rem;
}

.tasks-theme-role-summary__metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
}

.tasks-theme-role-summary__metric {
    display: grid;
    gap: 0.18rem;
}

.tasks-theme-role-summary__label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.76rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.tasks-my-side-card {
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1.15rem;
    box-shadow: var(--card-shadow, 0 14px 30px rgba(0, 0, 0, 0.08));
    overflow: hidden;
}

.tasks-my-side-heading {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    padding: 1rem 1.1rem 0;
}

.tasks-my-side-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1rem;
    font-weight: 700;
}

.tasks-my-side-accent {
    width: 0.35rem;
    min-height: 2rem;
    border-radius: 999px;
    flex: 0 0 auto;
}

.tasks-my-side-accent-blue {
    background: var(--bs-info);
}

.tasks-my-side-accent-gold {
    background: var(--bs-warning);
}

.tasks-my-side-accent-green {
    background: var(--bs-success);
}

.tasks-my-metric-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
}

.tasks-my-metric-icon {
    order: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4rem;
    height: 4rem;
    border-radius: 999px;
    font-size: 2.65rem;
    line-height: 1;
}

.tasks-my-metric-icon--pending {
    background: color-mix(in srgb, var(--bs-warning) 14%, var(--surface, var(--bs-body-bg)));
    color: var(--bs-warning);
}

.tasks-my-metric-icon--approved {
    background: color-mix(in srgb, var(--bs-success) 12%, var(--surface, var(--bs-body-bg)));
    color: var(--bs-success);
}

.tasks-my-metric-icon--history {
    background: color-mix(in srgb, var(--primary, var(--bs-primary)) 12%, var(--surface, var(--bs-body-bg)));
    color: var(--primary, var(--bs-primary));
}

.tasks-my-metric-copy {
    order: 1;
    min-width: 0;
}

.tasks-my-side-title-with-icon {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
}

.tasks-my-side-icon {
    font-size: 1.45rem;
    line-height: 1;
}

.tasks-my-side-icon--gold {
    color: var(--bs-warning);
}

.tasks-my-side-icon--green {
    color: var(--bs-success);
}

.tasks-my-side-icon--blue {
    color: var(--bs-info);
}
.tasks-my-record-table {
    min-width: 880px;
}

.tasks-my-record-table .assignment-row-menu-cell .pi,
.tasks-my-record-title .pi,
.tasks-drawer-icon .pi,
.tasks-response-drawer .confirmation-drawer-meta .pi {
    color: var(--primary, var(--bs-primary));
}

.tasks-my-record-title {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    max-width: 280px;
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
    line-height: 1.2;
}

.tasks-my-record-title span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tasks-my-drawer-row .assignment-program-name {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.tasks-my-drawer-row .assignment-row-note {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.tasks-drawer-summary {
    border-left: 1px solid var(--card-border, var(--border-color, var(--bs-border-color))) !important;
}

.tasks-drawer-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--primary, var(--bs-primary)) 12%, var(--surface, var(--bs-body-bg)));
}

.tasks-drawer-buttons {
    grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
}

.tasks-drawer-buttons .btn,
.tasks-response-drawer .confirmation-drawer-footer .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    font-weight: 500;
}
.tasks-my-record-icon--pending {
    color: var(--bs-warning) !important;
}

.tasks-my-record-icon--approved {
    color: var(--bs-success) !important;
}

.tasks-my-record-icon--history {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color))) !important;
}

.tasks-my-history-section {
    margin-top: 1rem;
}

.tasks-my-history-table {
    min-width: 880px;
}

.tasks-my-history-row {
    cursor: default;
}

.tasks-my-history-row > td:first-child::before {
    display: none;
}
.tasks-my-history-date {
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    white-space: nowrap;
}

.tasks-my-history-status-icon {
    font-size: 1rem;
    line-height: 1;
}

.tasks-my-history-status-icon--completed {
    color: var(--bs-success);
}

.tasks-my-history-status-icon--stuck {
    color: var(--bs-warning);
}

.tasks-my-history-status-icon--incomplete,
.tasks-my-history-status-icon--declined {
    color: var(--bs-danger);
}

.tasks-my-history-status-icon--muted {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
}

.tasks-my-history-title {
    text-decoration: none;
}

.tasks-my-history-title:hover,
.tasks-my-history-title:focus-visible {
    color: var(--primary, var(--bs-primary));
    text-decoration: none;
}

.tasks-my-history-comment {
    max-width: 260px;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.86rem;
    line-height: 1.3;
}

.tasks-my-history-muted {
    color: var(--text-soft, var(--muted, var(--bs-secondary-color)));
}
.tasks-my-action-card {
    padding: 0;
    overflow: hidden;
}

.tasks-my-action-card--pending {
    border-left: 0.32rem solid var(--bs-warning);
}

.tasks-my-action-card--approved {
    border-left: 0.32rem solid var(--bs-success);
}

.tasks-my-action-summary {
    display: grid;
    grid-template-columns: minmax(0, 1.8fr) minmax(6.5rem, 0.7fr) minmax(6rem, 0.7fr) auto;
    align-items: center;
    gap: 0.85rem;
    min-height: 3.25rem;
    padding: 0.7rem 0.9rem;
    cursor: pointer;
    list-style: none;
}

.tasks-my-action-summary::-webkit-details-marker {
    display: none;
}

.tasks-my-action-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.98rem;
    font-weight: 720;
    line-height: 1.25;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tasks-my-action-date,
.tasks-my-action-role {
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.86rem;
    line-height: 1.25;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tasks-my-action-date {
    text-align: center;
}

.tasks-my-action-role {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 650;
    text-align: right;
}

.tasks-my-action-expand {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--text-soft, var(--muted, var(--bs-secondary-color)));
    font-size: 0.95rem;
    transition: transform 0.18s ease, color 0.18s ease;
}

.tasks-my-action-card[open] .tasks-my-action-expand {
    color: var(--text-main, var(--bs-body-color));
    transform: rotate(180deg);
}

.tasks-my-action-body {
    display: grid;
    gap: 0.78rem;
    padding: 0 0.9rem 0.9rem;
    border-top: 1px dashed color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 78%, transparent);
}

.tasks-my-action-details {
    display: grid;
    gap: 0.65rem;
}

.tasks-my-action-detail {
    display: grid;
    gap: 0.2rem;
    padding-top: 0.75rem;
}

.tasks-my-action-label {
    color: var(--text-soft, var(--muted, var(--bs-secondary-color)));
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.tasks-my-action-value {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.98rem;
    font-weight: 700;
}

.tasks-my-action-context,
.tasks-my-action-note,
.tasks-my-action-prompt {
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.9rem;
}

.tasks-my-action-note,
.tasks-my-action-prompt {
    padding-top: 0.72rem;
    border-top: 1px dashed color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 78%, transparent);
}

.tasks-my-action-prompt {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 650;
}

.tasks-my-assigned-list {
    display: grid;
    gap: 0.75rem;
}

.tasks-my-assigned-card {
    text-decoration: none;
    color: inherit;
}

.tasks-my-assigned-card:hover {
    color: inherit;
    text-decoration: none;
}

.tasks-my-assigned-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.tasks-my-assigned-date {
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.82rem;
    font-weight: 600;
}

.tasks-my-assigned-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.98rem;
    font-weight: 700;
}

.tasks-my-assigned-meta {
    margin-top: 0.35rem;
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.9rem;
}

.tasks-my-assigned-footer {
    margin-top: 0.8rem;
}

.tasks-my-next-card {
    display: block;
    text-decoration: none;
    color: inherit;
    transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.tasks-my-next-card:hover {
    color: inherit;
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.08);
}

.tasks-my-next-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.tasks-my-next-date {
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.82rem;
    font-weight: 600;
}

.tasks-my-next-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1rem;
    font-weight: 700;
}

.tasks-my-next-meta,
.tasks-my-next-note,
.tasks-my-empty-small {
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.9rem;
}

.tasks-my-next-meta {
    margin-top: 0.35rem;
}

.tasks-my-next-note {
    margin-top: 0.65rem;
}

.tasks-my-date-list {
    display: grid;
    gap: 0.75rem;
}

.tasks-my-date-card {
    padding: 0.9rem 1rem;
}

.tasks-my-date-value {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
}

.tasks-my-status-list {
    display: grid;
    gap: 0.15rem;
    padding-top: 0.35rem;
}

.tasks-my-status-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    padding: 0.65rem 0;
    border-bottom: 1px solid color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 72%, transparent);
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.92rem;
}

.tasks-my-status-row:last-child {
    border-bottom: 0;
}

.tasks-my-status-row strong {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1rem;
    font-weight: 760;
}

.tasks-my-quick-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    padding-top: 0.45rem;
}

.tasks-theme-subpanel {
    padding: 1rem;
}

.tasks-theme-subpanel-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.tasks-confirm-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.75rem;
}

.tasks-confirm-list li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.9rem 1rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.tasks-theme-page .btn-primary,
.tasks-theme-page .btn-primary.theme-action-primary {
    background-color: var(--primary, var(--bs-primary)) !important;
    border-color: var(--primary, var(--bs-primary)) !important;
    color: var(--bs-white) !important;
}

.tasks-theme-page .btn-primary:hover,
.tasks-theme-page .btn-primary.theme-action-primary:hover {
    background-color: var(--primary-hover, var(--primary, var(--bs-primary))) !important;
    border-color: var(--primary-hover, var(--primary, var(--bs-primary))) !important;
}

.tasks-theme-page .btn-outline-secondary,
.tasks-theme-page .btn-outline-secondary.theme-action-outline {
    background: var(--btn-outline-neutral-bg, transparent) !important;
    border-color: var(--btn-outline-neutral-border, var(--border-color, var(--bs-border-color))) !important;
    color: var(--btn-outline-neutral-text, var(--text-main, var(--bs-body-color))) !important;
}

.tasks-theme-page .btn-outline-secondary:hover,
.tasks-theme-page .btn-outline-secondary.theme-action-outline:hover {
    background: var(--btn-outline-neutral-hover-bg, var(--surface-soft)) !important;
    color: var(--btn-outline-neutral-hover-text, var(--text-main, var(--bs-body-color))) !important;
}

.tasks-theme-page .btn-outline-danger {
    background: transparent !important;
    border-color: color-mix(in srgb, var(--bs-danger) 45%, var(--border-color, var(--bs-border-color))) !important;
    color: var(--bs-danger) !important;
}

.tasks-theme-page .btn-outline-danger:hover {
    background: color-mix(in srgb, var(--bs-danger) 16%, var(--surface, var(--bs-body-bg))) !important;
    color: var(--text-main, var(--bs-body-color)) !important;
}

.tasks-theme-page .btn-outline-secondary.theme-action-outline.tasks-theme-action-decline {
    background: color-mix(in srgb, var(--bs-warning) 10%, var(--surface, var(--bs-body-bg))) !important;
    border-color: color-mix(in srgb, var(--bs-warning) 38%, var(--border-color, var(--bs-border-color))) !important;
    color: color-mix(in srgb, var(--bs-warning) 68%, var(--text-main, var(--bs-body-color))) !important;
}

.tasks-theme-page .btn-outline-secondary.theme-action-outline.tasks-theme-action-decline:hover {
    background: color-mix(in srgb, var(--bs-warning) 18%, var(--surface, var(--bs-body-bg))) !important;
    color: var(--text-main, var(--bs-body-color)) !important;
}

.tasks-theme-page .btn-outline-secondary.theme-action-outline.tasks-theme-action-reopen {
    background: color-mix(in srgb, var(--bs-info) 10%, var(--surface, var(--bs-body-bg))) !important;
    border-color: color-mix(in srgb, var(--bs-info) 38%, var(--border-color, var(--bs-border-color))) !important;
    color: color-mix(in srgb, var(--bs-info) 68%, var(--text-main, var(--bs-body-color))) !important;
}

.tasks-theme-page .btn-outline-secondary.theme-action-outline.tasks-theme-action-reopen:hover {
    background: color-mix(in srgb, var(--bs-info) 18%, var(--surface, var(--bs-body-bg))) !important;
    color: var(--text-main, var(--bs-body-color)) !important;
}

.tasks-theme-page .btn-outline-secondary.theme-action-outline.tasks-theme-action-stuck {
    background: color-mix(in srgb, var(--bs-warning) 12%, var(--surface, var(--bs-body-bg))) !important;
    border-color: color-mix(in srgb, var(--bs-warning) 34%, var(--border-color, var(--bs-border-color))) !important;
    color: color-mix(in srgb, var(--bs-warning) 72%, var(--text-main, var(--bs-body-color))) !important;
}

.tasks-theme-page .btn-outline-secondary.theme-action-outline.tasks-theme-action-stuck:hover {
    background: color-mix(in srgb, var(--bs-warning) 20%, var(--surface, var(--bs-body-bg))) !important;
    color: var(--text-main, var(--bs-body-color)) !important;
}

.tasks-theme-page .btn-outline-secondary.theme-action-outline.tasks-theme-action-incomplete {
    background: color-mix(in srgb, var(--bs-danger) 10%, var(--surface, var(--bs-body-bg))) !important;
    border-color: color-mix(in srgb, var(--bs-danger) 34%, var(--border-color, var(--bs-border-color))) !important;
    color: color-mix(in srgb, var(--bs-danger) 68%, var(--text-main, var(--bs-body-color))) !important;
}

.tasks-theme-page .btn-outline-secondary.theme-action-outline.tasks-theme-action-incomplete:hover {
    background: color-mix(in srgb, var(--bs-danger) 18%, var(--surface, var(--bs-body-bg))) !important;
    color: var(--text-main, var(--bs-body-color)) !important;
}

.tasks-report-sheet {
    padding: 1.35rem 1.45rem 1.45rem;
    background: var(--surface, var(--bs-body-bg));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow);
    border-radius: 1.25rem;
}

.tasks-report-filter-card {
    background: var(--surface, var(--bs-body-bg));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow);
    border-radius: 1.25rem;
}

.tasks-report-filter-card .tasks-theme-card-header {
    padding-left: 1.35rem;
    padding-right: 1.35rem;
    padding-top: 1.25rem;
}

.tasks-report-filter-card .tasks-theme-filter {
    background: var(--surface, var(--bs-body-bg));
    border: 0;
    box-shadow: none;
    border-radius: 0 0 1.25rem 1.25rem;
    padding-left: 1.35rem;
    padding-right: 1.35rem;
    padding-bottom: 1.35rem;
}

.tasks-report-builder-form,
.tasks-report-filter-sections,
.tasks-report-display-section {
    display: grid;
    gap: 1rem;
}

.tasks-report-filter-section {
    margin: 0;
    padding: 0;
    border: 0;
    min-width: 0;
}

.tasks-report-filter-section legend {
    float: none;
    width: auto;
    margin-bottom: 0.65rem;
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.tasks-report-filter-grid {
    display: grid;
    gap: 0.85rem;
    align-items: end;
}

.tasks-report-filter-grid--scope {
    grid-template-columns: minmax(16rem, 1.4fr) minmax(12rem, 1fr) minmax(12rem, 1fr) minmax(12rem, 1fr);
}

.tasks-report-filter-grid--options {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.tasks-report-filter-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.6rem;
    padding-top: 0.1rem;
}

.tasks-report-display-section {
    margin-top: 0.35rem;
    padding-top: 1rem;
    border-top: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
}

.tasks-report-display-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.tasks-report-display-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    align-items: start;
}

.tasks-report-display-control {
    max-width: 18rem;
    width: 100%;
}

.report-chip-select {
    position: relative;
    min-width: 0;
}

.report-chip-select__control {
    width: 100%;
    min-height: 2.6rem;
    border: 1px solid var(--input-border, var(--border-color, var(--bs-border-color)));
    border-radius: 0.85rem;
    background: var(--input-bg, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.45rem 0.75rem;
    text-align: left;
    font-weight: 400;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.report-chip-select__control:hover,
.report-chip-select.is-open .report-chip-select__control {
    border-color: color-mix(in srgb, var(--primary, var(--bs-primary)) 38%, var(--input-border, var(--border-color, var(--bs-border-color))));
    box-shadow: 0 0 0 0.18rem color-mix(in srgb, var(--primary, var(--bs-primary)) 12%, transparent);
}

.report-chip-select__summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    min-width: 0;
}

.report-chip-select__placeholder {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.92rem;
}

.report-chip-select__chip {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-height: 1.55rem;
    max-width: 100%;
    border: 1px solid var(--pill-border, var(--border-color, var(--bs-border-color)));
    border-radius: 999px;
    background: var(--pill-bg, var(--surface-soft, var(--surface, var(--bs-body-bg))));
    color: var(--text-main, var(--bs-body-color));
    padding: 0.18rem 0.5rem;
    font-size: 0.82rem;
    line-height: 1.1;
}

.report-chip-select__chip-remove {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.72rem;
    line-height: 1;
}

.report-chip-select__chevron {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.82rem;
    transition: transform 0.18s ease;
}

.report-chip-select.is-open .report-chip-select__chevron {
    transform: rotate(180deg);
}

.report-chip-select__panel {
    position: absolute;
    z-index: 20;
    left: 0;
    right: 0;
    top: calc(100% + 0.4rem);
    display: none;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
    box-shadow: var(--shadow-lg, 0 1rem 2.5rem rgba(15, 23, 42, 0.16));
    padding: 0.7rem;
}

.report-chip-select.is-open .report-chip-select__panel {
    display: grid;
    gap: 0.6rem;
}

.report-chip-select__search {
    border-radius: 0.75rem;
}

.report-chip-select__options {
    display: grid;
    gap: 0.35rem;
    max-height: 16rem;
    overflow: auto;
    padding-right: 0.15rem;
}

.report-chip-select__option {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 2.1rem;
    border-radius: 0.7rem;
    padding: 0.4rem 0.5rem;
    color: var(--text-main, var(--bs-body-color));
    cursor: pointer;
    transition: background 0.16s ease;
}

.report-chip-select__option:hover,
.report-chip-select__option:focus-within {
    background: var(--table-row-hover, var(--surface-soft, var(--surface, var(--bs-body-bg))));
}

.report-chip-select__option input {
    accent-color: var(--primary, var(--bs-primary));
}

.report-chip-select__option-label {
    min-width: 0;
    font-size: 0.9rem;
    line-height: 1.25;
}

.report-chip-select__empty {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    padding: 0.55rem;
    font-size: 0.9rem;
}

.tasks-report-sheet-header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
}

.tasks-report-sheet-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.4rem, 2vw, 1.8rem);
    font-weight: 720;
    margin: 0.2rem 0 0.25rem;
    letter-spacing: -0.03em;
}

.tasks-report-sheet-subtitle {
    max-width: 34rem;
    line-height: 1.45;
}

.tasks-report-sheet-meta {
    display: grid;
    gap: 0.6rem;
    align-content: start;
    min-width: 15rem;
}

.tasks-report-meta-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 0.35rem;
    border-bottom: 1px dashed var(--card-border, var(--border-color, var(--bs-border-color)));
}

.tasks-report-layout-list,
.tasks-report-column-list {
    display: grid;
    gap: 0.7rem;
}

.tasks-report-layout-list {
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
}

.tasks-report-column-list {
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
}

.tasks-report-option {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.8rem 0.9rem;
    min-height: 4rem;
    border-radius: 1rem;
    border: 1px solid var(--table-border, var(--card-border, var(--border-color, var(--bs-border-color))));
    background: var(--surface, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.tasks-report-option:hover {
    background: var(--table-row-hover, var(--surface-soft, var(--surface, var(--bs-body-bg))));
    border-color: color-mix(in srgb, var(--primary, var(--bs-primary)) 30%, var(--table-border, var(--card-border, var(--border-color, var(--bs-border-color)))));
    transform: translateY(-1px);
}

.tasks-report-option input[type="checkbox"],
.tasks-report-option input[type="radio"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.tasks-report-option__body {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
    flex: 1 1 auto;
}

.tasks-report-option__name {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.35;
}

.tasks-report-option__meta {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.8rem;
    line-height: 1.3;
}

.tasks-report-option__indicator {
    width: 0.9rem;
    height: 0.9rem;
    margin-top: 0.25rem;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--primary, var(--bs-primary)) 22%, var(--table-border, var(--card-border, var(--border-color, var(--bs-border-color)))));
    background: var(--surface-muted, var(--surface-soft, var(--surface, var(--bs-body-bg))));
    box-shadow: inset 0 0 0 0.2rem var(--surface, var(--bs-body-bg));
    flex: 0 0 auto;
}

.tasks-report-option:has(input:checked) {
    background: color-mix(in srgb, var(--primary-soft, var(--surface-soft, var(--surface, var(--bs-body-bg)))) 72%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--primary, var(--bs-primary)) 36%, var(--table-border, var(--card-border, var(--border-color, var(--bs-border-color)))));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary, var(--bs-primary)) 16%, transparent);
}

.tasks-report-option:has(input:checked) .tasks-report-option__indicator {
    background: var(--primary, var(--bs-primary));
    border-color: var(--primary, var(--bs-primary));
    box-shadow: inset 0 0 0 0.2rem color-mix(in srgb, var(--surface, var(--bs-body-bg)) 82%, transparent);
}

.tasks-report-preview-note {
    margin-top: 1rem;
    margin-bottom: -0.2rem;
    padding: 0.8rem 0.95rem;
    border-radius: 0.95rem;
    border: 1px solid color-mix(in srgb, var(--bs-warning) 32%, var(--card-border, var(--border-color, var(--bs-border-color))));
    background: color-mix(in srgb, var(--bs-warning) 10%, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.9rem;
}

.tasks-report-table-wrap {
    padding: 1.2rem 0 0;
}

.tasks-report-group-list {
    display: grid;
    gap: 1.75rem;
}

.tasks-report-group {
    display: grid;
    gap: 0.35rem;
}

.tasks-report-group-title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--text-main, var(--bs-body-color));
    padding-bottom: 0.2rem;
    border-bottom: 1px solid color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 78%, transparent);
}

.tasks-report-table thead th {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    vertical-align: middle;
}

.tasks-report-table tbody td {
    padding-top: 0.7rem;
    padding-bottom: 0.7rem;
    vertical-align: top;
}

.tasks-report-date-cell {
    width: 11rem;
}

.tasks-report-date {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 620;
}

.tasks-report-name {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 650;
}

.tasks-report-context {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.25rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.85rem;
}

.tasks-report-table--wide {
    font-size: 0.92rem;
}

.tasks-report-table--wide thead th {
    font-size: 0.74rem;
}

@page {
    size: letter portrait;
    margin: 0.42in 0.45in 0.48in;
}

@media print {
    html,
    body {
        font-size: 13.3px !important;
        line-height: 1.32 !important;
        color: #111 !important;
        background: #fff !important;
    }

    .app-sidebar,
    .app-topbar,
    .offcanvas-sidebar,
    .tasks-report-screen-only {
        display: none !important;
    }

    .app-main {
        margin-left: 0 !important;
        width: 100% !important;
        min-height: auto !important;
    }

    .app-content {
        padding: 0 !important;
        background: #fff !important;
    }

    .tasks-report-page,
    .tasks-theme-page {
        background: #fff !important;
    }

    .tasks-report-sheet {
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        padding: 0 !important;
    }

    .tasks-report-sheet-header {
        gap: 0.7rem !important;
        padding-bottom: 0.55rem !important;
        margin-bottom: 0.15rem !important;
        border-bottom: 1px solid #1f2937 !important;
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .tasks-report-sheet-title {
        font-size: 20.8px !important;
        line-height: 1.1 !important;
        margin: 0.1rem 0 0.15rem !important;
        letter-spacing: -0.01em !important;
        color: #111 !important;
    }

    .tasks-report-sheet-subtitle,
    .tasks-theme-card-subtitle,
    .tasks-report-context,
    .tasks-theme-note {
        font-size: 11.7px !important;
        line-height: 1.25 !important;
        color: #4b5563 !important;
    }

    .tasks-report-sheet-meta {
        min-width: 11rem !important;
        gap: 0.25rem !important;
    }

    .tasks-report-meta-row {
        gap: 0.45rem !important;
        padding-bottom: 0.16rem !important;
        border-bottom: 1px dotted #cbd5e1 !important;
        font-size: 11.7px !important;
    }

    .tasks-report-table-wrap {
        padding-top: 0.42rem !important;
    }

    .tasks-report-group {
        break-inside: avoid;
        page-break-inside: avoid;
        gap: 0.18rem !important;
        margin-top: 0.28rem !important;
    }

    .tasks-report-group-list {
        gap: 0.8rem !important;
    }

    .tasks-report-group-title {
        font-size: 13.3px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        padding-bottom: 0.1rem !important;
        margin-bottom: 0.02rem !important;
        color: #111 !important;
        border-bottom: 1px solid #d1d5db !important;
        break-after: avoid;
        page-break-after: avoid;
    }

    .tasks-report-table {
        width: 100% !important;
        border-collapse: collapse !important;
        font-size: 11.7px !important;
    }

    .tasks-report-table thead {
        display: table-header-group !important;
    }

    .tasks-report-table tfoot {
        display: table-footer-group !important;
    }

    .tasks-report-table thead th {
        font-size: 10.4px !important;
        letter-spacing: 0.06em !important;
        padding-top: 0.28rem !important;
        padding-bottom: 0.28rem !important;
        color: #374151 !important;
        border-bottom: 1px solid #9ca3af !important;
    }

    .tasks-report-table tbody tr:hover {
        background: transparent !important;
    }

    .tasks-report-table tbody td {
        padding-top: 0.24rem !important;
        padding-bottom: 0.24rem !important;
        padding-left: 0.34rem !important;
        padding-right: 0.34rem !important;
        line-height: 1.22 !important;
        color: #111 !important;
        border-bottom: 1px solid #e5e7eb !important;
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .tasks-report-date-cell {
        width: 18% !important;
    }

    .tasks-report-date,
    .tasks-report-name {
        font-weight: 650 !important;
        color: #111 !important;
    }

    .tasks-theme-empty {
        font-size: 11.7px !important;
        color: #6b7280 !important;
        padding: 0.5rem 0 !important;
    }

    .tasks-report-table--wide {
        font-size: 10.9px !important;
    }

    .tasks-report-table--wide thead th {
        font-size: 9.9px !important;
    }

    .tasks-report-preview-note {
        display: none !important;
    }
}

@media (max-width: 1199.98px) {
    .tasks-theme-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tasks-theme-control-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tasks-theme-report-grid {
        grid-template-columns: 1fr;
    }

    .tasks-report-layout-list,
    .tasks-report-column-list {
        grid-template-columns: 1fr;
        gap: 0.65rem;
    }

    .tasks-report-filter-grid--scope,
    .tasks-report-filter-grid--options {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tasks-report-option {
        min-height: auto;
        padding: 0.78rem 0.85rem;
        border-radius: 0.95rem;
        align-items: center;
    }

    .tasks-report-option__body {
        gap: 0.14rem;
    }

    .tasks-report-option__name {
        font-size: 0.93rem;
    }

    .tasks-report-option__meta {
        font-size: 0.79rem;
        line-height: 1.28;
    }

    .tasks-report-option__indicator {
        margin-top: 0;
    }

    .tasks-report-table thead th {
        padding-top: 0.52rem;
        padding-bottom: 0.52rem;
        padding-left: 0.8rem;
        padding-right: 0.8rem;
        font-size: 0.74rem;
        letter-spacing: 0.06em;
    }
}

@media (max-width: 991.98px) {
    .tasks-theme-hero-body,
    .tasks-theme-card,
    .tasks-theme-filter {
        padding: 1rem;
    }

    .tasks-theme-actions {
        justify-content: flex-start;
    }

    .tasks-theme-form-grid,
    .tasks-theme-filter-grid,
    .tasks-theme-choice-grid {
        grid-template-columns: 1fr;
    }

    .tasks-theme-role-summary__metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tasks-theme-filter-grid > div,
    .tasks-theme-filter-grid .tasks-theme-filter-wide {
        grid-column: auto;
    }

    .tasks-theme-occurrence-assignment-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tasks-theme-occurrence-role-row,
    .tasks-theme-occurrence-person-row {
        grid-template-columns: 1fr;
    }

    .tasks-theme-occurrence-person-row {
        gap: 0.45rem;
    }

    .tasks-theme-occurrence-pills {
        width: 100%;
    }

    .task-rotation-modal__dialog {
        margin: 0.75rem;
    }

    .tasks-theme-occurrence-manager-line {
        align-items: flex-start;
    }

    .tasks-report-sheet {
        padding: 1.15rem;
    }

    .tasks-report-sheet-meta {
        min-width: 0;
        width: 100%;
    }

    .tasks-report-filter-grid--scope,
    .tasks-report-filter-grid--options,
    .tasks-report-display-grid {
        grid-template-columns: 1fr;
    }

    .tasks-report-filter-actions {
        justify-content: stretch;
    }

    .tasks-report-filter-actions .btn {
        flex: 1 1 10rem;
    }
}

@media (min-width: 576px) {
    .tasks-my-action-details {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .tasks-theme-metrics {
        grid-template-columns: 1fr;
    }

    .tasks-theme-control-grid {
        grid-template-columns: 1fr;
    }

    .tasks-theme-mini-metrics {
        grid-template-columns: 1fr;
    }

    .tasks-theme-occurrence-pills {
        gap: 0.45rem;
    }

    .tasks-theme-filter-actions {
        flex-direction: column;
    }

    .tasks-theme-filter-actions .btn {
        width: 100%;
    }

    .tasks-my-action-summary {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "title expand"
            "date expand"
            "role expand";
        align-items: center;
        gap: 0.28rem 0.7rem;
        min-height: 3.8rem;
    }

    .tasks-my-action-title {
        grid-area: title;
    }

    .tasks-my-action-date {
        grid-area: date;
        text-align: left;
    }

    .tasks-my-action-role {
        grid-area: role;
        color: var(--text-muted, var(--bs-secondary-color));
        font-size: 0.82rem;
        font-weight: 500;
        text-align: left;
    }

    .tasks-my-action-expand {
        grid-area: expand;
    }

    .tasks-theme-response-actions {
        flex-direction: column;
    }

    .tasks-theme-response-actions .btn {
        width: 100%;
    }

    .tasks-report-option {
        padding: 0.72rem 0.8rem;
    }

    .tasks-report-option__name {
        font-size: 0.91rem;
    }

    .tasks-report-option__meta {
        font-size: 0.77rem;
    }

    .tasks-report-table thead th {
        padding-top: 0.46rem;
        padding-bottom: 0.46rem;
        padding-left: 0.72rem;
        padding-right: 0.72rem;
        font-size: 0.72rem;
    }
}

/* ===== Giving themed module ===== */
.giving-theme-page,
.giving-form-page,
.giving-confirm-page {
    --giving-accent: #d78b2f;
    --giving-accent-strong: #8b5c16;
    --giving-surface: var(--surface, var(--bs-body-bg));
    --giving-surface-soft: var(--surface-soft, var(--bs-body-bg));
    --giving-border: var(--card-border, var(--border-color, var(--bs-border-color)));
    --giving-border-strong: color-mix(in srgb, var(--giving-accent) 18%, var(--card-border, var(--border-color, var(--bs-border-color))));
}

.giving-theme-shell,
.giving-theme-card,
.giving-theme-panel,
.giving-form-shell,
.giving-form-panel,
.giving-confirm-shell,
.giving-confirm-panel {
    border: 1px solid var(--giving-border);
    border-radius: 1.35rem;
    background: var(--giving-surface);
    box-shadow: var(--card-shadow, 0 16px 36px rgba(15, 23, 42, 0.08));
}

.giving-theme-hero,
.giving-form-shell,
.giving-confirm-shell {
    overflow: hidden;
    position: relative;
}

.giving-theme-hero-accent,
.giving-form-accent,
.giving-confirm-accent {
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.42rem;
    background: linear-gradient(180deg, color-mix(in srgb, var(--giving-accent) 88%, #ffffff 12%) 0%, color-mix(in srgb, var(--giving-accent-strong) 90%, #000000 10%) 100%);
}

.giving-theme-hero-body,
.giving-form-shell-body,
.giving-confirm-shell-body {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.5rem;
    padding: 1.45rem 1.5rem;
}

.giving-theme-label,
.giving-form-label,
.giving-confirm-label {
    color: var(--giving-accent-strong);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.giving-theme-title,
.giving-form-title,
.giving-confirm-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.7rem, 2.4vw, 2.15rem);
    font-weight: 750;
    line-height: 1.08;
}

.giving-theme-subtitle,
.giving-form-subtitle,
.giving-confirm-subtitle,
.giving-theme-context,
.giving-form-context,
.giving-confirm-copy,
.giving-theme-card-subtitle,
.giving-form-panel-subtitle,
.giving-confirm-panel-subtitle,
.giving-theme-table-note,
.giving-theme-empty,
.giving-theme-meta,
.giving-theme-note {
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.95rem;
    line-height: 1.6;
}

.giving-theme-context,
.giving-form-context {
    margin-top: 0.75rem;
}

.giving-theme-context-label,
.giving-form-context-label {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 600;
}

.giving-theme-actions,
.giving-form-actions,
.giving-confirm-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.giving-batch-page .giving-theme-shell {
    border-radius: 1.25rem;
}

.giving-batch-page .giving-theme-hero {
    overflow: hidden;
}

.giving-batch-page .giving-theme-hero-accent {
    width: auto;
    height: 0.5rem;
    inset: 0 0 auto 0;
    background: linear-gradient(90deg, var(--primary, var(--bs-primary)), var(--bs-info), var(--bs-danger), var(--bs-warning));
}

.giving-batch-page .giving-theme-hero-body {
    align-items: center;
    flex-wrap: wrap;
    padding: 1.5rem;
}

.giving-batch-header-block {
    min-width: 0;
}

.giving-batch-title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.giving-batch-page .giving-theme-title {
    font-size: clamp(1.75rem, 2.4vw, 2.45rem);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.035em;
}

.giving-batch-subtitle,
.giving-batch-context-line {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    color: var(--text-muted, var(--bs-secondary-color));
}

.giving-batch-subtitle {
    margin-top: 0.45rem;
    font-size: 0.92rem;
}

.giving-batch-context-line {
    margin-top: 0.65rem;
    font-size: 0.92rem;
}

.giving-batch-context-label {
    color: var(--text-muted, var(--bs-secondary-color));
    font-weight: 500;
}

.giving-batch-context-divider {
    color: var(--text-soft, var(--bs-secondary-color));
}

.giving-theme-action-warning {
    background: color-mix(in srgb, var(--bs-warning) 16%, var(--surface, var(--bs-body-bg)));
    color: var(--text-main, var(--bs-body-color));
    border: 1px solid color-mix(in srgb, var(--bs-warning) 42%, var(--card-border, var(--bs-border-color)));
}

.giving-theme-action-warning:hover,
.giving-theme-action-warning:focus-visible {
    background: color-mix(in srgb, var(--bs-warning) 24%, var(--surface, var(--bs-body-bg)));
    border-color: color-mix(in srgb, var(--bs-warning) 54%, var(--card-border, var(--bs-border-color)));
    color: var(--text-main, var(--bs-body-color));
}

.giving-theme-action-warning:focus-visible {
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--bs-warning) 22%, transparent);
}

.giving-batch-page .giving-theme-metrics {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.giving-batch-metric-card {
    position: relative;
    padding: 1.15rem;
    border-radius: 1.25rem;
}

.giving-batch-metric-card::before {
    display: none;
}

.giving-batch-metric-card .giving-theme-stat-label {
    font-size: 0.72rem;
    letter-spacing: 0.08em;
}

.giving-batch-metric-card .giving-theme-stat-value {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.04em;
    margin-top: 0.6rem;
}

.giving-batch-metric-value--compact {
    font-size: 1.05rem !important;
    letter-spacing: -0.01em !important;
    line-height: 1.35 !important;
}

.giving-batch-metric-card .giving-theme-hint {
    font-size: 0.78rem;
    margin-top: 0.25rem;
}

.giving-theme-metrics {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
    gap: 1rem;
}

.giving-theme-metric {
    position: relative;
    padding: 1.15rem 1.2rem;
    border: 1px solid var(--giving-border);
    border-radius: 1.15rem;
    background: var(--giving-surface);
    box-shadow: var(--card-shadow, 0 16px 30px rgba(15, 23, 42, 0.06));
    overflow: hidden;
}

.giving-theme-metric::before {
    content: "";
    position: absolute;
    inset: 0.95rem auto 0.95rem 0;
    width: 0.22rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--giving-accent) 78%, #ffffff 22%);
}

.giving-batch-page .giving-theme-metric::before,
.giving-report-page .giving-theme-metric::before {
    content: none;
    display: none;
}

.giving-fund-page .giving-theme-metric::before,
.giving-fund-page .giving-form-accent {
    content: none;
    display: none;
}

.giving-fund-page .giving-theme-hero-accent {
    width: auto;
    height: 0.5rem;
    inset: 0 0 auto 0;
    background: linear-gradient(
        90deg,
        var(--primary, var(--bs-primary)),
        color-mix(in srgb, var(--primary, var(--bs-primary)) 62%, var(--bs-info) 38%),
        color-mix(in srgb, var(--bs-info) 58%, var(--bs-warning) 42%)
    );
}

.giving-fund-page .giving-form-shell {
    overflow: hidden;
}

.giving-fund-page .giving-form-shell-body {
    align-items: center;
    flex-wrap: wrap;
    padding: 1.5rem;
}

.giving-fund-page .giving-form-shell::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 0.5rem;
    background: linear-gradient(
        90deg,
        var(--primary, var(--bs-primary)),
        color-mix(in srgb, var(--primary, var(--bs-primary)) 62%, var(--bs-info) 38%),
        color-mix(in srgb, var(--bs-info) 58%, var(--bs-warning) 42%)
    );
}

.giving-fund-page .giving-theme-card-body {
    padding-top: 0;
}

.giving-theme-stat-label {
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.giving-theme-stat-value {
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.5rem, 2vw, 2rem);
    font-weight: 760;
    line-height: 1.05;
    margin-top: 0.4rem;
}

.giving-theme-hint {
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.88rem;
    margin-top: 0.45rem;
}

.giving-theme-card,
.giving-theme-panel,
.giving-form-panel,
.giving-confirm-panel {
    overflow: hidden;
}

.giving-theme-card-header,
.giving-theme-panel-header,
.giving-form-panel-header,
.giving-confirm-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.1rem 1.25rem;
    border-bottom: 1px solid var(--giving-border);
    background: transparent;
}

.giving-theme-card-body,
.giving-theme-panel-body,
.giving-form-panel-body,
.giving-confirm-panel-body {
    padding: 1.2rem 1.25rem 1.25rem;
}

.giving-theme-section-title,
.giving-form-panel-title,
.giving-confirm-panel-title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.04rem;
    font-weight: 700;
    margin: 0;
}

.giving-theme-filter {
    padding: 1.2rem 1.25rem 0;
}

.giving-theme-filter-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 0.95rem 1rem;
    align-items: end;
}

.giving-theme-filter-grid > div {
    grid-column: span 2;
}

.giving-theme-filter-grid .giving-theme-filter-wide {
    grid-column: span 3;
}

.giving-theme-filter-grid .giving-theme-filter-actions {
    grid-column: span 2;
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.giving-theme-filter-grid--reports {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: start;
}

.giving-theme-filter-grid--reports > div,
.giving-theme-filter-grid--reports .giving-theme-filter-wide,
.giving-theme-filter-grid--reports .giving-theme-filter-actions {
    grid-column: span 1;
}

.giving-theme-filter-grid--reports .giving-theme-filter-wide {
    grid-column: span 1;
}

.giving-theme-filter-grid--reports .giving-theme-filter-actions {
    grid-column: 1 / -1;
    align-self: start;
    justify-content: flex-start;
    padding-top: 0.2rem;
}

.giving-theme-table-wrap {
    padding: 0 1.25rem 1.25rem;
}

.giving-theme-table {
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--table-border, var(--giving-border));
    margin: 0;
}

.giving-theme-table > :not(caption) > * > * {
    padding: 0.95rem 1rem;
    border-color: var(--table-border, var(--giving-border));
    vertical-align: middle;
}

.giving-theme-table tbody tr:hover > * {
    background: color-mix(in srgb, var(--giving-accent) 7%, var(--surface-soft, var(--surface, var(--bs-body-bg))));
}

.giving-report-page .giving-theme-metric::before {
    display: none;
}

.giving-report-page .giving-theme-metric {
    padding-left: 1.2rem;
}

.giving-report-page .giving-theme-filter {
    padding-bottom: 1.2rem;
}

.giving-theme-list {
    display: grid;
    gap: 0.8rem;
}

.giving-theme-list-item,
.giving-theme-item-card,
.giving-theme-workflow-step {
    border: 1px solid var(--giving-border);
    border-radius: 1rem;
    background: color-mix(in srgb, var(--giving-surface) 88%, var(--surface-soft, var(--bs-body-bg)) 12%);
    padding: 0.95rem 1rem;
}

.giving-theme-item-title {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 650;
}

.giving-theme-status,
.giving-theme-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.28rem 0.72rem;
    border-radius: 999px;
    border: 1px solid var(--giving-border-strong);
    background: color-mix(in srgb, var(--giving-accent) 10%, var(--giving-surface));
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1;
}

.giving-theme-status--posted,
.giving-theme-status--active,
.giving-theme-pill--success {
    border-color: color-mix(in srgb, var(--bs-success) 40%, var(--giving-border));
    background: color-mix(in srgb, var(--bs-success) 12%, var(--giving-surface));
    color: color-mix(in srgb, var(--bs-success) 88%, var(--text-main, var(--bs-body-color)));
}

.giving-theme-status--open,
.giving-theme-pill--warning {
    border-color: color-mix(in srgb, var(--bs-warning) 42%, var(--giving-border));
    background: color-mix(in srgb, var(--bs-warning) 12%, var(--giving-surface));
    color: color-mix(in srgb, var(--bs-warning) 76%, var(--text-main, var(--bs-body-color)));
}

.giving-theme-status--inactive,
.giving-theme-pill--neutral {
    border-color: var(--giving-border);
    background: color-mix(in srgb, var(--surface-soft, var(--surface, var(--bs-body-bg))) 72%, var(--giving-surface) 28%);
    color: var(--text-muted, var(--bs-secondary-color));
}

.giving-theme-status--danger,
.giving-theme-pill--danger {
    border-color: color-mix(in srgb, var(--bs-danger) 42%, var(--giving-border));
    background: color-mix(in srgb, var(--bs-danger) 10%, var(--giving-surface));
    color: color-mix(in srgb, var(--bs-danger) 84%, var(--text-main, var(--bs-body-color)));
}

.giving-theme-empty {
    text-align: center;
    padding: 2.25rem 1rem;
}

.giving-theme-empty p:last-child {
    margin-bottom: 0;
}

.giving-theme-chart-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.giving-theme-chart-card {
    border: 1px solid var(--giving-border);
    border-radius: 1.15rem;
    background: var(--giving-surface);
    padding: 1rem;
}

.giving-theme-chart-shell {
    max-width: 220px;
    height: 220px;
    margin: 0 auto;
}

.giving-theme-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.giving-theme-form-grid .giving-theme-field--full {
    grid-column: 1 / -1;
}

.giving-theme-check {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.9rem 1rem;
    border: 1px solid var(--giving-border);
    border-radius: 1rem;
    background: color-mix(in srgb, var(--surface-soft, var(--bs-body-bg)) 38%, var(--giving-surface) 62%);
}

.giving-confirm-blockers {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.85rem;
}

.giving-confirm-blockers li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0.95rem 1rem;
    border: 1px solid var(--giving-border);
    border-radius: 1rem;
    background: color-mix(in srgb, var(--surface-soft, var(--bs-body-bg)) 42%, var(--giving-surface) 58%);
}

.giving-confirm-blocker-count {
    min-width: 2.3rem;
    height: 2.3rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 1px solid var(--giving-border-strong);
    font-weight: 700;
}

.giving-theme-modal .modal-content {
    border: 1px solid var(--giving-border);
    border-radius: 1.2rem;
    overflow: hidden;
    background: var(--giving-surface);
    box-shadow: var(--card-shadow, 0 18px 36px rgba(15, 23, 42, 0.14));
}

.giving-theme-modal .modal-header {
    background: var(--surface, var(--bs-body-bg));
    border-bottom-color: var(--giving-border);
}

.giving-theme-modal .modal-footer {
    border-top-color: var(--giving-border);
}

.giving-theme-report-section {
    border: 1px solid var(--giving-border);
    border-radius: 1.15rem;
    overflow: hidden;
    background: var(--giving-surface);
    box-shadow: var(--card-shadow, 0 12px 28px rgba(15, 23, 42, 0.06));
}

.giving-theme-report-header {
    padding: 1rem 1.1rem 0.95rem;
    background: color-mix(in srgb, var(--giving-surface) 90%, var(--surface-soft, var(--bs-body-bg)) 10%);
    border-bottom: 1px solid var(--giving-border);
}

.giving-theme-report-subtotal > th,
.giving-theme-report-subtotal > td {
    background: color-mix(in srgb, var(--giving-accent) 8%, var(--giving-surface)) !important;
    font-weight: 700;
}

.giving-theme-report-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.2rem;
    border: 1px solid var(--giving-border-strong);
    border-radius: 1.15rem;
    background: color-mix(in srgb, var(--giving-surface) 90%, var(--surface-soft, var(--bs-body-bg)) 10%);
}

.giving-theme-note-cell {
    max-width: 380px;
    white-space: normal;
    overflow-wrap: anywhere;
}

.giving-theme-report-table {
    table-layout: fixed;
    width: 100%;
}

.giving-theme-report-table .col-person { width: 24%; }
.giving-theme-report-table .col-fund { width: 20%; }
.giving-theme-report-table .col-method { width: 14%; }
.giving-theme-report-table .col-amount { width: 12%; }
.giving-theme-report-table .col-note { width: 30%; }

.giving-theme-summary-table th {
    color: var(--text-main, var(--bs-body-color));
    font-weight: 650;
}

.giving-theme-page .btn-outline-secondary,
.giving-theme-page .btn-outline-secondary.theme-action-outline,
.giving-form-page .btn-outline-secondary,
.giving-form-page .btn-outline-secondary.theme-action-outline,
.giving-confirm-page .btn-outline-secondary,
.giving-confirm-page .btn-outline-secondary.theme-action-outline {
    background: var(--btn-outline-neutral-bg, transparent) !important;
    border-color: var(--btn-outline-neutral-border, var(--giving-border)) !important;
    color: var(--btn-outline-neutral-text, var(--text-main, var(--bs-body-color))) !important;
}

.giving-theme-page .btn-outline-secondary:hover,
.giving-theme-page .btn-outline-secondary.theme-action-outline:hover,
.giving-form-page .btn-outline-secondary:hover,
.giving-form-page .btn-outline-secondary.theme-action-outline:hover,
.giving-confirm-page .btn-outline-secondary:hover,
.giving-confirm-page .btn-outline-secondary.theme-action-outline:hover {
    background: var(--btn-outline-neutral-hover-bg, var(--surface-soft)) !important;
    color: var(--btn-outline-neutral-hover-text, var(--text-main, var(--bs-body-color))) !important;
}

.giving-theme-page .btn-outline-danger,
.giving-form-page .btn-outline-danger,
.giving-confirm-page .btn-outline-danger {
    color: var(--bs-danger) !important;
    border-color: color-mix(in srgb, var(--bs-danger) 45%, var(--giving-border)) !important;
}

.giving-theme-page .btn-outline-danger:hover,
.giving-form-page .btn-outline-danger:hover,
.giving-confirm-page .btn-outline-danger:hover {
    color: #fff !important;
}

@media (max-width: 1199.98px) {
    .giving-batch-page .giving-theme-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .giving-theme-filter-grid > div,
    .giving-theme-filter-grid .giving-theme-filter-wide,
    .giving-theme-filter-grid .giving-theme-filter-actions {
        grid-column: span 3;
    }

    .giving-theme-filter-grid--reports {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .giving-theme-filter-grid--reports > div,
    .giving-theme-filter-grid--reports .giving-theme-filter-wide,
    .giving-theme-filter-grid--reports .giving-theme-filter-actions {
        grid-column: span 1;
    }

    .giving-theme-filter-grid--reports .giving-theme-filter-wide {
        grid-column: span 2;
    }

    .giving-theme-filter-grid--reports .giving-theme-filter-actions {
        grid-column: 1 / -1;
    }
}

@media (max-width: 991.98px) {
    .giving-theme-hero-body,
    .giving-form-shell-body,
    .giving-confirm-shell-body,
    .giving-theme-card-header,
    .giving-theme-panel-header,
    .giving-form-panel-header,
    .giving-confirm-panel-header {
        flex-direction: column;
        align-items: stretch;
    }

    .giving-theme-chart-grid,
    .giving-theme-form-grid {
        grid-template-columns: 1fr;
    }

    .giving-batch-page .giving-theme-hero-body {
        padding: 1.25rem;
    }

    .giving-batch-page .giving-theme-metrics {
        grid-template-columns: 1fr;
    }

    .giving-theme-filter-grid > div,
    .giving-theme-filter-grid .giving-theme-filter-wide,
    .giving-theme-filter-grid .giving-theme-filter-actions {
        grid-column: span 6;
    }

    .giving-theme-filter-grid--reports {
        grid-template-columns: 1fr;
    }

    .giving-theme-filter-grid--reports > div,
    .giving-theme-filter-grid--reports .giving-theme-filter-wide,
    .giving-theme-filter-grid--reports .giving-theme-filter-actions {
        grid-column: 1 / -1;
    }
}

@media (max-width: 767.98px) {
    .giving-theme-table-wrap,
    .giving-theme-filter,
    .giving-theme-card-body,
    .giving-theme-panel-body,
    .giving-form-panel-body,
    .giving-confirm-panel-body {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .giving-theme-hero-body,
    .giving-form-shell-body,
    .giving-confirm-shell-body,
    .giving-theme-card-header,
    .giving-theme-panel-header,
    .giving-form-panel-header,
    .giving-confirm-panel-header {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .giving-batch-page .giving-theme-hero-body {
        padding: 1rem;
    }

    .giving-theme-filter-grid > div,
    .giving-theme-filter-grid .giving-theme-filter-wide,
    .giving-theme-filter-grid .giving-theme-filter-actions {
        grid-column: 1 / -1;
    }
}

/* ===== Worship module ===== */
.worship-chart-summary {
    align-items: stretch;
}

.worship-chart-summary-card {
    height: 100%;
    padding: 0.9rem 1rem;
    border: 1px solid color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 88%, transparent);
    border-radius: 1rem;
    background: color-mix(in srgb, var(--surface, var(--bs-body-bg)) 92%, var(--surface-2, var(--bs-light)) 8%);
}

.worship-chart-body {
    padding-top: 0.95rem;
}

.worship-chart-view {
    border: 1px solid color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 90%, transparent);
    border-radius: 1rem;
    background: color-mix(in srgb, var(--surface, var(--bs-body-bg)) 94%, var(--surface-2, var(--bs-light)) 6%);
    overflow: hidden;
}

.worship-chart-view__header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem 1rem;
    padding: 0.95rem 1.05rem 0.85rem;
    border-bottom: 1px solid color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 88%, transparent);
}

.worship-chart-view__title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.02rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 0.22rem;
}

.worship-chart-view__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.9rem;
}

.worship-chart-pre {
    margin: 0;
    padding: 1.2rem 1.05rem 1.25rem;
    border: 0;
    background: transparent;
    color: var(--text-main, var(--bs-body-color));
    font-family: "Consolas", "Courier New", monospace;
    font-size: 1rem;
    line-height: 1.72;
    white-space: pre-wrap;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.worship-chart-chord {
    color: color-mix(in srgb, var(--bs-warning) 52%, var(--bs-danger) 48%);
    font-weight: 700;
}

.worship-song-print-page {
    background: var(--surface-soft, color-mix(in srgb, var(--surface, var(--bs-body-bg)) 92%, var(--surface-2, var(--bs-light)) 8%));
    color: var(--text-main, var(--text, var(--bs-body-color)));
}

.worship-song-print-shell {
    max-width: 8.5in;
    margin: 0 auto;
    padding: 1.25rem;
}

.worship-song-print-toolbar {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.worship-song-print-article {
    background: var(--surface, var(--bs-body-bg));
    border: 1px solid color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 90%, transparent);
    border-radius: 1rem;
    padding: 1.25rem;
}

.worship-song-print-header {
    margin-bottom: 1rem;
    padding-bottom: 0.9rem;
    border-bottom: 1px solid color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 90%, transparent);
}

.worship-song-print-title {
    margin: 0 0 0.4rem;
    font-size: 1.7rem;
    line-height: 1.15;
    color: var(--text-main, var(--text, var(--bs-body-color)));
}

.worship-song-print-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.42rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.96rem;
}

.worship-song-print-chart {
    border-radius: 0.85rem;
}

.worship-song-print-chart .worship-chart-pre {
    padding-top: 0.85rem;
}

.worship-song-print-empty {
    padding: 1rem 0;
}

.worship-song-print-notes {
    margin-top: 1rem;
    padding-top: 0.9rem;
    border-top: 1px solid color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 90%, transparent);
}

.worship-song-print-notes-title {
    margin: 0 0 0.55rem;
    font-size: 1rem;
    color: var(--text-main, var(--text, var(--bs-body-color)));
}

.worship-setlist-print-shell {
    max-width: 8.5in;
}

.worship-setlist-print-article {
    padding-bottom: 1rem;
}

.worship-setlist-print-header {
    margin-bottom: 1.1rem;
}

.worship-setlist-print-summary {
    margin-top: 0.8rem;
    color: var(--text-main, var(--text, var(--bs-body-color)));
}

.worship-setlist-print-item {
    padding-top: 1rem;
    margin-top: 1rem;
    border-top: 1px solid color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 90%, transparent);
}

.worship-setlist-print-item:first-of-type {
    padding-top: 0;
    margin-top: 0;
    border-top: 0;
}

.worship-setlist-print-item__header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 0.6rem 1rem;
    margin-bottom: 0.65rem;
}

.worship-setlist-print-item__order {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 0.25rem;
}

.worship-setlist-print-item__title {
    margin: 0;
    font-size: 1.2rem;
    line-height: 1.2;
    color: var(--text-main, var(--text, var(--bs-body-color)));
}

.worship-setlist-print-item__artist {
    margin-top: 0.18rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.92rem;
}

.worship-setlist-print-item__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.42rem;
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.92rem;
}

.worship-setlist-print-item__notes {
    margin-bottom: 0.55rem;
    color: var(--text-main, var(--text, var(--bs-body-color)));
}

.worship-setlist-print-chart .worship-chart-pre {
    padding-top: 0.7rem;
}

@media (max-width: 767.98px) {
    .worship-chart-view__header {
        padding: 0.9rem 0.95rem 0.8rem;
    }

    .worship-chart-pre {
        padding: 1rem 0.95rem 1.1rem;
        font-size: 0.95rem;
        line-height: 1.64;
    }

    .worship-song-print-shell {
        padding: 0.8rem;
    }

    .worship-song-print-article {
        padding: 1rem;
    }

    .worship-song-print-title {
        font-size: 1.4rem;
    }

    .worship-setlist-print-item__title {
        font-size: 1.05rem;
    }

    .worship-setlist-print-item__meta {
        justify-content: flex-start;
    }
}

@media print {
    html,
    body {
        margin: 0 !important;
        padding: 0 !important;
        height: auto !important;
        min-height: 0 !important;
    }

    .app-messages {
        display: none !important;
    }

    .worship-chart-screen-tools {
        display: none !important;
    }

    .worship-chart-summary {
        margin-top: 0 !important;
        margin-bottom: 0.4rem !important;
    }

    .worship-chart-summary-card,
    .worship-chart-view {
        border-color: #d1d5db !important;
        box-shadow: none !important;
        background: #fff !important;
    }

    .worship-chart-view__header {
        padding: 0.55rem 0.7rem 0.5rem !important;
        border-bottom-color: #d1d5db !important;
    }

    .worship-chart-view__title {
        font-size: 14.4px !important;
        color: #111 !important;
        margin-bottom: 0.16rem !important;
    }

    .worship-chart-view__meta {
        font-size: 11.4px !important;
        color: #4b5563 !important;
    }

    .worship-chart-pre {
        padding: 0.75rem 0.7rem 0.85rem !important;
        font-size: 12.2px !important;
        line-height: 1.5 !important;
        color: #111 !important;
        white-space: pre-wrap !important;
        page-break-inside: auto !important;
        break-inside: auto !important;
    }

    .worship-chart-chord {
        color: color-mix(in srgb, var(--bs-warning) 52%, var(--bs-danger) 48%) !important;
    }

    @page {
        size: letter portrait;
        margin: 0.5in;
    }

    .worship-song-print-page {
        background: transparent !important;
        color: var(--text-main, var(--text, var(--bs-body-color))) !important;
        overflow: visible !important;
    }

    .worship-song-print-shell {
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    .worship-song-print-article {
        display: block !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        padding: 0 !important;
        background: transparent !important;
        overflow: visible !important;
    }

    .worship-song-print-header,
    .worship-song-print-notes {
        border-color: color-mix(in srgb, var(--card-border, var(--border-color, var(--bs-border-color))) 90%, transparent) !important;
    }

    .worship-song-print-title {
        font-size: 18px !important;
    }

    .worship-song-print-meta {
        font-size: 12px !important;
    }

    .worship-song-print-chart {
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        overflow: visible !important;
        page-break-inside: auto !important;
        break-inside: auto !important;
    }

    .worship-song-print-header {
        margin-bottom: 0.45rem !important;
        padding-bottom: 0.45rem !important;
    }

    .worship-song-print-chart .worship-chart-pre {
        margin: 0 !important;
        padding-top: 0.38rem !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        padding-bottom: 0 !important;
    }

    .worship-song-print-notes {
        page-break-inside: avoid !important;
        break-inside: avoid !important;
    }

    .worship-setlist-print-header {
        margin-bottom: 0.7rem !important;
    }

    .worship-setlist-print-summary {
        margin-top: 0.45rem !important;
    }

    .worship-setlist-print-item {
        margin-top: 0.75rem !important;
        padding-top: 0.75rem !important;
        page-break-inside: avoid !important;
        break-inside: avoid !important;
    }

    .worship-setlist-print-item__header {
        margin-bottom: 0.35rem !important;
    }

    .worship-setlist-print-item__title {
        font-size: 15px !important;
    }

    .worship-setlist-print-item__artist,
    .worship-setlist-print-item__meta,
    .worship-setlist-print-item__notes {
        font-size: 11.5px !important;
    }

    .worship-setlist-print-chart {
        border: 0 !important;
        background: transparent !important;
    }

.worship-setlist-print-chart .worship-chart-pre {
    padding-top: 0.2rem !important;
}
}




.photo-crop-modal-subtitle {
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.9rem;
}

.photo-crop-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(8rem, 11rem);
    gap: 1.25rem;
    align-items: start;
}

.photo-crop-main {
    display: grid;
    gap: 0.85rem;
    min-width: 0;
}

.photo-crop-workspace {
    width: 100%;
    min-height: 18rem;
    max-height: 24rem;
    border: 1px solid var(--card-border, var(--bs-border-color));
    border-radius: 1rem;
    overflow: hidden;
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.photo-crop-image {
    display: block;
    max-width: 100%;
}

.photo-crop-placeholder {
    min-height: 18rem;
    display: grid;
    place-items: center;
    gap: 0.65rem;
    text-align: center;
    border: 1px dashed var(--card-border, var(--bs-border-color));
    border-radius: 1rem;
    color: var(--text-muted, var(--bs-secondary-color));
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.photo-crop-placeholder .pi {
    font-size: 1.8rem;
    color: var(--primary, var(--bs-primary));
}

.photo-crop-alert {
    border: 1px solid color-mix(in srgb, var(--bs-danger) 40%, var(--card-border, var(--bs-border-color)));
    border-radius: 0.8rem;
    padding: 0.65rem 0.8rem;
    color: var(--bs-danger);
    background: color-mix(in srgb, var(--bs-danger) 8%, var(--surface, var(--bs-body-bg)));
    font-size: 0.9rem;
}

.photo-crop-zoom-label,
.photo-crop-preview-label {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.85rem;
    font-weight: 600;
}

.photo-crop-preview-panel {
    display: grid;
    gap: 0.75rem;
    justify-items: center;
    padding: 1rem;
    border: 1px solid var(--card-border, var(--bs-border-color));
    border-radius: 1rem;
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.photo-crop-preview {
    width: 7rem;
    height: 7rem;
    overflow: hidden;
    display: block;
    position: relative;
    border: 1px solid var(--card-border, var(--bs-border-color));
    background: var(--surface, var(--bs-body-bg));
}

.photo-crop-preview:not(.photo-crop-preview--active) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.photo-crop-preview:not(.photo-crop-preview--active) img,
.photo-crop-preview:not(.photo-crop-preview--active) .profile-avatar,
.photo-crop-preview:not(.photo-crop-preview--active) .household-workspace-identity__icon {
    width: 100%;
    height: 100%;
}

.photo-crop-preview--active img {
    max-width: none;
}

.photo-crop-preview--round {
    border-radius: 999px;
}

.photo-crop-preview--rounded {
    border-radius: 1rem;
}

.photo-upload-actions .btn {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

@media (max-width: 767.98px) {
    .photo-crop-grid {
        grid-template-columns: 1fr;
    }

    .photo-crop-workspace,
    .photo-crop-placeholder {
        min-height: 14rem;
    }

    .photo-upload-actions {
        justify-content: stretch;
    }

    .photo-upload-actions .btn,
    .photo-upload-actions form {
        width: 100%;
    }
}



/* Person profile workspace refinements */
.profile-profile-workspace {
    display: grid;
    gap: 1rem;
}

.profile-profile-workspace .profile-section-heading-row {
    margin-bottom: 1rem !important;
}

.profile-personal-panel .profile-info-grid,
.profile-custom-field-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem 1.35rem;
}

.profile-profile-workspace .profile-info-row,
.profile-custom-field-grid .profile-info-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.16rem;
    align-items: start;
    min-width: 0;
}

.profile-profile-workspace .profile-info-label,
.profile-custom-field-grid .profile-info-label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    line-height: 1.15;
    text-transform: uppercase;
    white-space: normal;
}

.profile-profile-workspace .profile-info-value,
.profile-custom-field-grid .profile-info-value {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.98rem;
    font-weight: 650;
    line-height: 1.3;
}

.profile-assessment-compact-panel {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.profile-assessment-compact-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(16rem, 0.75fr) auto;
    align-items: center;
    gap: 1rem;
    min-width: 0;
}

.profile-assessment-compact-row--empty {
    grid-template-columns: minmax(0, 1fr) auto;
}

.profile-assessment-compact-main {
    display: grid;
    gap: 0.22rem;
    min-width: 0;
}

.profile-assessment-compact-matches {
    display: grid;
    gap: 0.12rem;
    min-width: 0;
}

.profile-assessment-compact-matches .profile-assessment-top-row {
    padding: 0.28rem 0;
}

@media (max-width: 991.98px) {
    .profile-personal-panel .profile-info-grid,
    .profile-custom-field-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .profile-personal-panel .profile-info-grid,
    .profile-custom-field-grid {
        grid-template-columns: 1fr;
    }

    .profile-assessment-compact-row,
    .profile-assessment-compact-row--empty {
        grid-template-columns: 1fr;
        align-items: start;
    }
}
.profile-profile-workspace > .profile-panel.mt-4 {
    margin-top: 0 !important;
}

/* Person Family household summary */
.person-profile-page .family-household-summary-card {
    padding: 0;
    overflow: hidden;
}

.person-profile-page .family-household-summary {
    display: grid;
    grid-template-columns: 96px 340px 180px 1fr auto;
    align-items: center;
    gap: 22px;
    padding: 20px 24px;
}

.person-profile-page .family-household-summary__photo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 96px;
    height: 96px;
    overflow: hidden;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1.15rem;
    background: var(--primary-soft, var(--surface-soft));
    color: var(--primary, var(--bs-primary));
}

.person-profile-page .family-household-summary__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.person-profile-page .family-household-summary__photo .pi {
    font-size: 2rem;
}

.person-profile-page .family-household-summary__info {
    display: grid;
    gap: 0.38rem;
    min-width: 0;
}

.person-profile-page .family-household-summary__title-row {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.person-profile-page .family-household-summary__title-row > .pi {
    color: var(--primary, var(--bs-primary));
    font-size: 1.05rem;
}

.person-profile-page .family-household-summary__title {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.1rem;
    font-weight: 750;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.person-profile-page .family-household-summary__meta,
.person-profile-page .family-household-summary__address {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.9rem;
    line-height: 1.4;
}

.person-profile-page .family-household-summary__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.55rem;
}

.person-profile-page .family-household-summary__address {
    display: flex;
    align-items: flex-start;
    gap: 0.42rem;
}

.person-profile-page .family-household-summary__address .pi {
    color: var(--primary, var(--bs-primary));
    margin-top: 0.12rem;
}

.person-profile-page .family-household-summary__relationship {
    display: grid;
    gap: 0.22rem;
    min-width: 0;
}

.person-profile-page .family-household-summary__label {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.15;
    text-transform: uppercase;
}

.person-profile-page .family-household-summary__relationship strong {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.02rem;
    font-weight: 700;
    line-height: 1.25;
}

.person-profile-page .family-household-summary__relationship span:last-child {
    color: var(--text-muted, var(--muted, var(--bs-secondary-color)));
    font-size: 0.86rem;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.person-profile-page .family-household-summary__action {
    align-self: center;
    justify-self: end;
    white-space: nowrap;
}

@media (max-width: 991.98px) {
    .person-profile-page .family-household-summary {
        grid-template-columns: 96px minmax(0, 1fr) auto;
    }

    .person-profile-page .family-household-summary__relationship {
        grid-column: 2 / 3;
    }

    .person-profile-page .family-household-summary__action {
        grid-column: 3 / 4;
        grid-row: 1 / 3;
    }
}

@media (max-width: 767.98px) {
    .person-profile-page .family-household-summary {
        grid-template-columns: auto minmax(0, 1fr);
        align-items: flex-start;
        row-gap: 0.9rem;
        padding: 1rem;
    }

    .person-profile-page .family-household-summary__photo {
        width: 4.5rem;
        height: 4.5rem;
    }

    .person-profile-page .family-household-summary__relationship,
    .person-profile-page .family-household-summary__action {
        grid-column: 1 / -1;
    }

    .person-profile-page .family-household-summary__action {
        justify-self: start;
    }
}






/* Assessment visual question blocks */
.assessment-question-block__prompt {
    margin-bottom: 1.25rem;
    color: var(--text-main, var(--bs-body-color));
    font-size: clamp(1.1rem, 2vw, 1.35rem);
    font-weight: 650;
    line-height: 1.45;
}

.assessment-question-block__rows {
    display: grid;
    gap: 1rem;
}

.assessment-question-block__row {
    min-width: 0;
    margin: 0;
    padding: 1rem;
    border: 1px solid var(--card-border, var(--bs-border-color));
    border-radius: 1rem;
    background: var(--surface, var(--bs-body-bg));
}

.assessment-question-block__row legend {
    float: none;
    width: auto;
    margin: 0 0 0.75rem;
    color: var(--text-main, var(--bs-body-color));
    font-size: 1rem;
    font-weight: 650;
    line-height: 1.4;
}

.assessment-question-block__context {
    margin: -0.35rem 0 0.75rem;
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.9rem;
}

.assessment-question-block__options {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
    gap: 0.65rem;
}

.assessment-question-block__option {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-height: 3rem;
    padding: 0.7rem 0.8rem;
    border: 1px solid var(--input-border, var(--bs-border-color));
    border-radius: 0.75rem;
    background: var(--input-bg, var(--bs-body-bg));
    color: var(--text-main, var(--bs-body-color));
    cursor: pointer;
}

.assessment-question-block__option:has(input:checked) {
    border-color: var(--primary, var(--bs-primary));
    background: color-mix(in srgb, var(--primary, var(--bs-primary)) 9%, var(--surface, var(--bs-body-bg)));
}

.assessment-question-block__option:focus-within {
    outline: 3px solid color-mix(in srgb, var(--primary, var(--bs-primary)) 45%, transparent);
    outline-offset: 2px;
}

.assessment-question-block__row--invalid {
    border-color: var(--bs-danger);
}

.assessment-question-block__error {
    margin: 0.65rem 0 0;
    color: var(--bs-danger);
    font-size: 0.88rem;
    font-weight: 600;
}

@media (max-width: 575.98px) {
    .assessment-question-block__row {
        padding: 0.85rem;
    }

    .assessment-question-block__options {
        grid-template-columns: 1fr;
    }
}

/* Ministry Discovery results dashboard */
.ministry-results {
    --discovery-coral: #FCA47C;
    --discovery-cyan: #23CED9;
    --discovery-gold: #F9D779;
    --discovery-sage: #A1CCA6;
    --discovery-teal: #097C87;
    --discovery-navy: #0d2145;
    --discovery-track: #e8eef2;
    width: 100%;
    max-width: none;
    margin-inline: 0;
    padding-bottom: 1.75rem;
    color: var(--discovery-navy);
}
.ministry-results-overview,
.ministry-top-card,
.ministry-role-list-panel,
.ministry-role-detail,
.ministry-results-feedback {
    border: 1px solid color-mix(in srgb, var(--border-color, #d9dee7) 82%, #b7dce1);
    border-radius: .9rem;
    background: var(--card-bg, #fff);
    box-shadow: 0 .35rem 1.15rem rgba(15, 65, 78, .055);
}
.ministry-results-overview { margin-bottom: 1.15rem; overflow: hidden; }
.ministry-results-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(17rem, 19rem);
    gap: 2rem;
    align-items: center;
    padding: 1.35rem 1.5rem 1.15rem;
}
.ministry-results-hero__summary { display: grid; grid-template-columns: 4.25rem minmax(0, 1fr); gap: 1rem; align-items: start; }
.ministry-results-hero__icon,
.ministry-section-icon {
    display: grid;
    place-items: center;
    width: 4.25rem;
    height: 4.25rem;
    border-radius: 50%;
    background: color-mix(in srgb, var(--discovery-coral) 15%, #fff);
    color: #ff7d43;
    font-size: 1.7rem;
}
.ministry-results-hero h1 { margin: .1rem 0 .45rem; color: var(--discovery-navy); font-size: clamp(1.7rem, 3vw, 2.15rem); line-height: 1.08; font-weight: 800; }
.ministry-results-hero__copy > p { max-width: 47rem; margin: 0; color: var(--muted-color, #53657a); font-size: .87rem; line-height: 1.48; }
.ministry-results-hero__meta { display: flex; flex-wrap: wrap; gap: .35rem .8rem; margin-top: .55rem; color: var(--muted-color, #667085); font-size: .68rem; }
.ministry-results-status { display: inline-flex; align-items: center; gap: .28rem; color: var(--discovery-teal); font-weight: 750; }
.ministry-confidence-card {
    display: grid;
    grid-template-columns: 2.35rem minmax(0, 1fr);
    gap: .65rem;
    align-items: start;
    padding: .9rem 1rem;
    border: 1px solid color-mix(in srgb, var(--discovery-cyan) 23%, var(--border-color, #d9dee7));
    border-radius: .7rem;
    background: color-mix(in srgb, var(--discovery-cyan) 4%, var(--card-bg, #fff));
    box-shadow: none;
}
.ministry-confidence-card__icon { display: grid; place-items: center; width: 2.35rem; height: 2.35rem; color: var(--discovery-teal); font-size: 1.4rem; }
.ministry-confidence-card__copy { display: grid; line-height: 1.22; }
.ministry-confidence-card__copy > span { font-size: .72rem; font-weight: 800; }
.ministry-confidence-card__copy > strong { font-size: .92rem; }
.ministry-confidence-card__copy > p { margin: .35rem 0 0; color: var(--muted-color, #5e6f82); font-size: .69rem; line-height: 1.38; }
.ministry-confidence-meter { grid-column: 2; display: grid; grid-template-columns: repeat(3, 1fr); gap: .22rem; }
.ministry-confidence-meter span { height: .24rem; border-radius: 999px; background: var(--discovery-track); }
.ministry-confidence-meter--low span:first-child,
.ministry-confidence-meter--moderate span:nth-child(-n+2),
.ministry-confidence-meter--high span { background: var(--discovery-teal); }
.ministry-results-journey { padding: .3rem 1.5rem 1rem; }
.ministry-results-journey ol { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .25rem; margin: 0; padding: 0; list-style: none; }
.ministry-results-journey ol::before { content: ""; position: absolute; top: .72rem; left: 10%; right: 10%; height: 2px; background: linear-gradient(90deg, var(--discovery-cyan) 0 79%, color-mix(in srgb, var(--discovery-coral) 50%, var(--discovery-track)) 79%); }
.ministry-results-journey li { position: relative; z-index: 1; display: grid; justify-items: center; gap: .35rem; text-align: center; }
.ministry-results-journey li > span { display: grid; place-items: center; width: 1.48rem; height: 1.48rem; border-radius: 50%; background: #079cad; color: #fff; font-size: .64rem; box-shadow: 0 0 0 3px var(--card-bg, #fff); }
.ministry-results-journey li.is-final > span { background: #f58a27; }
.ministry-results-journey li strong { font-size: .68rem; line-height: 1.2; }
.ministry-results-top { margin-bottom: 1.1rem; padding: 0 .95rem; }
.ministry-results-section-heading { display: flex; align-items: center; gap: .65rem; margin: 0 0 .75rem; }
.ministry-section-icon { width: 2rem; height: 2rem; background: transparent; color: var(--discovery-teal); font-size: 1.4rem; }
.ministry-results-section-heading h2 { margin: 0; color: var(--discovery-navy); font-size: 1.25rem; font-weight: 800; }
.ministry-results-section-heading p { margin: .08rem 0 0; color: var(--muted-color, #607085); font-size: .72rem; line-height: 1.35; }
.ministry-results-section-heading--plain { margin-bottom: .7rem; }
.ministry-top-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .85rem; }
.ministry-top-card {
    --card-accent: var(--discovery-coral);
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 4.8rem;
    grid-template-areas: "rank rank" "identity ring" "copy copy";
    gap: .55rem .8rem;
    align-items: center;
    min-height: 10.6rem;
    padding: .85rem 1rem .9rem;
    overflow: hidden;
}
.ministry-top-card--1 { --card-accent: #ff914d; background: color-mix(in srgb, var(--discovery-coral) 5%, var(--card-bg, #fff)); }
.ministry-top-card--2 { --card-accent: #08a6b5; background: color-mix(in srgb, var(--discovery-cyan) 4%, var(--card-bg, #fff)); }
.ministry-top-card--3 { --card-accent: #69b784; background: color-mix(in srgb, var(--discovery-sage) 7%, var(--card-bg, #fff)); }
.ministry-rank { grid-area: rank; justify-self: start; min-width: 2.45rem; padding: .18rem .48rem; border-radius: .28rem .28rem .55rem .28rem; background: color-mix(in srgb, var(--card-accent) 85%, #fff); color: #fff; font-size: .69rem; font-weight: 900; }
.ministry-top-card__identity { grid-area: identity; display: grid; grid-template-columns: 2.8rem minmax(0, 1fr); gap: .65rem; align-items: center; }
.ministry-role-icon { display: grid; place-items: center; width: 2.8rem; height: 2.8rem; border-radius: 50%; background: color-mix(in srgb, var(--card-accent, var(--discovery-teal)) 13%, #fff); color: var(--card-accent, var(--discovery-teal)); font-size: 1.35rem; }
.ministry-top-card h3 { margin: 0; color: var(--discovery-navy); font-size: 1rem; line-height: 1.2; font-weight: 800; }
.ministry-percentage-ring { grid-area: ring; position: relative; display: grid; place-items: center; width: 4.55rem; height: 4.55rem; border-radius: 50%; background: conic-gradient(var(--card-accent) calc(var(--match-percent) * 1%), var(--discovery-track) 0); }
.ministry-percentage-ring::before { content: ""; position: absolute; inset: .43rem; border-radius: 50%; background: var(--card-bg, #fff); }
.ministry-percentage-ring span { position: relative; color: var(--discovery-navy); font-size: 1rem; font-weight: 900; }
.ministry-top-card > p { grid-area: copy; min-height: 2.55rem; margin: 0; color: var(--muted-color, #506176); font-size: .72rem; line-height: 1.42; }
.ministry-role-analysis { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(22rem, .92fr); gap: .9rem; align-items: stretch; padding: 0 .95rem; }
.ministry-role-list-panel,
.ministry-role-detail { padding: 1rem 1.1rem; }
.ministry-role-list { display: grid; gap: .1rem; }
.ministry-role-row { display: grid; grid-template-columns: 1.6rem minmax(7rem, .72fr) minmax(8rem, 1fr) 2.3rem; gap: .55rem; align-items: center; min-height: 2.05rem; padding: .2rem .25rem; border-radius: .45rem; color: var(--discovery-navy); text-decoration: none; }
.ministry-role-row:hover,
.ministry-role-row:focus-visible { background: color-mix(in srgb, var(--discovery-cyan) 7%, transparent); outline: 2px solid color-mix(in srgb, var(--discovery-cyan) 70%, transparent); outline-offset: 1px; }
.ministry-role-row.is-selected { background: color-mix(in srgb, var(--discovery-cyan) 8%, transparent); }
.ministry-role-row__icon { display: grid; place-items: center; width: 1.35rem; height: 1.35rem; border-radius: 50%; background: color-mix(in srgb, var(--discovery-cyan) 12%, #fff); color: var(--discovery-teal); font-size: .68rem; }
.ministry-role-row--rank-1 .ministry-role-row__icon { background: color-mix(in srgb, var(--discovery-coral) 20%, #fff); color: #f0783d; }
.ministry-role-row--rank-2 .ministry-role-row__icon { background: color-mix(in srgb, var(--discovery-cyan) 20%, #fff); color: #078e9f; }
.ministry-role-row--rank-3 .ministry-role-row__icon { background: color-mix(in srgb, var(--discovery-sage) 25%, #fff); color: #3c995d; }
.ministry-role-row__name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .72rem; font-weight: 600; }
.ministry-role-bar,
.ministry-contributor-bar { display: block; height: .58rem; overflow: hidden; border-radius: 999px; background: var(--discovery-track); }
.ministry-role-bar > span,
.ministry-contributor-bar > span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--discovery-cyan), #49c5c2); }
.ministry-role-row--rank-1 .ministry-role-bar > span { background: linear-gradient(90deg, #ff7d4b, #ff9f70); }
.ministry-role-row--rank-2 .ministry-role-bar > span { background: linear-gradient(90deg, #08a6b5, #31c0c8); }
.ministry-role-row--rank-3 .ministry-role-bar > span { background: linear-gradient(90deg, #67b879, #8acb9c); }
.ministry-role-row__percent { text-align: right; font-size: .72rem; }
.ministry-role-detail { --card-accent: var(--discovery-coral); }
.ministry-role-detail__header { display: grid; grid-template-columns: 2.8rem minmax(0, 1fr) auto; gap: .7rem; align-items: center; }
.ministry-role-detail__header h2 { margin: 0; font-size: 1.18rem; font-weight: 800; }
.ministry-role-detail__header > strong { color: #f0783d; font-size: 1rem; }
.ministry-role-detail__summary { margin: .55rem 0 .7rem 3.5rem; color: var(--muted-color, #596a7f); font-size: .71rem; line-height: 1.42; }
.ministry-contributor-group { padding: .65rem 0 0; }
.ministry-contributor-group + .ministry-contributor-group { margin-top: .15rem; }
.ministry-contributor-group h3 { display: flex; align-items: center; gap: .42rem; margin: 0 0 .4rem; color: var(--discovery-navy); font-size: .82rem; font-weight: 800; }
.ministry-contributor-group h3 i { color: #f0783d; }
.ministry-contributor-group--supporting h3 i { color: #51ad6c; }
.ministry-contributor-group--limited h3 i { color: #f58a27; }
.ministry-contributor-group > p,
.ministry-contributor-group > small { color: var(--muted-color, #667085); font-size: .65rem; }
.ministry-contributor-row { display: grid; grid-template-columns: minmax(7rem, 1fr) minmax(6rem, .85fr) 1.65rem; gap: .55rem; align-items: center; min-height: 1.45rem; }
.ministry-contributor-row strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .69rem; font-weight: 500; }
.ministry-contributor-row b { text-align: right; font-size: .68rem; }
.ministry-contributor-row small { grid-column: 1 / -1; margin: -.15rem 0 .15rem; color: var(--muted-color, #667085); font-size: .58rem; line-height: 1.25; }
.ministry-contributor-group--strong .ministry-contributor-bar > span { background: linear-gradient(90deg, #ff8a56, #ffc09d); }
.ministry-contributor-group--supporting .ministry-contributor-bar > span { background: linear-gradient(90deg, #49ae68, #a7dbb7); }
.ministry-contributor-group--limited .ministry-contributor-bar > span { background: linear-gradient(90deg, #90adbb, #b8cbd4); }
.ministry-results-empty { padding: 1rem; border-radius: .7rem; background: color-mix(in srgb, var(--border-color, #d9dee7) 18%, transparent); }
.ministry-results-actions { display: flex; justify-content: flex-start; margin: 1rem .95rem 0; }
.ministry-results-back { display: inline-flex; align-items: center; gap: .45rem; font-size: .78rem; }
.ministry-results-feedback { margin: 1rem .95rem 0; padding: .85rem 1rem; }
.ministry-results-feedback summary { cursor: pointer; font-size: .78rem; font-weight: 800; }
.ministry-results-feedback summary:focus-visible { outline: 3px solid var(--primary-color, #315efb); outline-offset: 3px; }
@media (max-width: 991.98px) {
    .ministry-results-hero { grid-template-columns: 1fr; gap: 1rem; }
    .ministry-confidence-card { width: min(100%, 30rem); }
    .ministry-top-grid { grid-template-columns: 1fr; }
    .ministry-top-card { min-height: 9.5rem; }
    .ministry-role-analysis { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .ministry-results { padding-inline: 0; }
    .ministry-results-overview,
    .ministry-top-card,
    .ministry-role-list-panel,
    .ministry-role-detail { border-radius: .72rem; }
    .ministry-results-hero { padding: 1rem; }
    .ministry-results-hero__summary { grid-template-columns: 2.8rem minmax(0, 1fr); gap: .7rem; }
    .ministry-results-hero__icon { width: 2.8rem; height: 2.8rem; font-size: 1.2rem; }
    .ministry-results-hero h1 { font-size: 1.55rem; }
    .ministry-results-hero__meta { display: none; }
    .ministry-results-journey { padding-inline: .4rem; }
    .ministry-results-journey ol { gap: .05rem; }
    .ministry-results-journey li strong { font-size: .56rem; overflow-wrap: anywhere; }
    .ministry-results-journey li > span { width: 1.3rem; height: 1.3rem; }
    .ministry-results-journey ol::before { top: .64rem; }
    .ministry-results-top,
    .ministry-role-analysis { padding-inline: 0; }
    .ministry-top-card { grid-template-columns: minmax(0, 1fr) 4.4rem; }
    .ministry-percentage-ring { width: 4.2rem; height: 4.2rem; }
    .ministry-role-list-panel,
    .ministry-role-detail { padding: .85rem; }
    .ministry-role-row { grid-template-columns: 1.45rem minmax(5rem, .8fr) minmax(4rem, 1fr) 2rem; gap: .35rem; }
    .ministry-role-row__name { font-size: .65rem; }
    .ministry-role-detail__summary { margin-left: 0; }
    .ministry-contributor-row { grid-template-columns: minmax(6rem, 1fr) minmax(4rem, .75fr) 1.5rem; gap: .35rem; }
}
@media (prefers-reduced-motion: reduce) {
    .ministry-role-row,
    .ministry-role-bar > span,
    .ministry-contributor-bar > span { transition: none !important; }
}
/* Ministry Discovery final desktop scale and proportion pass */
.ministry-results { width: 100%; max-width: none; margin-inline: 0; }
@media (min-width: 992px) {
    .ministry-results-overview { margin-bottom: 1.4rem; }
    .ministry-results-hero {
        grid-template-columns: minmax(0, 1fr) minmax(20rem, 22rem);
        gap: 2.5rem;
        padding: 1.75rem 1.9rem 1.45rem;
    }
    .ministry-results-hero__summary {
        grid-template-columns: 4.8rem minmax(0, 1fr);
        gap: 1.25rem;
    }
    .ministry-results-hero__icon {
        width: 4.8rem;
        height: 4.8rem;
        font-size: 1.95rem;
    }
    .ministry-results-hero h1 {
        margin-bottom: .6rem;
        font-size: clamp(2rem, 2.35vw, 2.45rem);
    }
    .ministry-results-hero__copy > p {
        max-width: 51rem;
        font-size: .98rem;
        line-height: 1.55;
    }
    .ministry-results-hero__meta {
        margin-top: .7rem;
        font-size: .75rem;
    }
    .ministry-confidence-card {
        grid-template-columns: 2.75rem minmax(0, 1fr);
        gap: .8rem;
        min-height: 8.1rem;
        padding: 1.15rem 1.25rem;
    }
    .ministry-confidence-card__icon {
        width: 2.75rem;
        height: 2.75rem;
        font-size: 1.65rem;
    }
    .ministry-confidence-card__copy > span { font-size: .8rem; }
    .ministry-confidence-card__copy > strong { font-size: 1.05rem; }
    .ministry-confidence-card__copy > p { font-size: .78rem; line-height: 1.45; }
    .ministry-confidence-meter span { height: .3rem; }
    .ministry-results-journey { padding: .45rem 1.9rem 1.25rem; }
    .ministry-results-journey ol { gap: .5rem; }
    .ministry-results-journey ol::before { top: .83rem; }
    .ministry-results-journey li { gap: .45rem; }
    .ministry-results-journey li > span {
        width: 1.7rem;
        height: 1.7rem;
        font-size: .72rem;
    }
    .ministry-results-journey li strong { font-size: .78rem; }
    .ministry-results-top {
        margin-bottom: 1.4rem;
        padding-inline: .4rem;
    }
    .ministry-results-section-heading {
        gap: .8rem;
        margin-bottom: .95rem;
    }
    .ministry-section-icon {
        width: 2.3rem;
        height: 2.3rem;
        font-size: 1.65rem;
    }
    .ministry-results-section-heading h2 { font-size: 1.45rem; }
    .ministry-results-section-heading p { margin-top: .14rem; font-size: .82rem; }
    .ministry-top-grid { gap: 1.05rem; }
    .ministry-top-card {
        grid-template-columns: minmax(0, 1fr) 6rem;
        gap: .75rem 1.15rem;
        min-height: 13.25rem;
        padding: 1.15rem 1.3rem 1.25rem;
    }
    .ministry-rank {
        min-width: 2.8rem;
        padding: .24rem .58rem;
        font-size: .78rem;
    }
    .ministry-top-card__identity {
        grid-template-columns: 3.3rem minmax(0, 1fr);
        gap: .85rem;
    }
    .ministry-role-icon {
        width: 3.3rem;
        height: 3.3rem;
        font-size: 1.6rem;
    }
    .ministry-top-card h3 { font-size: 1.18rem; line-height: 1.25; }
    .ministry-percentage-ring {
        width: 5.75rem;
        height: 5.75rem;
    }
    .ministry-percentage-ring::before { inset: .54rem; }
    .ministry-percentage-ring span { font-size: 1.25rem; }
    .ministry-top-card > p {
        min-height: 3rem;
        max-width: 29rem;
        font-size: .84rem;
        line-height: 1.52;
    }
    .ministry-role-analysis {
        grid-template-columns: minmax(0, 1.16fr) minmax(24rem, 1fr);
        gap: 1.1rem;
        padding-inline: .4rem;
    }
    .ministry-role-list-panel,
    .ministry-role-detail { padding: 1.3rem 1.4rem; }
    .ministry-role-list { gap: .18rem; }
    .ministry-role-row {
        grid-template-columns: 1.85rem minmax(8rem, .75fr) minmax(9rem, 1fr) 2.65rem;
        gap: .7rem;
        min-height: 2.55rem;
        padding: .3rem .4rem;
        border: 1px solid transparent;
    }
    .ministry-role-row.is-selected {
        border-color: color-mix(in srgb, var(--discovery-teal) 30%, transparent);
        background: color-mix(in srgb, var(--discovery-cyan) 9%, transparent);
        box-shadow: none;
    }
    .ministry-role-row__icon {
        width: 1.6rem;
        height: 1.6rem;
        font-size: .8rem;
    }
    .ministry-role-row__name { font-size: .82rem; }
    .ministry-role-bar,
    .ministry-contributor-bar { height: .68rem; }
    .ministry-role-row__percent { font-size: .82rem; }
    .ministry-role-detail__header {
        grid-template-columns: 3.3rem minmax(0, 1fr) auto;
        gap: .85rem;
    }
    .ministry-role-detail__header h2 { font-size: 1.38rem; }
    .ministry-role-detail__header > strong { font-size: 1.15rem; }
    .ministry-role-detail__summary {
        margin: .7rem 0 .95rem 4.15rem;
        font-size: .82rem;
        line-height: 1.5;
    }
    .ministry-contributor-group { padding-top: .85rem; }
    .ministry-contributor-group + .ministry-contributor-group { margin-top: .25rem; }
    .ministry-contributor-group h3 {
        margin-bottom: .55rem;
        font-size: .95rem;
    }
    .ministry-contributor-group > p,
    .ministry-contributor-group > small { font-size: .73rem; }
    .ministry-contributor-row {
        grid-template-columns: minmax(8rem, 1fr) minmax(7rem, .9fr) 1.9rem;
        margin-left: 1.75rem;
        gap: .7rem;
        min-height: 1.75rem;
    }
    .ministry-contributor-row strong { font-size: .79rem; }
    .ministry-contributor-row b { font-size: .78rem; }
    .ministry-contributor-row small { font-size: .66rem; }
    .ministry-results-actions,
    .ministry-results-feedback { margin-inline: .4rem; }
}
/* Keep Top Ministry Matches contained in the overview dashboard card. */
.ministry-results-overview > .ministry-results-top {
    margin: 0;
    padding: 1rem 1.5rem 1.35rem;
    border-top: 1px solid color-mix(in srgb, var(--border-color, #d9dee7) 82%, #b7dce1);
}
@media (min-width: 992px) {
    .ministry-results-overview > .ministry-results-top {
        padding: 1.25rem 1.9rem 1.6rem;
    }
}
@media (max-width: 640px) {
    .ministry-results-overview > .ministry-results-top {
        padding: 1rem;
    }
}
/* Contain role analysis and primary navigation in the results dashboard card. */
.ministry-results-overview > .ministry-role-analysis {
    padding: 1.25rem 1.5rem;
    border-top: 1px solid color-mix(in srgb, var(--border-color, #d9dee7) 82%, #b7dce1);
}
.ministry-results-overview > .ministry-results-actions {
    margin: 0;
    padding: 1rem 1.5rem;
    border-top: 1px solid color-mix(in srgb, var(--border-color, #d9dee7) 82%, #b7dce1);
}
@media (min-width: 992px) {
    .ministry-results-overview > .ministry-role-analysis {
        padding: 1.4rem 1.9rem;
    }
    .ministry-results-overview > .ministry-results-actions {
        padding: 1rem 1.9rem;
    }
}
@media (max-width: 640px) {
    .ministry-results-overview > .ministry-role-analysis,
    .ministry-results-overview > .ministry-results-actions {
        padding: 1rem;
    }
}
/* Ministry Discovery reusable participant components */
.assessment-participant-page {
    --discovery-peach: #fca47c;
    --discovery-cyan: #23ced9;
    --discovery-sage: #a1cca6;
    --discovery-teal: #097c87;
    --discovery-blue: #5ca9e6;
    --discovery-purple: #8272e8;
    --discovery-gold: #f9d779;
    --discovery-navy: #0d2145;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    color: var(--discovery-navy);
}
.discovery-workspace {
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--border-color, #d9dee7) 82%, #b7dce1);
    border-radius: 1rem;
    background: var(--card-bg, #fff);
    box-shadow: 0 .4rem 1.35rem rgba(15, 65, 78, .06);
}
.discovery-journey {
    display: grid;
    grid-template-columns: minmax(10rem, 13rem) minmax(0, 1fr);
    grid-template-areas: "heading steps" "intro intro";
    gap: .75rem 2rem;
    align-items: center;
    margin: 0;
    padding: 1.15rem 1.5rem 1rem;
    background: color-mix(in srgb, var(--discovery-cyan) 3%, var(--card-bg, #fff));
}
.discovery-journey__heading {
    grid-area: heading;
    display: grid;
    gap: .28rem;
}
.discovery-journey__heading .dashboard-home-kicker {
    color: var(--discovery-teal);
    font-size: .72rem;
    letter-spacing: .09em;
}
.discovery-journey__heading strong {
    color: var(--discovery-navy);
    font-size: 1.2rem;
}
.discovery-journey__steps {
    grid-area: steps;
    position: relative;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: .35rem;
    margin: 0;
    padding: 0;
    list-style: none;
}
.discovery-journey__steps::before {
    content: "";
    position: absolute;
    top: .87rem;
    left: 10%;
    right: 10%;
    height: 2px;
    background: color-mix(in srgb, var(--border-color, #d9dee7) 88%, var(--discovery-cyan));
}
.discovery-journey__step {
    position: relative;
    z-index: 1;
    display: grid;
    justify-items: center;
    gap: .35rem;
    min-width: 0;
    padding: 0 .2rem;
    color: var(--muted-color, #667085);
    text-align: center;
}
.discovery-journey__marker {
    display: grid;
    place-items: center;
    width: 1.75rem;
    height: 1.75rem;
    border: 2px solid var(--card-bg, #fff);
    border-radius: 50%;
    background: #e5ecef;
    box-shadow: 0 0 0 1px #cbd7dd;
    color: #70828e;
    font-size: .78rem;
    font-weight: 800;
}
.discovery-journey__step--complete .discovery-journey__marker {
    background: color-mix(in srgb, var(--discovery-sage) 68%, #fff);
    box-shadow: 0 0 0 1px #75ad82;
    color: #246d3c;
}
.discovery-journey__step--current {
    color: var(--discovery-navy);
    font-weight: 800;
}
.discovery-journey__step--current .discovery-journey__marker {
    background: var(--discovery-peach);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--discovery-peach) 24%, transparent);
    color: #713410;
}
.discovery-journey__label {
    font-size: .73rem;
    font-weight: 650;
}
.discovery-journey > p {
    grid-area: intro;
    margin: .15rem 0 0;
    color: var(--muted-color, #617184);
    font-size: .78rem;
}
.discovery-question {
    margin: 0;
    padding: 1.4rem 1.5rem 1.25rem;
    overflow: visible;
    border: 0;
    border-top: 1px solid color-mix(in srgb, var(--border-color, #d9dee7) 82%, #b7dce1);
    border-radius: 0;
    background: var(--card-bg, #fff);
    box-shadow: none;
}
.discovery-question__header {
    display: grid;
    grid-template-columns: 4rem minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
    margin-bottom: 1rem;
}
.discovery-question__icon {
    display: grid;
    place-items: center;
    width: 4rem;
    height: 4rem;
    border-radius: 1rem;
    background: color-mix(in srgb, var(--discovery-peach) 17%, #fff);
    color: #ee7740;
    font-size: 1.65rem;
}
.discovery-question__header h1 {
    margin: 0 0 .35rem;
    color: var(--discovery-navy);
    font-size: clamp(1.75rem, 2.4vw, 2.35rem);
    line-height: 1.12;
}
.discovery-question__header p {
    max-width: 60rem;
    margin: 0;
    color: var(--muted-color, #667085);
    font-size: .92rem;
    line-height: 1.5;
}
.discovery-question__context {
    display: inline-flex;
    min-height: 1.75rem;
    margin-top: .6rem;
    padding: .25rem .65rem;
    border: 1px solid color-mix(in srgb, var(--discovery-cyan) 22%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--discovery-cyan) 8%, transparent);
    color: var(--discovery-teal);
    font-size: .72rem;
    font-weight: 700;
}
.discovery-question__body,
.discovery-activity,
.discovery-continuum,
.discovery-confidence__card {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}
.discovery-question__prompt {
    display: block;
    width: 100%;
    margin: 0 0 .8rem;
    color: var(--discovery-navy);
    font-size: 1.08rem;
    font-weight: 750;
    line-height: 1.4;
}
.discovery-activity-list,
.discovery-continuum-list {
    display: grid;
    gap: .65rem;
}
.discovery-activity,
.discovery-continuum {
    padding: .75rem .9rem;
    border: 1px solid color-mix(in srgb, var(--border-color, #d9dee7) 88%, #c6d8dc);
    border-radius: .75rem;
    background: color-mix(in srgb, var(--border-color, #d9dee7) 7%, var(--card-bg, #fff));
}
.discovery-activity--energy { background: color-mix(in srgb, var(--discovery-peach) 5%, var(--card-bg, #fff)); }
.discovery-activity--preference { background: color-mix(in srgb, var(--discovery-sage) 7%, var(--card-bg, #fff)); }
.discovery-activity__layout {
    display: grid;
    grid-template-columns: minmax(15rem, .85fr) minmax(27rem, 1.15fr);
    gap: 1.25rem;
    align-items: center;
    min-height: 3.75rem;
}
.discovery-activity__identity,
.discovery-confidence__identity,
.discovery-continuum__identity {
    display: flex;
    align-items: center;
    gap: .75rem;
    min-width: 0;
}
.discovery-activity__icon {
    display: grid;
    place-items: center;
    flex: 0 0 2.5rem;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: .72rem;
    background: color-mix(in srgb, var(--discovery-cyan) 13%, #fff);
    color: var(--discovery-teal);
    font-size: 1.05rem;
}
.discovery-activity__title {
    color: var(--discovery-navy);
    font-size: 1rem;
    font-weight: 750;
    line-height: 1.35;
}
.discovery-activity--energy .discovery-activity__icon {
    background: color-mix(in srgb, var(--discovery-peach) 18%, #fff);
    color: #d66b31;
}
.discovery-activity--preference .discovery-activity__icon {
    background: color-mix(in srgb, var(--discovery-sage) 25%, #fff);
    color: #3d8b55;
}
.discovery-picker {
    position: relative;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    min-width: 0;
}
.discovery-picker--7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.discovery-picker__track {
    position: absolute;
    top: 1.08rem;
    left: 10%;
    right: 10%;
    height: 3px;
    border-radius: 999px;
    background: #d7e1e5;
}
.discovery-picker--7 .discovery-picker__track {
    left: 7.15%;
    right: 7.15%;
    height: 4px;
}
.discovery-picker--energy .discovery-picker__track {
    background: linear-gradient(90deg, color-mix(in srgb, var(--discovery-peach) 55%, #d7e1e5), var(--discovery-cyan));
}
.discovery-picker--preference .discovery-picker__track {
    height: 4px;
    background: linear-gradient(90deg, color-mix(in srgb, var(--discovery-sage) 50%, #d7e1e5), var(--discovery-teal));
}
.discovery-picker--continuum .discovery-picker__track {
    background: linear-gradient(90deg, var(--discovery-peach), #d7e1e5, var(--discovery-purple));
}
.discovery-picker__stop {
    position: relative;
    z-index: 1;
    min-width: 0;
    cursor: pointer;
}
.discovery-picker__stop input,
.discovery-scenario-option > input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.discovery-picker__choice {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .48rem;
    min-height: 58px;
    padding: 0 .15rem;
    color: var(--muted-color, #667085);
    text-align: center;
}
.discovery-picker__marker {
    display: grid;
    place-items: center;
    flex: 0 0 2.15rem;
    width: 2.15rem;
    height: 2.15rem;
    border: 4px solid var(--card-bg, #fff);
    border-radius: 50%;
    background: #d7e1e5;
    box-shadow: 0 0 0 1px #bccbd1;
}
.discovery-picker__label {
    font-size: .75rem;
    font-weight: 650;
    line-height: 1.15;
}
.discovery-picker__stop input:checked + .discovery-picker__choice {
    color: var(--discovery-navy);
    font-weight: 800;
}
.discovery-picker__stop input:checked + .discovery-picker__choice .discovery-picker__marker {
    background: var(--discovery-teal);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--discovery-cyan) 24%, transparent);
}
.discovery-picker--energy .discovery-picker__stop input:checked + .discovery-picker__choice .discovery-picker__marker {
    background: #ee7e43;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--discovery-peach) 30%, transparent);
}
.discovery-picker--preference .discovery-picker__stop input:checked + .discovery-picker__choice .discovery-picker__marker {
    background: #4f9f67;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--discovery-sage) 38%, transparent);
}
.discovery-picker--confidence .discovery-picker__stop input:checked + .discovery-picker__choice .discovery-picker__marker {
    background: #378fc9;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--discovery-blue) 28%, transparent);
}
.discovery-picker--continuum .discovery-picker__stop input:checked + .discovery-picker__choice .discovery-picker__marker {
    background: #7563df;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--discovery-purple) 24%, transparent);
}
.discovery-picker__stop input:checked + .discovery-picker__choice .discovery-picker__marker::after {
    content: "✓";
    color: #fff;
    font-size: .72rem;
    font-weight: 900;
}
.discovery-picker__stop input:focus-visible + .discovery-picker__choice .discovery-picker__marker {
    outline: 3px solid var(--discovery-teal);
    outline-offset: 3px;
}
.discovery-picker__stop--midpoint .discovery-picker__marker {
    background: var(--card-bg, #fff);
    box-shadow: 0 0 0 2px var(--muted-color, #667085);
}
.discovery-continuum {
    display: grid;
    grid-template-columns: minmax(15rem, .85fr) minmax(27rem, 1.15fr);
    gap: 1.25rem;
    align-items: center;
}
.discovery-continuum .discovery-activity__icon {
    background: color-mix(in srgb, var(--discovery-purple) 16%, #fff);
    color: #6a58ce;
}
.discovery-confidence {
    max-width: 64rem;
}
.discovery-confidence__card {
    padding: 1.25rem;
    border: 1px solid color-mix(in srgb, var(--discovery-blue) 22%, var(--border-color, #d9dee7));
    border-radius: .85rem;
    background: color-mix(in srgb, var(--discovery-blue) 5%, var(--card-bg, #fff));
}
.discovery-confidence__card[hidden] { display: none; }
.discovery-confidence__position {
    display: inline-flex;
    margin-bottom: .85rem;
    padding: .3rem .65rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--discovery-blue) 12%, transparent);
    color: #287fbd;
    font-size: .8rem;
    font-weight: 750;
}
.discovery-confidence__identity {
    margin-bottom: 1.2rem;
}
.discovery-confidence__identity .discovery-activity__icon {
    background: color-mix(in srgb, var(--discovery-blue) 18%, #fff);
    color: #287fbd;
}
.discovery-confidence__message {
    margin: .75rem 0 0;
    color: var(--danger-color, #b42318);
    font-weight: 650;
}
.discovery-confidence__navigation,
.discovery-navigation {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
}
.discovery-confidence__navigation {
    margin-top: 1rem;
}
.discovery-confidence__navigation .btn,
.discovery-navigation .btn,
.discovery-navigation a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    min-height: 44px;
}
.discovery-navigation {
    position: sticky;
    bottom: 0;
    z-index: 5;
    margin-top: 1rem;
    padding: .9rem 0 .1rem;
    border-top: 1px solid var(--border-color, #d9dee7);
    background: color-mix(in srgb, var(--card-bg, #fff) 94%, transparent);
    backdrop-filter: blur(8px);
}
.discovery-navigation .btn,
.discovery-navigation a {
    min-width: 7.5rem;
    min-height: 46px;
    padding-inline: 1.1rem;
}
.discovery-navigation .theme-action-primary {
    border-color: var(--discovery-teal);
    background: var(--discovery-teal);
}
.discovery-scenarios {
    display: grid;
    gap: .65rem;
}
.discovery-scenario-option {
    display: block;
    cursor: pointer;
}
.discovery-scenario-option__surface {
    display: grid;
    grid-template-columns: 1.1rem 2.55rem minmax(0, 1fr) 1.35rem;
    gap: .7rem;
    align-items: center;
    min-height: 4rem;
    padding: .65rem .8rem;
    border: 1px solid color-mix(in srgb, var(--border-color, #cbd2dc) 88%, var(--discovery-gold));
    border-radius: .7rem;
    background: var(--card-bg, #fff);
}
.discovery-scenario-option__letter {
    color: var(--muted-color, #667085);
    font-size: .72rem;
    font-weight: 800;
}
.discovery-scenario-option__icon {
    display: grid;
    place-items: center;
    width: 2.55rem;
    height: 2.55rem;
    border-radius: .65rem;
    background: color-mix(in srgb, var(--discovery-gold) 24%, #fff);
    color: #a86d08;
}
.discovery-scenario-option:nth-child(2) .discovery-scenario-option__icon { background: color-mix(in srgb, var(--discovery-sage) 24%, #fff); color: #3d8b55; }
.discovery-scenario-option:nth-child(3) .discovery-scenario-option__icon { background: color-mix(in srgb, var(--discovery-peach) 18%, #fff); color: #d66b31; }
.discovery-scenario-option:nth-child(4) .discovery-scenario-option__icon { background: color-mix(in srgb, var(--discovery-cyan) 14%, #fff); color: var(--discovery-teal); }
.discovery-scenario-option__text {
    color: var(--discovery-navy);
    font-size: .9rem;
    line-height: 1.35;
}
.discovery-scenario-option__selected {
    display: grid;
    place-items: center;
    width: 1.25rem;
    height: 1.25rem;
    border: 2px solid #aab3c0;
    border-radius: 50%;
    color: transparent;
}
.discovery-scenario-option > input:checked + .discovery-scenario-option__surface {
    border-color: var(--discovery-teal);
    background: color-mix(in srgb, var(--discovery-cyan) 7%, var(--card-bg, #fff));
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--discovery-cyan) 22%, transparent);
    font-weight: 700;
}
.discovery-scenario-option > input:checked + .discovery-scenario-option__surface .discovery-scenario-option__selected {
    border-color: var(--discovery-teal);
    background: var(--discovery-teal);
    color: #fff;
}
.discovery-scenario-option > input:focus-visible + .discovery-scenario-option__surface {
    outline: 3px solid var(--discovery-teal);
    outline-offset: 2px;
}
.discovery-question--default .discovery-question__icon,
.discovery-question--default .discovery-question__context {
    background: color-mix(in srgb, var(--discovery-gold) 23%, #fff);
    color: #a86d08;
}
.discovery-question--energy .discovery-question__icon,
.discovery-question--energy .discovery-question__context {
    background: color-mix(in srgb, var(--discovery-peach) 20%, #fff);
    color: #d66b31;
}
.discovery-question--preference .discovery-question__icon,
.discovery-question--preference .discovery-question__context {
    background: color-mix(in srgb, var(--discovery-sage) 25%, #fff);
    color: #3d8b55;
}
.discovery-question--confidence-cards .discovery-question__icon,
.discovery-question--confidence-context .discovery-question__icon,
.discovery-question--confidence-cards .discovery-question__context,
.discovery-question--confidence-context .discovery-question__context {
    background: color-mix(in srgb, var(--discovery-blue) 18%, #fff);
    color: #287fbd;
}
.discovery-question[class*="-continuum"] .discovery-question__icon,
.discovery-question[class*="-continuum"] .discovery-question__context {
    background: color-mix(in srgb, var(--discovery-purple) 16%, #fff);
    color: #6a58ce;
}
@media (hover: hover) {
    .discovery-scenario-option__surface:hover {
        border-color: color-mix(in srgb, var(--discovery-teal) 60%, var(--border-color, #cbd2dc));
        transform: translateY(-1px);
    }
}
@media (max-width: 991.98px) {
    .discovery-journey {
        grid-template-columns: 1fr;
        grid-template-areas: "heading" "steps" "intro";
        gap: .7rem;
    }
    .discovery-activity__layout,
    .discovery-continuum {
        grid-template-columns: 1fr;
        gap: .75rem;
    }
}
@media (max-width: 767.98px) {
    .discovery-workspace { border-radius: .8rem; }
    .discovery-journey,
    .discovery-question { padding: 1rem; }
    .discovery-journey__steps { gap: .1rem; }
    .discovery-journey__step { padding-inline: .05rem; }
    .discovery-journey__label { font-size: .62rem; }
    .discovery-question__header { grid-template-columns: 3rem minmax(0, 1fr); }
    .discovery-question__icon { width: 3rem; height: 3rem; font-size: 1.3rem; }
    .discovery-picker__choice { min-height: 76px; }
    .discovery-picker__marker { flex-basis: 1.9rem; width: 1.9rem; height: 1.9rem; }
    .discovery-picker__label { font-size: .66rem; overflow-wrap: anywhere; }
    .discovery-picker__track { top: .95rem; }
    .discovery-scenario-option__surface { grid-template-columns: 1rem 2.25rem minmax(0, 1fr) 1.25rem; gap: .5rem; }
    .discovery-scenario-option__icon { width: 2.25rem; height: 2.25rem; }
    .discovery-navigation { position: static; }
    .discovery-navigation .btn,
    .discovery-navigation a { flex: 1; min-width: 0; }
}
@media (max-width: 420px) {
    .discovery-question__header { grid-template-columns: 1fr; }
    .discovery-journey__label { font-size: .56rem; }
    .discovery-picker__label { font-size: .59rem; }
    .discovery-scenario-option__surface { grid-template-columns: 1rem minmax(0, 1fr) 1.25rem; }
    .discovery-scenario-option__icon { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .discovery-scenario-option__surface { transition: none; transform: none; }
}

/* People profile assessment summary */
.profile-assessment-dashboard {
    display: grid;
    gap: 1.25rem;
}

.profile-assessment-dashboard__heading,
.profile-assessment-section__heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.profile-assessment-hero {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(9rem, auto) auto;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    background: var(--surface-soft, var(--surface, var(--bs-body-bg)));
}

.profile-assessment-hero__icon,
.profile-ministry-match__icon,
.profile-assessment-empty__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    color: var(--primary, var(--bs-primary));
    background: var(--primary-soft, var(--surface-muted));
    border-radius: 0.9rem;
}

.profile-assessment-hero__icon {
    width: 3rem;
    height: 3rem;
    font-size: 1.3rem;
}

.profile-assessment-hero__identity {
    min-width: 0;
}

.profile-assessment-eyebrow {
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.profile-assessment-hero h3 {
    margin: 0.2rem 0 0.35rem;
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.08rem;
    font-weight: 700;
}

.profile-assessment-hero h3 span {
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.88rem;
    font-weight: 600;
}

.profile-assessment-hero__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.82rem;
}

.profile-assessment-confidence {
    display: grid;
    gap: 0.15rem;
    padding-left: 1rem;
    border-left: 1px solid var(--card-border, var(--bs-border-color));
}

.profile-assessment-confidence span {
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.76rem;
    font-weight: 650;
}

.profile-assessment-confidence strong {
    color: var(--text-main, var(--bs-body-color));
    font-size: 1rem;
}

.profile-assessment-section {
    padding-top: 1.15rem;
    border-top: 1px solid var(--card-border, var(--bs-border-color));
}

.profile-assessment-section__heading {
    margin-bottom: 0.8rem;
}

.profile-assessment-section__heading h3,
.profile-insight-card h4,
.profile-assessment-empty h3 {
    margin: 0;
    color: var(--text-main, var(--bs-body-color));
    font-weight: 700;
}

.profile-assessment-section__heading h3 {
    font-size: 1rem;
}

.profile-assessment-section__heading p,
.profile-assessment-empty p {
    margin: 0.2rem 0 0;
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.84rem;
}

.profile-ministry-match-list {
    display: grid;
    gap: 0.55rem;
}

.profile-ministry-match {
    display: grid;
    grid-template-columns: auto auto minmax(0, 1fr);
    align-items: start;
    gap: 0.75rem;
    padding: 0.8rem;
    border: 1px solid var(--card-border, var(--bs-border-color));
    border-radius: 0.85rem;
    background: var(--surface, var(--bs-body-bg));
}

.profile-ministry-match__rank {
    padding-top: 0.35rem;
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.78rem;
    font-weight: 750;
}

.profile-ministry-match__icon {
    width: 2.25rem;
    height: 2.25rem;
    font-size: 1rem;
}

.profile-ministry-match__body {
    min-width: 0;
}

.profile-ministry-match__title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
}

.profile-ministry-match__title-row h4 {
    margin: 0;
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.94rem;
    font-weight: 700;
}

.profile-ministry-match__title-row strong {
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.9rem;
}

.profile-ministry-match__themes,
.profile-ministry-match__summary {
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.78rem;
    line-height: 1.4;
}

.profile-ministry-match__themes {
    margin: 0.15rem 0 0.45rem;
    font-weight: 600;
}

.profile-ministry-match__summary {
    margin: 0.4rem 0 0;
}

.profile-ministry-match__track {
    height: 0.42rem;
    overflow: hidden;
    border-radius: 999px;
    background: var(--surface-muted, var(--bs-secondary-bg));
}

.profile-ministry-match__track span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--primary, var(--bs-primary));
}

.profile-assessment-insights {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.profile-insight-card {
    min-width: 0;
    padding: 0.9rem;
    border: 1px solid var(--card-border, var(--bs-border-color));
    border-radius: 0.9rem;
}

.profile-insight-card--strengths { background: color-mix(in srgb, var(--warning, #f59e0b) 8%, var(--surface, #fff)); }
.profile-insight-card--style { background: color-mix(in srgb, var(--primary, #0f8fa3) 8%, var(--surface, #fff)); }
.profile-insight-card--environment { background: color-mix(in srgb, var(--success, #22a06b) 8%, var(--surface, #fff)); }

.profile-insight-card__heading {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin-bottom: 0.65rem;
}

.profile-insight-card__heading .pi {
    color: var(--primary, var(--bs-primary));
}

.profile-insight-card h4 {
    font-size: 0.9rem;
}

.profile-insight-card__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.profile-insight-card__chips span {
    display: inline-flex;
    align-items: center;
    gap: 0.32rem;
    max-width: 100%;
    padding: 0.34rem 0.55rem;
    color: var(--text-main, var(--bs-body-color));
    background: color-mix(in srgb, var(--surface, #fff) 82%, transparent);
    border: 1px solid var(--card-border, var(--bs-border-color));
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 650;
    overflow-wrap: anywhere;
}

.profile-insight-card__chips span .pi {
    color: var(--primary, var(--bs-primary));
    font-size: 0.72rem;
}

.profile-insight-card__chips p {
    margin: 0;
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.8rem;
    line-height: 1.4;
}

.profile-assessment-empty {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    padding: 1rem;
    border: 1px dashed var(--card-border, var(--bs-border-color));
    border-radius: 0.9rem;
    background: var(--surface-soft, var(--bs-secondary-bg));
}

.profile-assessment-empty__icon {
    width: 2.75rem;
    height: 2.75rem;
    font-size: 1.1rem;
}

.profile-assessment-empty > div {
    min-width: 0;
    flex: 1;
}

.profile-assessment-empty h3 {
    font-size: 0.95rem;
}

@media (max-width: 991.98px) {
    .profile-assessment-hero {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .profile-assessment-confidence {
        grid-column: 2;
        padding-left: 0;
        border-left: 0;
    }

    .profile-assessment-hero > .btn {
        grid-column: 2;
        justify-self: start;
    }

    .profile-assessment-insights {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .profile-assessment-dashboard__heading,
    .profile-assessment-section__heading,
    .profile-assessment-empty {
        align-items: flex-start;
        flex-direction: column;
    }

    .profile-assessment-hero {
        grid-template-columns: 1fr;
    }

    .profile-assessment-confidence,
    .profile-assessment-hero > .btn {
        grid-column: 1;
    }

    .profile-assessment-hero > .btn,
    .profile-assessment-empty > .btn {
        width: 100%;
        justify-content: center;
    }

    .profile-ministry-match {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .profile-ministry-match__body {
        grid-column: 1 / -1;
    }
}

/* Keep the Person Profile action menu outside the hero card clipping boundary. */
.person-profile-page > .theme-page-hero,
.household-profile-page > .theme-page-hero {
    position: relative;
    z-index: 2;
    overflow: visible;
}

.person-profile-page > .theme-page-hero .theme-page-hero__accent,
.household-profile-page > .theme-page-hero .theme-page-hero__accent {
    border-radius: 1.2rem 1.2rem 0 0;
}

.profile-header-actions .dropdown,
.household-workspace-actions .dropdown {
    position: relative;
}

.profile-header-menu {
    min-width: 15rem;
    z-index: 1055;
}

.profile-header-menu > li {
    list-style: none;
}

@media (max-width: 575.98px) {
    .profile-header-menu {
        width: min(18rem, calc(100vw - 2rem));
        min-width: 0;
    }
}


/* ===== Settings workspace ===== */
.giso-settings-page {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.settings-workspace-header {
    padding: 0.15rem 0.15rem 0;
}

.settings-workspace-header h1,
.settings-page-heading h2,
.settings-config-card h3 {
    color: var(--text-main, var(--bs-body-color));
    letter-spacing: -0.025em;
}

.settings-workspace-header h1 {
    margin: 0;
    font-size: clamp(1.65rem, 2vw, 2rem);
    font-weight: 750;
}

.settings-workspace-header p,
.settings-page-heading p,
.settings-config-card__heading p {
    color: var(--text-muted, var(--bs-secondary-color));
}

.settings-workspace-header p {
    margin: 0.3rem 0 0;
}

.settings-workspace {
    display: grid;
    grid-template-columns: minmax(12.5rem, 14.5rem) minmax(0, 1fr);
    align-items: start;
    gap: 1.5rem;
}

.settings-nav-panel,
.settings-config-card {
    background: var(--surface, var(--bs-body-bg));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    box-shadow: var(--card-shadow, 0 8px 24px rgba(0, 0, 0, 0.05));
}

.settings-nav-panel {
    position: sticky;
    top: 1rem;
    padding: 0.65rem;
}

.settings-nav-group + .settings-nav-group {
    margin-top: 0.85rem;
    padding-top: 0.8rem;
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.settings-nav-label {
    padding: 0 0.65rem 0.4rem;
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.68rem;
    font-weight: 750;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.settings-nav-link {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-height: 2.45rem;
    padding: 0.55rem 0.7rem;
    color: var(--text-main, var(--bs-body-color));
    border-radius: 0.65rem;
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none;
    transition: background-color 140ms ease, color 140ms ease;
}

.settings-nav-link i {
    width: 1.05rem;
    color: var(--text-muted, var(--bs-secondary-color));
    text-align: center;
}

.settings-nav-link:hover {
    color: var(--primary, var(--bs-primary));
    background: var(--surface-soft, var(--bs-tertiary-bg));
}

.settings-nav-link.is-active {
    color: var(--primary, var(--bs-primary));
    background: color-mix(in srgb, var(--primary, var(--bs-primary)) 12%, var(--surface, var(--bs-body-bg)));
}

.settings-nav-link.is-active i {
    color: currentColor;
}

.settings-main {
    min-width: 0;
}

.settings-page-heading {
    margin-bottom: 1.1rem;
}

.settings-page-heading h2 {
    margin: 0;
    font-size: clamp(1.4rem, 1.8vw, 1.75rem);
    font-weight: 750;
}

.settings-page-heading p {
    margin: 0.3rem 0 0;
    font-size: 0.92rem;
}

.settings-mobile-nav {
    display: none;
}

.settings-config-stack {
    display: grid;
    gap: 1rem;
}

.settings-config-card {
    overflow: visible;
}

.settings-config-card__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.1rem;
    border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.settings-config-card__heading {
    min-width: 0;
}

.settings-config-card__title-line,
.settings-config-card__actions,
.settings-config-row__name-line {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.settings-config-card__title-line h3 {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 750;
}

.settings-config-card__heading p {
    margin: 0.25rem 0 0;
    font-size: 0.82rem;
}

.settings-count-badge,
.settings-soft-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 999px;
    background: var(--surface-soft, var(--bs-tertiary-bg));
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.7rem;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.settings-count-badge {
    min-width: 1.65rem;
    min-height: 1.35rem;
    padding: 0.2rem 0.45rem;
}

.settings-soft-badge {
    padding: 0.3rem 0.5rem;
}

.settings-soft-badge--primary {
    color: var(--primary, var(--bs-primary));
    border-color: color-mix(in srgb, var(--primary, var(--bs-primary)) 28%, transparent);
    background: color-mix(in srgb, var(--primary, var(--bs-primary)) 10%, var(--surface, var(--bs-body-bg)));
}

.settings-add-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    white-space: nowrap;
}

.settings-config-list {
    padding: 0 1.1rem;
}

.settings-config-row {
    display: grid;
    grid-template-columns: 1.5rem minmax(0, 1fr) auto 2.25rem;
    align-items: center;
    gap: 0.75rem;
    min-height: 4.25rem;
    padding: 0.7rem 0;
}

.settings-config-row + .settings-config-row {
    border-top: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
}

.settings-drag-handle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--text-muted, var(--bs-secondary-color));
    opacity: 0.65;
}

.settings-config-row__content {
    min-width: 0;
}

.settings-config-row__name-line strong {
    overflow: hidden;
    color: var(--text-main, var(--bs-body-color));
    font-size: 0.92rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-config-row__meta {
    display: block;
    margin-top: 0.2rem;
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.75rem;
}

.settings-status {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.78rem;
    font-weight: 650;
    white-space: nowrap;
}

.settings-status > span {
    width: 0.48rem;
    height: 0.48rem;
    border-radius: 50%;
    background: var(--text-muted, var(--bs-secondary-color));
}

.settings-status.is-active {
    color: var(--bs-success);
}

.settings-status.is-active > span {
    background: var(--bs-success);
}

.settings-overflow-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.15rem;
    height: 2.15rem;
    padding: 0;
    color: var(--text-muted, var(--bs-secondary-color));
    border: 1px solid transparent;
    border-radius: 0.55rem;
}

.settings-overflow-button:hover,
.settings-overflow-button:focus-visible,
.settings-overflow-button[aria-expanded="true"] {
    color: var(--text-main, var(--bs-body-color));
    background: var(--surface-soft, var(--bs-tertiary-bg));
    border-color: var(--card-border, var(--border-color, var(--bs-border-color)));
}

.settings-row-menu .dropdown-menu {
    min-width: 8rem;
    padding: 0.35rem;
    background: var(--surface, var(--bs-body-bg));
    border-color: var(--card-border, var(--border-color, var(--bs-border-color)));
    box-shadow: var(--card-shadow, 0 10px 25px rgba(0, 0, 0, 0.1));
}

.settings-row-menu .dropdown-item {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.5rem 0.65rem;
    color: var(--text-main, var(--bs-body-color));
    border-radius: 0.45rem;
    font-size: 0.84rem;
}

.settings-field-search {
    position: relative;
    min-width: min(13rem, 100%);
}

.settings-field-search i {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 0.75rem;
    color: var(--text-muted, var(--bs-secondary-color));
    transform: translateY(-50%);
    pointer-events: none;
}

.settings-field-search .form-control {
    min-height: 2.4rem;
    padding-left: 2.15rem;
    font-size: 0.84rem;
}

.settings-empty-state {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    min-height: 5rem;
    color: var(--text-muted, var(--bs-secondary-color));
    text-align: center;
}

.settings-empty-state p {
    margin: 0;
}

@media (max-width: 991.98px) {
    .settings-workspace {
        grid-template-columns: 1fr;
    }

    .settings-nav-panel {
        display: none;
    }

    .settings-mobile-nav {
        display: block;
        overflow: hidden;
        background: var(--surface, var(--bs-body-bg));
        border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
        border-radius: 0.8rem;
    }

    .settings-mobile-nav summary {
        display: flex;
        justify-content: space-between;
        align-items: center;
        min-height: 2.75rem;
        padding: 0.65rem 0.85rem;
        color: var(--text-main, var(--bs-body-color));
        font-weight: 700;
        cursor: pointer;
        list-style: none;
    }

    .settings-mobile-nav summary::-webkit-details-marker {
        display: none;
    }

    .settings-mobile-nav[open] summary {
        border-bottom: 1px solid var(--table-border, var(--border-color, var(--bs-border-color)));
    }

    .settings-mobile-nav nav {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.35rem;
        padding: 0.6rem;
    }

    .settings-mobile-nav nav a {
        padding: 0.55rem 0.65rem;
        color: var(--text-main, var(--bs-body-color));
        border-radius: 0.5rem;
        text-decoration: none;
    }

    .settings-mobile-nav nav a[aria-current="page"] {
        color: var(--primary, var(--bs-primary));
        background: color-mix(in srgb, var(--primary, var(--bs-primary)) 12%, var(--surface, var(--bs-body-bg)));
        font-weight: 700;
    }
}

@media (max-width: 767.98px) {
    .settings-workspace-header {
        display: none;
    }

    .settings-config-card__header,
    .settings-config-card__header--fields {
        align-items: stretch;
        flex-direction: column;
    }

    .settings-config-card__actions {
        align-items: stretch;
        flex-direction: column;
    }

    .settings-field-search,
    .settings-add-button {
        width: 100%;
    }

    .settings-config-row {
        grid-template-columns: 1.25rem minmax(0, 1fr) 2.25rem;
        gap: 0.55rem;
    }

    .settings-config-row .settings-status {
        grid-column: 2;
        justify-self: start;
    }

    .settings-config-row .settings-row-menu {
        grid-column: 3;
        grid-row: 1 / span 2;
    }
}

@media (max-width: 420px) {
    .settings-mobile-nav nav {
        grid-template-columns: 1fr;
    }

    .settings-config-list {
        padding: 0 0.85rem;
    }

    .settings-config-row__name-line {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.3rem;
    }
}


/* Settings overview and persisted row controls. */
.settings-overview-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.settings-overview-card {
    display: grid;
    grid-template-columns: 2.5rem minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.85rem;
    min-height: 7.25rem;
    padding: 1rem;
    color: var(--text-main, var(--bs-body-color));
    background: var(--surface, var(--bs-body-bg));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 1rem;
    box-shadow: var(--card-shadow, 0 8px 24px rgba(0, 0, 0, 0.05));
    text-decoration: none;
    transition: border-color 140ms ease, transform 140ms ease;
}

.settings-overview-card:hover,
.settings-overview-card:focus-visible {
    color: var(--text-main, var(--bs-body-color));
    border-color: color-mix(in srgb, var(--primary, var(--bs-primary)) 45%, var(--card-border, var(--bs-border-color)));
    transform: translateY(-1px);
}

.settings-overview-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    color: var(--primary, var(--bs-primary));
    background: color-mix(in srgb, var(--primary, var(--bs-primary)) 10%, var(--surface, var(--bs-body-bg)));
    border-radius: 0.7rem;
}

.settings-overview-card__body {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 0.18rem;
}

.settings-overview-card__body strong {
    font-size: 0.95rem;
}

.settings-overview-card__body small,
.settings-overview-card__body span {
    overflow: hidden;
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.78rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-toggle-form {
    display: flex;
    justify-content: flex-end;
    margin: 0;
}

.settings-switch {
    display: inline-flex;
    align-items: center;
    margin: 0;
    cursor: pointer;
}

.settings-switch input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.settings-switch__track {
    display: inline-flex;
    align-items: center;
    width: 2.25rem;
    height: 1.25rem;
    padding: 0.14rem;
    background: var(--surface-muted, var(--bs-secondary-bg));
    border: 1px solid var(--card-border, var(--border-color, var(--bs-border-color)));
    border-radius: 999px;
    transition: background-color 140ms ease, border-color 140ms ease;
}

.settings-switch__track > span {
    width: 0.84rem;
    height: 0.84rem;
    background: var(--surface, var(--bs-body-bg));
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    transition: transform 140ms ease;
}

.settings-switch input:checked + .settings-switch__track {
    background: var(--primary, var(--bs-primary));
    border-color: var(--primary, var(--bs-primary));
}

.settings-switch input:checked + .settings-switch__track > span {
    transform: translateX(0.96rem);
}

.settings-switch input:focus-visible + .settings-switch__track {
    outline: 3px solid color-mix(in srgb, var(--primary, var(--bs-primary)) 25%, transparent);
    outline-offset: 2px;
}

.settings-switch.is-protected {
    cursor: not-allowed;
    opacity: 0.7;
}

.settings-row-menu .dropdown-item[type="submit"] {
    width: 100%;
    border: 0;
    background: transparent;
    text-align: left;
}

@media (max-width: 767.98px) {
    .settings-overview-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 420px) {
    .settings-overview-card {
        grid-template-columns: 2.25rem minmax(0, 1fr) auto;
        min-height: 6.5rem;
        padding: 0.85rem;
    }
}

.settings-overview-meta { margin: 0.85rem 0 0; color: var(--text-muted, var(--bs-secondary-color)); font-size: 0.78rem; }

/* ===== Education schedule batch matrix ===== */
.schedule-batch-workspace {
    gap: 1rem;
}

.schedule-batch-heading-line {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin: 0.2rem 0 0.35rem;
}

.schedule-batch-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-top: 1px solid var(--table-border);
    background: var(--table-head-bg);
}

.schedule-batch-summary > div {
    display: grid;
    gap: 0.1rem;
    padding: 0.9rem 1.25rem;
    border-right: 1px solid var(--table-border);
}

.schedule-batch-summary > div:last-child {
    border-right: 0;
}

.schedule-batch-summary strong {
    color: var(--text-main);
    font-size: 1.1rem;
}

.schedule-batch-summary span {
    color: var(--text-muted);
    font-size: 0.78rem;
    font-weight: 600;
}

.schedule-workspace-tabs {
    display: flex;
    gap: 1.4rem;
    border-bottom: 1px solid var(--table-border);
    padding: 0 0.25rem;
}

.schedule-workspace-tab {
    appearance: none;
    border: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: var(--text-muted);
    padding: 0.75rem 0.3rem;
    font-weight: 650;
}

.schedule-workspace-tab.is-active {
    border-bottom-color: var(--primary);
    color: var(--primary);
}

.schedule-workspace-tab:disabled {
    opacity: 0.52;
}

.schedule-filter-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem;
    border: 1px solid var(--card-border);
    border-radius: 1rem;
    box-shadow: var(--card-shadow);
}

.schedule-filter-status,
.schedule-filter-fields {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.schedule-filter-fields {
    justify-content: flex-end;
}

.schedule-filter-fields .form-select {
    width: min(13rem, 100%);
}

.schedule-filter-fields .form-control {
    width: min(18rem, 100%);
}

.schedule-filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    border: 1px solid transparent;
    border-radius: 0.7rem;
    background: transparent;
    color: var(--text-muted);
    padding: 0.48rem 0.65rem;
    font-size: 0.86rem;
    font-weight: 650;
}

.schedule-filter-chip span {
    min-width: 1.3rem;
    border-radius: 999px;
    background: var(--surface-muted);
    padding: 0.08rem 0.35rem;
    color: var(--text-muted);
    font-size: 0.72rem;
    text-align: center;
}

.schedule-filter-chip.is-active {
    border-color: color-mix(in srgb, var(--primary) 28%, var(--table-border));
    background: var(--primary-soft);
    color: var(--primary);
}

.schedule-filter-chip:disabled {
    opacity: 0.5;
}

.schedule-matrix-layout {
    position: relative;
    min-width: 0;
}

.schedule-matrix-main {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.schedule-program-section {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--card-border);
    border-radius: 1rem;
    box-shadow: var(--card-shadow);
}

.schedule-program-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.15rem;
    border-bottom: 1px solid var(--table-border);
}

.schedule-program-identity {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.schedule-program-color {
    width: 0.4rem;
    height: 2.7rem;
    border-radius: 999px;
    background: var(--program-color, var(--primary));
}

.schedule-program-header h2 {
    margin: 0.08rem 0 0;
    color: var(--text-main);
    font-size: 1.1rem;
    font-weight: 700;
}

.schedule-program-count {
    color: var(--text-muted);
    font-size: 0.82rem;
}

.schedule-matrix-scroll {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
}

.schedule-matrix {
    width: 100%;
    min-width: max(100%, 680px);
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
}

.schedule-matrix th,
.schedule-matrix td {
    width: 15rem;
    border-right: 1px solid var(--table-border);
    border-bottom: 1px solid var(--table-border);
    padding: 0;
    vertical-align: stretch;
}

.schedule-matrix tr:last-child th,
.schedule-matrix tr:last-child td {
    border-bottom: 0;
}

.schedule-matrix th:last-child,
.schedule-matrix td:last-child {
    border-right: 0;
}

.schedule-matrix thead th {
    background: var(--table-head-bg);
    color: var(--text-main);
    padding: 0.7rem 0.8rem;
    font-size: 0.84rem;
    text-align: left;
}

.schedule-matrix .schedule-date-column {
    position: sticky;
    left: 0;
    z-index: 2;
    width: 7.5rem;
    min-width: 7.5rem;
    background: var(--surface);
}

.schedule-matrix thead .schedule-date-column {
    z-index: 3;
    background: var(--table-head-bg);
}

.schedule-class-name,
.schedule-class-room {
    display: block;
}

.schedule-class-name {
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 700;
    white-space: nowrap;
}

.schedule-class-room {
    margin-top: 0.15rem;
    color: var(--text-muted);
    font-size: 0.74rem;
    font-weight: 500;
}

.schedule-date-column {
    padding: 0.8rem !important;
}

.schedule-date-day,
.schedule-date-number,
.schedule-date-year {
    display: block;
}

.schedule-date-day {
    color: var(--primary);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
}

.schedule-date-number {
    color: var(--text-main);
    font-size: 0.9rem;
    font-weight: 700;
}

.schedule-date-year {
    color: var(--text-muted);
    font-size: 0.7rem;
    font-weight: 500;
}

.schedule-matrix-cell {
    display: grid;
    align-content: start;
    gap: 0.5rem;
    width: 100%;
    min-height: 6.4rem;
    border: 0;
    border-radius: 0;
    background: var(--surface);
    color: var(--text-main);
    padding: 0.7rem;
    text-align: left;
    transition: background 0.16s ease, box-shadow 0.16s ease;
}

.schedule-matrix-cell:hover,
.schedule-matrix-cell:focus-visible {
    outline: none;
    background: var(--table-row-hover);
    box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--primary) 34%, transparent);
}

.schedule-matrix-cell.is-selected {
    background: var(--primary-soft);
    box-shadow: inset 0 0 0 2px var(--primary);
}

.schedule-matrix-cell.is-unassigned {
    background: color-mix(in srgb, var(--bs-warning) 6%, var(--surface));
}

.schedule-cell-time {
    color: var(--text-muted);
    font-size: 0.72rem;
    font-weight: 650;
}

.schedule-cell-teachers {
    display: grid;
    gap: 0.32rem;
}

.schedule-teacher-chip {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    min-width: 0;
    border-radius: 0.6rem;
    background: var(--surface-muted);
    padding: 0.35rem 0.42rem;
}

.schedule-teacher-avatar {
    display: inline-grid;
    place-items: center;
    width: 1.65rem;
    height: 1.65rem;
    flex: 0 0 auto;
    border-radius: 50%;
    background: color-mix(in srgb, var(--primary) 16%, var(--surface));
    color: var(--primary);
    font-size: 0.62rem;
    font-weight: 800;
}

.schedule-teacher-chip-copy {
    display: grid;
    min-width: 0;
}

.schedule-teacher-chip-copy > span {
    overflow: hidden;
    color: var(--text-main);
    font-size: 0.76rem;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.schedule-teacher-chip-copy small {
    color: var(--text-muted);
    font-size: 0.64rem;
    text-transform: capitalize;
}

.schedule-teacher-chip-copy .confirmation-approved { color: var(--bs-success); }
.schedule-teacher-chip-copy .confirmation-declined { color: var(--bs-danger); }
.schedule-teacher-chip-copy .confirmation-pending { color: color-mix(in srgb, var(--bs-warning) 75%, var(--text-main)); }

.schedule-unassigned-label {
    display: inline-flex;
    width: max-content;
    border: 1px dashed color-mix(in srgb, var(--bs-warning) 55%, var(--table-border));
    border-radius: 0.55rem;
    color: var(--text-muted);
    padding: 0.35rem 0.5rem;
    font-size: 0.74rem;
    font-weight: 650;
}

.schedule-matrix-empty-cell {
    display: grid;
    place-items: center;
    min-height: 6.4rem;
    background: var(--surface-muted);
    color: var(--text-muted);
}

.schedule-drawer {
    position: fixed;
    z-index: 1060;
    top: var(--schedule-drawer-top, 4.75rem);
    right: 0;
    width: min(calc(100vw - 2rem), 26.25rem);
    height: calc(100dvh - var(--schedule-drawer-top, 4.75rem));
    border: 1px solid var(--card-border);
    border-right: 0;
    border-radius: 1rem 0 0 1rem;
    box-shadow: var(--card-shadow);
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateX(100%);
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.schedule-drawer.is-open {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(0);
}

.schedule-drawer-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem;
    border-bottom: 1px solid var(--table-border);
}

.schedule-drawer-header h2 {
    margin: 0.15rem 0 0;
    color: var(--text-main);
    font-size: 1.05rem;
    line-height: 1.35;
}

.schedule-drawer-close {
    display: grid;
    place-items: center;
    width: 2.1rem;
    height: 2.1rem;
    flex: 0 0 auto;
    border: 1px solid var(--table-border);
    border-radius: 0.65rem;
    background: var(--surface);
    color: var(--text-main);
    font-size: 1.25rem;
}

.schedule-drawer-tabs {
    display: flex;
    border-bottom: 1px solid var(--table-border);
    padding: 0 0.8rem;
}

.schedule-drawer-tabs button {
    flex: 1;
    border: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: var(--text-muted);
    padding: 0.7rem 0.25rem;
    font-size: 0.8rem;
    font-weight: 650;
}

.schedule-drawer-tabs button.is-active {
    border-bottom-color: var(--primary);
    color: var(--primary);
}

.schedule-drawer-body {
    height: calc(100% - 8.3rem);
    overflow-y: auto;
    padding: 1rem;
}

.schedule-drawer-summary dl {
    display: grid;
    gap: 0.55rem;
    margin: 0.9rem 0 1.2rem;
}

.schedule-drawer-summary dl > div {
    display: grid;
    grid-template-columns: 5rem minmax(0, 1fr);
    gap: 0.7rem;
}

.schedule-drawer-summary dt {
    color: var(--text-muted);
    font-size: 0.75rem;
    font-weight: 650;
}

.schedule-drawer-summary dd {
    margin: 0;
    color: var(--text-main);
    font-size: 0.82rem;
    text-align: right;
}

.schedule-drawer-body h3 {
    color: var(--text-main);
    font-size: 0.95rem;
    font-weight: 700;
}

.schedule-drawer-body p,
.schedule-drawer-empty {
    color: var(--text-muted);
    font-size: 0.82rem;
}

.schedule-drawer-teachers {
    display: grid;
    gap: 0.5rem;
}

.schedule-drawer-teacher {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    border: 1px solid var(--table-border);
    border-radius: 0.75rem;
    padding: 0.65rem;
}

.schedule-drawer-teacher > span:last-child {
    display: grid;
}

.schedule-drawer-teacher strong {
    color: var(--text-main);
    font-size: 0.84rem;
}

.schedule-drawer-teacher small {
    color: var(--text-muted);
    font-size: 0.72rem;
}

.schedule-drawer-readonly {
    margin: 0.8rem 0 0;
    border-radius: 0.7rem;
    background: var(--surface-muted);
    padding: 0.7rem;
}

.schedule-drawer-backdrop:not([hidden]) {
    display: block;
    position: fixed;
    z-index: 1055;
    top: var(--schedule-drawer-top, 4.75rem);
    right: 0;
    bottom: 0;
    left: 0;
    border: 0;
    background: rgb(0 0 0 / 0.12);
}

@media (max-width: 991.98px) {
    .schedule-drawer {
        width: min(94vw, 27.5rem);
        border-radius: 1rem 0 0 1rem;
    }

    .schedule-drawer-backdrop:not([hidden]) {
        background: rgb(0 0 0 / 0.28);
    }
}

@media (max-width: 575.98px) {
    .schedule-drawer {
        width: 100vw;
        max-width: 100vw;
        border-right: 0;
        border-left: 0;
        border-radius: 0;
    }
}

@media (max-width: 767.98px) {
    .schedule-batch-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .schedule-batch-summary > div:nth-child(2) {
        border-right: 0;
    }

    .schedule-batch-summary > div:nth-child(-n+2) {
        border-bottom: 1px solid var(--table-border);
    }

    .schedule-filter-bar,
    .schedule-filter-fields {
        align-items: stretch;
        flex-direction: column;
    }

    .schedule-filter-status {
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: 0.2rem;
    }

    .schedule-filter-fields .form-select,
    .schedule-filter-fields .form-control,
    .schedule-filter-fields .btn {
        width: 100%;
    }

    .schedule-matrix th,
    .schedule-matrix td {
        width: 12.5rem;
    }
}


.schedule-matrix td.is-filtered {
    background: var(--surface-muted);
}

.schedule-matrix td.is-filtered .schedule-matrix-cell {
    display: none;
}

.schedule-matrix td.is-filtered::after {
    content: "—";
    display: grid;
    place-items: center;
    min-height: 6.4rem;
    color: var(--text-muted);
}

/* ===== Education batch teacher drawer actions ===== */
.schedule-drawer-teacher-copy {
    display: grid;
    min-width: 0;
    flex: 1 1 auto;
}

.schedule-remove-teacher-form {
    margin-left: auto;
}

.schedule-drawer-remove,
.schedule-person-select {
    border: 1px solid var(--table-border);
    border-radius: 0.55rem;
    background: var(--surface);
    color: var(--primary);
    padding: 0.32rem 0.5rem;
    font-size: 0.72rem;
    font-weight: 700;
}

.schedule-drawer-remove {
    color: var(--bs-danger);
}

.schedule-drawer-remove:hover,
.schedule-drawer-remove:focus-visible,
.schedule-person-select:hover,
.schedule-person-select:focus-visible {
    border-color: currentColor;
    outline: none;
}

.schedule-person-select:disabled {
    color: var(--text-muted);
    cursor: default;
    opacity: 0.65;
}

.schedule-add-teacher-toggle {
    width: 100%;
    margin-top: 0.8rem;
}

.schedule-add-teacher {
    display: grid;
    gap: 1rem;
    margin-top: 0.8rem;
    border-top: 1px solid var(--table-border);
    padding-top: 0.9rem;
}

.schedule-add-teacher[hidden] {
    display: none;
}

.schedule-add-section-label {
    display: block;
    margin-bottom: 0.45rem;
    color: var(--text-muted);
    font-size: 0.72rem;
    font-weight: 750;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.schedule-roster-list,
.schedule-person-search-results {
    display: grid;
    gap: 0.4rem;
}

.schedule-person-search-results {
    margin-top: 0.5rem;
}

.schedule-person-result {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-width: 0;
    border: 1px solid var(--table-border);
    border-radius: 0.7rem;
    background: var(--surface);
    padding: 0.55rem;
}

.schedule-person-result-copy {
    display: grid;
    min-width: 0;
    flex: 1 1 auto;
}

.schedule-person-result-copy strong {
    overflow: hidden;
    color: var(--text-main);
    font-size: 0.8rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.schedule-person-result-copy small {
    color: var(--text-muted);
    font-size: 0.68rem;
}

.schedule-teacher-assign-form {
    display: grid;
    gap: 0.8rem;
    border: 1px solid color-mix(in srgb, var(--primary) 26%, var(--table-border));
    border-radius: 0.8rem;
    background: color-mix(in srgb, var(--primary-soft) 35%, var(--surface));
    padding: 0.8rem;
}

.schedule-teacher-assign-form[hidden] {
    display: none;
}

.schedule-selected-person {
    display: grid;
}

.schedule-selected-person strong {
    color: var(--text-main);
    font-size: 0.88rem;
}

.schedule-selected-person span {
    color: var(--text-muted);
    font-size: 0.72rem;
}

.schedule-roster-enroll {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    border-radius: 0.65rem;
    background: color-mix(in srgb, var(--bs-warning) 12%, var(--surface));
    padding: 0.65rem;
    color: var(--text-main);
    font-size: 0.76rem;
    line-height: 1.4;
}

.schedule-roster-enroll[hidden] {
    display: none;
}

.schedule-roster-enroll input {
    margin-top: 0.15rem;
    accent-color: var(--primary);
}

.schedule-scope-options {
    display: grid;
    gap: 0.42rem;
    margin: 0;
    border: 0;
    padding: 0;
}

.schedule-scope-options legend {
    margin-bottom: 0.35rem;
    color: var(--text-main);
    font-size: 0.78rem;
    font-weight: 700;
}

.schedule-scope-options label,
.schedule-selected-dates label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--text-main);
    font-size: 0.76rem;
}

.schedule-scope-options input,
.schedule-selected-dates input {
    accent-color: var(--primary);
}

.schedule-selected-dates {
    display: grid;
    gap: 0.4rem;
    max-height: 11rem;
    overflow-y: auto;
    border: 1px solid var(--table-border);
    border-radius: 0.65rem;
    background: var(--surface);
    padding: 0.65rem;
}

.schedule-selected-dates[hidden],
.schedule-scope-help[hidden] {
    display: none;
}

.schedule-scope-help {
    margin: 0;
    border-radius: 0.6rem;
    background: var(--surface-muted);
    padding: 0.55rem;
}

/* ===== Education batch-level assignment and gaps ===== */
.schedule-batch-tools {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border: 1px solid var(--card-border);
    border-radius: 1rem;
    box-shadow: var(--card-shadow);
    padding: 0.85rem 1rem;
}

.schedule-coverage-summary,
.schedule-batch-tool-actions {
    display: flex;
    align-items: center;
    gap: 0.7rem;
}

.schedule-coverage-summary > div {
    display: grid;
}

.schedule-coverage-summary span {
    color: var(--text-muted);
    font-size: 0.74rem;
}

.schedule-coverage-summary strong {
    color: var(--text-main);
    font-size: 0.92rem;
}

.schedule-coverage-gap {
    border-radius: 999px;
    background: color-mix(in srgb, var(--bs-warning) 16%, var(--surface));
    color: var(--text-main) !important;
    padding: 0.3rem 0.6rem;
    font-weight: 700;
}

.schedule-coverage-gap.is-complete {
    background: color-mix(in srgb, var(--bs-success) 16%, var(--surface));
}

.schedule-batch-tool-actions .btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.schedule-batch-action-drawer {
    position: fixed;
    z-index: 1060;
    top: 0;
    right: 0;
    width: min(92vw, 27rem);
    height: 100dvh;
    border-left: 1px solid var(--card-border);
    box-shadow: -1rem 0 2.5rem rgb(0 0 0 / 0.12);
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    transform: translateX(100%);
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.schedule-batch-action-drawer.is-open {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(0);
}

.schedule-batch-action-body {
    height: calc(100% - 5.2rem);
    overflow-y: auto;
    padding: 1rem;
}

.schedule-batch-action-body form {
    display: grid;
    gap: 1rem;
}

.schedule-batch-field {
    display: grid;
    gap: 0.4rem;
}

.schedule-batch-field > label {
    color: var(--text-main);
    font-size: 0.8rem;
    font-weight: 700;
}

.schedule-batch-roster {
    display: grid;
    gap: 0.4rem;
}

.schedule-batch-roster .schedule-person-result {
    width: 100%;
    text-align: left;
}

.schedule-bulk-preview {
    display: grid;
    gap: 0.45rem;
    border: 1px solid color-mix(in srgb, var(--primary) 28%, var(--table-border));
    border-radius: 0.8rem;
    background: color-mix(in srgb, var(--primary-soft) 38%, var(--surface));
    padding: 0.8rem;
}

.schedule-bulk-preview > strong {
    color: var(--text-main);
    font-size: 0.9rem;
}

.schedule-bulk-preview > span {
    color: var(--text-muted);
    font-size: 0.76rem;
}

.schedule-bulk-preview p {
    margin: 0;
    color: var(--text-main);
    font-size: 0.78rem;
}

.schedule-bulk-preview [data-preview-dates] {
    display: grid;
    gap: 0.25rem;
    max-height: 9rem;
    overflow-y: auto;
    color: var(--text-muted);
    font-size: 0.74rem;
}

.schedule-bulk-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

.schedule-gap-overview {
    display: grid;
    gap: 0.15rem;
    border-radius: 0.8rem;
    background: var(--surface-muted);
    padding: 0.8rem;
}

.schedule-gap-overview strong {
    color: var(--text-main);
    font-size: 1.25rem;
}

.schedule-gap-overview span {
    color: var(--text-muted);
    font-size: 0.78rem;
}

.schedule-gap-groups {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
}

.schedule-gap-group {
    overflow: hidden;
    border: 1px solid var(--table-border);
    border-radius: 0.8rem;
}

.schedule-gap-group > header {
    display: flex;
    justify-content: space-between;
    gap: 0.8rem;
    background: var(--table-head-bg);
    padding: 0.65rem 0.75rem;
}

.schedule-gap-group > header strong {
    color: var(--text-main);
    font-size: 0.82rem;
}

.schedule-gap-group > header span {
    color: var(--text-muted);
    font-size: 0.72rem;
}

.schedule-gap-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.7rem;
    border-top: 1px solid var(--table-border);
    padding: 0.65rem 0.75rem;
}

.schedule-gap-item > div {
    display: grid;
    min-width: 0;
}

.schedule-gap-item strong {
    color: var(--text-main);
    font-size: 0.78rem;
}

.schedule-gap-item span {
    color: var(--text-muted);
    font-size: 0.7rem;
}

@media (max-width: 767.98px) {
    .schedule-batch-tools,
    .schedule-coverage-summary,
    .schedule-batch-tool-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .schedule-batch-tool-actions .btn {
        justify-content: center;
        width: 100%;
    }
}

/* ===== Education teacher conflict states ===== */
.schedule-conflict-summary {
    border-radius: 999px;
    background: color-mix(in srgb, var(--bs-danger) 12%, var(--surface));
    color: var(--bs-danger) !important;
    padding: 0.3rem 0.6rem;
    font-weight: 700;
}

.schedule-conflict-summary.is-clear {
    background: var(--surface-muted);
    color: var(--text-muted) !important;
}

.schedule-cell-time {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.4rem;
}

.schedule-conflict-icon {
    display: inline-grid;
    place-items: center;
    width: 1.35rem;
    height: 1.35rem;
    border-radius: 50%;
    background: color-mix(in srgb, var(--bs-warning) 20%, var(--surface));
    color: color-mix(in srgb, var(--bs-warning) 72%, var(--text-main));
    font-size: 0.72rem;
}

.schedule-drawer-conflict {
    display: grid;
    gap: 0.55rem;
    margin-bottom: 1rem;
    border: 1px solid color-mix(in srgb, var(--bs-warning) 45%, var(--table-border));
    border-radius: 0.8rem;
    background: color-mix(in srgb, var(--bs-warning) 9%, var(--surface));
    padding: 0.75rem;
}

.schedule-conflict-detail {
    display: grid;
    gap: 0.12rem;
    border-top: 1px solid color-mix(in srgb, var(--bs-warning) 24%, var(--table-border));
    padding-top: 0.5rem;
}

.schedule-conflict-detail:first-of-type {
    border-top: 0;
    padding-top: 0;
}

.schedule-conflict-detail strong {
    color: var(--text-main);
    font-size: 0.82rem;
}

.schedule-conflict-detail span {
    color: var(--text-muted);
    font-size: 0.72rem;
}

.schedule-preview-conflicts {
    display: grid;
    gap: 0.35rem;
    border-radius: 0.65rem;
    background: color-mix(in srgb, var(--bs-warning) 14%, var(--surface));
    padding: 0.65rem;
}

.schedule-preview-conflicts > strong {
    color: var(--text-main);
    font-size: 0.76rem;
}

.schedule-preview-conflicts [data-preview-conflict-list] {
    display: grid;
    gap: 0.2rem;
    color: var(--text-muted);
    font-size: 0.7rem;
}

/* ===== Education Draft teacher rotation ===== */
.schedule-rotation-list,
.schedule-rotation-preview-list {
    display: grid;
    gap: 0.45rem;
}

.schedule-rotation-teacher {
    display: grid;
    grid-template-columns: 1.5rem minmax(0, 1fr) auto;
    gap: 0.55rem;
    align-items: center;
    border: 1px solid var(--table-border);
    border-radius: 0.7rem;
    background: var(--surface);
    padding: 0.55rem;
}

.schedule-rotation-teacher > span:first-child {
    display: grid;
    place-items: center;
    width: 1.4rem;
    height: 1.4rem;
    border-radius: 50%;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 0.7rem;
    font-weight: 800;
}

.schedule-rotation-teacher strong {
    color: var(--text-main);
    font-size: 0.8rem;
}

.schedule-rotation-teacher > span:last-of-type {
    display: flex;
    gap: 0.2rem;
}

.schedule-rotation-teacher button {
    display: grid;
    place-items: center;
    width: 1.65rem;
    height: 1.65rem;
    border: 1px solid var(--table-border);
    border-radius: 0.45rem;
    background: var(--surface);
    color: var(--text-main);
    font-size: 0.75rem;
}

.schedule-rotation-teacher button:disabled {
    opacity: 0.4;
}

.schedule-rotation-teacher .schedule-roster-enroll {
    grid-column: 2 / -1;
}

.schedule-rotation-preview {
    display: grid;
    gap: 0.65rem;
    border: 1px solid color-mix(in srgb, var(--primary) 28%, var(--table-border));
    border-radius: 0.8rem;
    background: color-mix(in srgb, var(--primary-soft) 32%, var(--surface));
    padding: 0.75rem;
}

.schedule-rotation-summary {
    color: var(--text-muted);
    font-size: 0.74rem;
    line-height: 1.45;
}

.schedule-rotation-preview-row {
    display: grid;
    gap: 0.12rem;
    border-radius: 0.6rem;
    background: var(--surface);
    padding: 0.55rem;
}

.schedule-rotation-preview-row strong {
    color: var(--text-main);
    font-size: 0.78rem;
}

.schedule-rotation-preview-row span {
    color: var(--text-muted);
    font-size: 0.7rem;
}

.schedule-rotation-preview-row.is-skipped {
    color: var(--text-muted);
    font-size: 0.74rem;
}

/* ===== Education batch teacher workload tab ===== */
.schedule-teachers-panel {
    display: grid;
    gap: 1rem;
}

.schedule-teachers-panel[hidden] {
    display: none;
}

.schedule-teacher-summary {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid var(--card-border);
    border-radius: 1rem;
    box-shadow: var(--card-shadow);
}

.schedule-teacher-summary > div {
    display: grid;
    gap: 0.15rem;
    padding: 0.9rem 1rem;
    border-right: 1px solid var(--table-border);
}

.schedule-teacher-summary > div:last-child {
    border-right: 0;
}

.schedule-teacher-summary strong {
    color: var(--text-main);
    font-size: 1.1rem;
}

.schedule-teacher-summary span {
    color: var(--text-muted);
    font-size: 0.72rem;
    font-weight: 650;
}

.schedule-teacher-filters {
    display: grid;
    grid-template-columns: minmax(12rem, 1.5fr) repeat(4, minmax(9rem, 1fr));
    gap: 0.75rem;
    border: 1px solid var(--card-border);
    border-radius: 1rem;
    box-shadow: var(--card-shadow);
    padding: 0.85rem 1rem;
}

.schedule-teacher-filters label {
    display: grid;
    gap: 0.3rem;
    min-width: 0;
}

.schedule-teacher-filters label > span {
    color: var(--text-muted);
    font-size: 0.7rem;
    font-weight: 700;
}

.schedule-teacher-list {
    overflow: hidden;
    border: 1px solid var(--card-border);
    border-radius: 1rem;
    box-shadow: var(--card-shadow);
}

.schedule-teacher-list-header,
.schedule-teacher-row {
    display: grid;
    grid-template-columns: minmax(12rem, 1.15fr) minmax(14rem, 1.6fr) minmax(6rem, 0.55fr) minmax(5rem, 0.5fr) minmax(9rem, 0.8fr) 1.5rem;
    align-items: center;
    gap: 0.75rem;
}

.schedule-teacher-list:not(.is-posted) .schedule-teacher-list-header,
.schedule-teacher-list:not(.is-posted) .schedule-teacher-row {
    grid-template-columns: minmax(12rem, 1.15fr) minmax(14rem, 1.8fr) minmax(6rem, 0.55fr) minmax(5rem, 0.5fr) 1.5rem;
}

.schedule-teacher-list-header {
    border-bottom: 1px solid var(--table-border);
    background: var(--table-head-bg);
    color: var(--text-muted);
    padding: 0.7rem 1rem;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
}

.schedule-teacher-row {
    width: 100%;
    border: 0;
    border-bottom: 1px solid var(--table-border);
    background: var(--surface);
    color: var(--text-main);
    padding: 0.75rem 1rem;
    text-align: left;
}

.schedule-teacher-row:last-child {
    border-bottom: 0;
}

.schedule-teacher-row:hover,
.schedule-teacher-row:focus-visible,
.schedule-teacher-row.is-selected {
    outline: 0;
    background: var(--table-row-hover);
    box-shadow: inset 3px 0 var(--primary);
}

.schedule-teacher-identity {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-width: 0;
}

.schedule-teacher-identity > span:last-child,
.schedule-teacher-context,
.schedule-teacher-metric,
.schedule-teacher-confirmations {
    display: grid;
    gap: 0.12rem;
    min-width: 0;
}

.schedule-teacher-identity strong {
    overflow: hidden;
    font-size: 0.84rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.schedule-teacher-identity small,
.schedule-teacher-context small,
.schedule-teacher-metric small,
.schedule-teacher-confirmations small {
    color: var(--text-muted);
    font-size: 0.69rem;
}

.schedule-teacher-context small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.schedule-teacher-metric strong {
    font-size: 0.9rem;
}

.schedule-teacher-metric.has-conflict strong,
.schedule-teacher-drawer-summary .has-conflict,
.schedule-assignment-state .has-conflict {
    color: color-mix(in srgb, var(--bs-warning) 78%, var(--text-main));
}

.schedule-teacher-row-arrow {
    color: var(--text-muted);
    font-size: 1.35rem;
    text-align: right;
}

.schedule-teacher-workload-body {
    height: calc(100% - 4.6rem);
    overflow-y: auto;
    padding: 1rem;
}

.schedule-teacher-drawer-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.schedule-teacher-drawer-summary span {
    display: grid;
    gap: 0.1rem;
    border-radius: 0.65rem;
    background: var(--surface-muted);
    padding: 0.6rem;
    color: var(--text-muted);
    font-size: 0.66rem;
}

.schedule-teacher-drawer-summary strong {
    color: inherit;
    font-size: 0.95rem;
}

.schedule-teacher-assignment-groups,
.schedule-teacher-assignment-groups > section,
.schedule-teacher-assignment-list {
    display: grid;
    gap: 0.6rem;
}

.schedule-teacher-assignment-groups {
    gap: 1rem;
}

.schedule-teacher-assignment-groups h3 {
    margin: 0;
    color: var(--text-main);
    font-size: 0.86rem;
}

.schedule-teacher-assignment {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    border: 1px solid var(--table-border);
    border-radius: 0.7rem;
    padding: 0.65rem;
}

.schedule-teacher-assignment > span {
    display: grid;
    gap: 0.12rem;
}

.schedule-teacher-assignment strong {
    color: var(--text-main);
    font-size: 0.8rem;
}

.schedule-teacher-assignment small {
    color: var(--text-muted);
    font-size: 0.7rem;
}

.schedule-assignment-state {
    text-align: right;
}

@media (max-width: 1199.98px) {
    .schedule-teacher-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .schedule-teacher-list-header {
        display: none;
    }

    .schedule-teacher-row,
    .schedule-teacher-list:not(.is-posted) .schedule-teacher-row {
        grid-template-columns: minmax(12rem, 1fr) minmax(12rem, 1fr) repeat(2, minmax(5rem, auto)) minmax(8rem, auto) 1.5rem;
    }
}

@media (max-width: 767.98px) {
    .schedule-teacher-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .schedule-teacher-summary > div {
        border-bottom: 1px solid var(--table-border);
    }

    .schedule-teacher-filters {
        grid-template-columns: 1fr;
    }

    .schedule-teacher-row {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: start;
    }

    .schedule-teacher-identity,
    .schedule-teacher-context,
    .schedule-teacher-metric,
    .schedule-teacher-confirmations {
        grid-column: 1;
    }

    .schedule-teacher-row-arrow {
        grid-column: 2;
        grid-row: 1;
    }

    .schedule-teacher-context small {
        white-space: normal;
    }
}
/* ===== Education Schedule Batch workflow polish ===== */
.schedule-batch-workspace {
    --schedule-control-height: 2.4rem;
}

.schedule-batch-hero-body {
    align-items: center;
    padding: 1rem 1.15rem;
}

.schedule-batch-hero-accent {
    height: 0.3rem;
}

.schedule-batch-title {
    font-size: clamp(1.3rem, 1.8vw, 1.65rem);
}

.schedule-batch-heading-line {
    gap: 0.6rem;
    margin-block: 0.08rem 0.25rem;
}

.schedule-batch-subtitle,
.schedule-posted-guidance {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--text-muted);
    font-size: 0.8rem;
}

.schedule-posted-guidance {
    margin-top: 0.35rem;
    color: color-mix(in srgb, var(--bs-success) 70%, var(--text-main));
}

.schedule-batch-actions .btn,
.schedule-batch-tool-actions .btn,
.schedule-filter-fields .form-control,
.schedule-filter-fields .form-select,
.schedule-filter-fields .btn,
.schedule-teacher-filters .form-control,
.schedule-teacher-filters .form-select {
    min-height: var(--schedule-control-height);
}

.schedule-batch-actions .btn,
.schedule-batch-tool-actions .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.42rem;
    padding-block: 0.42rem;
    font-size: 0.8rem;
}

.schedule-batch-actions .bi,
.schedule-batch-tool-actions .bi {
    width: 1rem;
    font-size: 0.88rem;
    line-height: 1;
    text-align: center;
}

.schedule-batch-more-menu {
    min-width: 12rem;
    overflow: hidden;
    border-color: var(--card-border);
    border-radius: 0.8rem;
    background: var(--surface);
    box-shadow: var(--card-shadow);
    padding: 0.35rem;
}

.schedule-batch-more-menu form {
    margin: 0;
}

.schedule-batch-more-menu .dropdown-item {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    border: 0;
    border-radius: 0.55rem;
    background: transparent;
    color: var(--text-main);
    padding: 0.5rem 0.65rem;
    font-size: 0.8rem;
}

.schedule-batch-more-menu .dropdown-item:hover,
.schedule-batch-more-menu .dropdown-item:focus-visible {
    background: var(--table-row-hover);
}

.schedule-batch-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.schedule-batch-summary > div {
    padding: 0.65rem 1.15rem;
}

.schedule-batch-summary strong {
    font-size: 1rem;
}

.schedule-batch-summary span {
    font-size: 0.7rem;
}

.schedule-workspace-tabs {
    gap: 0.25rem;
    padding-inline: 0;
}

.schedule-workspace-tab {
    min-height: 2.65rem;
    padding: 0.65rem 0.9rem;
    border-radius: 0.6rem 0.6rem 0 0;
}

.schedule-workspace-tab:hover:not(:disabled),
.schedule-workspace-tab:focus-visible {
    background: var(--table-row-hover);
    outline: none;
}

.schedule-workspace-tab:disabled {
    color: var(--text-muted);
    cursor: not-allowed;
    opacity: 0.5;
}

.schedule-batch-tools {
    gap: 0.75rem;
    padding: 0.7rem 0.8rem;
}

.schedule-coverage-summary {
    flex-wrap: wrap;
    gap: 0.5rem;
}

.schedule-coverage-primary {
    margin-right: 0.1rem;
}

.schedule-coverage-gap,
.schedule-conflict-summary,
.schedule-pending-summary {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    min-height: 1.8rem;
    border-radius: 999px;
    padding: 0.25rem 0.55rem;
    font-size: 0.7rem;
    font-weight: 700;
    white-space: nowrap;
}

.schedule-pending-summary {
    background: color-mix(in srgb, var(--bs-warning) 16%, var(--surface));
    color: color-mix(in srgb, var(--bs-warning) 76%, var(--text-main));
}

.schedule-pending-summary.is-clear {
    background: var(--surface-muted);
    color: var(--text-muted);
}

.schedule-action-count {
    display: inline-grid;
    place-items: center;
    min-width: 1.25rem;
    height: 1.25rem;
    border-radius: 999px;
    background: var(--surface-muted);
    padding-inline: 0.25rem;
    font-size: 0.66rem;
}

.schedule-filter-bar {
    gap: 0.75rem;
    padding: 0.65rem 0.8rem;
}

.schedule-filter-chip {
    min-height: 2rem;
    padding: 0.32rem 0.65rem;
}

.schedule-filter-chip span {
    min-width: 1.15rem;
    text-align: center;
}

.schedule-program-header {
    min-height: 3.65rem;
    padding: 0.7rem 0.9rem;
}

.schedule-program-color {
    height: 2.1rem;
}

.schedule-program-header h2 {
    font-size: 1rem;
}

.schedule-program-controls {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.schedule-program-count {
    font-size: 0.72rem;
    white-space: nowrap;
}

.schedule-program-toggle {
    display: inline-grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    border: 1px solid var(--table-border);
    border-radius: 0.55rem;
    background: var(--surface);
    color: var(--text-muted);
}

.schedule-program-toggle:hover,
.schedule-program-toggle:focus-visible {
    border-color: color-mix(in srgb, var(--primary) 36%, var(--table-border));
    color: var(--primary);
    outline: none;
}

.schedule-program-section.is-collapsed {
    box-shadow: none;
}

.schedule-matrix thead th {
    padding: 0.55rem 0.65rem;
    font-size: 0.78rem;
}

.schedule-date-column {
    padding: 0.58rem 0.65rem !important;
}

.schedule-matrix-cell {
    gap: 0.38rem;
    min-height: 5.25rem;
    padding: 0.5rem 0.55rem;
}

.schedule-cell-time {
    font-size: 0.68rem;
}

.schedule-teacher-chip {
    gap: 0.4rem;
    min-height: 2rem;
    padding: 0.28rem 0.36rem;
}

.schedule-teacher-avatar {
    width: 1.55rem;
    height: 1.55rem;
}

.schedule-teacher-chip-copy > span {
    font-size: 0.72rem;
}

.schedule-unassigned-label {
    padding: 0.28rem 0.42rem;
    font-size: 0.69rem;
}

.schedule-matrix-empty-cell,
.schedule-matrix td.is-filtered::after {
    min-height: 5.25rem;
}

.schedule-drawer,
.schedule-batch-action-drawer {
    top: var(--schedule-drawer-top, 4.75rem);
    width: min(calc(100vw - 2rem), 26.25rem);
    height: calc(100dvh - var(--schedule-drawer-top, 4.75rem));
    border: 1px solid var(--card-border);
    border-right: 0;
    border-radius: 1rem 0 0 1rem;
    box-shadow: -1rem 0 2.5rem rgb(0 0 0 / 0.12);
}

.schedule-drawer-header {
    min-height: 4.4rem;
    padding: 0.85rem 1rem;
    background: var(--surface);
}

.schedule-drawer-header h2 {
    font-size: 1rem;
}

.schedule-drawer-body,
.schedule-batch-action-body,
.schedule-teacher-workload-body {
    scrollbar-gutter: stable;
}

.schedule-batch-action-body {
    height: calc(100% - 4.4rem);
}

.schedule-bulk-actions,
.schedule-rotation-form > .btn:last-child {
    position: sticky;
    z-index: 2;
    bottom: -1rem;
    margin: 0 -1rem -1rem;
    border-top: 1px solid var(--table-border);
    background: var(--surface);
    padding: 0.8rem 1rem;
}

.schedule-bulk-actions .btn {
    min-height: var(--schedule-control-height);
}

.schedule-empty-state {
    padding: 1.75rem 1rem;
}

.schedule-empty-state h2 {
    margin-bottom: 0.25rem;
    color: var(--text-main);
    font-size: 1rem;
}

.schedule-empty-state p {
    margin-bottom: 0.75rem;
    font-size: 0.8rem;
}

.schedule-batch-workspace button:focus-visible,
.schedule-batch-workspace a:focus-visible,
.schedule-batch-workspace input:focus-visible,
.schedule-batch-workspace select:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--primary) 66%, white);
    outline-offset: 2px;
}

.schedule-batch-workspace button[aria-busy="true"] {
    cursor: wait;
    opacity: 0.72;
}

@media (max-width: 991.98px) {
    .schedule-batch-tools {
        align-items: stretch;
        flex-direction: column;
    }

    .schedule-batch-tool-actions {
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .schedule-drawer,
    .schedule-batch-action-drawer {
        width: min(94vw, 27.5rem);
    }
}

@media (max-width: 575.98px) {
    .schedule-batch-hero-body {
        align-items: stretch;
        padding: 0.85rem;
    }

    .schedule-batch-actions {
        justify-content: flex-start;
    }

    .schedule-batch-actions .btn {
        min-width: 0;
    }

    .schedule-batch-summary {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .schedule-batch-summary > div {
        border-bottom: 0;
        padding: 0.55rem 0.45rem;
        text-align: center;
    }

    .schedule-batch-tool-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .schedule-filter-status {
        scrollbar-width: thin;
    }

    .schedule-program-header {
        align-items: flex-start;
    }

    .schedule-program-controls {
        align-items: flex-end;
        flex-direction: column;
    }

    .schedule-program-count {
        white-space: normal;
        text-align: right;
    }

    .schedule-drawer,
    .schedule-batch-action-drawer {
        width: 100vw;
        max-width: 100vw;
        border-inline: 0;
        border-radius: 0;
    }
}

/* ===== Education Schedule Batch final visual polish ===== */
.schedule-batch-workspace .schedule-teacher-avatar {
    overflow: hidden;
    width: 1.75rem;
    height: 1.75rem;
    flex: 0 0 1.75rem;
    border: 1px solid color-mix(in srgb, var(--primary) 16%, var(--table-border));
    font-size: 0.62rem;
    line-height: 1;
}

.schedule-batch-workspace .schedule-teacher-avatar--image {
    display: block;
    object-fit: cover;
    border-radius: 50%;
    background: var(--surface-muted);
}

.schedule-batch-workspace .schedule-teacher-avatar--small {
    width: 1.65rem;
    height: 1.65rem;
    flex-basis: 1.65rem;
}

.schedule-batch-workspace .schedule-teacher-avatar--drawer,
.schedule-batch-workspace .schedule-teacher-avatar--medium {
    width: 2.25rem;
    height: 2.25rem;
    flex-basis: 2.25rem;
    font-size: 0.72rem;
}

.schedule-batch-workspace .schedule-teacher-avatar--large {
    width: 2.75rem;
    height: 2.75rem;
    flex-basis: 2.75rem;
    font-size: 0.82rem;
}

.schedule-batch-workspace .schedule-matrix th.schedule-date-column,
.schedule-batch-workspace .schedule-matrix td:has(> .schedule-date-column) {
    width: 5.5rem;
    min-width: 5.5rem;
}

.schedule-batch-workspace .schedule-date-column {
    width: 5.5rem;
    min-width: 5.5rem;
    padding: 0.45rem 0.5rem !important;
}

.schedule-batch-workspace .schedule-matrix-cell {
    min-height: 4.7rem;
    gap: 0.28rem;
    padding: 0.4rem 0.48rem;
}

.schedule-batch-workspace .schedule-matrix-empty-cell,
.schedule-batch-workspace .schedule-matrix td.is-filtered::after {
    min-height: 4.7rem;
}

.schedule-batch-workspace .schedule-teacher-chip {
    gap: 0.42rem;
    min-height: 1.9rem;
    border: 1px solid color-mix(in srgb, var(--table-border) 78%, transparent);
    background: color-mix(in srgb, var(--surface-muted) 76%, var(--surface));
    padding: 0.2rem 0.34rem;
}

.schedule-batch-workspace .schedule-drawer-teacher,
.schedule-batch-workspace .schedule-person-result {
    min-height: 3.25rem;
}

.schedule-batch-workspace .schedule-rotation-teacher > strong {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-width: 0;
}

.schedule-batch-workspace .schedule-rotation-preview-teacher,
.schedule-batch-workspace .schedule-teacher-drawer-profile {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-width: 0;
}

.schedule-batch-workspace .schedule-teacher-drawer-profile {
    margin-bottom: 0.85rem;
    border-bottom: 1px solid var(--table-border);
    padding-bottom: 0.85rem;
    color: var(--text-main);
}

.schedule-batch-workspace .schedule-teacher-drawer-profile strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 575.98px) {
    .schedule-batch-workspace .schedule-teacher-avatar--medium {
        width: 2rem;
        height: 2rem;
        flex-basis: 2rem;
    }
}

.schedule-batch-workspace .schedule-conflict-teacher {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-width: 0;
}

/* ===== Education Schedule Batch matrix hierarchy refinement ===== */
.schedule-batch-workspace .schedule-filter-bar {
    flex-wrap: nowrap;
    gap: 0.7rem;
    padding: 0.55rem 0.7rem;
}

.schedule-batch-workspace .schedule-filter-status,
.schedule-batch-workspace .schedule-filter-fields {
    flex-wrap: nowrap;
    gap: 0.35rem;
}

.schedule-batch-workspace .schedule-filter-fields {
    min-width: 0;
    margin-left: auto;
    flex-shrink: 0;
}

.schedule-batch-workspace .schedule-filter-fields .form-select,
.schedule-batch-workspace .schedule-filter-fields .form-control,
.schedule-batch-workspace .schedule-filter-fields .btn {
    min-height: var(--schedule-control-height);
    border-radius: 0.62rem;
    font-size: 0.76rem;
}

.schedule-batch-workspace .schedule-filter-fields .form-select {
    width: 12.5rem;
    min-width: 12.5rem;
    flex: 0 0 12.5rem;
}

.schedule-batch-workspace .schedule-filter-fields .form-control {
    width: 20rem;
    min-width: 18rem;
    flex: 1 1 20rem;
}

.schedule-batch-workspace .schedule-filter-fields .btn {
    flex: 0 0 auto;
}

.schedule-batch-workspace .schedule-filter-chip {
    min-height: 1.9rem;
    gap: 0.32rem;
    border-color: var(--table-border);
    border-radius: 999px;
    background: var(--surface);
    padding: 0.24rem 0.58rem;
    font-size: 0.72rem;
    line-height: 1;
    white-space: nowrap;
}

.schedule-batch-workspace .schedule-filter-chip span {
    min-width: auto;
    background: transparent;
    padding: 0;
    color: inherit;
    font-size: 0.68rem;
    font-weight: 800;
}

.schedule-batch-workspace .schedule-filter-chip[data-schedule-filter="unassigned"] {
    border-color: color-mix(in srgb, var(--bs-warning) 28%, var(--table-border));
    background: color-mix(in srgb, var(--bs-warning) 7%, var(--surface));
}

.schedule-batch-workspace .schedule-filter-chip[data-schedule-filter="pending"] {
    border-color: color-mix(in srgb, var(--bs-warning) 34%, var(--table-border));
    background: color-mix(in srgb, var(--bs-warning) 10%, var(--surface));
}

.schedule-batch-workspace .schedule-filter-chip[data-schedule-filter="conflict"] {
    border-color: color-mix(in srgb, var(--bs-danger) 25%, var(--table-border));
    background: color-mix(in srgb, var(--bs-danger) 7%, var(--surface));
}

.schedule-batch-workspace .schedule-filter-chip.is-active {
    border-color: color-mix(in srgb, var(--primary) 45%, var(--table-border));
    background: var(--primary-soft);
    color: var(--primary);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 10%, transparent);
}

.schedule-batch-workspace .schedule-program-section {
    border-color: color-mix(in srgb, var(--program-color) 18%, var(--card-border));
    box-shadow: 0 0.15rem 0.55rem color-mix(in srgb, var(--program-color) 7%, transparent);
}

.schedule-batch-workspace .schedule-program-header {
    border-bottom-color: color-mix(in srgb, var(--program-color) 30%, var(--table-border));
    border-left: 0.3rem solid var(--program-color);
    background: var(--surface);
    padding: 0.58rem 0.78rem;
}

.schedule-batch-workspace .schedule-program-color {
    display: inline-grid;
    place-items: center;
    width: auto;
    height: auto;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--program-color);
    font-size: 1.35rem;
}

.schedule-batch-workspace .schedule-program-header h2 {
    color: var(--text-main);
    font-size: 0.96rem;
}

.schedule-batch-workspace .schedule-matrix thead th {
    padding: 0.45rem 0.55rem;
    border-bottom: 2px solid color-mix(in srgb, var(--primary) 18%, var(--table-border));
    background: color-mix(in srgb, var(--primary) 2%, var(--surface));
}

.schedule-batch-workspace .schedule-class-name {
    font-size: 0.78rem;
    line-height: 1.25;
}

.schedule-batch-workspace .schedule-class-meta {
    display: flex;
    align-items: center;
    gap: 0.16rem;
    min-width: 0;
    margin-top: 0.16rem;
    color: var(--text-muted);
    font-size: 0.67rem;
    font-weight: 500;
    white-space: nowrap;
}

.schedule-batch-workspace .schedule-class-age-range,
.schedule-batch-workspace .schedule-class-meta-separator,
.schedule-batch-workspace .schedule-class-room {
    display: inline;
    margin: 0;
}

.schedule-batch-workspace .schedule-class-room {
    overflow: hidden;
    text-overflow: ellipsis;
}

.schedule-batch-workspace .schedule-date-column,
.schedule-batch-workspace .schedule-matrix .schedule-date-column {
    width: 4.75rem;
    min-width: 4.75rem;
    padding: 0.35rem 0.4rem !important;
    text-align: center;
}

.schedule-batch-workspace .schedule-date-day {
    font-size: 0.63rem;
}

.schedule-batch-workspace .schedule-date-number {
    font-size: 0.8rem;
}

.schedule-batch-workspace .schedule-date-year {
    font-size: 0.62rem;
}

.schedule-batch-workspace .schedule-matrix-cell {
    grid-template-columns: max-content minmax(0, 1fr);
    min-height: 4.15rem;
    gap: 0.35rem;
    padding: 0.32rem 0.4rem;
}

.schedule-batch-workspace .schedule-matrix-empty-cell,
.schedule-batch-workspace .schedule-matrix td.is-filtered::after {
    min-height: 4.15rem;
}

.schedule-batch-workspace .schedule-cell-time {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    justify-self: center;
    min-height: 1.8rem;
    color: var(--text-muted);
    font-size: 0.64rem;
    text-align: center;
    white-space: nowrap;
}

.schedule-batch-workspace .schedule-cell-time.is-override {
    color: var(--primary);
    font-weight: 700;
}

.schedule-batch-workspace .schedule-cell-teachers {
    gap: 0;
    min-width: 0;
}

.schedule-batch-workspace .schedule-cell-teachers:has(.schedule-teacher-chip) {
    padding: 0.2rem 0.3rem;
    border-radius: 0.45rem;
    background: transparent;
}

.schedule-batch-workspace .schedule-teacher-chip {
    min-height: 1.8rem;
    padding: 0.15rem 0.2rem;
    border: 0;
    border-radius: 0.25rem;
    background: transparent;
    box-shadow: none;
}

.schedule-batch-workspace .schedule-teacher-chip.confirmation-assigned {
    background: transparent;
}

.schedule-batch-workspace .schedule-teacher-chip.confirmation-pending {
    background: transparent;
}

.schedule-batch-workspace .schedule-teacher-chip.confirmation-approved {
    background: transparent;
}

.schedule-batch-workspace .schedule-teacher-chip.confirmation-declined {
    background: transparent;
}

.schedule-batch-workspace .schedule-teacher-chip.has-conflict {
    background: transparent;
}

.schedule-batch-workspace .schedule-teacher-chip + .schedule-teacher-chip {
    margin-top: 0.2rem;
}

.schedule-batch-workspace .schedule-teacher-chip-copy {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.4rem;
    width: 100%;
}

.schedule-batch-workspace .schedule-teacher-chip-copy > span {
    flex: 1 1 auto;
}

.schedule-batch-workspace .schedule-teacher-chip-copy small {
    flex: 0 0 auto;
    white-space: nowrap;
}

.schedule-batch-workspace .schedule-conflict-icon {
    display: inline-flex;
    width: auto;
    height: auto;
    border-radius: 0;
    background: transparent;
    color: var(--bs-danger);
    font-size: 1.2rem;
}
.schedule-batch-workspace .schedule-teacher-status > .pi {
    font-size: 1.2rem;
}

.schedule-batch-workspace .schedule-teacher-status {
    display: inline-flex;
    align-items: center;
    gap: 0.22rem;
    margin-left: auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    font-size: 0.64rem;
    font-weight: 700;
}

@media (max-width: 1199.98px) {
    .schedule-batch-workspace .schedule-filter-bar {
        align-items: stretch;
        flex-direction: column;
    }

    .schedule-batch-workspace .schedule-filter-fields {
        width: 100%;
        margin-left: 0;
    }

    .schedule-batch-workspace .schedule-filter-fields .form-control {
        flex: 1 1 14rem;
        width: auto;
    }
}

@media (max-width: 767.98px) {
    .schedule-batch-workspace .schedule-filter-status {
        overflow-x: auto;
        padding-bottom: 0.2rem;
    }

    .schedule-batch-workspace .schedule-filter-fields {
        display: grid;
        grid-template-columns: 1fr auto;
    }

    .schedule-batch-workspace .schedule-filter-fields .form-select,
    .schedule-batch-workspace .schedule-filter-fields .form-control {
        width: 100%;
    }

    .schedule-batch-workspace .schedule-filter-fields .form-control {
        min-width: 0;
        grid-column: 1 / -1;
        grid-row: 1;
    }
}

/* Schedule Batch alternating date-row accent */
.schedule-batch-workspace .schedule-matrix tbody tr:nth-child(even) > th.schedule-date-column,
.schedule-batch-workspace .schedule-matrix tbody tr:nth-child(even) > td {
    background: color-mix(in srgb, var(--primary) 2%, var(--surface));
}

.schedule-batch-workspace .schedule-matrix tbody tr:nth-child(even) .schedule-matrix-cell:not(.is-unassigned):not(.is-selected):not(:hover):not(:focus-visible) {
    background: transparent;
}
/* Schedule Batch consolidated workspace card */
.schedule-batch-workspace .schedule-workspace-card {
    overflow: hidden;
    border: 1px solid var(--card-border);
    border-radius: 1rem;
    box-shadow: var(--card-shadow);
}

.schedule-batch-workspace .schedule-workspace-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0 0.75rem;
    border-bottom: 1px solid var(--table-border);
}

.schedule-batch-workspace .schedule-workspace-card .schedule-workspace-tabs {
    border-bottom: 0;
}

.schedule-batch-workspace .schedule-workspace-card__actions {
    display: flex;
    align-items: center;
    gap: 0.45rem;
}

.schedule-batch-workspace .schedule-workspace-card__actions .btn {
    min-height: var(--schedule-control-height);
}

.schedule-batch-workspace .schedule-workspace-card [data-workspace-panel="schedule"],
.schedule-batch-workspace .schedule-workspace-card .schedule-teachers-panel {
    padding: 0.75rem;
}

.schedule-batch-workspace .schedule-workspace-card .schedule-filter-bar {
    border: 0;
    border-bottom: 1px solid var(--table-border);
    border-radius: 0;
    box-shadow: none;
    padding: 0 0 0.75rem;
}

.schedule-batch-workspace .schedule-workspace-card .schedule-matrix-layout {
    margin-top: 0.75rem;
}

@media (max-width: 1199.98px) {
    .schedule-batch-workspace .schedule-workspace-card__header {
        align-items: flex-start;
        flex-wrap: wrap;
        padding-bottom: 0.65rem;
    }

    .schedule-batch-workspace .schedule-workspace-card .schedule-filter-fields {
        flex-wrap: wrap;
    }
}

@media (max-width: 767.98px) {
    .schedule-batch-workspace .schedule-workspace-card__header,
    .schedule-batch-workspace .schedule-workspace-card__actions {
        align-items: stretch;
        flex-direction: column;
    }

    .schedule-batch-workspace .schedule-workspace-card__header {
        padding: 0 0.65rem 0.65rem;
    }

    .schedule-batch-workspace .schedule-workspace-card__actions .btn {
        width: 100%;
    }

    .schedule-batch-workspace .schedule-workspace-card [data-workspace-panel="schedule"],
    .schedule-batch-workspace .schedule-workspace-card .schedule-teachers-panel {
        padding: 0.6rem;
    }

    .schedule-batch-workspace .schedule-workspace-card .schedule-filter-fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .schedule-batch-workspace .schedule-workspace-card .schedule-filter-fields .form-select,
    .schedule-batch-workspace .schedule-workspace-card .schedule-filter-fields .form-control {
        min-width: 0;
        grid-column: 1 / -1;
    }

    .schedule-batch-workspace .schedule-workspace-card .schedule-filter-fields .btn {
        width: 100%;
    }
}
/* Schedule Batch sortable class-header layout */
.schedule-batch-workspace .schedule-matrix thead th:not(.schedule-date-column) .theme-table-sort-button {
    position: relative;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding-right: 2rem;
}

.schedule-batch-workspace .schedule-matrix thead th:not(.schedule-date-column) .schedule-class-sort-label {
    display: grid;
    gap: 0.16rem;
    min-width: 0;
    text-align: left;
}

.schedule-batch-workspace .schedule-matrix thead th:not(.schedule-date-column) .schedule-class-sort-label .schedule-class-name,
.schedule-batch-workspace .schedule-matrix thead th:not(.schedule-date-column) .schedule-class-sort-label .schedule-class-room {
    display: block;
}
.schedule-batch-workspace .schedule-matrix thead th:not(.schedule-date-column) .theme-table-sort-button__icon {
    position: absolute;
    top: 50%;
    right: 0.6rem;
    transform: translateY(-50%);
}

/* ===== Education Control shell ===== */
.education-control-page {
    gap: 1rem;
    min-width: 0;
    max-width: 100%;
}

/* The shared sidebar layer (1030) keeps navigation and its church dropdown
   above sticky matrix cells; session drawers/backdrops remain at 1055+. */

.education-control-hero {
    overflow: hidden;
    border-radius: 1.25rem;
}

.education-control-hero__accent {
    height: 0.42rem;
    background: linear-gradient(
        90deg,
        var(--primary, var(--bs-primary)),
        color-mix(in srgb, var(--bs-info) 62%, var(--primary, var(--bs-primary))),
        color-mix(in srgb, var(--bs-success) 50%, var(--primary, var(--bs-primary)))
    );
}

.education-control-hero__body,
.education-control-identity,
.education-control-month {
    display: flex;
    align-items: center;
}

.education-control-hero__body {
    justify-content: space-between;
    gap: 1rem;
    padding: 1.1rem 1.25rem;
}

.education-control-identity {
    gap: 0.9rem;
    min-width: 0;
}

.education-control-month {
    flex: 0 0 auto;
    gap: 0;
    min-height: 2.75rem;
    padding: 0;
    border: 1px solid var(--card-border, var(--bs-border-color));
    border-radius: 0.65rem;
    background: transparent;
    color: var(--text-main, var(--bs-body-color));
}

.education-control-month > i {
    color: var(--primary, var(--bs-primary));
    font-size: 1.1rem;
}

.education-control-month > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 10rem;
    min-height: 2.75rem;
    padding: 0 1rem;
    border-right: 1px solid var(--card-border, var(--bs-border-color));
    border-left: 1px solid var(--card-border, var(--bs-border-color));
}

.education-control-month small {
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.education-control-navigation {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.education-control-tabs {
    display: inline-flex;
    align-items: flex-end;
    align-self: stretch;
    gap: 0.2rem;
    width: auto;
    padding: 0;
    border: 0;
    border-bottom: 1px solid var(--card-border, var(--bs-border-color));
    border-radius: 0;
    background: transparent;
}

.education-control-tab {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 2.65rem;
    padding: 0.55rem 0.8rem;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    background: transparent;
    color: var(--text-muted, var(--bs-secondary-color));
    font-weight: 650;
    text-decoration: none;
}

.education-control-tab:hover,
.education-control-tab:focus-visible {
    color: var(--primary, var(--bs-primary));
    background: transparent;
    outline: none;
}

.education-control-tab.is-active {
    border-color: var(--primary, var(--bs-primary));
    background: transparent;
    color: var(--primary, var(--bs-primary));
}

.education-control-context {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 1rem;
}

.education-control-context p {
    margin: 0;
    color: var(--text-muted, var(--bs-secondary-color));
    font-size: 0.86rem;
}

.education-control-placeholder {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-height: 14rem;
    padding: 2rem;
}

.education-control-placeholder__icon {
    display: inline-grid;
    place-items: center;
    width: 3.25rem;
    height: 3.25rem;
    flex: 0 0 3.25rem;
    border-radius: 1rem;
    background: var(--primary-soft, var(--surface-soft));
    color: var(--primary, var(--bs-primary));
    font-size: 1.35rem;
}

.education-control-placeholder h2 {
    margin: 0.2rem 0;
    color: var(--text-main, var(--bs-body-color));
    font-size: 1.15rem;
}

.education-control-placeholder p {
    margin: 0;
    color: var(--text-muted, var(--bs-secondary-color));
}

.education-control-drawer-reserve {
    display: none;
}

@media (max-width: 767.98px) {
    .education-control-hero__body,
    .education-control-context {
        align-items: stretch;
        flex-direction: column;
    }

    .education-control-month {
        width: 100%;
    }

    .education-control-navigation {
        align-items: stretch;
        flex-direction: column;
    }

    .education-control-tabs {
        align-items: flex-end;
        flex-direction: row;
        align-self: flex-start;
    }

    .education-control-tab {
        justify-content: center;
        width: auto;
    }
}

@media (max-width: 575.98px) {
    .education-control-hero__body,
    .education-control-placeholder {
        padding: 1rem;
    }

    .education-control-identity,
    .education-control-placeholder {
        align-items: flex-start;
    }

    .education-control-placeholder {
        flex-direction: column;
    }
}


/* Education Control live Sessions matrix */
.control-session-summary { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:.75rem; margin-bottom:1rem; }
.control-session-summary > div { display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding:.8rem 1rem; border:1px solid var(--card-border); border-radius:.8rem; background:var(--surface); }
.control-session-summary span { color:var(--text-muted); font-size:.76rem; font-weight:650; }
.control-session-summary strong { color:var(--text-main); font-size:1.15rem; }
.control-session-toolbar { display:grid; gap:.85rem; padding:1rem; margin-bottom:1rem; }
.control-month-nav,.control-session-filters { display:flex; align-items:end; gap:.55rem; flex-wrap:wrap; }
.control-month-nav strong { min-width:9rem; color:var(--text-main); text-align:center; }
.control-session-filters label { display:grid; gap:.25rem; min-width:9.5rem; }
.control-session-filters label > span { color:var(--text-muted); font-size:.68rem; font-weight:700; text-transform:uppercase; }
.control-session-filters .control-session-search { flex:1 1 16rem; }
.control-session-result-count { margin:0; color:var(--text-muted); font-size:.78rem; }
.control-session-matrix-list { display:grid; gap:1rem; }
.control-program-section .schedule-program-header { background:color-mix(in srgb,var(--program-color) 9%,var(--surface)); }
.control-cell-stack { display:grid; }
.control-cell-stack > .control-session-cell + .control-session-cell { border-top:1px solid var(--table-border); }
.control-session-cell__top { display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.control-source-badge { display:inline-flex; width:max-content; border-radius:999px; padding:.16rem .42rem; background:var(--surface-muted); color:var(--text-muted); font-size:.62rem; font-weight:750; }
.control-source-badge--batch { color:var(--primary); background:var(--primary-soft); }
.control-teacher-row { display:grid; grid-template-columns:auto minmax(0,1fr) auto auto; align-items:center; gap:.42rem; min-width:0; padding:.3rem 0; }
.control-teacher-name { overflow:hidden; color:var(--text-main); font-size:.75rem; font-weight:650; text-overflow:ellipsis; white-space:nowrap; }
.control-response-pill { display:inline-flex; border-radius:999px; padding:.15rem .42rem; font-size:.62rem; font-weight:750; white-space:nowrap; }
.control-response-pill--pending { color:color-mix(in srgb,var(--bs-warning) 75%,var(--text-main)); background:color-mix(in srgb,var(--bs-warning) 12%,var(--surface)); }
.control-response-pill--approved { color:var(--bs-success); background:color-mix(in srgb,var(--bs-success) 10%,var(--surface)); }
.control-response-pill--declined { color:var(--bs-danger); background:color-mix(in srgb,var(--bs-danger) 10%,var(--surface)); }
.control-conflict-icon { color:var(--bs-danger); font-size:.85rem; }
.control-session-cell.has-conflict { box-shadow:inset .2rem 0 0 color-mix(in srgb,var(--bs-danger) 75%,transparent); }
.control-session-backdrop { position:fixed; inset:0; z-index:1055; background:rgb(10 25 38 / .12); }
.control-session-drawer { background:var(--surface); overflow-y:auto; }
.control-session-drawer-panel { padding:1rem; }
.control-drawer-meta { display:grid; gap:.25rem; color:var(--text-muted); font-size:.78rem; }
.control-drawer-meta strong { color:var(--text-main); font-size:.95rem; }
.control-drawer-tabs { display:grid; grid-template-columns:repeat(3,1fr); gap:.35rem; margin:1rem 0; padding:.25rem; border-radius:.7rem; background:var(--surface-muted); }
.control-drawer-tabs button { border:0; border-radius:.55rem; background:transparent; color:var(--text-muted); padding:.45rem; font-size:.74rem; font-weight:700; }
.control-drawer-tabs button.is-active { background:var(--surface); color:var(--primary); box-shadow:0 1px 4px rgb(15 40 55 / .08); }
.control-drawer-list { display:grid; gap:.65rem; }
.control-drawer-teacher { display:flex; align-items:flex-start; gap:.65rem; padding:.7rem; border:1px solid var(--table-border); border-radius:.75rem; }
.control-drawer-teacher > div { display:grid; gap:.25rem; min-width:0; }
.control-drawer-teacher small,.control-drawer-teacher p { margin:0; color:var(--text-muted); font-size:.72rem; }
.control-attendance-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:.55rem; }
.control-attendance-grid > div { display:flex; justify-content:space-between; padding:.65rem; border-radius:.65rem; background:var(--surface-muted); }
.control-attendance-grid span { color:var(--text-muted); font-size:.72rem; }
.control-session-details { display:grid; gap:.55rem; }
.control-session-details > div { display:grid; grid-template-columns:6rem 1fr; gap:.6rem; padding-bottom:.5rem; border-bottom:1px solid var(--table-border); }
.control-session-details dt { color:var(--text-muted); font-size:.72rem; }
.control-session-details dd { margin:0; color:var(--text-main); font-size:.78rem; overflow-wrap:anywhere; }
@media (max-width: 900px) { .control-session-summary { grid-template-columns:repeat(2,minmax(0,1fr)); } .control-session-drawer { width:min(100vw,30rem); top:0; height:100dvh; border-radius:0; } }
@media (max-width: 575.98px) { .control-session-summary { grid-template-columns:1fr; } .control-session-filters label,.control-session-filters .control-session-search { width:100%; flex-basis:100%; } .control-session-filters .btn { flex:1; } }
.control-drawer-teacher__copy { display:grid; gap:.25rem; min-width:0; flex:1; }
.control-remove-teacher-form { margin-left:auto; align-self:center; }
.control-add-teacher-form { display:grid; gap:.7rem; margin-top:1rem; padding-top:1rem; border-top:1px solid var(--table-border); }
.control-add-teacher-form h3 { margin:0; color:var(--text-main); font-size:.9rem; }
.control-add-teacher-form > label:not(.control-roster-enrollment) { display:grid; gap:.28rem; }
.control-add-teacher-form > label > span { color:var(--text-muted); font-size:.72rem; font-weight:650; }
.control-roster-enrollment { display:flex; align-items:center; gap:.5rem; }
.control-add-teacher-help { margin:0; color:var(--text-muted); font-size:.7rem; }
.control-teacher-picker-label { color:var(--text-muted); font-size:.72rem; font-weight:650; }
.control-teacher-picker { position:relative; }
.control-teacher-picker__input { min-height:2.1rem; border-radius:var(--control-radius, .5rem); }
.control-teacher-picker__panel { position:absolute; z-index:5; top:calc(100% + .3rem); left:0; right:0; max-height:16rem; overflow-y:auto; padding:.35rem; border:1px solid var(--table-border); border-radius:.65rem; background:var(--surface); box-shadow:0 .7rem 1.6rem color-mix(in srgb,var(--text-main) 12%,transparent); }
.control-teacher-picker__group + .control-teacher-picker__group { margin-top:.3rem; padding-top:.3rem; border-top:1px solid var(--table-border); }
.control-teacher-picker__group-label { padding:.32rem .5rem; color:var(--text-muted); font-size:.65rem; font-weight:750; letter-spacing:.04em; text-transform:uppercase; }
.control-teacher-picker__option { display:grid; width:100%; gap:.08rem; padding:.48rem .55rem; border:0; border-radius:.45rem; background:transparent; color:var(--text-main); text-align:left; }
.control-teacher-picker__option span { font-size:.78rem; font-weight:700; }
.control-teacher-picker__option small { color:var(--text-muted); font-size:.66rem; }
.control-teacher-picker__option:hover:not(:disabled),.control-teacher-picker__option:focus-visible,.control-teacher-picker__option.is-active { outline:0; background:color-mix(in srgb,var(--primary) 9%,var(--surface)); }
.control-teacher-picker__option:disabled { cursor:not-allowed; opacity:.58; }
.control-teacher-picker__option[hidden],.control-teacher-picker__group[hidden],.control-teacher-picker__panel[hidden] { display:none; }
.control-teacher-picker__empty { margin:.4rem; color:var(--text-muted); font-size:.72rem; }
.control-drawer-teacher { flex-wrap:wrap; }
.control-teacher-response-form { display:grid; gap:.45rem; width:100%; margin-left:2.3rem; padding-top:.45rem; border-top:1px solid var(--table-border); }
.control-teacher-response-form label { display:grid; gap:.2rem; }
.control-teacher-response-form label > span { color:var(--text-muted); font-size:.68rem; font-weight:650; }
.control-response-actions { display:flex; align-items:center; gap:.35rem; flex-wrap:wrap; }
.control-response-action { border:1px solid var(--table-border); background:var(--surface); color:var(--text-muted); font-size:.68rem; padding:.26rem .48rem; }
.control-response-action--approve { border-color:color-mix(in srgb,var(--bs-success) 28%,var(--table-border)); color:var(--bs-success); }
.control-response-action--decline { border-color:color-mix(in srgb,var(--bs-danger) 28%,var(--table-border)); color:var(--bs-danger); }
.control-session-edit-form { display:grid; gap:.65rem; margin-top:1rem; padding-top:1rem; border-top:1px solid var(--table-border); }
.control-session-edit-form h3,.control-session-danger h3 { margin:0; color:var(--text-main); font-size:.9rem; }
.control-session-edit-form label { display:grid; gap:.25rem; }
.control-session-edit-form label > span { color:var(--text-muted); font-size:.7rem; font-weight:650; }
.control-session-danger { display:grid; gap:.6rem; margin-top:1rem; padding:1rem; border:1px solid color-mix(in srgb,var(--bs-danger) 25%,var(--table-border)); border-radius:.75rem; background:color-mix(in srgb,var(--bs-danger) 4%,var(--surface)); }
.control-session-danger p { margin:0; color:var(--text-muted); font-size:.72rem; }
.control-session-danger form { display:grid; gap:.65rem; }
.control-cancel-confirm { display:flex; align-items:flex-start; gap:.5rem; color:var(--text-main); font-size:.72rem; }
.control-session-cancel-button { width:max-content; border:1px solid color-mix(in srgb,var(--bs-danger) 40%,var(--table-border)); background:var(--surface); color:var(--bs-danger); }
/* Education Control live Teachers workload */
.control-teacher-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; margin-bottom:1rem; }
.control-teacher-summary > div { display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding:.8rem 1rem; border:1px solid var(--card-border); border-radius:.8rem; background:var(--surface); }
.control-teacher-summary span { color:var(--text-muted); font-size:.76rem; font-weight:650; }
.control-teacher-summary strong { color:var(--text-main); font-size:1.15rem; }
.control-workload-conflicts { display:flex !important; align-items:center; gap:.45rem; min-width:auto !important; padding-bottom:.38rem; }
.control-teacher-list { overflow:hidden; }
.control-teacher-list__header,.control-teacher-workload-row { display:grid; grid-template-columns:minmax(11rem,1.4fr) .55fr minmax(12rem,1.5fr) repeat(4,.55fr) .55fr; align-items:center; gap:.7rem; }
.control-teacher-list__header { padding:.65rem 1rem; background:var(--table-head-bg); color:var(--text-muted); font-size:.68rem; font-weight:750; text-transform:uppercase; }
.control-teacher-workload-row { width:100%; border:0; border-top:1px solid var(--table-border); background:var(--surface); color:var(--text-main); padding:.75rem 1rem; text-align:left; }
.control-teacher-workload-row:hover,.control-teacher-workload-row:focus-visible,.control-teacher-workload-row.is-selected { outline:0; background:var(--table-row-hover); }
.control-workload-identity { display:flex; align-items:center; gap:.55rem; min-width:0; }
.control-workload-identity strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.control-workload-context { display:grid; gap:.2rem; min-width:0; }
.control-workload-context > span { width:max-content; border-left:.25rem solid var(--program-color,var(--primary)); padding-left:.4rem; font-size:.72rem; font-weight:700; }
.control-workload-context small { overflow:hidden; color:var(--text-muted); text-overflow:ellipsis; white-space:nowrap; }
.control-count-pending { color:color-mix(in srgb,var(--bs-warning) 75%,var(--text-main)); }
.control-workload-open { color:var(--primary); font-size:.72rem; font-weight:700; text-align:right; }
.control-workload-drawer-header { display:flex; align-items:center; gap:.7rem; padding:.25rem 0 .5rem; }
.control-workload-drawer-header > div { display:grid; gap:.15rem; }
.control-workload-drawer-header span { color:var(--text-muted); font-size:.72rem; }
.control-workload-assignment-list,.control-workload-response-list,.control-workload-conflict-list { display:grid; gap:.6rem; }
.control-workload-assignment-list article,.control-workload-response-list article,.control-workload-conflict-list article { display:flex; align-items:flex-start; justify-content:space-between; gap:.6rem; padding:.7rem; border:1px solid var(--table-border); border-radius:.7rem; }
.control-workload-assignment-list article > div,.control-workload-response-list article > div,.control-workload-conflict-list article > div { display:grid; gap:.2rem; min-width:0; }
.control-workload-assignment-list span,.control-workload-response-list p,.control-workload-conflict-list span { margin:0; color:var(--text-muted); font-size:.72rem; }
.control-workload-assignment-list small,.control-workload-response-list small,.control-workload-conflict-list small { color:var(--text-muted); font-size:.68rem; }
.control-workload-conflict-list > article > i { color:var(--bs-danger); }
@media (max-width:1100px) { .control-teacher-list { overflow-x:auto; } .control-teacher-list__header,.control-teacher-workload-row { min-width:58rem; } }
@media (max-width:700px) { .control-teacher-summary { grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* Education Control Phase 9 shared polish */
.education-control-page {
    --education-status-pending: color-mix(in srgb, var(--bs-warning) 78%, var(--text-main));
    --education-status-approved: var(--bs-success);
    --education-status-declined: var(--bs-danger);
    --education-status-conflict: var(--bs-danger);
}
.education-control-month > a {
    display:inline-grid;
    place-items:center;
    width:2rem;
    height:2rem;
    border-radius:0;
    color:var(--primary);
    text-decoration:none;
}
.education-control-month > a:hover,
.education-control-month > a:focus-visible { background:transparent; color:var(--text-main); outline:2px solid color-mix(in srgb,var(--primary) 35%,transparent); outline-offset:-2px; }
.education-control-month .education-control-month__today { width:auto; padding:0 .45rem; font-size:.72rem; font-weight:700; }
.education-control-tab:focus-visible,
.control-teacher-workload-row:focus-visible,
.control-session-cell:focus-visible { outline:2px solid var(--primary); outline-offset:2px; }
.education-control-metrics { gap:.75rem; margin-bottom:1rem; }
.education-control-metrics > div,
.education-control-metrics > a { min-height:4.35rem; border-radius:.8rem; box-shadow:none; }
.education-control-filterbar,
.control-session-toolbar { border-radius:.9rem; box-shadow:none; }
.education-control-filter-form :is(.form-control,.form-select) { min-height:2.5rem; border-radius:.7rem !important; }
.education-control-filter-form .btn { min-height:2.5rem; display:inline-flex; align-items:center; justify-content:center; gap:.35rem; border-radius:.7rem; }
.control-response-pill--pending { color:var(--education-status-pending); }
.control-response-pill--approved { color:var(--education-status-approved); }
.control-response-pill--declined { color:var(--education-status-declined); }
.control-conflict-icon,
.control-workload-conflict-list > article > i { color:var(--education-status-conflict); }
.control-source-badge { border:1px solid color-mix(in srgb,var(--text-muted) 18%,transparent); }
.control-source-badge--batch { border-color:color-mix(in srgb,var(--primary) 22%,transparent); }
.control-session-drawer { width:min(calc(100vw - 2rem),26.25rem); }
.control-session-drawer-panel { padding:1rem; }
.control-workload-context { max-height:3.2rem; overflow:hidden; }
.control-workload-context small { display:-webkit-box; white-space:normal; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.schedule-program-header { min-height:4.2rem; }
.control-session-matrix thead th { vertical-align:middle; }
.control-teacher-row { min-height:2.25rem; }
@media (max-width:767.98px) {
    .education-control-tabs { flex-direction:row; overflow-x:auto; }
    .education-control-tab { justify-content:center; min-width:7.5rem; width:auto; }
    .education-control-month { flex-wrap:nowrap; justify-content:center; width:fit-content; max-width:100%; }
    .education-control-filter-form { width:100%; }
    .confirmation-filter-grid.education-control-filter-form { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:575.98px) {
    .education-control-tabs { display:flex; }
    .education-control-tab { min-width:0; padding:.5rem .35rem; font-size:.78rem; }
    .confirmation-filter-grid.education-control-filter-form { grid-template-columns:1fr; }
    .education-control-metrics { grid-template-columns:1fr; }
}

/* ===== Education Schedule Batch approved visual redesign ===== */
.schedule-batch-workspace {
    --schedule-control-height: 2.35rem;
    gap: 0.85rem;
}

.schedule-batch-workspace .schedule-batch-hero,
.schedule-batch-workspace .schedule-note-panel,
.schedule-batch-workspace .schedule-workspace-card {
    border: 1px solid var(--card-border);
    border-radius: 0.75rem;
    box-shadow: none;
}

.schedule-batch-workspace .schedule-batch-hero-accent {
    height: 0.28rem;
    background: var(--primary);
}

.schedule-batch-workspace .schedule-batch-hero-body {
    min-height: 5.5rem;
    padding: 0.9rem 1rem;
}

.schedule-batch-workspace .schedule-batch-kicker {
    color: var(--primary);
    font-size: 0.65rem;
    letter-spacing: 0.06em;
}

.schedule-batch-workspace .schedule-batch-title {
    font-size: clamp(1.2rem, 1.65vw, 1.5rem);
}

.schedule-batch-workspace .schedule-status-pill {
    box-shadow: none;
}

.schedule-batch-workspace .schedule-status-pill-draft {
    border-color: var(--bs-warning);
    background: var(--bs-warning);
    color: var(--text-main);
}

.schedule-batch-workspace .schedule-status-pill-posted {
    border-color: var(--bs-success);
    background: var(--bs-success);
    color: var(--text-main);
}

.schedule-batch-workspace .schedule-batch-actions,
.schedule-batch-workspace .schedule-workspace-card__actions {
    gap: 0.4rem;
}

.schedule-batch-workspace :is(.schedule-batch-actions,.schedule-workspace-card__actions,.schedule-filter-fields) .btn,
.schedule-batch-workspace .schedule-filter-fields :is(.form-control,.form-select) {
    min-height: var(--schedule-control-height);
    border-radius: 0.5rem;
}

.schedule-batch-workspace .schedule-workspace-card {
    overflow: hidden;
}

.schedule-batch-workspace .schedule-workspace-card__header {
    min-height: 3.45rem;
    padding: 0 0.7rem;
    background: var(--surface);
}

.schedule-batch-workspace .schedule-workspace-tabs {
    align-self: stretch;
    gap: 0.2rem;
}

.schedule-batch-workspace .schedule-workspace-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    min-height: 3.4rem;
    border: 0;
    border-bottom: 3px solid transparent;
    border-radius: 0;
    padding: 0.65rem 0.85rem;
    background: var(--surface);
    font-size: 0.8rem;
}

.schedule-batch-workspace .schedule-workspace-tab .bi {
    font-size: 0.9rem;
}

.schedule-batch-workspace .schedule-workspace-tab.is-active {
    border-bottom-color: var(--primary);
    background: var(--surface);
    color: var(--primary);
}

.schedule-batch-workspace .schedule-workspace-tab:hover:not(:disabled),
.schedule-batch-workspace .schedule-workspace-tab:focus-visible {
    background: var(--surface-muted);
}

.schedule-batch-workspace .schedule-workspace-card [data-workspace-panel="schedule"],
.schedule-batch-workspace .schedule-workspace-card .schedule-teachers-panel {
    padding: 0.7rem;
}

.schedule-batch-workspace .schedule-workspace-card .schedule-filter-bar {
    gap: 0.55rem;
    padding: 0 0 0.7rem;
}

.schedule-batch-workspace .schedule-filter-status,
.schedule-batch-workspace .schedule-filter-fields {
    gap: 0.35rem;
}

.schedule-batch-workspace .schedule-filter-chip {
    min-height: var(--schedule-control-height);
    border: 1px solid var(--table-border);
    border-radius: 0.5rem;
    background: var(--surface);
    padding: 0.35rem 0.58rem;
}

.schedule-batch-workspace .schedule-filter-chip[data-schedule-filter="unassigned"] {
    border-color: var(--bs-warning);
    background: var(--surface);
}

.schedule-batch-workspace .schedule-filter-chip[data-schedule-filter="pending"] {
    border-color: var(--bs-danger);
    background: var(--surface);
}

.schedule-batch-workspace .schedule-filter-chip[data-schedule-filter="conflict"] {
    border-color: var(--bs-danger);
    background: var(--surface);
}

.schedule-batch-workspace .schedule-filter-chip.is-active {
    border-color: var(--primary);
    background: var(--primary);
    color: white;
    box-shadow: none;
}

.schedule-batch-workspace .schedule-filter-chip.is-active span {
    color: white;
}

.schedule-batch-workspace .schedule-action-count {
    border: 0;
    background: var(--surface-muted);
    color: var(--text-main);
    box-shadow: none;
}

.schedule-batch-workspace .schedule-matrix-main {
    gap: 0.75rem;
}

.schedule-batch-workspace .schedule-program-section {
    border: 1px solid var(--card-border);
    border-left: 0.3rem solid var(--program-color);
    border-radius: 0.65rem;
    box-shadow: none;
}

.schedule-batch-workspace .schedule-program-header {
    min-height: 3.45rem;
    border-left: 0;
    border-bottom: 1px solid var(--table-border);
    background: var(--surface);
    padding: 0.55rem 0.7rem;
}

.schedule-batch-workspace .schedule-program-color {
    color: var(--program-color);
    font-size: 1.25rem;
}

.schedule-batch-workspace .schedule-program-header h2 {
    font-size: 0.95rem;
}

.schedule-batch-workspace .schedule-program-toggle {
    border-color: var(--table-border);
    border-radius: 0.45rem;
    box-shadow: none;
}

.schedule-batch-workspace .schedule-matrix {
    min-width: max(100%, 680px);
}

.schedule-batch-workspace .schedule-matrix thead th {
    height: 3.4rem;
    border-bottom: 2px solid var(--bs-info);
    background: var(--surface-muted);
    padding: 0.5rem 0.6rem;
    vertical-align: middle;
}

.schedule-batch-workspace .schedule-class-name {
    color: var(--text-main);
    font-size: 0.8rem;
    font-weight: 750;
}

.schedule-batch-workspace .schedule-class-meta {
    display: block;
    margin-top: 0.12rem;
    color: var(--text-muted);
    font-size: 0.68rem;
    white-space: normal;
}

.schedule-batch-workspace .schedule-class-room {
    display: block;
    overflow: hidden;
    margin: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.schedule-batch-workspace .schedule-matrix .schedule-date-column {
    width: 5rem;
    min-width: 5rem;
    background: var(--surface);
}

.schedule-batch-workspace .schedule-matrix thead .schedule-date-column {
    background: var(--surface-muted);
}

.schedule-batch-workspace .schedule-matrix tbody tr:nth-child(even) > th.schedule-date-column,
.schedule-batch-workspace .schedule-matrix tbody tr:nth-child(even) > td {
    background: var(--surface-muted);
}

.schedule-batch-workspace .schedule-matrix-cell {
    min-height: 4.35rem;
    grid-template-columns: 3.5rem minmax(0, 1fr);
    gap: 0.35rem;
    background: var(--surface);
    padding: 0.35rem 0.42rem;
}

.schedule-batch-workspace .schedule-matrix tbody tr:nth-child(even) .schedule-matrix-cell:not(.is-unassigned):not(.is-selected):not(:hover):not(:focus-visible) {
    background: var(--surface-muted);
}

.schedule-batch-workspace .schedule-matrix-cell:hover,
.schedule-batch-workspace .schedule-matrix-cell:focus-visible {
    background: var(--surface);
    box-shadow: inset 0 0 0 2px var(--bs-info);
}

.schedule-batch-workspace .schedule-matrix-cell.is-selected {
    background: var(--surface);
    box-shadow: inset 0 0 0 2px var(--primary);
}

.schedule-batch-workspace .schedule-cell-time {
    align-self: center;
    color: var(--text-main);
    font-size: 0.68rem;
    font-weight: 700;
}

.schedule-batch-workspace .schedule-cell-teachers:has(.schedule-teacher-chip) {
    padding: 0.12rem 0;
}

.schedule-batch-workspace .schedule-teacher-chip {
    min-height: 1.8rem;
    border: 0;
    background: transparent;
    padding: 0.12rem 0.15rem;
    box-shadow: none;
}

.schedule-batch-workspace .schedule-teacher-chip + .schedule-teacher-chip {
    margin-top: 0.12rem;
    border-top: 1px solid var(--table-border);
    padding-top: 0.22rem;
}

.schedule-batch-workspace .schedule-teacher-avatar {
    border-color: var(--bs-info);
}

.schedule-batch-workspace .schedule-teacher-chip-copy > span {
    color: var(--text-main);
    font-size: 0.72rem;
    font-weight: 650;
}

.schedule-batch-workspace .schedule-teacher-status.confirmation-assigned,
.schedule-batch-workspace .schedule-teacher-status.confirmation-approved {
    color: var(--primary);
}

.schedule-batch-workspace .schedule-teacher-status.confirmation-pending {
    color: var(--bs-warning);
}

.schedule-batch-workspace .schedule-teacher-status.confirmation-declined,
.schedule-batch-workspace .schedule-conflict-icon {
    color: var(--bs-danger);
}

.schedule-batch-workspace .schedule-unassigned-label {
    border: 1px solid var(--bs-warning);
    border-radius: 0.45rem;
    background: var(--bs-warning);
    color: var(--text-main);
}

.schedule-batch-workspace :is(.schedule-drawer,.schedule-batch-action-drawer) {
    width: min(calc(100vw - 1rem), 26rem);
    border-color: var(--card-border);
    border-radius: 0.75rem 0 0 0.75rem;
    background: var(--surface);
    box-shadow: none;
}

.schedule-batch-workspace .schedule-drawer-header {
    min-height: 4rem;
    border-bottom: 1px solid var(--table-border);
    background: var(--surface);
    padding: 0.75rem 0.9rem;
}

.schedule-batch-workspace .schedule-drawer-tabs {
    background: var(--surface);
    padding-inline: 0.7rem;
}

.schedule-batch-workspace .schedule-drawer-tabs button {
    min-height: 2.65rem;
}

.schedule-batch-workspace .schedule-drawer-tabs button.is-active {
    border-bottom-color: var(--primary);
    color: var(--primary);
}

.schedule-batch-workspace .schedule-drawer-teacher,
.schedule-batch-workspace .schedule-person-result {
    border-color: var(--table-border);
    border-radius: 0.55rem;
    background: var(--surface);
    box-shadow: none;
}

.schedule-batch-workspace .schedule-add-teacher {
    gap: 0.75rem;
}

.schedule-batch-workspace .schedule-person-search-results {
    max-height: 15rem;
    overflow-y: auto;
}

.schedule-batch-workspace :is(button,a,input,select):focus-visible {
    outline: 2px solid var(--bs-info);
    outline-offset: 2px;
}

@media (max-width: 1199.98px) {
    .schedule-batch-workspace .schedule-workspace-card__header {
        align-items: center;
    }

    .schedule-batch-workspace .schedule-filter-status,
    .schedule-batch-workspace .schedule-filter-fields {
        flex-wrap: wrap;
    }
}

@media (max-width: 767.98px) {
    .schedule-batch-workspace .schedule-workspace-card__header {
        align-items: stretch;
        padding: 0 0.6rem 0.6rem;
    }

    .schedule-batch-workspace .schedule-workspace-tabs {
        overflow-x: auto;
    }

    .schedule-batch-workspace .schedule-workspace-tab {
        min-width: 7rem;
    }

    .schedule-batch-workspace .schedule-filter-fields {
        grid-template-columns: 1fr 1fr;
    }

    .schedule-batch-workspace .schedule-filter-fields :is(.form-select,.form-control) {
        grid-column: 1 / -1;
    }

    .schedule-batch-workspace :is(.schedule-drawer,.schedule-batch-action-drawer) {
        width: 100vw;
        max-width: 100vw;
        border-radius: 0;
    }
}

/* ===== Education Schedule Batch approved reference alignment ===== */
.schedule-batch-workspace .schedule-batch-hero {
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.schedule-batch-workspace .schedule-batch-hero-accent {
    display: none;
}

.schedule-batch-workspace .schedule-batch-hero-body {
    min-height: 0;
    padding: 0 0.15rem 0.75rem;
}

.schedule-batch-workspace .schedule-workspace-card {
    border: 0;
    border-radius: 0;
    background: transparent;
}

.schedule-batch-workspace .schedule-workspace-card__header {
    width: max-content;
    min-height: 3.25rem;
    margin-bottom: 0.65rem;
    border: 1px solid var(--card-border);
    border-radius: 0.55rem;
    background: var(--surface);
    padding: 0.25rem;
}

.schedule-batch-workspace .schedule-workspace-tabs {
    align-self: auto;
    border: 0;
}

.schedule-batch-workspace .schedule-workspace-tab {
    min-width: 10.25rem;
    min-height: 2.75rem;
    border: 0;
    border-radius: 0.35rem;
    background: var(--surface);
}

.schedule-batch-workspace .schedule-workspace-tab.is-active {
    border: 0;
    background: var(--bs-info);
    color: var(--text-main);
}

.schedule-batch-workspace .schedule-workspace-tab:disabled {
    background: var(--surface);
    color: var(--text-muted);
    opacity: 1;
}

.schedule-batch-workspace .schedule-workspace-card [data-workspace-panel="schedule"],
.schedule-batch-workspace .schedule-workspace-card .schedule-teachers-panel {
    padding: 0;
}

.schedule-batch-workspace .schedule-workspace-card .schedule-filter-bar {
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 0.65rem;
    padding: 0;
    border: 0;
}

.schedule-batch-workspace .schedule-filter-fields {
    flex: 1 1 auto;
    flex-wrap: wrap;
}

.schedule-batch-workspace .schedule-filter-fields .btn {
    gap: 0.55rem;
    font-size: 0.84rem;
    white-space: nowrap;
}

.schedule-batch-workspace .schedule-filter-fields [data-open-batch-assignment] {
    border-color: var(--primary);
    background: var(--primary);
    color: white;
}

.schedule-batch-workspace .schedule-action-rotation {
    border: 1px solid var(--bs-info);
    background: var(--bs-info);
    color: var(--text-main);
}

.schedule-batch-workspace .schedule-filter-fields [data-open-review-gaps] {
    border-color: var(--bs-warning);
    background: var(--bs-warning);
    color: var(--text-main);
}

.schedule-batch-workspace .schedule-filter-fields [data-open-review-conflicts] {
    border-color: var(--bs-danger);
    background: var(--bs-danger);
    color: var(--text-main);
}

.schedule-batch-workspace .schedule-filter-chip:disabled {
    background: var(--surface-muted);
    color: var(--text-muted);
    opacity: 1;
}

.schedule-batch-workspace .schedule-program-header {
    border-bottom-color: var(--program-color);
    background: var(--program-color);
}

.schedule-batch-workspace .schedule-program-color,
.schedule-batch-workspace .schedule-program-header h2,
.schedule-batch-workspace .schedule-program-header .schedule-batch-kicker,
.schedule-batch-workspace .schedule-program-count {
    color: var(--text-main);
}

.schedule-batch-workspace .schedule-program-toggle {
    border-color: var(--text-main);
    background: var(--program-color);
    color: var(--text-main);
}

.schedule-batch-workspace .schedule-program-toggle:hover,
.schedule-batch-workspace .schedule-program-toggle:focus-visible {
    border-color: var(--text-main);
    background: var(--surface);
    color: var(--text-main);
}

.schedule-batch-workspace .schedule-matrix thead th {
    border-bottom-color: var(--bs-info);
    background: var(--surface-muted);
    text-align: center;
}

.schedule-batch-workspace .schedule-matrix thead th:not(.schedule-date-column) .theme-table-sort-button,
.schedule-batch-workspace .schedule-matrix thead th:not(.schedule-date-column) .schedule-class-sort-label {
    align-items: center;
    text-align: center;
}

.schedule-batch-workspace .schedule-teacher-chip.confirmation-assigned,
.schedule-batch-workspace .schedule-teacher-chip.confirmation-approved {
    background: var(--bs-success);
}

.schedule-batch-workspace .schedule-teacher-chip.confirmation-pending {
    background: var(--bs-warning);
}

.schedule-batch-workspace .schedule-teacher-chip.confirmation-declined,
.schedule-batch-workspace .schedule-teacher-chip.has-conflict {
    background: var(--bs-danger);
}

.schedule-batch-workspace .schedule-teacher-chip {
    min-height: 2rem;
    border-radius: 0.4rem;
    padding: 0.18rem 0.28rem;
}

.schedule-batch-workspace .schedule-teacher-chip + .schedule-teacher-chip {
    margin-top: 0.18rem;
    border-top: 0;
    padding-top: 0.18rem;
}

.schedule-batch-workspace .schedule-teacher-avatar {
    border-color: var(--surface);
}

.schedule-batch-workspace .schedule-teacher-status.confirmation-assigned,
.schedule-batch-workspace .schedule-teacher-status.confirmation-approved,
.schedule-batch-workspace .schedule-teacher-status.confirmation-pending,
.schedule-batch-workspace .schedule-teacher-status.confirmation-declined,
.schedule-batch-workspace .schedule-teacher-chip.has-conflict .schedule-teacher-status,
.schedule-batch-workspace .schedule-teacher-chip.has-conflict .schedule-conflict-icon {
    color: var(--text-main);
}

.schedule-batch-workspace .schedule-matrix-empty-cell {
    margin: 0.35rem;
    min-height: 3.6rem;
    border: 1px dashed var(--table-border);
    border-radius: 0.4rem;
    background: var(--surface-muted);
}

.schedule-batch-workspace :is(.schedule-drawer,.schedule-batch-action-drawer) {
    width: min(calc(100vw - 1rem), 24rem);
    border-radius: 0.55rem 0 0 0.55rem;
}

.schedule-batch-workspace .schedule-drawer-header {
    border-top: 0.3rem solid var(--primary);
}

.schedule-batch-workspace .schedule-drawer-tabs {
    gap: 0.35rem;
    border-bottom: 0;
    padding: 0.45rem 0.7rem;
}

.schedule-batch-workspace .schedule-drawer-tabs button {
    border: 1px solid var(--table-border);
    border-radius: 0.4rem;
}

.schedule-batch-workspace .schedule-drawer-tabs button.is-active {
    border-color: var(--bs-info);
    background: var(--bs-info);
    color: var(--text-main);
}

@media (max-width: 1199.98px) {
    .schedule-batch-workspace .schedule-workspace-card__header {
        width: 100%;
    }

    .schedule-batch-workspace .schedule-workspace-tabs {
        width: 100%;
    }

    .schedule-batch-workspace .schedule-workspace-tab {
        flex: 1 1 0;
        min-width: 7rem;
    }
}

/* Schedule Batch row and draft-state color refinement */
.schedule-batch-workspace .schedule-matrix tbody > tr > th.schedule-date-column,
.schedule-batch-workspace .schedule-matrix tbody > tr > td,
.schedule-batch-workspace .schedule-matrix tbody tr:nth-child(even) > th.schedule-date-column,
.schedule-batch-workspace .schedule-matrix tbody tr:nth-child(even) > td {
    background: var(--surface);
}

.schedule-batch-workspace .schedule-matrix tbody .schedule-matrix-cell,
.schedule-batch-workspace .schedule-matrix tbody tr:nth-child(even) .schedule-matrix-cell:not(.is-unassigned):not(.is-selected):not(:hover):not(:focus-visible) {
    background: var(--surface);
}

.schedule-batch-workspace .schedule-matrix thead th,
.schedule-batch-workspace .schedule-matrix thead .schedule-date-column {
    background: var(--table-head-bg);
}

.schedule-batch-workspace[data-batch-status="draft"] .schedule-teacher-chip {
    background: var(--table-head-bg);
}

.schedule-batch-workspace[data-batch-status="draft"] .schedule-teacher-chip.has-conflict {
    background: var(--bs-danger);
}

/* Education Control Sessions aligned with Schedule Batch matrix markup */
.education-control-page .control-session-matrix-list {
    gap: 0.75rem;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr);
}

.education-control-page .control-program-section {
    overflow: hidden;
    border: 1px solid var(--card-border);
    border-left: 0.3rem solid var(--program-color);
    border-radius: 0.65rem;
    background: var(--surface);
    box-shadow: none;
}

.education-control-page .control-program-section .schedule-program-header {
    min-height: 3.45rem;
    border-bottom: 1px solid var(--program-color);
    background: var(--program-color);
    padding: 0.55rem 0.7rem;
}

.education-control-page .control-program-section .schedule-program-color {
    display: inline-grid;
    place-items: center;
    width: auto;
    height: auto;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--text-main);
    font-size: 1.25rem;
}

.education-control-page .control-program-section :is(.schedule-batch-kicker,.schedule-program-header h2,.schedule-program-count) {
    color: var(--text-main);
}

.education-control-page .control-program-section .schedule-program-header h2 {
    font-size: 0.95rem;
}

.education-control-page .control-session-matrix thead th,
.education-control-page .control-session-matrix thead .schedule-date-column {
    height: 3.4rem;
    border-bottom: 2px solid var(--program-color);
    background: var(--table-head-bg);
    padding: 0.5rem 0.6rem;
    text-align: center;
    vertical-align: middle;
}

.education-control-page .control-session-matrix .schedule-class-name {
    color: var(--text-main);
    font-size: 0.8rem;
    font-weight: 750;
}

.education-control-page .control-session-matrix .schedule-class-meta {
    display: block;
    margin-top: 0.12rem;
    color: var(--text-muted);
    font-size: 0.68rem;
}

.education-control-page .control-session-matrix .schedule-class-room {
    display: block;
    overflow: hidden;
    margin: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.education-control-page .control-session-matrix tbody > tr > th.schedule-date-column,
.education-control-page .control-session-matrix tbody > tr > td {
    background: var(--surface);
}

.education-control-page .control-session-cell {
    grid-template-columns: 3.7rem minmax(0, 1fr);
    min-height: 4.35rem;
    gap: 0.35rem;
    background: var(--surface);
    padding: 0.35rem 0.42rem;
}

.education-control-page .control-session-cell:hover,
.education-control-page .control-session-cell:focus-visible {
    background: var(--surface);
    box-shadow: inset 0 0 0 2px var(--bs-info);
}

.education-control-page .control-session-cell.is-selected {
    background: var(--surface);
    box-shadow: inset 0 0 0 2px var(--primary);
}

.education-control-page .control-session-time-source {
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 0.28rem;
    min-width: 0;
}

.education-control-page .control-session-time-source .schedule-cell-time {
    color: var(--text-main);
    font-size: 0.68rem;
    font-weight: 700;
}

.education-control-page .control-session-time-source .control-source-badge {
    max-width: 100%;
    overflow: hidden;
    padding: 0.12rem 0.3rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.education-control-page .control-session-cell .schedule-cell-teachers {
    align-self: center;
    min-width: 0;
}

.education-control-page .control-session-cell .schedule-teacher-chip {
    min-height: 2rem;
    gap: 0.42rem;
    border: 0;
    border-radius: 0.4rem;
    padding: 0.18rem 0.28rem;
    box-shadow: none;
}

.education-control-page .control-session-cell .schedule-teacher-chip.confirmation-approved {
    background: var(--bs-success);
}

.education-control-page .control-session-cell .schedule-teacher-chip.confirmation-pending {
    background: var(--bs-warning);
}

.education-control-page .control-session-cell .schedule-teacher-chip.confirmation-declined,
.education-control-page .control-session-cell .schedule-teacher-chip.has-conflict {
    background: var(--bs-danger);
}

.education-control-page .control-session-cell .schedule-teacher-chip + .schedule-teacher-chip {
    margin-top: 0.18rem;
}

.education-control-page .control-session-cell .schedule-teacher-chip-copy {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.4rem;
    width: 100%;
    min-width: 0;
}

.education-control-page .control-session-cell .schedule-teacher-chip-copy > span {
    overflow: hidden;
    color: var(--text-main);
    font-size: 0.72rem;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.education-control-page .control-session-cell .schedule-teacher-status {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    margin-left: auto;
    color: var(--text-main);
    font-size: 1rem;
}

.education-control-page .control-session-cell .schedule-conflict-icon {
    display: inline-flex;
    color: var(--text-main);
    font-size: 1rem;
}

.education-control-page .control-session-cell.has-conflict {
    box-shadow: inset 0.2rem 0 0 var(--bs-danger);
}

.education-control-page .control-session-cell.has-conflict:hover,
.education-control-page .control-session-cell.has-conflict:focus-visible {
    box-shadow:
        inset 0.2rem 0 0 var(--bs-danger),
        inset 0 0 0 2px var(--bs-info);
}

.education-control-page .control-session-cell.has-conflict.is-selected {
    box-shadow:
        inset 0.2rem 0 0 var(--bs-danger),
        inset 0 0 0 2px var(--primary);
}

.education-control-page .control-session-matrix .schedule-matrix-empty-cell {
    margin: 0.35rem;
    min-height: 3.6rem;
    border: 1px dashed var(--table-border);
    border-radius: 0.4rem;
    background: var(--table-head-bg);
}

@media (max-width: 767.98px) {
    .education-control-page .control-session-cell {
        grid-template-columns: 3.4rem minmax(8rem, 1fr);
    }
}


.education-control-page .control-workload-conflict-list > article > i,
.education-control-page .control-session-cell .schedule-conflict-icon {
    width: auto;
    height: auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}


/* Education Control unified workspace */
.education-control-page .education-control-workspace {
    min-width: 0;
    overflow: visible;
    border: 1px solid var(--card-border, var(--bs-border-color));
    border-radius: 0.8rem;
    background: var(--surface, var(--bs-body-bg));
    box-shadow: none;
}

.education-control-page .education-control-navigation {
    /* The desktop sidebar reduces usable width before the mobile breakpoint. */
    flex-wrap: wrap;
    min-width: 0;
    min-height: 3.65rem;
    padding: 0.35rem 0.65rem;
    border-bottom: 1px solid var(--card-border, var(--bs-border-color));
}

.education-control-page .education-control-tabs {
    min-width: 0;
    max-width: 100%;
    align-self: stretch;
    gap: 0.25rem;
    padding: 0.25rem;
    border: 1px solid var(--card-border, var(--bs-border-color));
    border-bottom: 1px solid var(--card-border, var(--bs-border-color));
    border-radius: 0.55rem;
}

.education-control-page .education-control-tab {
    min-width: 8.5rem;
    min-height: 2.65rem;
    border: 0;
    border-radius: 0.38rem;
}

.education-control-page .education-control-tab.is-active {
    border: 0;
    background: var(--bs-info);
    color: var(--text-main);
}

.education-control-page .education-control-tab:hover:not(.is-active),
.education-control-page .education-control-tab:focus-visible:not(.is-active) {
    background: var(--table-head-bg);
}

.education-control-page .education-control-workspace > :not(.education-control-navigation):not(.control-session-backdrop):not(.control-session-drawer) {
    margin-right: 0.75rem;
    margin-left: 0.75rem;
}

.education-control-page .education-control-workspace > .education-control-metrics {
    margin-top: 0.75rem;
}

.education-control-page .education-control-workspace > .control-session-toolbar,
.education-control-page .education-control-workspace > .education-control-filterbar {
    padding-right: 0;
    padding-left: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.education-control-page .education-control-workspace > .control-session-matrix-list,
.education-control-page .education-control-workspace > .control-teacher-list,
.education-control-page .education-control-workspace > .confirmation-content {
    margin-bottom: 0.75rem;
}

@media (max-width: 767.98px) {
    .education-control-page .education-control-navigation {
        gap: 0.65rem;
    }

    .education-control-page .education-control-tabs {
        max-width: 100%;
    }

    .education-control-page .education-control-tab {
        min-width: 7rem;
    }

    .education-control-page .education-control-workspace > :not(.education-control-navigation):not(.control-session-backdrop):not(.control-session-drawer) {
        margin-right: 0.5rem;
        margin-left: 0.5rem;
    }
}


/* Keep the Schedule Batch header menu outside the standard hero clipping boundary. */
.schedule-batch-workspace > .schedule-batch-header {
    position: relative;
    z-index: 20;
    overflow: visible;
}

.schedule-batch-workspace > .schedule-batch-header .theme-page-hero__accent {
    border-radius: 1.2rem 1.2rem 0 0;
}

.schedule-batch-workspace > .schedule-batch-header .schedule-batch-more-menu {
    z-index: 1080;
}

/* Membership User Manager workspace; uses the selected Giso theme tokens. */
.um-workspace { display: grid; grid-template-columns: minmax(15rem, 19rem) minmax(0, 1fr); gap: 1rem; align-items: start; }
.um-workspace [hidden] { display: none !important; }
.um-workspace > *, .um-editor > *, .um-user-identity { min-width: 0; }
.um-editor { display: flex; flex-direction: column; gap: .85rem; min-width: 0; }
.um-editor-scroll { display: flex; flex-direction: column; gap: .85rem; min-width: 0; }
.um-workspace.um-workspace-scroll { height: var(--um-workspace-height); min-height: 0; overflow: hidden; align-items: stretch; padding-bottom: 0; }
.um-workspace-scroll > .um-directory { display: flex; flex-direction: column; min-height: 0; }
.um-workspace-scroll .um-directory-heading, .um-workspace-scroll .um-search, .um-workspace-scroll .um-directory-footer { flex-shrink: 0; }
.um-workspace-scroll .um-user-list { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior-y: contain; }
.um-workspace-scroll > .um-editor { display: grid; grid-template-rows: auto auto auto minmax(0, 1fr) auto; min-height: 0; overflow: hidden; }
.um-workspace-scroll .um-editor-scroll { min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; padding-right: .25rem; }
.um-workspace-scroll .um-editor-scroll > * { flex-shrink: 0; }
.um-workspace-scroll .user-access-matrix-wrap { max-height: none; }
.um-workspace .user-access-panel, .um-workspace .user-access-form-panel, .um-workspace .user-access-surface { border-radius: .8rem; box-shadow: 0 2px 8px color-mix(in srgb, var(--text-main, var(--bs-body-color)) 4%, transparent); }
.um-directory { overflow: hidden; }
.um-directory-heading { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: 1rem; }
.um-directory-heading h2 { font-size: 1rem; font-weight: 700; margin: 0; }
.um-search { position: relative; margin: 0 .85rem .7rem; }
.um-search .bi { position: absolute; left: .75rem; top: .65rem; color: var(--text-muted, var(--bs-secondary-color)); }
.um-search input { padding-left: 2.1rem; font-size: .82rem; min-height: 2.3rem; border-radius: .55rem; }
.um-user-row { display: flex; align-items: flex-start; gap: .65rem; padding: .85rem; border-top: 1px solid var(--card-border, var(--bs-border-color)); position: relative; }
.um-user-row:hover { background: var(--surface-soft, var(--bs-tertiary-bg)); }
.um-user-row.is-selected { background: var(--primary-soft, var(--surface-soft)); box-shadow: inset 3px 0 var(--primary, var(--bs-primary)); }
.um-avatar { width: 2.2rem; height: 2.2rem; font-size: .76rem; }
.um-user-identity { flex: 1; }
.um-user-name { display: block; font-size: .84rem; font-weight: 650; line-height: 1.4; color: var(--text-main, var(--bs-body-color)); text-decoration: none; overflow-wrap: anywhere; }
.um-user-name:hover { color: var(--primary, var(--bs-primary)); }
.um-user-email { display: block; color: var(--text-muted, var(--bs-secondary-color)); font-size: .74rem; overflow-wrap: anywhere; margin-top: .1rem; }
.um-row-pills { display: flex; gap: .3rem; flex-wrap: wrap; margin-top: .45rem; }
.um-row-pills .user-access-pill { font-size: .65rem; padding: .2rem .45rem; min-height: auto; }
.um-row-action { color: var(--text-muted, var(--bs-secondary-color)); padding: .2rem; }
.um-directory-footer { padding: .7rem .85rem; display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; justify-content: space-between; font-size: .73rem; color: var(--text-muted, var(--bs-secondary-color)); border-top: 1px solid var(--card-border, var(--bs-border-color)); }
.um-pager { display: flex; gap: .4rem; align-items: center; }
.um-pager .btn { padding: .1rem .35rem; }
.um-empty-editor { min-height: 20rem; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem; text-align: center; gap: .8rem; }
.um-empty-editor h2 { font-size: 1.1rem; margin: 0; }
.um-editor .user-access-edit-header { grid-template-columns: minmax(0, 1fr) auto; gap: .8rem; padding: 1rem; }
.um-editor .user-access-edit-title { font-size: 1.3rem; }
.um-editor .btn { min-height: 2.25rem; border-radius: .5rem; font-size: .8rem; display: inline-flex; align-items: center; justify-content: center; gap: .4rem; }
.um-editor .bi { font-size: .9rem; }
.um-account-meta { display: flex; flex-wrap: wrap; gap: .6rem 1.4rem; font-size: .75rem; color: var(--text-muted, var(--bs-secondary-color)); padding: 0 .2rem; }
.um-account-meta strong { font-weight: 500; margin-right: .4rem; }
.um-tabs { display: flex; border-bottom: 1px solid var(--card-border, var(--bs-border-color)); gap: 1.1rem; flex-wrap: wrap; }
.um-tabs a { text-decoration: none; color: var(--text-muted, var(--bs-secondary-color)); font-size: .83rem; padding: .65rem .2rem; border-bottom: 2px solid transparent; }
.um-tabs a[aria-selected="true"] { color: var(--primary, var(--bs-primary)); border-bottom-color: var(--primary, var(--bs-primary)); font-weight: 650; }
.um-summary-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; margin-top: .85rem; }
.um-editor .user-access-form-panel__header { padding: .8rem 1rem; }
.um-editor .user-access-form-panel__header h2 { font-size: .95rem; }
.um-editor .user-access-form-panel__body { padding: 1rem; }
.um-editor .user-access-edit-field-grid { gap: .8rem; align-items: end; }
.um-editor .form-label, .um-editor .form-check-label { font-size: .8rem; }
.um-editor .form-text { font-size: .76rem; line-height: 1.5; }
.um-editor details summary { color: var(--primary, var(--bs-primary)); font-size: .8rem; cursor: pointer; }
.um-editor .user-access-edit-matrix-card { margin-top: 0; }
.um-permission-note { padding: .7rem 1rem 0; font-size: .75rem; color: var(--text-muted, var(--bs-secondary-color)); }
.um-permission-table { font-size: .8rem; min-width: 31rem; }
.um-permission-table thead th { position: sticky; top: 0; z-index: 1; background: var(--table-head-bg, var(--surface-soft)); white-space: nowrap; }
.um-permission-table th, .um-permission-table td { padding: .65rem .85rem; vertical-align: middle; border-color: var(--table-border, var(--bs-border-color)); }
.um-permission-table th:first-child { width: 35%; }
.um-permission-table .form-select { min-width: 8rem; font-size: .78rem; }
.um-permission-table tr[data-override="allow"] select { border-color: var(--bs-success); background-color: color-mix(in srgb, var(--bs-success) 8%, var(--input-bg, var(--surface))); }
.um-permission-table tr[data-override="deny"] select { border-color: var(--bs-danger); background-color: var(--danger-soft, var(--surface-soft)); }
.um-permission-value { display: inline-block; font-size: .73rem; font-weight: 600; padding: .2rem .5rem; border-radius: .35rem; color: var(--text-muted, var(--bs-secondary-color)); background: var(--surface-soft, var(--bs-tertiary-bg)); }
.um-permission-value[data-allowed="true"] { color: var(--bs-success-text-emphasis, var(--bs-success)); background: var(--bs-success-bg-subtle, var(--surface-soft)); }
.um-danger-zone { border-color: color-mix(in srgb, var(--bs-danger) 45%, var(--card-border, var(--bs-border-color))) !important; }
.um-danger-zone h2 { color: var(--bs-danger-text-emphasis, var(--bs-danger)); }
.um-editor .um-page-actions { padding: .85rem 0 0; margin: 0; border-top: 1px solid var(--card-border, var(--bs-border-color)); }
.um-editor .um-page-actions .btn { flex: 0 1 auto; }
@media (max-width: 1100px) { .um-workspace { grid-template-columns: minmax(14rem, 16rem) minmax(0, 1fr); } .um-editor .user-access-edit-header { grid-template-columns: minmax(0, 1fr); } .um-editor .user-access-edit-header__actions { justify-content: flex-start; } }
@media (max-width: 850px) { .um-workspace { grid-template-columns: minmax(0, 1fr); } .um-user-list { max-height: 22rem; overflow: auto; } .um-summary-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 480px) { .um-editor .user-access-edit-field-grid { grid-template-columns: minmax(0, 1fr); } .um-editor .um-page-actions, .um-editor .user-access-edit-actions__buttons { display: flex; flex-wrap: wrap; flex-direction: row; } .um-tabs { gap: .7rem; } .um-editor .user-access-edit-title { font-size: 1.15rem; } }

/* Separate directory and editor; checkbox controls retain tri-state form data. */
.um-workspace.um-editor-page { grid-template-columns: minmax(0, 1fr); }
.um-list-page [hidden] { display: none !important; }
.um-list-page .um-user-list { max-height: none; overflow: visible; }
.um-checkbox-matrix { min-width: 54rem; }
.um-checkbox-matrix th:first-child { width: 12rem; min-width: 12rem; position: sticky; left: 0; z-index: 1; background: var(--surface, var(--bs-body-bg)); }
.um-checkbox-matrix thead th:first-child { z-index: 3; background: var(--table-head-bg, var(--surface-soft)); }
.um-checkbox-matrix thead th:not(:first-child) { text-align: center; white-space: normal; min-width: 5.5rem; }
.um-checkbox-matrix td { text-align: center; padding: .55rem .4rem; }
.um-permission-cell { display: flex; flex-direction: column; align-items: center; gap: .25rem; padding: .35rem; border-radius: .45rem; }
.um-permission-checkline { display: flex; align-items: center; justify-content: center; min-height: 1.65rem; gap: .3rem; }
.um-permission-checkline .form-check-input { margin: 0; width: 1.1rem; height: 1.1rem; cursor: pointer; }
.um-permission-source { color: var(--text-muted, var(--bs-secondary-color)); font-size: .7rem; white-space: nowrap; }
.um-checkbox-matrix td[data-override="allow"] .um-permission-cell,
.um-checkbox-matrix td[data-override="deny"] .um-permission-cell { background: var(--primary-soft, var(--surface-soft)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary, var(--bs-primary)) 30%, transparent); }
.um-checkbox-matrix td:not([data-override="inherit"]) .um-permission-source { color: var(--primary, var(--bs-primary)); }
.um-permission-reset { border: 0; background: transparent; color: var(--primary, var(--bs-primary)); border-radius: .3rem; padding: .2rem; min-width: 1.6rem; min-height: 1.6rem; display: inline-flex; align-items: center; justify-content: center; }
@media (pointer: coarse) { .um-permission-reset { min-width: 2.75rem; min-height: 2.75rem; } .um-permission-checkline { min-height: 2.75rem; } }

/* Users directory: accepted header/buttons with bounded, responsive table rows.
   Keep the existing membership badge palette until its separate decision. */
.um-list-page { min-width: 0; }
.um-list-page .um-list-subtitle { color: var(--giso-header-muted); margin: .5rem 0 0; }
.um-directory-table { overflow: visible; margin-top: 1.25rem; min-width: 0; border: 1px solid var(--giso-button-border); border-radius: 16px; background: var(--giso-button-surface); }
.um-directory-table .um-directory-heading { padding: 1rem; }
.um-directory-toolbar { display: flex; flex-wrap: wrap; align-items: end; gap: 10px; padding: 0 1rem 1rem; }
.um-directory-search { position: relative; flex: 1 1 16rem; min-width: 0; }
.um-directory-search > .pi { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); font-size: 16px; color: var(--giso-header-muted); }
.um-directory-search .form-control { min-height: 44px; padding-left: 40px; border: 1px solid var(--giso-button-border); border-radius: 12px; background: var(--giso-button-surface); color: var(--giso-button-text); }
.um-directory-control-label { display: block; margin-bottom: .35rem; font-size: 12px; color: var(--giso-header-muted); }
.um-directory-select { position: relative; max-width: 100%; }
.um-directory-select__trigger { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 44px; padding: 0 14px; border: 1px solid var(--giso-button-border); border-radius: 12px; color: var(--giso-button-text); background: var(--giso-button-surface); font-size: 14px; }
.um-directory-select__trigger .pi { font-size: 16px; }
.um-directory-select__options { position: absolute; z-index: 10; left: 0; top: calc(100% + 6px); width: max-content; min-width: 100%; max-width: min(20rem, calc(100vw - 32px)); margin: 0; padding: 6px; list-style: none; border: 1px solid var(--giso-button-border); border-radius: 16px; background: var(--giso-button-surface); color: var(--giso-button-text); box-shadow: var(--giso-menu-shadow); }
.um-directory-select__options [role="option"] { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; padding: 10px 12px; border-radius: 10px; cursor: pointer; font-size: 14px; }
.um-directory-select__options [aria-selected="false"] .pi { visibility: hidden; }
.um-directory-select__options [aria-selected="true"] { background: var(--giso-button-soft); }
.um-directory-select__options [role="option"]:hover, .um-directory-select__options [role="option"]:focus { outline: 2px solid var(--giso-button-brand); outline-offset: -2px; }
.um-directory-select :focus-visible, .um-membership-table a:focus-visible { outline: 3px solid var(--giso-button-brand); outline-offset: 2px; }
.um-directory-table-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: .75rem 1rem; border-top: 1px solid var(--giso-button-border); }
.um-directory-table-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; min-width: 0; }
.um-directory-table-tools .um-directory-select { display: flex; align-items: center; gap: 8px; }
.um-directory-table-tools .um-directory-control-label { margin: 0; }
.um-directory-table-tools .um-directory-select__options { left: auto; right: 0; }
.um-directory-summary { margin: 0; padding: 0; color: var(--giso-header-muted); font-size: 13px; }
.um-directory-table-wrap { max-width: 100%; }
.um-membership-table { width: 100%; table-layout: fixed; border-collapse: collapse; color: var(--giso-button-text); font-size: 14px; }
.um-membership-table th { font-size: 12px; color: var(--giso-header-muted); text-align: left; }
.um-membership-table th, .um-membership-table td { padding: .85rem 1rem; border-top: 1px solid var(--giso-button-border); vertical-align: middle; overflow-wrap: anywhere; }
.um-membership-table th:first-child { width: 35%; }
.um-membership-table th:last-child { width: 76px; }
.um-membership-table th a { display: inline-flex; align-items: center; gap: 8px; color: inherit; text-decoration: none; min-height: 36px; }
.um-directory-identity { display: flex; align-items: center; gap: .75rem; min-width: 0; }
.um-directory-identity .um-user-name { color: var(--giso-button-brand); }
.um-directory-table .directory-pagination { padding: 1rem; margin: 0; border-top: 1px solid var(--giso-button-border); }
.um-directory-table .directory-pagination__page { color: var(--giso-button-text); border-color: var(--giso-button-border); background: var(--giso-button-surface); min-width: 36px; min-height: 36px; border-radius: 12px; }
.um-directory-table .directory-pagination__page.is-current { background: var(--giso-button-soft); color: var(--giso-button-brand); }
.um-directory-empty { padding: 1.5rem 1rem; text-align: center; color: var(--giso-header-muted); }
.um-directory-empty > .pi { font-size: 44px; }
.um-directory-empty h3 { font-size: 16px; margin: 1rem 0 .5rem; }
@media (max-width: 767.98px) {
    .um-directory-toolbar { align-items: end; }
    .um-directory-search { flex-basis: 100%; }
    .um-membership-table, .um-membership-table tbody { display: block; }
    .um-membership-table thead { display: none; }
    .um-membership-table tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem 1rem; padding: 1rem; border-top: 1px solid var(--giso-button-border); }
    .um-membership-table td { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; padding: 0; border: 0; min-width: 0; grid-column: 1; }
    .um-membership-table td[data-label]::before { content: attr(data-label); color: var(--giso-header-muted); font-size: 12px; }
    .um-membership-table .um-directory-row-action { grid-column: 2; grid-row: 1 / span 4; }
}
@media (pointer: coarse) {
    .um-directory-table .directory-pagination__page, .um-membership-table th a { min-height: 44px; min-width: 44px; }
}