:root {
    --color-forest: #254236;
    --color-forest-dark: #17291f;
    --color-sage: #7c927d;
    --color-sage-soft: #e8eee4;
    --color-off-white: #fffdf8;
    --color-warm-bg: #f4efe6;
    --color-beige: #e5d8c5;
    --color-beige-soft: #f1e8da;
    --color-pastel-orange: #e0a365;
    --color-clay: #a2542a;
    --color-clay-dark: #7c3f1f;
    --color-brown: #5a3d2a;
    --color-text: #1f2521;
    --color-text-muted: #5d625d;
    --color-border: #d8ccbe;
    --color-success: #386150;
    --color-warning: #9a681d;
    --color-error: #8b3d2f;
    --color-focus: #4f7d62;
    --bg: var(--color-warm-bg);
    --panel: var(--color-off-white);
    --ink: var(--color-text);
    --muted: var(--color-text-muted);
    --accent: var(--color-clay);
    --accent-dark: var(--color-clay-dark);
    --success: var(--color-success);
    --warning: var(--color-warning);
    --error: var(--color-error);
    --line: var(--color-border);
    --sidebar-ink: #f3ede3;
    --font-family-base: "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    --font-size-meta: 0.82rem;
    --font-size-label: 0.9rem;
    --font-size-body: 1rem;
    --font-size-lead: 1.12rem;
    --font-size-section: clamp(1.35rem, 1.1rem + 0.8vw, 1.8rem);
    --font-size-title: clamp(2rem, 1.45rem + 1.8vw, 3.2rem);
    --font-weight-label: 650;
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 3rem;
    --radius-control: 14px;
    --radius-panel: 20px;
    --radius-card: var(--radius-panel);
    --shadow-panel: 0 24px 60px rgba(48, 37, 28, 0.08);
    --shadow-card-hover: 0 18px 42px rgba(48, 37, 28, 0.12);
    --shadow-control: 0 10px 24px rgba(48, 37, 28, 0.08);
    --shadow-control-hover: 0 14px 28px rgba(48, 37, 28, 0.12);
    --focus-ring: 0 0 0 4px rgba(79, 125, 98, 0.2);
}

* {
    box-sizing: border-box;
}

[hidden] {
    display: none !important;
}

body {
    margin: 0;
    font-family: var(--font-family-base);
    font-size: var(--font-size-body);
    line-height: 1.55;
    background:
        radial-gradient(circle at top left, rgba(162, 84, 42, 0.12), transparent 25%),
        linear-gradient(180deg, #f7f1e8 0%, #efe7dc 100%);
    color: var(--ink);
}

.visually-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

h1,
h2,
h3,
p {
    margin-top: 0;
}

h1 {
    font-size: var(--font-size-title);
    line-height: 1.08;
}

h2 {
    font-size: var(--font-size-section);
    line-height: 1.18;
}

h3 {
    line-height: 1.24;
}

a {
    color: inherit;
    text-decoration: none;
}

.public-shell {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.skip-link {
    position: fixed;
    top: 0.75rem;
    left: 0.75rem;
    z-index: 20;
    transform: translateY(-150%);
    padding: 0.75rem 1rem;
    border-radius: var(--radius-control);
    background: var(--color-forest-dark);
    color: var(--color-off-white);
    font-weight: 700;
    box-shadow: var(--shadow-control-hover);
    transition: transform 0.16s ease;
}

.skip-link:focus-visible {
    transform: translateY(0);
    outline: none;
}

.public-header {
    position: sticky;
    top: 0;
    z-index: 10;
    border-bottom: 1px solid var(--line);
    background: rgba(255, 253, 248, 0.88);
    backdrop-filter: blur(12px);
}

.public-header-inner {
    width: min(1180px, calc(100% - 2rem));
    min-height: 4.35rem;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.brand {
    margin-right: auto;
    font-weight: 700;
}

.public-brand {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.brand-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    flex: 0 0 2.75rem;
    border-radius: 50%;
    background: var(--color-forest);
    color: var(--color-off-white);
    font-size: 0.82rem;
    font-weight: 800;
}

.brand-text {
    display: grid;
    gap: 0.05rem;
}

.brand-text strong {
    font-size: 1rem;
    line-height: 1.1;
}

.brand-text span {
    color: var(--muted);
    font-size: var(--font-size-meta);
    font-weight: 600;
}

.public-nav {
    display: flex;
    gap: 0.35rem;
    align-items: center;
}

.public-menu {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.public-nav a,
.admin-header-actions > a,
.admin-header-actions > form > button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 2.75rem;
    padding: 0.7rem 1rem;
    border-radius: 999px;
    border: 1px solid rgba(162, 84, 42, 0.16);
    background: rgba(255, 255, 255, 0.76);
    box-shadow: 0 10px 24px rgba(48, 37, 28, 0.08);
    transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}

.public-nav a:hover,
.public-nav a:focus-visible,
.admin-header-actions > a:hover,
.admin-header-actions > form > button:hover {
    transform: translateY(-1px);
    border-color: rgba(162, 84, 42, 0.34);
    background: #fff;
    box-shadow: 0 14px 28px rgba(48, 37, 28, 0.12);
}

.public-nav a.is-active {
    border-color: rgba(37, 66, 54, 0.26);
    background: var(--color-sage-soft);
    color: var(--color-forest-dark);
}

.nav-icon-link {
    gap: 0.45rem;
}

.nav-item-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 1.45rem;
    height: 1.45rem;
    border-radius: 999px;
    background: rgba(162, 84, 42, 0.12);
    color: inherit;
    font-size: 0.72rem;
    font-weight: 850;
    line-height: 1;
}

.public-menu-toggle {
    display: none;
    align-items: center;
    gap: 0.65rem;
    min-height: 2.75rem;
    padding: 0.65rem 0.85rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: rgba(255, 255, 255, 0.9);
    color: var(--ink);
    font: inherit;
    font-weight: 700;
    box-shadow: var(--shadow-control);
}

.menu-lines {
    display: grid;
    gap: 0.22rem;
}

.menu-lines span {
    width: 1.1rem;
    height: 2px;
    border-radius: 999px;
    background: var(--color-forest);
}

.public-header-cta {
    white-space: nowrap;
}

.public-content {
    width: min(1180px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 2rem 0 3rem;
    flex: 1 0 auto;
}

.admin-content {
    padding: 2rem;
}

.admin-content {
    display: grid;
    gap: var(--space-5);
}

.hero,
.card,
.panel {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    padding: 2rem;
    box-shadow: var(--shadow-panel);
}

.hero-grid {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 1.5rem;
}

.homepage-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    align-items: stretch;
    margin-bottom: var(--space-4);
}

.homepage-hero-copy,
.homepage-hero-panel,
.homepage-course-card {
    border: 1px solid var(--line);
    background: rgba(255, 253, 248, 0.92);
    box-shadow: var(--shadow-panel);
}

.homepage-hero-copy {
    padding: clamp(1.2rem, 2.4vw, 2rem);
    border-radius: var(--radius-panel);
    display: grid;
    align-content: center;
    gap: var(--space-3);
}

.homepage-hero-copy h1 {
    max-width: 24ch;
    margin-bottom: 0;
}

.homepage-hero-copy .lead {
    max-width: 42rem;
    margin-bottom: 0;
}

.homepage-hero-panel {
    border-radius: var(--radius-panel);
    padding: var(--space-6);
    display: grid;
    align-content: end;
    gap: var(--space-3);
    background:
        linear-gradient(145deg, rgba(37, 66, 54, 0.94), rgba(90, 61, 42, 0.88)),
        var(--color-forest);
    color: var(--color-off-white);
}

.homepage-hero-panel span {
    color: var(--color-pastel-orange);
    font-size: var(--font-size-meta);
    font-weight: 800;
    text-transform: uppercase;
}

.homepage-hero-panel strong {
    font-size: clamp(2rem, 2vw, 3rem);
    line-height: 1;
}

.homepage-hero-panel p {
    margin-bottom: 0;
    color: rgba(255, 253, 248, 0.78);
}

.homepage-section {
    display: grid;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.homepage-discovery-panel {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(18rem, 1.1fr);
    gap: var(--space-4);
    align-items: end;
    padding: var(--space-4);
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: rgba(255, 253, 248, 0.92);
    box-shadow: var(--shadow-panel);
}

.homepage-discovery-copy h2,
.homepage-discovery-copy p {
    margin-bottom: 0;
}

.homepage-discovery-copy p {
    color: var(--muted);
}

.homepage-category-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-3);
    align-items: end;
}

.homepage-filter-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    align-items: center;
}

.homepage-filter-actions button,
.homepage-filter-actions a {
    white-space: nowrap;
}

.rounded-select {
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.92);
}

.category-filter-strip {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    align-items: center;
}

.category-filter-strip a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.6rem 0.9rem;
    border: 1px solid rgba(124, 146, 125, 0.3);
    border-radius: 999px;
    background: rgba(232, 238, 228, 0.7);
    color: var(--color-forest-dark);
    font-size: var(--font-size-meta);
    font-weight: 800;
}

.category-filter-strip a:hover,
.category-filter-strip a:focus-visible {
    background: var(--color-sage-soft);
    text-decoration: none;
}

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

.category-discovery-card {
    min-height: 8.5rem;
    padding: var(--space-5);
    border: 1px solid rgba(124, 146, 125, 0.28);
    border-radius: var(--radius-panel);
    background: rgba(232, 238, 228, 0.72);
    display: grid;
    align-content: space-between;
    gap: var(--space-4);
    box-shadow: var(--shadow-control);
    transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.category-discovery-card:hover,
.category-discovery-card:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(37, 66, 54, 0.34);
    background: var(--color-sage-soft);
    box-shadow: var(--shadow-control-hover);
}

.category-discovery-card span {
    color: var(--color-forest-dark);
    font-size: 1.15rem;
    font-weight: 800;
}

.category-discovery-card strong {
    color: var(--accent-dark);
    font-size: var(--font-size-meta);
}

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

.homepage-course-card {
    border-radius: var(--radius-panel);
    padding: var(--space-4);
    display: grid;
    gap: var(--space-3);
}

.homepage-course-card h3 {
    margin-bottom: 0;
}

.homepage-course-card > p {
    color: var(--muted);
}

.homepage-course-card .button-secondary {
    align-self: end;
    margin-top: auto;
}

.homepage-course-card-head {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    align-items: center;
}

.course-list-hero,
.course-filter-panel,
.public-course-card {
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: rgba(255, 253, 248, 0.92);
    box-shadow: var(--shadow-panel);
}

.course-list-hero {
    padding: clamp(1.75rem, 3vw, 3rem);
    margin-bottom: var(--space-5);
}

.course-list-hero h1 {
    max-width: 15ch;
}

.course-list-hero .lead {
    max-width: 46rem;
}

.course-filter-panel {
    display: grid;
    gap: var(--space-5);
    padding: var(--space-5);
    margin-bottom: var(--space-7);
}

.course-filter-panel h2 {
    margin-bottom: 0;
}

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

.course-filter-actions {
    display: flex;
    gap: var(--space-2);
    align-items: center;
}

.course-filter-actions button,
.course-filter-actions .button-secondary {
    width: auto;
    min-height: 3.2rem;
    white-space: nowrap;
}

.results-count {
    align-self: center;
    padding: 0.45rem 0.75rem;
    border-radius: 999px;
    background: var(--color-sage-soft);
    color: var(--color-forest-dark);
    font-size: var(--font-size-meta);
    font-weight: 800;
}

.public-course-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.public-course-card {
    padding: var(--space-4);
    display: grid;
    gap: var(--space-3);
}

.course-card-link {
    color: inherit;
    text-decoration: none;
}

.course-card-link:hover,
.course-card-link:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(37, 66, 54, 0.28);
    box-shadow: var(--shadow-control-hover);
    text-decoration: none;
}

.course-card-image {
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: calc(var(--radius-panel) - 6px);
    object-fit: cover;
    background: var(--color-sage-soft);
}

.public-course-card.is-group {
    border-color: rgba(224, 163, 101, 0.48);
    background:
        linear-gradient(180deg, rgba(255, 247, 232, 0.78), rgba(255, 253, 248, 0.96)),
        var(--panel);
}

.public-course-card h3 {
    margin-bottom: 0;
}

.public-course-card > p {
    color: var(--muted);
}

.public-course-card .button-secondary {
    align-self: end;
    margin-top: auto;
}

.public-course-card-head {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    align-items: center;
}

.course-group-note {
    margin-bottom: 0;
    color: var(--accent-dark) !important;
    font-weight: 800;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    margin-top: 1.5rem;
}

.button-primary,
.button-success {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.85rem 1.2rem;
    border-radius: var(--radius-control);
    background: var(--accent);
    color: #fff;
    border: 1px solid transparent;
    box-shadow: 0 14px 30px rgba(162, 84, 42, 0.22);
    font-weight: 700;
    transition: transform 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
}

.button-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(162, 84, 42, 0.28);
}

.button-success {
    background: var(--success);
    box-shadow: 0 14px 30px rgba(56, 97, 80, 0.2);
}

.button-success:hover {
    background: var(--color-forest);
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(56, 97, 80, 0.24);
}

.button-primary:focus-visible,
.button-success:focus-visible,
.button-secondary:focus-visible,
.button-danger:focus-visible,
.button-link:focus-visible,
.public-menu-toggle:focus-visible,
a:focus-visible,
button:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring), var(--shadow-control);
}

.public-footer {
    margin-top: auto;
    background: var(--color-forest-dark);
    color: var(--color-off-white);
}

.public-footer-inner {
    width: min(1180px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 2rem 0;
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) auto auto;
    gap: 2rem;
    align-items: start;
}

.public-footer p {
    margin-bottom: 0;
    color: rgba(255, 253, 248, 0.78);
}

.public-footer-brand {
    color: var(--color-off-white) !important;
    font-weight: 800;
}

.public-footer-nav,
.public-footer-contact {
    display: grid;
    gap: 0.45rem;
}

.public-footer-nav a,
.public-footer-contact a {
    color: rgba(255, 253, 248, 0.84);
}

.public-footer-nav a:hover,
.public-footer-nav a:focus-visible,
.public-footer-contact a:hover,
.public-footer-contact a:focus-visible {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 0.2rem;
}

.public-footer-contact {
    font-style: normal;
}

.public-footer-contact span {
    color: var(--color-pastel-orange);
    font-weight: 700;
}

.button-secondary,
.button-danger,
.button-link,
.button-small,
.admin-header-actions a,
.form-actions a,
.table-actions a,
.section-head > a,
.auth-card > a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    min-width: 0;
    padding: 0.8rem 1rem;
    border-radius: var(--radius-control);
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.92);
    color: var(--ink);
    box-shadow: var(--shadow-control);
    font-weight: 600;
    transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.button-secondary:hover,
.button-danger:hover,
.button-link:hover,
.button-small:hover,
.admin-header-actions a:hover,
.form-actions a:hover,
.table-actions a:hover,
.section-head > a:hover,
.auth-card > a:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-control-hover);
}

.button-danger {
    border-color: rgba(139, 61, 47, 0.2);
    background: rgba(139, 61, 47, 0.12);
    color: var(--error);
}

.button-link {
    background: transparent;
    border-color: transparent;
    box-shadow: none;
    color: var(--accent-dark);
}

.button-small {
    min-height: 2.15rem;
    padding: 0.45rem 0.65rem;
    border-radius: 10px;
    font-size: 0.86rem;
}

.user-delete-button {
    border-color: rgba(139, 61, 47, 0.45);
}

.user-delete-button:hover {
    background: #8b3d2f;
    border-color: #6b2c22;
    color: #fff;
}

.narrow-card {
    max-width: 640px;
}

.cards,
.detail-grid {
    display: grid;
    gap: 1.5rem;
    margin-top: 1.5rem;
}

.cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.detail-grid {
    grid-template-columns: 1.35fr 1fr;
}

.section-head {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 1rem;
    margin: 2rem 0 1rem;
}

.chip-list {
    list-style: none;
    padding: 0;
    margin: 1rem 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.chip-list a {
    display: inline-flex;
    padding: 0.65rem 0.95rem;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.7);
}

.eyebrow {
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--accent);
    font-size: var(--font-size-meta);
    font-weight: 750;
}

.lead {
    font-size: var(--font-size-lead);
    color: var(--muted);
}

form {
    display: grid;
    gap: 0.75rem;
}

input,
select,
textarea,
button {
    width: 100%;
    padding: 0.85rem 1rem;
    border-radius: var(--radius-control);
    border: 1px solid var(--line);
    font: inherit;
}

label {
    display: grid;
    gap: var(--space-2);
    color: var(--ink);
    font-size: var(--font-size-label);
    font-weight: var(--font-weight-label);
}

input,
select,
textarea {
    background: rgba(255, 255, 255, 0.86);
    color: var(--ink);
    transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
}

input::placeholder,
textarea::placeholder {
    color: rgba(93, 98, 93, 0.72);
}

input:focus-visible,
select:focus-visible,
textarea:focus-visible,
button:focus-visible,
a:focus-visible {
    outline: 2px solid var(--color-focus);
    outline-offset: 2px;
    box-shadow: var(--focus-ring);
}

button {
    background: var(--accent);
    color: white;
    border: 0;
    cursor: pointer;
    font-weight: 700;
    box-shadow: 0 14px 30px rgba(162, 84, 42, 0.22);
    transition: transform 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
}

button:hover {
    background: var(--accent-dark);
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(124, 63, 31, 0.24);
}

button:disabled,
input:disabled,
select:disabled,
textarea:disabled,
.is-disabled {
    cursor: not-allowed;
    opacity: 0.58;
}

button:disabled:hover,
.is-disabled:hover {
    transform: none;
    box-shadow: none;
}

.searchable-combobox {
    position: relative;
    display: grid;
    width: 100%;
    min-width: 0;
}

.searchable-combobox-input {
    width: 100%;
}

.searchable-select-native {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.searchable-combobox-list {
    position: absolute;
    z-index: 90;
    top: calc(100% + 0.35rem);
    left: 0;
    right: 0;
    display: grid;
    gap: 0.2rem;
    max-height: 15rem;
    overflow: auto;
    padding: 0.35rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--panel);
    box-shadow: var(--shadow-card-hover);
}

.searchable-combobox-list[hidden] {
    display: none;
}

.searchable-combobox-option {
    justify-content: flex-start;
    width: 100%;
    min-height: 2.2rem;
    padding: 0.45rem 0.65rem;
    border: 0;
    border-radius: var(--radius-control);
    background: transparent;
    color: var(--ink);
    text-align: left;
    box-shadow: none;
}

.searchable-combobox-option:hover,
.searchable-combobox-option:focus-visible,
.searchable-combobox-option.is-active {
    background: rgba(232, 238, 228, 0.78);
    color: var(--color-forest);
    transform: none;
    box-shadow: none;
}

.searchable-combobox-option[aria-selected="true"] {
    background: rgba(56, 97, 80, 0.12);
    color: var(--color-forest);
    font-weight: 800;
}

.searchable-combobox-empty {
    padding: 0.55rem 0.65rem;
    color: var(--muted);
    font-size: var(--font-size-meta);
}

.admin-action-button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    border-color: transparent;
    color: #fff;
    text-decoration: none;
    transition: transform 0.16s ease, box-shadow 0.16s ease, background 0.16s ease, border-color 0.16s ease;
}

.admin-action-button,
.admin-action-button > span {
    color: #fff;
}

.action-button-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.1rem;
    height: 1.1rem;
    color: #fff !important;
    font-weight: 850;
    line-height: 1;
}

.admin-table .admin-action-button .action-button-icon,
.user-profile-card .admin-action-button .action-button-icon,
.rich-text-editor .admin-action-button .action-button-icon {
    color: currentColor;
}

.button-action-create,
.admin-action-button.button-action-create {
    background: #3f6f58 !important;
    border-color: #3f6f58 !important;
    color: #fff !important;
}

.button-action-create:hover,
.button-action-create:focus-visible,
.admin-action-button.button-action-create:hover,
.admin-action-button.button-action-create:focus-visible {
    background: #2f5945 !important;
    border-color: #2f5945 !important;
    color: #fff !important;
}

.button-action-edit,
.admin-action-button.button-action-edit {
    background: #a26335 !important;
    border-color: #a26335 !important;
    color: #fff !important;
}

.button-action-edit:hover,
.button-action-edit:focus-visible,
.admin-action-button.button-action-edit:hover,
.admin-action-button.button-action-edit:focus-visible {
    background: #834b26 !important;
    border-color: #834b26 !important;
    color: #fff !important;
}

.button-action-delete,
.admin-action-button.button-action-delete {
    background: #96473e !important;
    border-color: #96473e !important;
    color: #fff !important;
}

.button-action-delete:hover,
.button-action-delete:focus-visible,
.admin-action-button.button-action-delete:hover,
.admin-action-button.button-action-delete:focus-visible {
    background: #79342e !important;
    border-color: #79342e !important;
    color: #fff !important;
}

.button-action-detail,
.admin-action-button.button-action-detail {
    background: #2f4b68 !important;
    border-color: #2f4b68 !important;
    color: #fff !important;
}

.button-action-detail:hover,
.button-action-detail:focus-visible,
.admin-action-button.button-action-detail:hover,
.admin-action-button.button-action-detail:focus-visible {
    background: #203a54 !important;
    border-color: #203a54 !important;
    color: #fff !important;
}

.rich-text-editor .ql-toolbar button.admin-action-button,
.course-bulk-email-dialog .ql-toolbar button.admin-action-button {
    width: auto;
    min-width: 2.15rem;
    height: 2.15rem;
    padding: 0.35rem 0.48rem;
    border-width: 1px;
    border-style: solid;
    color: #fff;
}

.rich-text-editor .ql-toolbar button.admin-action-button.button-action-edit,
.course-bulk-email-dialog .ql-toolbar button.admin-action-button.button-action-edit {
    background: #a26335;
    border-color: #a26335;
}

.rich-text-editor .ql-toolbar button.admin-action-button.button-action-edit:hover,
.rich-text-editor .ql-toolbar button.admin-action-button.button-action-edit:focus-visible,
.course-bulk-email-dialog .ql-toolbar button.admin-action-button.button-action-edit:hover,
.course-bulk-email-dialog .ql-toolbar button.admin-action-button.button-action-edit:focus-visible {
    background: #834b26;
    border-color: #834b26;
}

.admin-action-button[data-tooltip]:hover::after,
.admin-action-button[data-tooltip]:focus-visible::after {
    content: attr(data-tooltip);
    position: absolute;
    left: calc(100% - 0.4rem);
    bottom: calc(100% - 0.2rem);
    z-index: 45;
    width: max-content;
    max-width: 16rem;
    padding: 0.35rem 0.55rem;
    border-radius: 8px;
    background: rgba(31, 37, 33, 0.94);
    color: #fff;
    font-size: var(--font-size-meta);
    font-weight: 700;
    line-height: 1.25;
    box-shadow: var(--shadow-control);
    pointer-events: none;
}

.is-loading,
[aria-busy="true"] {
    cursor: progress;
    opacity: 0.72;
}

.checkbox {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.checkbox input {
    width: auto;
}

.course-card {
    display: grid;
    gap: 1rem;
}

.course-card-link {
    position: relative;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.course-card-link::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(162, 84, 42, 0);
    transition: box-shadow 0.18s ease;
}

.course-card-link:hover {
    transform: translateY(-4px);
    border-color: rgba(162, 84, 42, 0.34);
    box-shadow: 0 28px 60px rgba(48, 37, 28, 0.14);
}

.course-card-link:hover::after {
    box-shadow: inset 0 0 0 1px rgba(162, 84, 42, 0.2);
}

.course-date {
    color: var(--accent);
    font-weight: 600;
}

.compact {
    grid-template-columns: max-content 1fr;
}

.course-detail-grid {
    align-items: start;
}

.course-detail-shell {
    display: grid;
    gap: var(--space-4);
}

.course-detail-card {
    display: grid;
    grid-template-columns: minmax(0, 1.28fr) minmax(320px, 0.72fr);
    gap: var(--space-5);
    align-items: start;
    padding: var(--space-5);
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: rgba(255, 253, 248, 0.92);
    box-shadow: var(--shadow-panel);
}

.course-detail-content {
    display: grid;
    gap: var(--space-4);
}

.course-detail-hero,
.course-detail-section,
.course-registration-panel {
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: rgba(255, 255, 255, 0.58);
}

.course-detail-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(240px, 0.7fr);
    gap: 1.25rem;
    padding: var(--space-4);
    align-items: stretch;
}

.course-detail-hero-copy {
    display: grid;
    align-content: center;
    gap: var(--space-3);
}

.course-detail-hero-copy h1 {
    max-width: 13ch;
}

.course-detail-badges {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.course-detail-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.course-detail-image {
    width: 100%;
    min-height: 100%;
    max-height: 22rem;
    object-fit: cover;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--color-sage-soft);
}

.course-detail-meta {
    margin: 0;
}

.course-detail-section {
    display: grid;
    gap: var(--space-3);
    padding: var(--space-4);
}

.course-detail-section h2,
.course-detail-section h3,
.course-detail-section p {
    margin-bottom: 0;
}

.course-registration-panel {
    position: sticky;
    top: 5.25rem;
    scroll-margin-top: 5.5rem;
    display: grid;
    gap: var(--space-4);
    padding: var(--space-4);
}

.course-detail-top {
    grid-template-columns: minmax(0, 1.3fr) minmax(320px, 0.85fr);
}

.course-detail-main {
    display: grid;
    gap: 1.5rem;
}

.course-meta-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.course-meta-item {
    display: grid;
    gap: 0.35rem;
    padding: 1rem;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(216, 204, 190, 0.9);
}

.course-meta-item span,
.registration-summary span {
    color: var(--muted);
    font-size: 0.9rem;
}

.course-meta-item strong,
.registration-summary strong {
    font-size: 1rem;
}

.course-meta-item-wide {
    grid-column: 1 / -1;
}

.course-body {
    display: grid;
    grid-template-columns: minmax(260px, 0.9fr) minmax(0, 1fr);
    gap: 1.25rem;
    align-items: start;
}

.course-body-copy {
    display: grid;
    gap: 1rem;
}

.course-image {
    width: 100%;
    border-radius: 18px;
    border: 1px solid var(--line);
    margin: 0;
}

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

.compact-list-head {
    align-items: end;
    margin-bottom: var(--space-3);
}

.compact-list-head h1,
.compact-list-head h2 {
    margin-bottom: 0;
}

.table-filter-toolbar {
    display: grid;
    grid-template-columns: minmax(14rem, 1fr) minmax(10rem, 0.45fr) auto auto;
    gap: var(--space-3);
    align-items: end;
    margin-bottom: var(--space-4);
}

.table-filter-toolbar button,
.table-filter-toolbar .button-secondary,
.table-filter-toolbar .button-primary {
    min-height: 3rem;
}

.registration-form {
    gap: 1rem;
}

.registration-course-summary,
.registration-form-section {
    display: grid;
    gap: var(--space-3);
}

.registration-course-summary {
    padding: 1rem;
    border: 1px solid rgba(216, 204, 190, 0.9);
    border-radius: 18px;
    background: rgba(232, 238, 228, 0.34);
}

.registration-course-summary > span {
    color: var(--muted);
    font-size: var(--font-size-meta);
}

.registration-form-section {
    padding-top: 0.25rem;
}

.registration-form-section h3 {
    margin-bottom: 0;
    font-size: 1rem;
}

.registration-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.registration-section-head .registration-email-prefill {
    flex: 0 0 auto;
}

.registration-field-grid {
    display: grid;
    gap: 0.85rem;
}

.registration-email-prefill {
    justify-self: start;
    width: auto;
}

.course-registration-card {
    display: grid;
    gap: 1.25rem;
}

.registration-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.registration-summary > div {
    display: grid;
    gap: 0.35rem;
    padding: 1rem;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(216, 204, 190, 0.9);
}

.course-lessons-card {
    margin-top: 1.5rem;
}

.lesson-list,
.addon-overview,
.lesson-choice-list {
    display: grid;
    gap: 0.75rem;
}

.lesson-card,
.addon-overview article {
    display: grid;
    gap: var(--space-2);
    padding: var(--space-4);
    border: 1px solid rgba(216, 204, 190, 0.88);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.72);
}

.lesson-card {
    grid-template-columns: minmax(0, 1fr) minmax(12rem, 0.55fr);
    align-items: start;
}

.lesson-card h3,
.lesson-card p,
.addon-overview p {
    margin-bottom: 0;
}

.addon-overview article span {
    color: var(--accent-dark);
    font-weight: 800;
}

.addon-list {
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 1rem;
}

.addon-list legend {
    padding: 0 var(--space-2);
    color: var(--color-forest);
    font-weight: 800;
}

.reservation-scope {
    background: rgba(232, 238, 228, 0.34);
}

.addon-choice {
    align-items: flex-start;
    padding: 0.85rem;
    border: 1px solid rgba(216, 204, 190, 0.82);
    border-radius: var(--radius-control);
    background: rgba(255, 255, 255, 0.6);
}

.addon-choice > span {
    display: grid;
    gap: 0.25rem;
    font-weight: 600;
}

.addon-choice small,
.addon-choice em,
.addon-state {
    color: var(--muted);
    font-size: var(--font-size-meta);
    font-style: normal;
    font-weight: 600;
}

.addon-choice.is-required {
    border-color: rgba(56, 97, 80, 0.32);
    background: rgba(232, 238, 228, 0.46);
}

.registration-feedback,
.validation-summary {
    display: grid;
    gap: 0.4rem;
    padding: 0.85rem 1rem;
    border: 1px solid rgba(139, 61, 47, 0.22);
    border-radius: var(--radius-control);
    background: rgba(139, 61, 47, 0.08);
}

.validation-summary ul {
    margin: 0;
    padding-left: 1.1rem;
}

.registration-feedback.success {
    border: 1px solid rgba(56, 97, 80, 0.24);
    background: rgba(56, 97, 80, 0.1);
    color: var(--success);
}

.field-validation,
.field-validation-error,
.validation-summary-errors {
    color: var(--error);
    font-size: var(--font-size-meta);
    font-weight: 700;
}

.registration-disabled {
    display: grid;
    gap: var(--space-2);
    padding: var(--space-4);
    border: 1px solid rgba(139, 61, 47, 0.28);
    border-radius: 18px;
    background: rgba(139, 61, 47, 0.1);
    color: var(--error);
}

.registration-disabled p {
    margin-bottom: 0;
}

.addon-note {
    margin: -0.25rem 0 0.75rem 2.25rem;
    color: var(--muted);
}

.price-box {
    border: 1px dashed var(--line);
    border-radius: 18px;
    padding: 1rem 1.25rem;
    background: rgba(255, 255, 255, 0.55);
}

.price-total {
    font-size: 1.35rem;
    font-weight: 700;
}

.form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.form-actions button {
    width: auto;
}

.form-actions form {
    display: inline-flex;
}

.course-server-status-filter {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.course-server-status-filter .is-active {
    border-color: rgba(172, 91, 42, 0.35);
    background: rgba(172, 91, 42, 0.16);
    color: var(--accent-dark);
}

.full-width {
    grid-column: 1 / -1;
}

.table-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
}

.table-actions form {
    display: inline-flex;
    margin: 0;
}

.table {
    width: 100%;
    border-collapse: collapse;
}

.table-wrap {
    max-width: 100%;
    min-width: 0;
    border: 1px solid rgba(216, 204, 190, 0.82);
    border-radius: 18px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    background: rgba(255, 255, 255, 0.56);
}

.table thead,
.admin-table thead {
    background: rgba(232, 238, 228, 0.9);
}

.table th,
.table td {
    text-align: left;
    padding: 0.85rem 0.65rem;
    border-bottom: 1px solid var(--line);
    vertical-align: top;
}

.table th,
.admin-table th {
    color: var(--color-forest);
    font-size: var(--font-size-meta);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.table tbody tr:hover,
.admin-table tbody tr:hover {
    background: rgba(232, 238, 228, 0.36);
}

.badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-left: 0.5rem;
    padding: 0.28rem 0.62rem;
    border-radius: 999px;
    background: rgba(124, 146, 125, 0.17);
    color: var(--color-forest);
    font-size: var(--font-size-meta);
    font-weight: 700;
    line-height: 1.2;
}

.badge-success {
    background: rgba(56, 97, 80, 0.14);
    color: var(--success);
}

.badge-warning {
    background: rgba(224, 163, 101, 0.2);
    color: var(--warning);
}

.badge-danger {
    background: rgba(139, 61, 47, 0.12);
    color: var(--error);
}

.danger-link {
    color: var(--error);
}

.reservation-state {
    margin-left: 0;
}

.reservation-new_pending {
    background: rgba(215, 152, 55, 0.15);
    color: #8d5d00;
}

.reservation-paid {
    background: rgba(45, 128, 87, 0.15);
    color: #196441;
}

.reservation-overdue {
    background: rgba(160, 74, 31, 0.15);
    color: #8a3c12;
}

.reservation-cancelled {
    background: rgba(122, 126, 133, 0.16);
    color: #53565c;
}

.reservation-refund_required {
    background: rgba(153, 44, 82, 0.14);
    color: #84234a;
}

.qr-card {
    display: grid;
    gap: 1rem;
}

.completion-shell {
    display: grid;
    gap: var(--space-6);
}

.completion-hero,
.payment-panel,
.completion-card {
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: rgba(255, 253, 248, 0.92);
    box-shadow: var(--shadow-panel);
}

.completion-hero {
    display: grid;
    gap: var(--space-4);
    padding: clamp(2rem, 4vw, 4rem);
    background:
        linear-gradient(145deg, rgba(232, 238, 228, 0.88), rgba(255, 253, 248, 0.94)),
        var(--panel);
}

.completion-hero h1 {
    max-width: 14ch;
}

.completion-hero .lead {
    max-width: 46rem;
}

.completion-hero-actions,
.payment-panel-head,
.completion-bottom-grid {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
}

.payment-panel {
    display: grid;
    gap: var(--space-5);
    padding: var(--space-5);
}

.payment-panel-head {
    justify-content: space-between;
    align-items: start;
}

.payment-panel-head h2 {
    margin-bottom: 0;
    font-size: clamp(2rem, 4vw, 4rem);
    color: var(--color-forest-dark);
}

.payment-symbol {
    display: grid;
    gap: 0.35rem;
    min-width: min(100%, 15rem);
    padding: 1rem;
    border: 1px solid rgba(56, 97, 80, 0.24);
    border-radius: 18px;
    background: rgba(232, 238, 228, 0.5);
}

.payment-symbol span,
.qr-fallback span {
    color: var(--muted);
    font-size: var(--font-size-meta);
    font-weight: 800;
    text-transform: uppercase;
}

.payment-symbol strong {
    font-size: 1.35rem;
    color: var(--accent-dark);
}

.payment-grid {
    display: grid;
    grid-template-columns: minmax(260px, 0.75fr) minmax(0, 1fr);
    gap: var(--space-5);
    align-items: start;
}

.payment-qr-card,
.payment-details-card {
    display: grid;
    gap: var(--space-4);
    padding: var(--space-4);
    border: 1px solid rgba(216, 204, 190, 0.88);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.68);
}

.payment-qr-card h3,
.payment-details-card h3 {
    margin-bottom: 0;
}

.payment-qr-card p {
    margin-bottom: 0;
    color: var(--muted);
}

.qr-unavailable {
    display: grid;
    min-height: 15rem;
    place-items: center;
    border-radius: 18px;
    background: rgba(31, 37, 33, 0.05);
    color: var(--muted);
    font-size: 2rem;
    font-weight: 900;
}

.payment-detail-list {
    display: grid;
    grid-template-columns: minmax(8rem, max-content) minmax(0, 1fr);
    gap: 0.75rem 1rem;
    margin: 0;
}

.payment-detail-list dt {
    color: var(--muted);
    font-weight: 700;
}

.payment-detail-list dd {
    margin: 0;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.qr-fallback {
    display: grid;
    gap: var(--space-2);
    padding: 1rem;
    border-radius: 18px;
    background: rgba(31, 37, 33, 0.04);
}

.completion-bottom-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(280px, 0.7fr);
}

.completion-card {
    display: grid;
    gap: var(--space-4);
    padding: var(--space-5);
}

.completion-card h2,
.completion-card h3 {
    margin-bottom: 0;
}

.completion-lesson-list,
.next-steps-list {
    display: grid;
    gap: 0.75rem;
    margin: 0;
}

.completion-lesson-list {
    list-style: none;
    padding: 0;
}

.completion-lesson-list li {
    display: grid;
    gap: 0.25rem;
    padding: 0.9rem;
    border: 1px solid rgba(216, 204, 190, 0.82);
    border-radius: var(--radius-control);
    background: rgba(255, 255, 255, 0.62);
}

.completion-lesson-list span {
    color: var(--muted);
}

.public-error-shell {
    min-height: min(64vh, 42rem);
    display: grid;
    place-items: center;
    padding: var(--space-7) 0;
}

.public-error-card {
    width: min(100%, 44rem);
    display: grid;
    gap: var(--space-4);
    padding: clamp(2rem, 5vw, 4rem);
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background:
        linear-gradient(145deg, rgba(232, 238, 228, 0.82), rgba(255, 253, 248, 0.96)),
        var(--panel);
    box-shadow: var(--shadow-panel);
    text-align: center;
}

.public-error-card h1,
.public-error-card p {
    margin-bottom: 0;
}

.public-error-card .eyebrow {
    justify-self: center;
}

.public-error-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-3);
}

.error-reference {
    justify-self: center;
    padding: 0.65rem 0.9rem;
    border-radius: 999px;
    background: rgba(31, 37, 33, 0.05);
    color: var(--muted);
    font-size: var(--font-size-meta);
}

.error-reference span {
    color: var(--ink);
    font-weight: 800;
}

.email-state {
    display: grid;
    gap: 0.25rem;
    padding: 1rem;
    border-radius: 18px;
}

.email-state.success {
    border: 1px solid rgba(56, 97, 80, 0.24);
    background: rgba(56, 97, 80, 0.1);
    color: var(--success);
}

.email-state.info {
    border: 1px solid rgba(124, 146, 125, 0.28);
    background: rgba(232, 238, 228, 0.42);
}

.email-state.warning {
    border: 1px solid rgba(224, 163, 101, 0.34);
    background: rgba(224, 163, 101, 0.14);
    color: var(--warning);
}

.communications-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-3);
    align-items: start;
    margin-bottom: var(--space-3);
}

.communications-hero h1,
.communications-hero p,
.communication-compose-card h2,
.communication-compose-card p,
.communication-history-card h2,
.communication-history-card p {
    margin: 0;
}

.communication-stat {
    display: grid;
    justify-items: end;
    gap: 0.2rem;
    min-width: 9rem;
}

.communication-stat strong {
    color: var(--ink);
    font-size: 2rem;
}

.communication-stat span {
    color: var(--muted);
}

.communications-layout {
    display: grid;
    grid-template-columns: minmax(320px, 0.8fr) minmax(0, 1.2fr);
    gap: var(--space-3);
    align-items: start;
}

.communications-layout-history-first {
    grid-template-columns: minmax(0, 1fr);
}

.communication-compose-card {
    position: relative;
    justify-self: end;
}

.communication-compose-card > summary {
    list-style: none;
    cursor: pointer;
}

.communication-compose-card > summary::-webkit-details-marker {
    display: none;
}

.communication-compose-panel {
    position: absolute;
    z-index: 20;
    right: 0;
    top: calc(100% + 0.75rem);
    display: grid;
    gap: var(--space-3);
    width: min(42rem, calc(100vw - 3rem));
    max-height: min(72vh, 48rem);
    overflow: auto;
    padding: var(--space-4);
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
    background: rgba(255, 253, 248, 0.98);
    box-shadow: var(--shadow-card-hover);
}

.communication-compose-card,
.communication-history-card,
.communication-compose-form {
    display: grid;
    gap: var(--space-3);
}

.table-filter-row input,
.table-filter-row select {
    width: 100%;
    min-width: 7rem;
    padding: 0.45rem 0.55rem;
    border-radius: var(--radius-control);
    font-size: 0.86rem;
}

.table-filter-range {
    display: grid;
    grid-template-columns: repeat(2, minmax(7rem, 1fr));
    gap: 0.35rem;
}

.table-filter-dropdown {
    position: relative;
}

.table-filter-dropdown summary {
    width: 100%;
    min-width: 9rem;
    padding: 0.45rem 0.55rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: rgba(255, 255, 255, 0.78);
    cursor: pointer;
    font-size: 0.86rem;
    font-weight: 700;
}

.table-filter-dropdown summary::-webkit-details-marker {
    display: none;
}

.table-filter-dropdown-panel {
    position: absolute;
    z-index: 20;
    display: grid;
    gap: 0.4rem;
    min-width: 13rem;
    margin-top: 0.35rem;
    padding: 0.45rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--panel);
    box-shadow: var(--shadow);
    letter-spacing: 0;
    text-transform: none;
}

.table-checklist-filter {
    display: grid;
    gap: 0.35rem;
    min-width: 9rem;
    max-height: 8.5rem;
    overflow: auto;
    padding: 0.35rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: rgba(255, 255, 255, 0.62);
    letter-spacing: 0;
    text-transform: none;
}

.table-checklist-filter label {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    min-height: 1.65rem;
    color: var(--ink);
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
}

.table-filter-option-value {
    display: inline-flex;
    align-items: center;
    width: fit-content;
}

.table-checklist-filter input {
    width: auto;
    min-width: 0;
}

.admin-table tr[data-row-href] {
    cursor: pointer;
}

.card[data-row-href] {
    cursor: pointer;
}

.card[data-row-href]:hover {
    transform: translateY(-2px);
}

.card[data-row-href]:focus-visible {
    outline: 3px solid rgba(79, 125, 98, 0.35);
    outline-offset: 3px;
}

.admin-table tr[data-row-href]:hover {
    background: rgba(124, 146, 125, 0.1);
}

.admin-table tr[data-row-href]:focus-visible {
    outline: 3px solid rgba(79, 125, 98, 0.35);
    outline-offset: -3px;
}

.communication-recipient-checklist {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: var(--space-2);
    max-height: 16rem;
    overflow: auto;
    padding: var(--space-2);
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: rgba(255, 255, 255, 0.62);
}

.communication-recipient-checklist label {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: 0.55rem;
    row-gap: 0.1rem;
    align-items: center;
    padding: 0.45rem 0.55rem;
    border: 1px solid rgba(56, 97, 80, 0.12);
    border-radius: var(--radius-control);
    background: rgba(255, 255, 255, 0.68);
}

.communication-recipient-checklist input {
    grid-row: span 2;
}

.communication-recipient-checklist span,
.communication-recipient-checklist small {
    overflow-wrap: anywhere;
}

.communication-recipient-checklist small {
    color: var(--muted);
    font-size: var(--font-size-meta);
}

.communication-validation {
    margin: 0;
}

.communication-history-table td strong,
.communication-history-table td span {
    display: block;
}

.communication-history-table td > span:not(.badge):not(.email-state) {
    margin-top: 0.2rem;
    color: var(--muted);
    font-size: 0.9rem;
}

.communication-status-queued,
.communication-status-pending {
    color: var(--warning);
    background: rgba(154, 104, 29, 0.12);
}

.communication-status-sent,
.communication-status-delivered {
    color: var(--success);
    background: rgba(56, 97, 80, 0.1);
}

.communication-status-failed {
    color: var(--error);
    background: rgba(139, 61, 47, 0.1);
}

.communication-row-failed {
    background: rgba(224, 163, 101, 0.08);
}

.communication-detail-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-3);
    align-items: start;
    margin-bottom: var(--space-3);
}

.communication-detail-hero h1,
.communication-detail-hero p,
.communication-detail-card h2 {
    margin: 0;
}

.communication-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.75fr);
    gap: var(--space-3);
    align-items: start;
    margin-bottom: var(--space-3);
}

.communication-detail-card {
    display: grid;
    gap: var(--space-3);
}

.communication-message-body {
    padding: var(--space-3);
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: rgba(255, 255, 255, 0.68);
}

.qr-visual {
    display: block;
    width: 100%;
    max-width: 18rem;
    height: auto;
    aspect-ratio: 1;
    justify-self: center;
    min-height: 0;
    object-fit: contain;
    padding: 0.75rem;
    border-radius: 20px;
    border: 1px solid var(--line);
    background: #fff;
}

.qr-payload {
    display: block;
    overflow-wrap: anywhere;
    padding: 1rem;
    border-radius: 18px;
    border: 1px solid rgba(216, 204, 190, 0.9);
    background: rgba(31, 37, 33, 0.04);
    font-size: 0.92rem;
    line-height: 1.5;
}

.admin-shell {
    display: grid;
    grid-template-columns: 17.5rem minmax(0, 1fr);
    min-height: 100vh;
    background:
        linear-gradient(135deg, rgba(232, 238, 228, 0.52), rgba(249, 245, 238, 0.78)),
        var(--color-warm);
}

.admin-sidebar {
    position: sticky;
    top: 0;
    align-self: start;
    min-height: 100vh;
    max-height: 100vh;
    overflow-y: auto;
    background: linear-gradient(180deg, #22322b 0%, #17231e 100%);
    color: var(--sidebar-ink);
    padding: 1.25rem;
}

.admin-sidebar-brand {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem;
    align-items: center;
    padding: 0.75rem;
    border-radius: var(--radius-card);
    background: rgba(255, 255, 255, 0.06);
    color: var(--sidebar-ink);
}

.admin-sidebar-brand .brand-mark {
    background: var(--color-clay);
}

.admin-sidebar-brand .brand-text span {
    color: rgba(243, 237, 227, 0.68);
}

.admin-nav {
    display: grid;
    gap: 0.35rem;
    margin-top: 1.25rem;
}

.admin-nav a {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 2.5rem;
    padding: 0.62rem 0.8rem;
    border-radius: var(--radius-control);
    color: rgba(243, 237, 227, 0.9);
    font-weight: 700;
}

.admin-nav a:hover,
.admin-nav a:focus-visible,
.admin-nav a.is-active {
    background: rgba(255, 255, 255, 0.1);
    color: #fffaf0;
}

.admin-nav .nav-item-icon {
    background: rgba(255, 255, 255, 0.14);
    color: #fffaf0;
}

.admin-nav a.is-active {
    box-shadow: inset 4px 0 0 var(--color-clay);
}

.admin-nav-section {
    margin: 0.8rem 0 0.2rem;
    color: rgba(243, 237, 227, 0.5);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
}

.admin-profile-link {
    margin-top: 0.75rem;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.admin-main {
    display: grid;
    grid-template-rows: auto 1fr;
    min-width: 0;
}

.admin-header {
    position: sticky;
    top: 0;
    z-index: 700;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    min-height: 4.75rem;
    padding: 0.75rem 2rem;
    border-bottom: 1px solid rgba(216, 204, 190, 0.8);
    background: rgba(249, 245, 238, 0.92);
    backdrop-filter: blur(16px);
}

.admin-header strong {
    display: block;
    font-size: 1.25rem;
    line-height: 1.2;
}

.admin-menu-toggle + div {
    grid-column: 2;
}

.admin-header-actions {
    grid-column: 3;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
}

.admin-menu-toggle {
    display: none;
    align-items: center;
    gap: 0.65rem;
    min-height: 2.6rem;
    padding: 0.62rem 0.78rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: rgba(255, 255, 255, 0.92);
    color: var(--ink);
    font-weight: 800;
    box-shadow: var(--shadow-control);
}

.admin-sidebar-backdrop {
    display: none;
}

.button-link {
    background: rgba(255, 255, 255, 0.92);
    color: var(--ink);
}

.breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
    color: var(--muted);
    margin-bottom: -0.5rem;
    font-size: var(--font-size-meta);
    font-weight: 700;
}

.breadcrumbs a::after {
    content: "/";
    margin-left: 0.45rem;
    color: rgba(109, 124, 111, 0.55);
}

.breadcrumbs span {
    color: var(--ink);
}

.flash {
    position: fixed;
    top: 1.5rem;
    right: 1.5rem;
    z-index: 1000;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 0.85rem;
    min-width: min(420px, calc(100vw - 2rem));
    max-width: min(520px, calc(100vw - 2rem));
    padding: 1rem 1.25rem;
    border-radius: var(--radius-card);
    border: 1px solid var(--line);
    background: #fff6ef;
    box-shadow: 0 24px 60px rgba(31, 37, 33, 0.16);
    animation: flash-in 0.22s ease;
}

.flash:focus {
    outline: none;
}

.flash span {
    line-height: 1.45;
    font-weight: 700;
}

.flash-success {
    border-color: rgba(56, 97, 80, 0.25);
    background: #eef6f1;
    color: var(--success);
}

.flash-error {
    border-color: rgba(139, 61, 47, 0.25);
    background: #f9eeeb;
    color: var(--error);
}

.flash-info {
    border-color: rgba(83, 103, 89, 0.25);
    background: #f4f0e7;
    color: var(--ink);
}

.flash-warning {
    border-color: rgba(195, 123, 66, 0.28);
    background: #fff3df;
    color: #8a4b16;
}

.flash.is-hiding {
    animation: flash-out 0.25s ease forwards;
}

.flash-close {
    width: auto;
    min-width: 2.25rem;
    padding: 0.4rem 0.65rem;
    border-radius: 999px;
    box-shadow: none;
    background: rgba(31, 37, 33, 0.08);
    color: inherit;
}

.flash-close:hover,
.flash-close:focus-visible {
    background: rgba(31, 37, 33, 0.14);
    box-shadow: none;
    transform: none;
}

.has-confirmation-dialog {
    overflow: hidden;
}

.confirmation-dialog[hidden] {
    display: none;
}

.confirmation-dialog {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: grid;
    place-items: center;
    padding: var(--space-4);
}

.confirmation-dialog__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(31, 37, 33, 0.48);
}

.confirmation-dialog__panel {
    position: relative;
    z-index: 1;
    display: grid;
    gap: var(--space-3);
    width: min(34rem, 100%);
    padding: clamp(1.25rem, 3vw, 2rem);
    border: 1px solid rgba(139, 61, 47, 0.24);
    border-radius: var(--radius-card);
    background: var(--panel);
    box-shadow: 0 32px 80px rgba(31, 37, 33, 0.24);
}

.confirmation-dialog__panel:focus {
    outline: 3px solid rgba(139, 61, 47, 0.24);
    outline-offset: 4px;
}

.confirmation-dialog__panel h2,
.confirmation-dialog__panel p {
    margin: 0;
}

.confirmation-dialog__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--space-2);
}

.has-admin-action-modal {
    overflow: hidden;
}

.admin-action-modal[hidden] {
    display: none;
}

.admin-action-modal {
    position: fixed;
    inset: 0;
    z-index: 1250;
    display: grid;
    place-items: center;
    padding: clamp(0.75rem, 2vw, 1.5rem);
}

.admin-action-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(31, 37, 33, 0.52);
    backdrop-filter: blur(4px);
}

.admin-action-modal__dialog {
    position: relative;
    z-index: 1;
    width: min(58rem, 100%);
    max-height: min(92vh, 56rem);
    overflow: auto;
    padding: clamp(1rem, 2.2vw, 1.75rem);
    border: 1px solid rgba(139, 61, 47, 0.24);
    border-radius: var(--radius-card);
    background: var(--panel);
    box-shadow: 0 32px 80px rgba(31, 37, 33, 0.28);
}

.admin-action-modal__dialog:focus {
    outline: 3px solid rgba(139, 61, 47, 0.24);
    outline-offset: 4px;
}

.admin-action-modal__close {
    position: sticky;
    top: 0;
    left: 100%;
    z-index: 2;
    width: 2.5rem;
    min-width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    border-radius: 999px;
    background: var(--panel-muted);
    color: var(--ink);
    box-shadow: none;
}

.admin-action-modal__close:hover,
.admin-action-modal__close:focus-visible {
    background: rgba(139, 61, 47, 0.14);
    box-shadow: none;
    transform: none;
}

.admin-action-modal__body {
    display: grid;
    gap: var(--space-4);
}

.admin-action-modal__body > .card {
    margin: 0;
    box-shadow: none;
}

.admin-action-modal__body .user-edit-hero,
.admin-action-modal__body .user-skills-hero {
    padding-right: 3rem;
}

.admin-action-modal__loading {
    padding: var(--space-6);
    text-align: center;
    color: var(--muted);
}

.auth-shell {
    display: grid;
    place-items: center;
    min-height: calc(100vh - 120px);
    padding: clamp(2rem, 5vw, 4rem) 1rem;
    background:
        radial-gradient(circle at top left, rgba(203, 176, 123, 0.24), transparent 34rem),
        linear-gradient(145deg, rgba(243, 238, 226, 0.72), rgba(232, 238, 228, 0.42));
}

.admin-auth-shell {
    min-height: min(42rem, calc(100vh - 120px));
}

.auth-card {
    width: min(100%, 520px);
    display: grid;
    gap: var(--space-3);
    padding: clamp(1.35rem, 4vw, 2rem);
}

.auth-card h1,
.auth-card p {
    margin: 0;
}

.auth-card--notice {
    text-align: left;
}

.auth-eyebrow {
    color: var(--accent-dark);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.auth-copy {
    color: var(--muted);
    line-height: 1.65;
}

.auth-form {
    display: grid;
    gap: var(--space-3);
}

.auth-form label {
    margin: 0;
}

.auth-form .button-primary,
.auth-secondary-actions .button-primary,
.auth-secondary-actions .button-secondary,
.auth-secondary-actions .button-link {
    width: 100%;
}

.auth-checkbox {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    color: var(--ink);
    font-weight: 600;
}

.auth-checkbox input {
    width: 1.1rem;
    min-height: 1.1rem;
}

.auth-secondary-actions {
    display: grid;
    gap: 0.75rem;
}

.auth-dev-link {
    display: grid;
    gap: 0.5rem;
    padding: 1rem;
    border: 1px solid rgba(109, 124, 111, 0.22);
    border-radius: var(--radius-card);
    background: rgba(232, 238, 228, 0.45);
    overflow-wrap: anywhere;
}

.auth-dev-link span {
    color: var(--accent-dark);
    font-weight: 800;
}

.auth-dev-link a {
    color: var(--ink);
    text-decoration: underline;
    text-underline-offset: 0.18rem;
}

.stat-card strong {
    display: block;
    font-size: 2rem;
    margin: 0.35rem 0 0.5rem;
}

.stat-card-link {
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.stat-card-link:hover {
    transform: translateY(-3px);
    border-color: rgba(162, 84, 42, 0.35);
    box-shadow: 0 28px 60px rgba(48, 37, 28, 0.14);
}

.dashboard-hero {
    display: flex;
    justify-content: space-between;
    gap: var(--space-4);
    align-items: end;
    margin-bottom: var(--space-4);
}

.dashboard-hero h1,
.dashboard-hero p {
    margin: 0;
}

.dashboard-hero h1 {
    margin-top: 0.25rem;
}

.dashboard-hero-actions,
.dashboard-actions {
    display: grid;
    gap: 0.75rem;
}

.dashboard-metrics {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
    gap: var(--space-2);
    margin-bottom: var(--space-3);
}

.dashboard-metric {
    min-height: 7.5rem;
    padding: 0.9rem;
}

.dashboard-metric .eyebrow {
    margin-bottom: 0.2rem;
}

.dashboard-metric strong {
    font-size: 1.45rem;
    margin: 0.15rem 0 0.2rem;
}

.dashboard-metric p:last-child {
    margin-bottom: 0;
    font-size: 0.9rem;
    line-height: 1.35;
}

.dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(18rem, 0.8fr);
    gap: var(--space-4);
    align-items: start;
    margin-bottom: var(--space-4);
}

.dashboard-panel {
    display: grid;
    gap: var(--space-3);
}

.dashboard-panel--wide {
    min-width: 0;
}

.dashboard-stack {
    display: grid;
    gap: var(--space-4);
}

.dashboard-table td strong,
.dashboard-table td span {
    display: block;
}

.dashboard-table td span:not(.badge) {
    color: var(--muted);
    font-size: 0.9rem;
    margin-top: 0.2rem;
}

.dashboard-table .badge {
    margin-left: 0;
}

.dashboard-attention-list {
    display: grid;
    gap: 0.75rem;
}

.dashboard-attention {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.25rem 0.75rem;
    padding: 0.95rem;
    border-radius: var(--radius-card);
    border: 1px solid rgba(109, 124, 111, 0.2);
    background: rgba(232, 238, 228, 0.5);
    color: var(--ink);
}

.dashboard-attention:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-control-hover);
}

.dashboard-attention span {
    font-weight: 800;
}

.dashboard-attention strong {
    font-size: 1.45rem;
    line-height: 1;
}

.dashboard-attention small {
    grid-column: 1 / -1;
    color: var(--muted);
    line-height: 1.45;
}

.dashboard-attention-warning {
    border-color: rgba(195, 123, 66, 0.32);
    background: #fff3df;
}

.dashboard-attention-danger {
    border-color: rgba(139, 61, 47, 0.25);
    background: rgba(139, 61, 47, 0.08);
}

.dashboard-actions a {
    display: grid;
    gap: 0.25rem;
    padding: 0.9rem 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
    background: rgba(255, 255, 255, 0.7);
    color: var(--ink);
}

.dashboard-actions a:hover {
    border-color: rgba(162, 84, 42, 0.28);
    transform: translateY(-1px);
    box-shadow: var(--shadow-control-hover);
}

.dashboard-actions span {
    color: var(--muted);
    font-size: 0.9rem;
}

.category-hero,
.category-filter-card,
.category-panel,
.category-edit-card,
.category-delete-card {
    display: grid;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.category-hero {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
}

.category-hero h1,
.category-hero p,
.category-edit-card h1,
.category-edit-card p,
.delete-confirmation-head h1,
.delete-confirmation-head p {
    margin: 0;
}

.category-filter-grid {
    align-items: end;
}

.category-filter-grid label {
    margin: 0;
}

.category-filter-actions button {
    width: 100%;
}

.category-table td strong {
    display: block;
}

.category-table-toolbar {
    grid-template-columns: minmax(14rem, 1fr) auto;
    margin-bottom: var(--space-3);
}

.category-color-swatch {
    display: inline-block;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.55rem;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 999px;
    vertical-align: middle;
    box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.62);
}

.category-form {
    display: grid;
    gap: var(--space-3);
    max-width: 42rem;
}

.category-delete-card {
    max-width: 48rem;
}

.category-delete-summary {
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
    background: rgba(255, 255, 255, 0.62);
}

.delete-warning {
    display: grid;
    gap: 0.35rem;
    padding: 1rem;
    border: 1px solid rgba(139, 61, 47, 0.25);
    border-radius: var(--radius-card);
    background: rgba(139, 61, 47, 0.08);
    color: var(--ink);
}

.delete-warning-ready {
    border-color: rgba(56, 97, 80, 0.2);
    background: rgba(56, 97, 80, 0.08);
}

.delete-warning p {
    margin: 0;
    color: var(--muted);
}

.course-groups-hero,
.course-groups-panel {
    display: grid;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.course-groups-hero {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
}

.course-groups-hero h1,
.course-groups-hero p,
.course-groups-panel h2,
.course-groups-panel p {
    margin: 0;
}

.course-groups-table td strong {
    display: block;
    margin-bottom: 0.2rem;
}

.course-groups-table .course-group-row {
    background: linear-gradient(90deg, rgba(232, 238, 228, 0.5), rgba(255, 255, 255, 0));
}

.course-groups-table .table-actions {
    min-width: 8.5rem;
}

.course-cancel-card {
    display: grid;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.course-cancel-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-3);
    align-items: start;
}

.course-cancel-head h1,
.course-cancel-head p,
.course-cancel-card h2,
.course-cancel-card p {
    margin: 0;
}

.course-cancel-summary,
.course-cancel-impact {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-3);
}

.course-cancel-impact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.course-cancel-summary > div,
.course-cancel-impact > div {
    display: grid;
    gap: 0.35rem;
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
    background: rgba(255, 255, 255, 0.62);
}

.course-cancel-summary span,
.course-cancel-impact span {
    color: var(--muted);
    font-size: 0.9rem;
}

.course-cancel-impact strong {
    font-size: 1.9rem;
    color: var(--error);
}

.course-cancel-form {
    display: grid;
    gap: var(--space-3);
}

.company-info-card {
    display: grid;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.company-info-card-compact .section-head {
    align-items: end;
}

.company-info-card-compact .section-head h2,
.company-info-card-compact .section-head p {
    margin: 0;
}

.company-info-form {
    display: grid;
    gap: var(--space-3);
}

.company-info-section {
    display: grid;
    gap: var(--space-2);
    padding: 0.85rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
    background: rgba(255, 255, 255, 0.62);
}

.company-info-section legend {
    padding: 0 0.35rem;
    color: var(--ink);
    font-weight: 700;
}

.company-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-2);
}

.admin-course-detail-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(12rem, 18rem) auto;
    gap: var(--space-3);
    align-items: start;
    margin-bottom: var(--space-3);
    padding: var(--space-4);
}

.admin-course-detail-hero h1,
.admin-course-detail-hero p {
    margin: 0;
}

.admin-course-detail-hero h1 {
    font-size: clamp(1.45rem, 1.1rem + 1vw, 2.1rem);
}

.admin-course-detail-hero > div:first-child {
    display: grid;
    gap: var(--space-2);
}

.admin-course-detail-cover {
    overflow: hidden;
    align-self: stretch;
    min-height: 9rem;
    border-radius: var(--radius-control);
    background: var(--color-beige-soft);
    box-shadow: inset 0 0 0 1px rgba(90, 61, 42, 0.12);
}

.admin-course-detail-cover img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 9rem;
    object-fit: cover;
}

.admin-course-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.75rem;
}

.admin-course-actions form {
    margin: 0;
}

.admin-course-section-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: var(--space-3);
}

.admin-course-section-nav a {
    display: inline-flex;
    align-items: center;
    min-height: 2.35rem;
    padding: 0.55rem 0.9rem;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    color: var(--ink);
    font-weight: 700;
    text-decoration: none;
}

.admin-course-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.admin-course-summary-grid .card {
    display: grid;
    gap: 0.35rem;
}

.admin-course-summary-grid span {
    color: var(--muted);
    font-size: 0.9rem;
}

.admin-course-summary-grid strong {
    color: var(--ink);
    font-size: 1.15rem;
}

.admin-course-overview,
.admin-course-section {
    display: grid;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.admin-course-overview h2,
.admin-course-section h2 {
    margin: 0;
}

.admin-course-overview p,
.admin-course-section p {
    margin: 0;
}

.admin-course-two-column {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
    gap: var(--space-3);
    align-items: start;
    margin-bottom: var(--space-3);
}

.admin-course-two-column .admin-course-section {
    margin-bottom: 0;
}

.admin-course-overview-layout {
    grid-template-columns: minmax(0, 0.95fr) minmax(360px, 1.05fr);
}

.admin-course-documents-section {
    width: 100%;
}

.document-hover-preview {
    position: fixed;
    z-index: 80;
    display: grid;
    gap: 0.5rem;
    width: min(22rem, calc(100vw - 2rem));
    min-height: 8rem;
    padding: 0.7rem;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-card);
    background: var(--panel);
    box-shadow: var(--shadow-panel);
    pointer-events: none;
}

.document-hover-preview[hidden] {
    display: none;
}

.document-hover-preview iframe {
    width: 100%;
    height: 15rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: #fff;
}

.table-filter-row th {
    padding-top: 0.5rem;
}

.table-filter-inline {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: var(--font-size-meta);
    font-weight: 700;
}

.table-filter-inline input,
.table-filter-inline select {
    width: min(100%, 24rem);
}

.admin-course-section .table-actions form {
    display: grid;
    gap: 0.35rem;
    margin: 0.5rem 0 0;
}

.admin-course-table-filter {
    max-width: 24rem;
}

.admin-course-table-filter label {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: var(--font-size-meta);
    font-weight: 700;
}

.admin-course-addon-editor {
    align-content: start;
}

.admin-course-addon-editor summary {
    width: max-content;
    cursor: pointer;
    list-style: none;
}

.admin-course-addon-editor summary::-webkit-details-marker {
    display: none;
}

.admin-course-addon-editor form {
    margin-top: var(--space-3);
}

.admin-course-section .admin-table td strong,
.admin-course-section .admin-table td span {
    display: block;
}

.admin-course-edit-shell {
    display: grid;
    gap: var(--space-5);
    width: min(920px, 100%);
    margin: 0 auto;
    padding: clamp(1.5rem, 3vw, 2.25rem);
}

.admin-course-edit-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-4);
    align-items: start;
}

.admin-course-edit-head h1,
.admin-course-edit-head h2,
.admin-course-edit-head p {
    margin: 0;
}

.admin-course-edit-head > div:first-child {
    display: grid;
    gap: var(--space-2);
}

.admin-course-edit-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.85rem;
    height: 2.85rem;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--ink);
    box-shadow: none;
    font-size: 2.35rem;
    font-weight: 350;
    line-height: 1;
    text-decoration: none;
}

.admin-course-edit-close:hover,
.admin-course-edit-close:focus-visible {
    background: rgba(162, 84, 42, 0.08);
    box-shadow: var(--focus-ring);
}

.admin-course-edit-form {
    display: grid;
    gap: var(--space-4);
}

.has-course-edit-modal {
    overflow: hidden;
}

.admin-course-edit-modal {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: grid;
    place-items: center;
    padding: clamp(1rem, 3vh, 1.75rem) clamp(0.75rem, 2vw, 1.5rem);
    overflow: hidden;
}

.admin-course-edit-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(35, 31, 24, 0.42);
    backdrop-filter: blur(4px);
}

.admin-course-edit-modal-dialog {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    width: min(920px, 100%);
    max-width: calc(100vw - clamp(1.5rem, 4vw, 3rem));
    max-height: calc(100vh - clamp(2rem, 6vh, 3.5rem));
    overflow: hidden;
    outline: none;
    padding: clamp(1.5rem, 3vw, 2.25rem);
}

.admin-course-edit-modal-dialog .admin-course-edit-head {
    margin-bottom: var(--space-4);
}

.admin-course-edit-form-modal {
    min-height: 0;
    overflow: hidden;
}

.admin-course-edit-form-modal .admin-course-edit-grid {
    box-sizing: border-box;
    max-width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 0;
}

.admin-course-edit-form-modal .admin-course-edit-submit {
    position: sticky;
    bottom: 0;
    margin: var(--space-4) 0 0;
    padding-top: var(--space-3);
    border-top: 1px solid var(--line);
    background: var(--panel);
}

.admin-course-edit-validation {
    margin: 0;
}

.admin-course-edit-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-4);
    align-items: start;
}

.admin-course-edit-section {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-3);
    margin: 0;
    min-width: 0;
    padding: 0 0 var(--space-4);
    border: 0;
    border-bottom: 1px solid var(--line);
}

.admin-course-edit-section:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.admin-course-edit-section legend {
    grid-column: 1 / -1;
    padding: 0 0 0.15rem;
    color: var(--ink);
    font-size: 1.05rem;
    font-weight: 800;
}

.admin-course-cover-field {
    display: grid;
    gap: 0.55rem;
}

.admin-course-cover-field img {
    width: min(100%, 22rem);
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
    background: rgba(232, 238, 228, 0.55);
}

.admin-course-cover-field span {
    color: var(--muted);
    font-size: 0.9rem;
}

.admin-course-edit-check {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    min-height: 3.25rem;
    padding: 0.75rem 0;
}

.admin-course-address-suggestions {
    display: grid;
    gap: 0.65rem;
}

.admin-course-address-suggestions > span {
    color: var(--muted);
    font-size: 0.9rem;
    font-weight: 700;
}

.admin-course-address-suggestions > div {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.admin-course-address-suggestions button {
    width: auto;
    min-height: 2.25rem;
    padding: 0.45rem 0.75rem;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    color: var(--ink);
    font-weight: 700;
}

.pac-container {
    z-index: 10000 !important;
}

.admin-course-edit-submit {
    display: grid;
    gap: var(--space-3);
    padding-top: var(--space-2);
}

.admin-course-edit-submit > div:first-child {
    display: grid;
    gap: 0.25rem;
}

.admin-course-edit-submit span {
    color: var(--muted);
}

.admin-course-edit-submit .form-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-2);
    align-items: center;
}

.admin-course-edit-submit .button-primary {
    width: 100%;
    min-height: 3.5rem;
}

.admin-courses-filter-card,
.admin-courses-list-card {
    display: grid;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.admin-courses-hero {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    margin-bottom: var(--space-3);
}

.admin-courses-hero h1,
.admin-courses-hero p,
.admin-courses-list-card h2,
.admin-courses-list-card p {
    margin: 0;
}

.admin-courses-filter {
    grid-template-columns: minmax(13rem, 1.3fr) minmax(10rem, 1fr) minmax(8rem, 0.7fr) minmax(8rem, 0.7fr) minmax(9rem, 0.8fr) auto;
    align-items: end;
}

.admin-courses-filter .form-actions {
    align-items: end;
    flex-wrap: wrap;
}

.admin-courses-filter .button-success {
    min-height: 3rem;
}

.admin-courses-table td strong,
.admin-courses-table td span {
    display: block;
}

.admin-courses-table td > span:not(.badge) {
    margin-top: 0.2rem;
    color: var(--muted);
    font-size: 0.9rem;
}

.course-group-badge {
    margin-top: 0.45rem;
    color: var(--success);
    background: rgba(56, 97, 80, 0.1);
}

.course-single-badge {
    margin-top: 0.45rem;
    color: var(--muted);
    background: rgba(31, 37, 33, 0.06);
}

.course-status-active {
    color: var(--success);
    background: rgba(56, 97, 80, 0.1);
}

.course-status-ended {
    color: var(--ink-muted);
    background: rgba(62, 92, 118, 0.12);
}

.course-status-cancelled {
    color: var(--error);
    background: rgba(139, 61, 47, 0.1);
}

.registrations-hero {
    display: grid;
    gap: var(--space-2);
    margin-bottom: var(--space-3);
}

.registrations-hero h1,
.registrations-hero p {
    margin: 0;
}

.registrations-list-card {
    display: grid;
    gap: var(--space-3);
}

.registrations-table td strong,
.registrations-table td span {
    display: block;
}

.registrations-table td > span:not(.badge) {
    margin-top: 0.2rem;
    color: var(--muted);
    font-size: 0.9rem;
}

.reservation-payment-paid {
    color: var(--success);
    background: rgba(56, 97, 80, 0.1);
}

.reservation-payment-open,
.reservation-new {
    color: var(--warning);
    background: rgba(154, 104, 29, 0.12);
}

.reservation-detail-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-3);
    align-items: start;
    margin-bottom: var(--space-3);
}

.reservation-detail-hero h1,
.reservation-detail-hero p,
.reservation-detail-panel h2,
.reservation-actions-card h2,
.reservation-actions-card h3,
.reservation-actions-card p,
.reservation-invoice-card h2,
.reservation-log-card h2 {
    margin: 0;
}

.reservation-detail-status {
    display: grid;
    justify-items: end;
    gap: 0.35rem;
    min-width: 14rem;
}

.reservation-detail-status strong {
    color: var(--ink);
    font-size: 1.55rem;
}

.reservation-detail-status span:last-child {
    color: var(--muted);
}

.reservation-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.reservation-detail-panel,
.reservation-invoice-card,
.reservation-log-card,
.reservation-actions-card {
    display: grid;
    gap: var(--space-3);
}

.reservation-payment-panel {
    grid-column: 1 / -1;
}

.invoices-hero,
.invoice-detail-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: var(--space-4);
}

.invoices-hero h1,
.invoices-hero p,
.invoice-detail-hero h1,
.invoice-detail-hero p,
.invoice-actions-card h2,
.invoice-actions-card p {
    margin: 0;
}

.invoice-summary,
.invoice-total-panel {
    display: grid;
    gap: 0.2rem;
    min-width: 13rem;
    padding: 1rem;
    border: 1px solid rgba(56, 97, 80, 0.18);
    border-radius: var(--radius-card);
    background: rgba(232, 238, 228, 0.48);
    text-align: right;
}

.invoice-summary span,
.invoice-total-panel span,
.invoice-summary small,
.invoice-total-panel small {
    color: var(--muted);
    font-size: var(--font-size-meta);
    font-weight: 700;
}

.invoice-summary strong,
.invoice-total-panel strong {
    color: var(--color-forest);
    font-size: 1.55rem;
}

.invoice-list-card,
.invoice-payment-card,
.invoice-meta-card,
.invoice-context-card,
.invoice-file-card,
.invoice-items-card {
    display: grid;
    gap: var(--space-3);
}

.invoice-table-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
}

.invoice-table-filters label {
    min-width: min(100%, 13rem);
}

.invoice-payment-card {
    margin-bottom: var(--space-3);
}

.invoice-payment-action {
    display: flex;
    justify-content: flex-start;
}

.invoice-qr-panel {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: var(--space-3);
    max-width: 100%;
    padding: 1rem;
    border: 1px solid rgba(56, 97, 80, 0.18);
    border-radius: var(--radius-card);
    background: rgba(255, 248, 236, 0.66);
}

.invoice-qr-image {
    width: 8.5rem;
    height: 8.5rem;
    border: 1px solid rgba(56, 97, 80, 0.16);
    border-radius: var(--radius-control);
    background: #fff;
}

.invoice-qr-copy {
    display: grid;
    gap: 0.35rem;
    min-width: 0;
}

.invoice-qr-copy span,
.invoice-qr-copy code {
    color: var(--muted);
    overflow-wrap: anywhere;
}

.invoice-table td,
.invoice-items-table td {
    vertical-align: top;
}

.numeric {
    text-align: right;
    white-space: nowrap;
}

.invoice-status {
    border-color: rgba(83, 103, 89, 0.16);
    background: rgba(232, 238, 228, 0.46);
    color: var(--color-forest);
}

.invoice-status-overdue,
.invoice-status-cancelled,
.invoice-status-refundrequired,
.invoice-status-refundedcancelled {
    border-color: rgba(139, 61, 47, 0.22);
    background: rgba(139, 61, 47, 0.1);
    color: var(--error);
}

.invoice-status-paid {
    border-color: rgba(56, 97, 80, 0.24);
    background: rgba(56, 97, 80, 0.12);
    color: var(--success);
}

.invoice-detail-badges,
.invoice-file-state {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.invoice-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(20rem, 0.8fr);
    gap: var(--space-4);
    margin-bottom: var(--space-3);
}

.invoice-file-state {
    flex-direction: column;
    padding: 1rem;
    border: 1px solid rgba(56, 97, 80, 0.2);
    border-radius: var(--radius-card);
    background: rgba(232, 238, 228, 0.42);
}

.invoice-file-state span {
    color: var(--muted);
    overflow-wrap: anywhere;
}

.invoice-actions-card .button-secondary {
    width: fit-content;
}

.students-hero,
.student-detail-hero,
.student-edit-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: end;
    gap: var(--space-4);
}

.students-hero h1,
.students-hero p,
.student-detail-hero h1,
.student-detail-hero p,
.student-edit-hero h1,
.student-edit-hero p,
.student-list-card h2,
.student-list-card p,
.student-email-card h2,
.student-email-card p,
.student-contact-card h2,
.student-contact-card p,
.student-history-filter-card h2,
.student-history-card h2,
.student-history-card p,
.student-email-history-card h2,
.student-email-history-card p,
.student-email-compose-card h2,
.student-email-compose-card p {
    margin: 0;
}

.student-summary {
    display: grid;
    gap: 0.2rem;
    min-width: 10rem;
    padding: 1rem;
    border: 1px solid rgba(56, 97, 80, 0.18);
    border-radius: var(--radius-card);
    background: rgba(232, 238, 228, 0.48);
    text-align: right;
}

.student-summary span,
.student-summary small {
    color: var(--muted);
    font-size: var(--font-size-meta);
    font-weight: 700;
}

.student-summary strong {
    color: var(--color-forest);
    font-size: 1.55rem;
}

.students-list-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: end;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.student-hero-actions,
.student-detail-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--space-2);
}

.student-filter-card,
.student-list-card,
.student-email-card,
.student-contact-card,
.student-history-filter-card,
.student-history-card,
.student-email-history-card,
.student-email-compose-card,
.student-edit-card {
    display: grid;
    gap: var(--space-3);
}

.student-filter {
    grid-template-columns: minmax(16rem, 1fr) minmax(12rem, 16rem) auto;
    align-items: end;
}

.student-list-toolbar {
    align-items: end;
    gap: var(--space-3);
}

.student-status-filter {
    display: flex;
    align-items: end;
    gap: var(--space-2);
}

.student-status-filter label {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: var(--font-size-meta);
    font-weight: 700;
}

.student-bulk-compose-card {
    margin-left: auto;
}

.student-bulk-compose-panel {
    width: min(46rem, calc(100vw - 3rem));
}

.student-recipient-checklist {
    max-height: 18rem;
}

.student-bulk-email-form .student-attachment-field,
.student-bulk-email-form .student-rich-text-field {
    display: grid;
    gap: 0.45rem;
}

.student-attachment-input {
    min-height: 3.4rem;
    padding: 0.85rem;
    border: 1px dashed rgba(56, 97, 80, 0.38);
    background: rgba(255, 255, 255, 0.72);
}

.rich-text-editor {
    min-width: 0;
}

.rich-text-editor .ql-toolbar,
.rich-text-editor .ql-container {
    border-color: var(--line);
    background: rgba(255, 255, 255, 0.82);
    font-family: inherit;
}

.rich-text-editor .ql-toolbar {
    border-radius: var(--radius-control) var(--radius-control) 0 0;
}

.rich-text-editor .ql-container {
    min-height: 11rem;
    border-radius: 0 0 var(--radius-control) var(--radius-control);
    font-size: 1rem;
}

.rich-text-editor .ql-editor {
    min-height: 11rem;
    max-height: 18rem;
    overflow-y: auto;
    line-height: 1.55;
}

.rich-text-source {
    min-height: 11rem;
}

.rich-text-source-bound {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.user-course-presets {
    justify-content: flex-end;
}

.user-course-presets button {
    border: 1px solid var(--line);
    border-radius: var(--radius-pill);
    padding: 0.45rem 0.8rem;
    background: rgba(255, 255, 255, 0.7);
    color: var(--color-forest);
    font-weight: 800;
    cursor: pointer;
}

.user-course-presets button.active,
.user-course-presets button:hover,
.user-course-presets button:focus-visible {
    border-color: rgba(56, 97, 80, 0.42);
    background: rgba(232, 238, 228, 0.78);
}

.user-course-presets span {
    margin-left: 0.25rem;
    color: var(--muted);
    font-size: var(--font-size-meta);
}

.user-courses-table td {
    vertical-align: top;
}

.user-courses-table td strong,
.user-courses-table td span:not(.badge) {
    display: block;
}

.user-courses-table td span:not(.badge) {
    margin-top: 0.2rem;
    color: var(--muted);
    font-size: 0.9rem;
}

.user-course-status-upcoming {
    border-color: rgba(56, 97, 80, 0.24);
    background: rgba(232, 238, 228, 0.74);
    color: var(--color-forest);
}

.user-course-status-closed {
    border-color: rgba(83, 103, 89, 0.18);
    background: rgba(245, 240, 229, 0.8);
    color: var(--muted);
}

.user-course-status-cancelled {
    border-color: rgba(195, 123, 66, 0.28);
    background: rgba(246, 226, 204, 0.72);
    color: var(--danger);
}

.user-profile-calendar-card {
    margin-top: var(--space-3);
}

.students-table td,
.student-reservations-table td {
    vertical-align: top;
}

.students-table td strong,
.students-table td span:not(.badge),
.student-reservations-table td strong,
.student-reservations-table td span:not(.badge) {
    display: block;
}

.students-table td span:not(.badge),
.student-reservations-table td span:not(.badge),
.student-email-history span {
    color: var(--muted);
    font-size: 0.9rem;
    margin-top: 0.2rem;
}

.student-status,
.student-payment {
    border-color: rgba(83, 103, 89, 0.16);
    background: rgba(232, 238, 228, 0.46);
    color: var(--color-forest);
}

.student-status-inactive,
.student-payment-unpaid {
    border-color: rgba(195, 123, 66, 0.26);
    background: rgba(195, 123, 66, 0.12);
    color: #8a4d22;
}

.student-status-active,
.student-payment-paid {
    border-color: rgba(56, 97, 80, 0.24);
    background: rgba(56, 97, 80, 0.12);
    color: var(--success);
}

.student-detail-grid,
.student-communication-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(20rem, 0.8fr);
    gap: var(--space-4);
    margin-bottom: var(--space-3);
}

.student-detail-grid-contact-only {
    grid-template-columns: minmax(0, 1fr);
}

.student-communication-chat-grid {
    grid-template-columns: minmax(0, 1.35fr) minmax(20rem, 0.65fr);
}

.student-chat-card {
    align-content: start;
}

.student-chat-thread {
    display: grid;
    gap: var(--space-3);
}

.student-chat-message {
    display: grid;
    gap: var(--space-2);
    padding: var(--space-3);
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
    background: rgba(255, 255, 255, 0.7);
}

.student-chat-message-incoming {
    border-color: rgba(195, 123, 66, 0.28);
    background: rgba(246, 226, 204, 0.34);
}

.student-chat-message-outgoing {
    border-color: rgba(56, 97, 80, 0.2);
    background: rgba(232, 238, 228, 0.38);
}

.student-chat-message header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: var(--space-2);
}

.student-chat-message header > div,
.student-chat-meta,
.student-chat-body,
.student-chat-attachments {
    min-width: 0;
}

.student-chat-message header strong {
    display: block;
    margin-top: 0.25rem;
    overflow-wrap: anywhere;
}

.student-chat-message time,
.student-chat-meta {
    color: var(--muted);
    font-size: var(--font-size-meta);
    font-weight: 700;
}

.student-chat-meta {
    display: grid;
    grid-template-columns: repeat(3, auto minmax(0, 1fr));
    gap: 0.25rem 0.65rem;
}

.student-chat-meta dt {
    color: var(--ink);
}

.student-chat-meta dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.student-chat-body {
    overflow-wrap: anywhere;
    line-height: 1.55;
}

.student-chat-body p {
    margin: 0 0 0.55rem;
}

.student-chat-body p:last-child {
    margin-bottom: 0;
}

.student-chat-attachments {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.student-chat-attachments a {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.45rem 0.65rem;
    border: 1px solid rgba(56, 97, 80, 0.2);
    border-radius: var(--radius-control);
    background: rgba(255, 255, 255, 0.72);
    color: var(--color-forest);
    font-weight: 800;
    text-decoration: none;
}

.student-chat-attachments span {
    color: var(--muted);
    font-size: var(--font-size-meta);
}

.student-history-card {
    margin-bottom: var(--space-3);
}

.student-edit-form {
    display: grid;
    gap: var(--space-3);
    max-width: 58rem;
}

.student-form-section {
    display: grid;
    gap: var(--space-3);
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
    background: rgba(255, 255, 255, 0.62);
}

.student-form-section legend {
    padding: 0 0.35rem;
    color: var(--ink);
    font-weight: 800;
}

.student-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-3);
}

.student-check {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    min-height: 3rem;
    margin-top: 1.5rem;
    font-weight: 800;
}

.student-check input {
    width: auto;
}

.users-hero,
.user-profile-hero,
.user-edit-hero,
.user-skills-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: end;
    gap: var(--space-4);
}

.users-hero h1,
.users-hero p,
.user-profile-hero h1,
.user-profile-hero p,
.user-edit-hero h1,
.user-edit-hero p,
.user-skills-hero h1,
.user-skills-hero p,
.user-list-card h2,
.user-list-card p,
.user-profile-card h2,
.user-profile-card p,
.user-actions-card h2,
.user-skills-card h2,
.user-skills-card p,
.user-finance-card h2,
.user-courses-card h2,
.user-courses-card p,
.user-lessons-card h2,
.user-lessons-card p,
.user-skill-assign-card h2,
.user-skill-assign-card p,
.user-skills-table-card h2,
.user-skills-table-card p {
    margin: 0;
}

.user-summary {
    display: grid;
    gap: 0.2rem;
    min-width: 11rem;
    padding: 1rem;
    border: 1px solid rgba(56, 97, 80, 0.18);
    border-radius: var(--radius-card);
    background: rgba(232, 238, 228, 0.48);
    text-align: right;
}

.user-summary span,
.user-summary small {
    color: var(--muted);
    font-size: var(--font-size-meta);
    font-weight: 700;
}

.user-summary strong {
    color: var(--color-forest);
    font-size: 1.55rem;
}

.user-hero-actions,
.user-profile-badges,
.user-profile-actions,
.user-action-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--space-2);
}

.user-list-card,
.user-profile-card,
.user-skills-card,
.user-courses-card,
.user-lessons-card,
.user-edit-card,
.user-skill-assign-card,
.user-skills-table-card {
    display: grid;
    gap: var(--space-3);
}

.user-table-toolbar {
    grid-template-columns: minmax(14rem, 1fr) auto;
    margin-bottom: var(--space-3);
}

.user-profile-actions form {
    display: inline-flex;
}

.user-profile-actions button,
.user-profile-actions a {
    min-height: 2.75rem;
}

.users-table td,
.user-skills-table td {
    vertical-align: top;
}

.users-table td strong,
.users-table td span:not(.badge),
.user-course-list span {
    display: block;
}

.users-table td span:not(.badge),
.user-course-list span {
    color: var(--muted);
    font-size: 0.9rem;
    margin-top: 0.2rem;
}

.user-role,
.user-status {
    border-color: rgba(83, 103, 89, 0.16);
    background: rgba(232, 238, 228, 0.46);
    color: var(--color-forest);
}

.user-status-active {
    border-color: rgba(56, 97, 80, 0.24);
    background: rgba(56, 97, 80, 0.12);
    color: var(--success);
}

.user-status-inactive {
    border-color: rgba(139, 61, 47, 0.22);
    background: rgba(139, 61, 47, 0.1);
    color: var(--error);
}

.user-profile-grid,
.user-activity-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(20rem, 0.8fr);
    gap: var(--space-4);
    margin-bottom: var(--space-3);
}

.user-courses-card,
.user-lessons-card-full {
    margin-bottom: var(--space-3);
}

.user-calendar-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    gap: var(--space-2);
}

.user-action-list {
    justify-content: stretch;
    flex-direction: column;
}

.user-action-list a,
.user-action-list form,
.user-action-list button {
    width: 100%;
}

.user-skill-chips {
    margin: 0;
}

.user-edit-form {
    display: grid;
    gap: var(--space-3);
    max-width: 58rem;
}

.user-form-section {
    display: grid;
    gap: var(--space-3);
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
    background: rgba(255, 255, 255, 0.62);
}

.user-form-section legend {
    padding: 0 0.35rem;
    color: var(--ink);
    font-weight: 800;
}

.user-form-grid,
.user-skill-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-3);
}

.user-skill-form {
    grid-template-columns: minmax(16rem, 1fr) minmax(12rem, 18rem) auto;
    align-items: end;
}

.reservation-action-groups {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-3);
}

.reservation-action-groups > div {
    display: grid;
    gap: var(--space-2);
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
    background: rgba(255, 255, 255, 0.62);
}

.reservation-action-groups form {
    margin: 0;
}

.registrations-hero {
    margin-bottom: var(--space-3);
}

.registrations-filter-card {
    display: grid;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.registrations-filter {
    grid-template-columns: minmax(14rem, 1.4fr) minmax(8rem, 0.7fr) minmax(8rem, 0.7fr) minmax(10rem, 0.8fr) auto auto;
    align-items: end;
}

.registrations-filter .form-actions {
    align-items: end;
    flex-wrap: wrap;
}

.quick-filter-row {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-2);
    flex-wrap: wrap;
}

.quick-filter-row a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.15rem;
    padding: 0.45rem 0.7rem;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.74);
    color: var(--ink);
    font-size: 0.86rem;
    font-weight: 700;
}

.has-manual-reservation-modal,
.has-registration-edit-modal,
.has-student-edit-modal,
.has-student-email-modal,
.has-course-bulk-email-modal {
    overflow: hidden;
}

.manual-reservation-modal[hidden],
.registration-edit-modal[hidden],
.student-edit-modal[hidden],
.student-email-modal[hidden],
.course-bulk-email-modal[hidden] {
    display: none !important;
}

.manual-reservation-modal,
.registration-edit-modal,
.student-edit-modal,
.student-email-modal,
.course-bulk-email-modal {
    position: fixed;
    inset: 0;
    z-index: 1300;
    display: grid;
    place-items: center;
    padding: var(--space-4);
}

.manual-reservation-backdrop,
.registration-edit-modal-backdrop,
.student-edit-modal-backdrop,
.student-email-modal-backdrop,
.course-bulk-email-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(36, 45, 36, 0.42);
    backdrop-filter: blur(4px);
}

.manual-reservation-dialog,
.registration-edit-modal-dialog,
.student-edit-modal-dialog,
.student-email-modal-dialog,
.course-bulk-email-dialog {
    position: relative;
    z-index: 1;
    width: min(64rem, calc(100vw - 2rem));
    max-height: calc(100vh - 2rem);
    overflow: hidden;
}

.registration-edit-modal-dialog {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    gap: var(--space-3);
}

.student-edit-modal-dialog,
.student-email-modal-dialog {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: var(--space-3);
}

.student-email-modal-dialog {
    width: min(42rem, calc(100vw - 2rem));
}

.registration-edit-modal-dialog .section-head,
.student-edit-modal-dialog .section-head,
.student-email-modal-dialog .section-head {
    align-items: start;
}

.student-edit-form-modal,
.student-email-modal-dialog form {
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 0.15rem;
}

.registration-edit-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
    gap: var(--space-2);
    margin: 0;
    padding: var(--space-3);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--surface-muted);
}

.registration-edit-summary div {
    min-width: 0;
}

.registration-edit-summary dt {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
}

.registration-edit-summary dd {
    margin: 0.2rem 0 0;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.registration-edit-form {
    display: grid;
    gap: var(--space-3);
    max-height: calc(100vh - 17rem);
    overflow-x: hidden;
    overflow-y: auto;
    padding-right: 0.25rem;
}

.registration-edit-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
    gap: var(--space-3);
}

.registration-edit-options {
    display: grid;
    gap: var(--space-2);
}

.registration-edit-options h3 {
    margin: 0;
    font-size: 1rem;
}

.registration-edit-lock {
    padding: var(--space-2) var(--space-3);
    border: 1px solid rgba(144, 91, 40, 0.25);
    border-radius: var(--radius-sm);
    background: rgba(255, 244, 224, 0.82);
}

.registration-edit-submit {
    position: sticky;
    bottom: 0;
    margin-top: var(--space-1);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.82), var(--surface) 34%);
    border-top: 1px solid var(--line);
    padding-top: var(--space-2);
}

.course-bulk-email-dialog {
    display: grid;
    gap: var(--space-3);
    grid-template-rows: auto minmax(0, 1fr);
}

.course-bulk-email-dialog .section-head {
    align-items: start;
}

.course-bulk-email-dialog .shared-bulk-email-composer-embedded {
    border: 0;
    min-width: 0;
    width: 100%;
    padding: 0;
    box-shadow: none;
    background: transparent;
    justify-self: stretch;
}

.course-bulk-email-dialog .communication-compose-panel {
    position: static;
    width: 100%;
    max-height: none;
    overflow: visible;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.course-bulk-email-dialog .shared-bulk-email-form {
    min-width: 0;
    max-height: calc(100vh - 13rem);
    overflow-x: hidden;
    overflow-y: auto;
    padding-right: 0.25rem;
}

.course-bulk-email-dialog .communication-recipient-checklist {
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    max-height: 12rem;
}

.course-bulk-email-dialog label,
.course-bulk-email-dialog input,
.course-bulk-email-dialog textarea,
.course-bulk-email-dialog .rich-text-editor,
.course-bulk-email-dialog .ql-toolbar,
.course-bulk-email-dialog .ql-container {
    max-width: 100%;
    min-width: 0;
}

.course-bulk-email-dialog .form-actions {
    position: sticky;
    bottom: 0;
    margin-top: var(--space-1);
    padding-top: var(--space-2);
    background: linear-gradient(180deg, rgba(255, 253, 248, 0), var(--panel) 42%);
}

@media (max-width: 720px) {
    .course-bulk-email-modal {
        padding: var(--space-2);
    }

    .course-bulk-email-dialog {
        width: calc(100vw - 1rem);
        max-height: calc(100vh - 1rem);
    }

    .course-bulk-email-dialog .section-head {
        gap: var(--space-2);
    }

    .course-bulk-email-dialog .shared-bulk-email-form {
        max-height: calc(100vh - 12rem);
    }
}

.manual-reservation-card {
    display: grid;
    gap: var(--space-3);
}

.manual-reservation-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-3);
    align-items: start;
}

.manual-reservation-validation {
    grid-column: 1 / -1;
    margin: 0;
}

.manual-reservation-group {
    display: grid;
    gap: var(--space-2);
    align-items: start;
    min-width: 0;
}

.manual-reservation-group-wide {
    grid-column: 1 / -1;
}

.manual-reservation-group > span:first-child {
    display: none;
}

.manual-reservation-group > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-2);
    align-items: start;
    min-width: 0;
}

.manual-reservation-group p {
    grid-column: 1 / -1;
    margin: 0;
}

.manual-option-list {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
}

.manual-check {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.65rem;
    align-items: start;
    padding: 0.7rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: rgba(255, 255, 255, 0.7);
}

.manual-check[hidden] {
    display: none !important;
}

.manual-check span,
.manual-check small {
    display: block;
}

.manual-check small {
    color: var(--muted);
}

.manual-price-summary {
    display: grid;
    gap: 0.25rem;
    padding: 0.75rem;
    border: 1px solid rgba(124, 146, 125, 0.38);
    border-radius: var(--radius-control);
    background: rgba(232, 238, 228, 0.55);
}

.manual-price-summary span {
    color: var(--muted);
    font-size: 0.9rem;
}

.manual-price-controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-2);
    align-items: end;
}

.manual-reservation-finish .form-actions {
    align-items: center;
    gap: 0.65rem;
}

.manual-reservation-finish .button-success,
.manual-reservation-finish .button-secondary {
    min-height: 2.35rem;
    min-width: 10.5rem;
    padding: 0.55rem 0.8rem;
    box-shadow: var(--shadow-control);
    font-size: 0.9rem;
}

.skills-table-card {
    margin-top: 1.5rem;
}

.admin-table {
    width: 100%;
    border-collapse: collapse;
}

.admin-table th,
.admin-table td {
    text-align: left;
    padding: 0.95rem 0.75rem;
    border-bottom: 1px solid var(--line);
}

.empty-state,
.calendar-empty {
    display: grid;
    gap: var(--space-2);
    padding: var(--space-5);
    border: 1px dashed rgba(124, 146, 125, 0.42);
    border-radius: 18px;
    background: rgba(232, 238, 228, 0.48);
    color: var(--muted);
}

.skill-inline-form {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
}

.skill-inline-form input[type="text"] {
    width: auto;
    min-width: 10rem;
}

.skill-inline-form button {
    width: auto;
    white-space: nowrap;
}

.simple-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 1rem;
}

.simple-list li {
    display: grid;
    gap: 0.25rem;
}

.meta-list {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 0.6rem 1rem;
    margin: 0;
}

.meta-list dt {
    color: var(--muted);
}

.meta-list dd {
    margin: 0;
}

.user-color {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    border-radius: 999px;
    vertical-align: middle;
    margin-right: 0.5rem;
    border: 1px solid rgba(0, 0, 0, 0.08);
}

.color-input-shell {
    display: flex;
    align-items: center;
    gap: 0.85rem;
}

.color-input-shell input[type="color"] {
    width: 4.25rem;
    min-height: 3rem;
    padding: 0.3rem;
}

.color-preview-badge {
    width: 1.4rem;
    height: 1.4rem;
    border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.55);
}

.color-code {
    font-size: 0.95rem;
    letter-spacing: 0.05em;
}

.password-field {
    position: relative;
}

.password-field input {
    min-width: 0;
    padding-right: 3.5rem;
}

.password-toggle {
    position: absolute;
    top: 50%;
    right: 0.75rem;
    display: inline-flex;
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    background: transparent;
    color: var(--ink);
    border: none;
    border-radius: 999px;
    transform: translateY(-50%);
    box-shadow: none;
}

.password-toggle:hover {
    background: rgba(109, 124, 111, 0.12);
    transform: translateY(-50%);
    box-shadow: none;
}

.password-toggle:focus-visible {
    outline: 2px solid rgba(109, 124, 111, 0.45);
    outline-offset: 2px;
}

.password-toggle:active {
    transform: translateY(-50%);
    box-shadow: none;
}

.password-toggle__icon {
    position: absolute;
    inset: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
    transition: opacity 0.16s ease;
}

.password-toggle__icon svg {
    width: 1.25rem;
    height: 1.25rem;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    fill: none;
}

.password-toggle__icon--hide {
    opacity: 0;
}

.password-toggle.is-visible .password-toggle__icon--show {
    opacity: 0;
}

.password-toggle.is-visible .password-toggle__icon--hide {
    opacity: 1;
}

label span.field-validation-error,
div.validation-summary-errors {
    color: var(--error);
}

.calendar-toolbar,
.calendar-toolbar-actions,
.calendar-top-controls,
.calendar-legend,
.calendar-event-actions {
    display: flex;
    gap: 1rem;
}

.calendar-toolbar,
.calendar-toolbar-actions,
.calendar-top-controls {
    justify-content: space-between;
    align-items: center;
}

.calendar-toolbar-redesign {
    align-items: end;
    margin-bottom: var(--space-3);
}

.calendar-title-block h1,
.calendar-title-block p {
    margin: 0;
}

.calendar-filter-card {
    display: grid;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.calendar-top-controls {
    flex-wrap: wrap;
    gap: var(--space-2);
    padding: 0.5rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: rgba(255, 255, 255, 0.72);
}

.calendar-navigation-actions {
    flex-wrap: wrap;
    gap: 0.5rem;
}

.calendar-navigation-actions .button-secondary {
    min-height: 2.3rem;
    padding-inline: 0.75rem;
}

.calendar-range-label {
    display: grid;
    gap: 0.15rem;
    min-width: min(18rem, 100%);
    text-align: center;
}

.calendar-range-label span {
    color: var(--muted);
    font-size: var(--font-size-meta);
    font-weight: 700;
    text-transform: uppercase;
}

.calendar-range-label strong {
    color: var(--ink);
    font-size: 1.05rem;
}

.calendar-filter-grid {
    align-items: end;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
}

.calendar-filter-grid label {
    margin: 0;
}

.calendar-filter-actions {
    justify-content: end;
    align-self: end;
}

.calendar-filter-actions button,
.calendar-filter-actions a {
    min-width: 8rem;
}

.calendar-scope-switch {
    margin-top: 1.5rem;
}

.calendar-view-switch {
    margin-top: 0;
}

.calendar-filter-dropdown {
    align-self: end;
}

.calendar-category-filter-option .badge {
    background: color-mix(in srgb, var(--category-color, var(--accent)) 28%, #fff);
    color: var(--ink);
    border-color: color-mix(in srgb, var(--category-color, var(--accent)) 54%, var(--line));
}

.calendar-view-switch a.active,
.calendar-scope-switch a.active {
    background: var(--accent);
    color: #fff;
}

.calendar-legend {
    flex-wrap: wrap;
    margin-top: 1rem;
}

.calendar-legend-item {
    display: inline-flex;
    align-items: center;
    padding: 0.45rem 0.75rem;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.75);
}

.calendar-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}

.calendar-fullcalendar-card {
    position: relative;
    margin-bottom: var(--space-3);
    overflow: hidden;
}

.calendar-filter-card.is-loading .calendar-fullcalendar-card::after {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: grid;
    place-items: center;
    background: rgba(250, 248, 242, 0.72);
    color: var(--ink);
    font-weight: 800;
    content: "Načítám kalendář";
}

#admin-fullcalendar {
    min-height: 32rem;
}

#admin-fullcalendar .fc {
    color: var(--ink);
}

#admin-fullcalendar .fc-theme-standard td,
#admin-fullcalendar .fc-theme-standard th,
#admin-fullcalendar .fc-scrollgrid {
    border-color: var(--line);
}

#admin-fullcalendar .fc-col-header-cell,
#admin-fullcalendar .fc-daygrid-day {
    background: rgba(255, 255, 255, 0.64);
}

#admin-fullcalendar .fc-day-today {
    background: rgba(232, 238, 228, 0.68);
}

#admin-fullcalendar .fc-event {
    border-width: 0 0 0 4px;
    border-radius: 6px;
    box-shadow: none;
}

#admin-fullcalendar .calendar-event-cancelled {
    opacity: 0.72;
    filter: grayscale(0.35);
}

#admin-fullcalendar .calendar-event-ended {
    opacity: 0.82;
}

.fc-event-krajina {
    display: grid;
    gap: 0.12rem;
    min-width: 0;
    padding: 0.18rem 0.25rem;
    line-height: 1.2;
}

.fc-event-krajina strong,
.fc-event-krajina span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fc-event-krajina strong {
    font-size: 0.82rem;
}

.fc-event-krajina span {
    font-size: 0.72rem;
    opacity: 0.86;
}

.calendar-column {
    display: grid;
    gap: 0.75rem;
    align-content: start;
    padding: 1rem;
    min-height: 15rem;
    border-radius: var(--radius-card);
    border: 1px solid rgba(216, 204, 190, 0.85);
    background: rgba(255, 255, 255, 0.45);
}

.calendar-column header {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    align-items: baseline;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid rgba(216, 204, 190, 0.65);
}

.calendar-column header span {
    color: var(--muted);
    font-size: 0.85rem;
}

.calendar-column-today {
    background: rgba(162, 84, 42, 0.08);
    border-color: rgba(162, 84, 42, 0.25);
}

.calendar-empty {
    color: var(--muted);
    font-size: 0.95rem;
}

.calendar-event {
    position: relative;
    display: grid;
    gap: 0.6rem;
    padding: 0.9rem;
    border-radius: var(--radius-card);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.86));
    border: 1px solid rgba(216, 204, 190, 0.85);
    border-left: 6px solid var(--event-category);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--event-lecturer) 18%, transparent);
}

.calendar-event-cancelled {
    opacity: 0.72;
}

.calendar-event-ended {
    background: linear-gradient(180deg, rgba(245, 242, 237, 0.95), rgba(241, 236, 230, 0.88));
}

.calendar-event-main {
    display: grid;
    gap: 0.25rem;
}

.calendar-event-main a {
    font-weight: 700;
}

.calendar-event-time {
    color: var(--accent);
    font-weight: 600;
}

.calendar-event-meta {
    color: var(--muted);
    font-size: 0.92rem;
}

.calendar-event-preview {
    position: absolute;
    left: 0.75rem;
    right: 0.75rem;
    top: calc(100% + 0.35rem);
    display: none;
    z-index: 10;
    padding: 0.85rem 1rem;
    border-radius: 14px;
    background: #1f2521;
    color: #fff;
    box-shadow: 0 18px 36px rgba(31, 37, 33, 0.18);
}

.calendar-event-preview span {
    color: rgba(255, 255, 255, 0.82);
}

.calendar-event:hover .calendar-event-preview {
    display: grid;
    gap: 0.35rem;
}

.calendar-event-actions {
    flex-wrap: wrap;
    align-items: center;
    font-size: 0.92rem;
    gap: 0.45rem;
}

.calendar-event-actions form {
    display: inline;
}

.calendar-event-actions a,
.calendar-event-actions .button-link {
    min-height: 2rem;
    padding: 0.32rem 0.55rem;
    border-radius: 999px;
    background: rgba(232, 238, 228, 0.65);
    color: var(--accent-dark);
    font-weight: 700;
}

.calendar-agenda {
    display: none;
    gap: var(--space-3);
}

.calendar-agenda-list,
.calendar-agenda-day {
    display: grid;
    gap: var(--space-3);
}

.calendar-agenda-day h3 {
    margin: 0;
    color: var(--color-forest);
}

.calendar-agenda-event {
    display: grid;
    gap: 0.75rem;
    padding: 1rem;
    border-radius: var(--radius-card);
    border: 1px solid rgba(216, 204, 190, 0.85);
    border-left: 6px solid var(--event-category);
    background: rgba(255, 255, 255, 0.78);
}

.calendar-agenda-event a {
    font-weight: 800;
}

.calendar-agenda-event span {
    display: block;
    margin-top: 0.2rem;
    color: var(--muted);
}

.earnings-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-4);
    align-items: end;
}

.earnings-hero h1,
.earnings-hero p,
.earnings-filter-card h2,
.earnings-filter-card p,
.earnings-table-card h2,
.earnings-table-card h3,
.earnings-table-card p {
    margin: 0;
}

.earnings-summary {
    display: grid;
    gap: 0.2rem;
    min-width: 13rem;
    padding: 1rem;
    border: 1px solid rgba(56, 97, 80, 0.18);
    border-radius: var(--radius-card);
    background: rgba(232, 238, 228, 0.48);
    text-align: right;
}

.earnings-summary span,
.earnings-summary small {
    color: var(--muted);
    font-size: var(--font-size-meta);
    font-weight: 700;
}

.earnings-summary strong {
    color: var(--color-forest);
    font-size: 1.55rem;
}

.earnings-metrics {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    gap: var(--space-3);
    margin-bottom: var(--space-4);
}

.earnings-metric {
    min-height: 9rem;
}

.earnings-metric strong {
    display: block;
    margin: 0.25rem 0 0.35rem;
    color: var(--color-forest);
    font-size: 1.65rem;
}

.earnings-table-card {
    display: grid;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.earnings-lecturer-filter {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.earnings-lecturer-filter a {
    display: inline-flex;
    align-items: center;
    min-height: 2.4rem;
    padding: 0.55rem 0.9rem;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    color: var(--ink);
    font-weight: 700;
}

.earnings-lecturer-filter a.active {
    border-color: rgba(56, 97, 80, 0.32);
    background: rgba(232, 238, 228, 0.82);
}

.earnings-month-card {
    display: grid;
    gap: var(--space-3);
    margin-top: 1rem;
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
    background: rgba(255, 255, 255, 0.62);
}

.earnings-category-table td,
.earnings-course-table td {
    vertical-align: top;
}

.category-dot {
    display: inline-block;
    width: 0.75rem;
    height: 0.75rem;
    margin-right: 0.45rem;
    border-radius: 999px;
    box-shadow: inset 0 0 0 1px rgba(34, 45, 37, 0.14);
}

.earnings-course-table td strong,
.earnings-course-table td span {
    display: block;
}

.earnings-course-table td span {
    color: var(--muted);
    font-size: 0.9rem;
    margin-top: 0.2rem;
}

.statistics-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-4);
    align-items: end;
}

.statistics-hero h1,
.statistics-hero p,
.statistics-filter-card h2,
.statistics-filter-card p,
.statistics-panel h2,
.statistics-panel p,
.statistics-months-card h2,
.statistics-months-card h3,
.statistics-months-card h4,
.statistics-months-card p {
    margin: 0;
}

.statistics-summary {
    display: grid;
    gap: 0.2rem;
    min-width: 13rem;
    padding: 1rem;
    border: 1px solid rgba(56, 97, 80, 0.18);
    border-radius: var(--radius-card);
    background: rgba(232, 238, 228, 0.48);
    text-align: right;
}

.statistics-summary span,
.statistics-summary small {
    color: var(--muted);
    font-size: var(--font-size-meta);
    font-weight: 700;
}

.statistics-summary strong {
    color: var(--color-forest);
    font-size: 1.55rem;
}

.statistics-filter-card,
.statistics-panel,
.statistics-months-card {
    display: grid;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.statistics-filter {
    grid-template-columns: minmax(12rem, 16rem) minmax(12rem, 16rem) auto;
    align-items: end;
}

.statistics-metrics {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    gap: var(--space-3);
    margin-bottom: var(--space-4);
}

.statistics-metric {
    min-height: 9rem;
}

.statistics-metric strong {
    display: block;
    margin: 0.25rem 0 0.35rem;
    color: var(--color-forest);
    font-size: 1.55rem;
}

.statistics-grid,
.statistics-month-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-4);
    align-items: start;
}

.statistics-month-card {
    display: grid;
    gap: var(--space-3);
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
    background: rgba(255, 255, 255, 0.62);
}

.statistics-table td {
    vertical-align: top;
}

.chart-bar {
    width: 100%;
    height: 0.65rem;
    margin-bottom: 0.35rem;
    border-radius: 999px;
    background: rgba(216, 204, 190, 0.7);
    overflow: hidden;
}

.chart-bar span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--accent), #d19152);
}

@keyframes flash-in {
    from {
        opacity: 0;
        transform: translateY(-12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes flash-out {
    from {
        opacity: 1;
        transform: translateY(0);
    }
    to {
        opacity: 0;
        transform: translateY(-10px);
    }
}

@media (max-width: 900px) {
    .detail-grid,
    .admin-shell,
    .hero-grid,
    .homepage-hero,
    .homepage-discovery-panel,
    .homepage-category-form,
    .category-discovery,
    .homepage-course-grid,
    .course-filter-grid,
    .public-course-grid,
    .course-detail-shell,
    .course-detail-card,
    .course-detail-hero,
    .lesson-card,
    .payment-grid,
    .completion-bottom-grid,
    .dashboard-grid,
    .category-hero,
    .course-groups-hero,
    .course-cancel-head,
    .course-cancel-summary,
    .course-cancel-impact,
    .company-info-grid,
    .admin-courses-hero,
    .admin-course-detail-hero,
    .admin-course-summary-grid,
    .admin-course-two-column,
    .admin-course-edit-shell,
    .admin-course-edit-head,
    .admin-course-edit-grid,
    .admin-course-edit-section,
    .reservation-detail-hero,
    .reservation-detail-grid,
    .reservation-action-groups,
    .invoices-hero,
    .invoice-detail-hero,
    .invoice-filter,
    .invoice-detail-grid,
    .students-hero,
    .student-detail-hero,
    .student-edit-hero,
    .student-filter,
    .student-detail-grid,
    .student-communication-grid,
    .student-form-grid,
    .users-hero,
    .user-profile-hero,
    .user-edit-hero,
    .user-skills-hero,
    .user-filter,
    .user-profile-grid,
    .user-activity-grid,
    .user-form-grid,
    .user-skill-form,
    .earnings-hero,
    .statistics-hero,
    .statistics-filter,
    .statistics-grid,
    .statistics-month-grid,
    .communications-hero,
    .communications-layout {
        grid-template-columns: 1fr;
    }

    .admin-course-actions,
    .admin-course-edit-submit,
    .reservation-detail-status,
    .student-hero-actions,
    .student-detail-badges,
    .user-hero-actions,
    .user-profile-badges,
    .communication-stat {
        justify-content: stretch;
        justify-items: stretch;
    }

    .admin-course-actions a,
    .admin-course-actions form,
    .admin-course-actions button,
    .admin-course-edit-submit,
    .admin-course-edit-submit .form-actions,
    .admin-course-edit-submit button,
    .admin-course-edit-submit a {
        width: 100%;
    }

    .admin-course-edit-submit {
        align-items: stretch;
        flex-direction: column;
    }

    .manual-reservation-form,
    .manual-reservation-group > div,
    .manual-price-controls,
    .manual-option-list {
        grid-template-columns: 1fr;
    }

    .dashboard-hero {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-shell {
        display: block;
    }

    .admin-sidebar {
        position: fixed;
        inset: 0 auto 0 0;
        z-index: 900;
        width: min(20rem, calc(100vw - 3rem));
        min-height: 100vh;
        transform: translateX(-105%);
        transition: transform 0.2s ease;
        box-shadow: 24px 0 60px rgba(31, 37, 33, 0.24);
    }

    .admin-sidebar.is-open {
        transform: translateX(0);
    }

    .admin-sidebar-backdrop {
        position: fixed;
        inset: 0;
        z-index: 850;
        display: none;
        border: 0;
        background: rgba(31, 37, 33, 0.42);
    }

    .admin-nav-open .admin-sidebar-backdrop {
        display: block;
    }

    .admin-main {
        min-height: 100vh;
    }

    .admin-header {
        grid-template-columns: auto minmax(0, 1fr);
        padding: 0.75rem 1rem;
    }

    .admin-menu-toggle {
        display: inline-flex;
    }

    .admin-menu-toggle + div {
        grid-column: 2;
    }

    .admin-header-actions {
        grid-column: 1 / -1;
        justify-content: stretch;
    }

    .admin-header-actions > a,
    .admin-header-actions > form,
    .admin-header-actions > form > button {
        width: 100%;
    }

    .admin-content {
        padding: 1rem;
    }

    .table-wrap {
        scrollbar-width: thin;
    }

    .table-wrap > .admin-table,
    .table-wrap > .table {
        min-width: 42rem;
    }

    .admin-content > *,
    .statistics-grid > *,
    .statistics-month-grid > *,
    .earnings-month-grid > *,
    .earnings-grid > * {
        min-width: 0;
    }

    .public-header-inner {
        min-height: 4.25rem;
        flex-wrap: wrap;
        padding: 0.75rem 0;
    }

    .public-menu-toggle {
        display: inline-flex;
        margin-left: auto;
    }

    .public-menu {
        display: none;
        width: 100%;
        padding-top: 0.75rem;
        border-top: 1px solid rgba(216, 204, 190, 0.72);
    }

    .public-menu.is-open {
        display: grid;
        gap: 0.75rem;
    }

    .public-nav {
        display: grid;
        gap: 0.5rem;
    }

    .public-nav a,
    .public-header-cta {
        width: 100%;
    }

    .public-footer-inner {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }

    .course-filter-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .course-filter-actions button,
    .course-filter-actions .button-secondary,
    .course-detail-hero-actions a,
    .dashboard-hero-actions a,
    .category-hero a,
    .course-groups-hero a,
    .form-actions button,
    .completion-hero-actions a,
    .public-error-actions a {
        width: 100%;
    }

    .course-registration-panel {
        position: static;
        scroll-margin-top: 1rem;
    }

    .section-head {
        align-items: start;
    }

    .calendar-toolbar,
    .calendar-toolbar-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .calendar-grid {
        display: none;
    }

    .calendar-agenda {
        display: grid;
    }

    .flash {
        left: 1rem;
        right: 1rem;
        min-width: auto;
        max-width: none;
    }

    .color-input-shell {
        grid-template-columns: 1fr;
    }

    .course-meta-grid,
    .registration-summary,
    .course-body,
    .payment-detail-list {
        grid-template-columns: 1fr;
    }

    .payment-panel-head,
    .completion-hero-actions,
    .public-error-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .payment-symbol,
    .qr-fallback,
    .price-box,
    .completion-card,
    .payment-details-card,
    .payment-qr-card {
        min-width: 0;
    }

    .qr-fallback code {
        white-space: normal;
        overflow-wrap: anywhere;
    }
}

@media (max-width: 560px) {
    .invoice-qr-panel {
        grid-template-columns: 1fr;
    }

    .invoice-qr-image {
        width: 7.5rem;
        height: 7.5rem;
    }

    .brand-text span {
        display: none;
    }

    .public-content {
        width: min(100% - 1rem, 1180px);
        padding-top: 1rem;
    }

    .admin-header {
        gap: 0.5rem;
        padding: 0.65rem 0.75rem;
    }

    .admin-header strong {
        font-size: 1.05rem;
        overflow-wrap: anywhere;
    }

    .admin-header-actions {
        gap: 0.5rem;
    }

    .admin-header-actions > a,
    .admin-header-actions > form,
    .admin-header-actions > form > button {
        min-height: 2.75rem;
    }

    .admin-content {
        gap: 1rem;
        padding: 0.75rem;
    }

    .hero,
    .card,
    .panel {
        border-radius: 18px;
        padding: 1rem;
    }

    .table-actions {
        align-items: stretch;
    }

    .table-actions > a,
    .table-actions > button,
    .table-actions > form,
    .table-actions > form > button {
        min-width: min(100%, 9rem);
    }

    .course-list-hero,
    .course-filter-panel,
    .public-course-card,
    .course-detail-hero,
    .course-detail-section,
    .course-registration-panel,
    .payment-panel,
    .completion-card,
    .public-error-card {
        border-radius: 18px;
        padding: 1rem;
    }

    .course-detail-image {
        min-height: 12rem;
        max-height: 16rem;
    }

    .qr-visual {
        max-width: min(100%, 15rem);
        min-height: 0;
    }
}