/* Shared school palette. Public pages and every account layout use these tokens. */
:root {
    color-scheme: light;
    --theme-bg: #ffffff;
    --theme-deep: #f5f8fd;
    --theme-surface: #f3f6fb;
    --theme-raised: #e8f0fb;
    --theme-text: #1c2f4d;
    --theme-muted: #596b82;
    --theme-link: #245994;
    --theme-line: #d8e2ef;
    --theme-gold: #926714;
    --theme-primary: #245994;
    --theme-success: #187047;
    --theme-success-bg: #eaf7ef;
    --theme-warning: #845900;
    --theme-warning-bg: #fff5dd;
    --theme-danger: #ac303a;
    --theme-danger-bg: #fff0f1;
    --theme-info: #245994;
    --theme-info-bg: #eaf3ff;
    --theme-purple: #694398;
    --theme-purple-bg: #f3edfc;
    --theme-brand-navy: #11196b;
    --theme-brand-blue: #1552d4;
    --theme-brand-gradient: linear-gradient(115deg, #11196b 0%, #17368c 48%, #1552d4 100%);
}

html { scroll-behavior: smooth; }
.bosco-theme {
    --navy: var(--theme-link);
    --navy-deep: var(--theme-deep);
    --gold: var(--theme-gold);
    --ink: var(--theme-text);
    --muted: var(--theme-muted);
    --line: var(--theme-line);
    --wash: var(--theme-bg);
    --bg: var(--theme-bg);
    --blue: var(--theme-link);
    --blue2: var(--theme-primary);
    --green: var(--theme-success);
    --danger: var(--theme-danger);
    margin: 0;
    background: var(--theme-bg);
    color: var(--theme-text);
    font-family: "Segoe UI", Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}
.bosco-theme *, .bosco-theme *::before, .bosco-theme *::after { box-sizing: border-box; }
.bosco-theme :is(a, button, input, select, textarea, summary):focus-visible { outline: 2px solid var(--theme-gold); outline-offset: 4px; }
.bosco-theme a { color: var(--theme-link); text-underline-offset: 4px; }
.bosco-theme :is(h1, h2, h3, h4) { color: var(--theme-text); }
.bosco-theme :is(input, select, textarea) { color-scheme: light; color: var(--theme-text); }
.bosco-theme input::placeholder, .bosco-theme textarea::placeholder { color: var(--theme-muted); opacity: .8; }
.bosco-theme ::selection { color: var(--theme-deep); background: var(--theme-gold); }
.bosco-theme :is(button, a) { -webkit-tap-highlight-color: transparent; }
.bosco-theme button:disabled { cursor: not-allowed; }
.bosco-theme button { background: var(--theme-primary); color: #fff; }
.bosco-theme .gcash-qr-image { background: #fff; }

/* The public website: generous spacing, fine dividers, and subdued photography. */
.school-home {
    --school-navy: var(--theme-text);
    --school-ink: var(--theme-text);
    --school-muted: var(--theme-muted);
    --school-gold: var(--theme-gold);
    --school-line: var(--theme-line);
    --school-paper: var(--theme-bg);
    --school-wash: var(--theme-surface);
}
.school-home a { color: inherit; }
.school-home :is(h1, h2) em { color: var(--theme-gold); }
.school-home .school-header { position: relative; z-index: 2; background: var(--theme-brand-gradient); border-bottom-color: #ffffff30; }
.school-home .school-header-inner { min-height: 114px; }
.school-home .school-brand strong { color: #fff; }
.school-home .school-nav { gap: 26px; }
.school-home .school-nav a { position: relative; padding-block: 10px; transition: color .2s; }
.school-home .school-nav a:hover { color: var(--theme-gold); }
.school-home .school-nav .school-login { border-color: var(--theme-line); padding: 10px 19px; }
.school-home .school-nav .school-login:hover { border-color: var(--theme-gold); }
.school-home .school-kicker { color: var(--theme-gold); }
.school-home .school-button { background: var(--theme-primary); border-color: var(--theme-primary); color: #fff !important; font-size: 13px; min-height: 49px; transition: background .2s, transform .2s; }
.school-home .school-button:hover { background: #1b477c; transform: translateY(-2px); }
.school-home .school-button-outline { color: var(--theme-primary) !important; background: #ffffffb8; border-color: var(--theme-primary); }
.school-home .school-button-outline:hover { background: var(--theme-raised); border-color: var(--theme-gold); }
.school-home .school-text-link { border-color: #7e95b0; font-size: 13px; }
.school-home .school-text-link:hover { color: var(--theme-gold); border-color: var(--theme-gold); }
.school-photo-section {
    --theme-text: #fff; --theme-muted: #e1e9f5; --theme-gold: #f0d58b;
    --theme-line: #ffffff40; --theme-link: #e1edff;
    --school-navy: var(--theme-text); --school-ink: var(--theme-text);
    --school-muted: var(--theme-muted); --school-gold: var(--theme-gold); --school-line: var(--theme-line);
    position: relative; isolation: isolate; overflow: hidden; color: var(--theme-text); background: #102747;
}
.school-background { position: absolute; inset: 0; margin: 0; z-index: -2; pointer-events: none; }
.school-background img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center; display: block; filter: brightness(.82) saturate(.9); }
.school-photo-section::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(90deg, #081d3fe6 0%, #102b50b8 45%, #102b5073 100%); }
.school-home .school-hero { display: flex; align-items: center; min-height: 640px; padding-block: 80px; }
.school-home .school-hero-photo { max-width: none; }
.school-home .school-hero-photo img { height: 100%; object-position: center 35%; }
.school-home .school-hero-copy { max-width: 650px; }
.school-home .school-hero h1 { font-size: clamp(49px, 5.6vw, 80px); line-height: 1.04; margin-bottom: 28px; }
.school-home .school-hero-description { max-width: 470px; font-size: 15px; color: var(--theme-muted); }
.school-home .school-hero-actions { display: grid; grid-template-columns: max-content max-content; gap: 13px 16px; justify-content: start; }
.school-explore-link { grid-column: 1; justify-self: start; }
.school-home .school-hero-note { color: var(--theme-muted); }
.school-home .school-strands-strip { border-top: 0; padding-block: 32px; }
.school-home .school-strands-strip a:hover strong { color: var(--theme-gold); }
.school-home .school-section { padding-block: 88px; }
.school-home #announcements { scroll-margin-top: 28px; }
.school-news-carousel { position: relative; }
.school-news-viewport { overflow: hidden; padding-block: 6px; }
.school-home .school-news-grid { gap: 0; }
.school-home .school-news-item { padding: 0 32px; border-left: 1px solid var(--theme-line); }
.school-home .school-news-item:first-child { padding-left: 0; border-left: 0; }
.school-home .school-news-item:last-child { padding-right: 0; }
.bosco-theme .school-news-item { color: var(--theme-text); }
.bosco-theme .school-news-item h3 { color: var(--theme-text); font-size: 28px; }
.bosco-theme .school-news-item p { color: var(--theme-muted); font-size: 14px; }
.bosco-theme .school-news-item summary { color: var(--theme-gold); font-size: 13px; }
.bosco-theme .school-news-date { color: var(--theme-muted); border-color: var(--theme-line); padding-top: 20px; font-size: 11px; }
.bosco-theme .school-news-media { background: var(--theme-surface); }
.school-news-controls { display: contents; }
.school-home .school-news-arrow { position: absolute; top: 42%; display: grid; place-items: center; width: 42px; height: 48px; border: 1px solid var(--theme-line); color: var(--theme-gold); background: var(--theme-deep); font-size: 25px; text-decoration: none; transition: background .2s, transform .2s; }
.school-news-arrow-prev { left: -50px; }
.school-news-arrow-next { right: -50px; }
.school-news-arrow-prev:hover { transform: translateX(-3px); }
.school-news-arrow-next:hover { transform: translateX(3px); }
.school-home .school-news-arrow:hover { background: var(--theme-raised); }
.school-news-arrow[aria-disabled="true"] { opacity: .28; }
.school-news-carousel[aria-busy="true"] .school-news-arrow { pointer-events: none; }
.school-home .school-community { background: var(--theme-deep); }
.school-home .school-community-inner { display: block; padding-block: 100px; }
.school-community-inner > div { max-width: 720px; }
.school-home .school-community h2 { font-size: clamp(35px, 4.1vw, 58px); }
.school-home .school-community .school-background img { max-width: none; object-position: 72% center; }
.school-home .school-community p:not(.school-kicker) { font-size: 15px; }
.school-home .school-footer { position: relative; z-index: 2; background: var(--theme-brand-gradient); }
.school-home .school-footer a:hover { color: var(--theme-gold); }
.school-home .school-footer p:not(.school-kicker), .school-home .school-footer a { font-size: 13px; }
.school-home .school-footer-top { grid-template-columns: 1.1fr 1.1fr 1fr; }
.school-home .skip-link { color: var(--theme-deep); background: var(--theme-gold); }
.school-home .school-back-link { color: var(--theme-muted) !important; }
.school-home .school-guide-nav a { border-color: var(--theme-gold); }
.school-home .school-guide-nav a:hover, .school-home .school-steps a { color: var(--theme-gold); }
.school-home .school-page-intro { padding-block: 48px 60px; }
.school-strands-page::after { background: linear-gradient(90deg, #081d3fe6, #102b50cf 55%, #102b509e); }
.school-strands-page > .school-background img { object-position: 65% top; }
.school-strand-list > article { display: grid; grid-template-columns: 110px 1fr 36px; gap: 30px; padding: 38px 0; border-top: 1px solid var(--theme-line); }
.school-strand-list h2 { font-size: clamp(28px, 3vw, 39px); margin-bottom: 15px; }
.school-strand-list p { color: var(--theme-muted); max-width: 730px; font-size: 15px; }
.school-strand-tag { color: var(--theme-gold); font-size: 12px; letter-spacing: .035em; }
.school-strand-mark { font-size: 30px; color: var(--theme-gold); }
.school-strand-cta { display: flex; flex-wrap: wrap; gap: 28px; align-items: center; padding-block: 24px 70px; }
.school-about::after { background: linear-gradient(90deg, #081d3fe6, #102b50cf 60%, #102b50b3); }
.school-about { clip-path: inset(0); }
.school-about .school-background { position: fixed; }
.school-about .school-background img { position: absolute; inset: 0; object-position: center 25%; }
.school-slide { opacity: 0; animation: school-background-cycle 9s linear infinite; }
.school-slide-campus { animation-delay: -6s; }
.school-slide-logo { animation-delay: -3s; }
@keyframes school-background-cycle { 0%, 29.99% { opacity: 1; } 33.33%, 96.66% { opacity: 0; } 100% { opacity: 1; } }
.school-about.is-paused .school-slide { animation-play-state: paused; }
.school-about-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.school-about-heading .school-kicker { margin-bottom: 0; }
.school-home .school-motion-toggle { background: transparent; border: 1px solid var(--theme-line); color: var(--theme-muted); padding: 7px 12px; font-size: 11px; cursor: pointer; }
.school-about .school-page-intro h1 { max-width: 1040px; margin-top: 30px; font-size: clamp(40px, 4.9vw, 66px); }
.school-about-sections { padding-bottom: 70px; }
.school-about-sections > section { display: grid; grid-template-columns: .4fr 1fr; gap: 60px; border-top: 1px solid var(--theme-line); padding-block: 44px; }
.school-about-sections h2 { font-size: 35px; }
.school-about-sections p:not(.school-kicker) { color: var(--theme-muted); font-size: 15px; }
.school-service-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; margin-top: 35px; }
.school-service-list h3 { font-size: 15px; color: var(--theme-gold); }
.school-service-list p { font-size: 13px !important; }

/* Account workspaces: keep operational layouts; replace boxes with open sections. */
.bosco-theme:not(.school-home) { line-height: 1.55; }
.bosco-theme .bar, .bosco-theme .top, .bosco-theme .auth-header { background: var(--theme-brand-gradient); border-bottom: 1px solid #ffffff30; }
.bosco-theme .bar { min-height: 78px; height: auto; padding-block: 12px; }
.bosco-theme .brand { color: #fff; font-weight: 700; letter-spacing: .045em; }
.bosco-theme .brand small { color: #dceaff; font-weight: 500; }
.bosco-theme .brand-with-crest { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.brand-with-crest img { width: 42px; height: 50px; object-fit: contain; }
.bosco-theme .shell { grid-template-columns: 224px minmax(0, 1fr); }
.bosco-theme .shell > aside { background: var(--theme-deep); border-right: 1px solid var(--theme-line); }
.bosco-theme .shell > main { max-width: 1480px; min-width: 0; padding: 36px clamp(20px, 3vw, 46px); }
.bosco-theme .shell > aside :is(p, .staff-nav-toggle) { background: transparent; color: var(--theme-gold); border: 0; border-bottom: 1px solid var(--theme-line); border-radius: 0; box-shadow: none; font-weight: 600; letter-spacing: .09em; }
.bosco-theme .shell > aside a { color: var(--theme-muted); border-radius: 3px; font-size: 13px; }
.bosco-theme .shell > aside a:hover, .bosco-theme .shell > aside a.active { background: var(--theme-raised); color: var(--theme-text); }
.bosco-theme .staff-nav-links { border-color: var(--theme-line); }
.bosco-theme .staff-nav-chevron { color: var(--theme-gold); }
.bosco-theme :is(.card, .auth-card, .metric, .detail-card, .billing, .assign-panel, .billing-summary, .academic-schedule, .section-box, .filter-bar, .toolbar, .student-workbench, .account-card) {
    background: transparent; border-radius: 0; box-shadow: none; border: 0; border-top: 1px solid var(--theme-line);
}
.bosco-theme .card { padding: 28px 0; margin-bottom: 24px; }
.bosco-theme .card .card { padding: 20px 0; margin-block: 12px; }
.bosco-theme .card :is(h1, h2), .bosco-theme .dashboard-intro h1 { color: var(--theme-text); }
.bosco-theme .dashboard-intro h1, .bosco-theme main > h1 { font-size: clamp(27px, 3vw, 36px); letter-spacing: -.035em; }
.bosco-theme .metrics { gap: 0; border-block: 1px solid var(--theme-line); margin: 22px 0 34px; }
.bosco-theme .metric { border: 0; border-left: 1px solid var(--theme-line); padding: 24px; margin: 0; }
.bosco-theme .metrics .metric { background: transparent; border-radius: 0; border-left: 1px solid var(--theme-line); box-shadow: none; }
.bosco-theme .metric:first-child { border-left: 0; padding-left: 0; }
.bosco-theme .metric small { color: var(--theme-muted); font-size: 12px; font-weight: 500; }
.bosco-theme .metric strong { color: var(--theme-text); font-size: 36px; font-weight: 500; letter-spacing: -.04em; }
.bosco-theme .metric.warning strong { color: var(--theme-warning); }
.bosco-theme .metric.danger strong { color: var(--theme-danger); }
.bosco-theme .metric.success strong { color: var(--theme-success); }
.bosco-theme .dashboard-grid { gap: 36px; }
.bosco-theme .quick-actions { gap: 0; grid-template-columns: 1fr; }
.bosco-theme .quick-actions a { padding: 13px 0; color: var(--theme-link); background: transparent; border: 0; border-bottom: 1px solid var(--theme-line); border-radius: 0; }
.bosco-theme .quick-actions a::after { content: '↗'; float: right; color: var(--theme-gold); }
.bosco-theme .quick-actions a:hover { background: var(--theme-surface); }
.bosco-theme :is(.attention, .notice, .success, .error, .help-note, .login-error, .login-status, .billing-status) { border-radius: 3px; }
.bosco-theme .workspace { padding: 0; margin: 0 auto; }
.bosco-theme .toolbar { padding: 20px 0; }
.bosco-theme .student-workbench { border-bottom: 1px solid var(--theme-line); }
.bosco-theme :is(.list-panel, .details-panel) { background: transparent; }
.bosco-theme .student-row { border-radius: 0; background: transparent; box-shadow: none; border: 0; border-bottom: 1px solid var(--theme-line); }
.bosco-theme .student-row.active { background: var(--theme-raised); box-shadow: inset 2px 0 var(--theme-gold); }
.bosco-theme .student-row:hover { background: var(--theme-surface); box-shadow: none; transform: none; }
.bosco-theme .student-profile { padding: 24px; }
.bosco-theme :is(.detail-card, .billing, .assign-panel, .academic-schedule) { padding: 20px 0; }
.bosco-theme :is(.billing-metrics > div, .billing-voucher, .billing-verified-fields, .billing-review-saved) { border-radius: 0; background: transparent; border: 0; border-top: 1px solid var(--theme-line); padding-inline: 0; }
.bosco-theme .billing-summary { padding: 24px 0; }
.bosco-theme :is(.migration-term-card, .migration-summary div, .migration-selection-tools, .migration-actions, .app-profile-section, .term-card, .offering-editor, .evaluation-stat, .review-grid section, .billing-grid > div, .curriculum-preview, .schedule-term, .table-wrapper, .student-bill-summary), .bosco-theme .onsite-application :is(.card, .requirement-item) { background: transparent; border: 0; border-top: 1px solid var(--theme-line); border-radius: 0; box-shadow: none; padding: 20px 0; }
.bosco-theme .schedule-box-head { background: transparent; padding-inline: 0; }
.bosco-theme :is(.address-picker, .requirement-review-item) { background: transparent; border: 0; border-top: 1px solid var(--theme-line); border-radius: 0; padding: 20px 0; }
.bosco-theme .school-account-logo { object-fit: contain; }
.bosco-theme .schedule-filter > *, .bosco-theme .billing-form > * { min-width: 0; }
.bosco-theme .list-empty { border: 0; border-radius: 0; }
.bosco-theme :is(input[type=checkbox], input[type=radio]) { accent-color: var(--theme-gold); }
.bosco-theme :is(.billing-metrics strong, .profile-title h2, .detail-card h3, .schedule-heading h3) { color: var(--theme-text); }
.bosco-theme :is(table, .table, .official-schedule) { background: transparent; border-radius: 0; }
.bosco-theme :is(th, td) { border-color: var(--theme-line); }
.bosco-theme :is(th, .table th, .billing-table th, .official-schedule th) { background: var(--theme-surface); color: var(--theme-muted); }
.bosco-theme tbody tr:hover { background: var(--theme-surface); }
.bosco-theme :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]), select, textarea) { background: #fff; border: 1px solid #c4d2e3; border-radius: 8px; color: var(--theme-text); }
.bosco-theme input::file-selector-button { background: var(--theme-raised); color: var(--theme-text); border: 0; border-right: 1px solid var(--theme-line); padding: 7px 12px; margin-right: 12px; cursor: pointer; }
.bosco-theme input:-webkit-autofill { -webkit-text-fill-color: var(--theme-text); box-shadow: 0 0 0 1000px #fff inset; }
.bosco-theme :is(button, .button, .primary, .secondary, .btn, .billing-button) { border-radius: 10px; }
.bosco-theme :is(.button, .primary, .btn, .billing-button), .bosco-theme .toolbar button, .bosco-theme .assign-panel button, .bosco-theme .profile-form-actions button:first-child { background: var(--theme-primary); color: #fff; border-color: var(--theme-primary); }
.bosco-theme :is(.button, .primary, .btn, .billing-button):hover { filter: brightness(1.15); }
.bosco-theme :is(.secondary, .billing-button.secondary) { background: var(--theme-raised); color: var(--theme-link); }
.bosco-theme :is(button.danger, .button.danger) { background: var(--theme-danger-bg); color: var(--theme-danger); }
.bosco-theme :is(.modal-content, .account-menu__panel) { background: var(--theme-surface); color: var(--theme-text); border: 1px solid var(--theme-line); border-radius: 5px; }
.bosco-theme .account-menu__logout { background: transparent; color: var(--theme-danger); }
.bosco-theme .account-menu__logout:hover { background: var(--theme-danger-bg); }
.bosco-theme .announcement-preview .school-news-item { background: transparent; }
.bosco-theme .announcement-preview { border-color: var(--theme-line); }
.bosco-theme .announcement-saved-list { gap: 40px; }
.bosco-theme .announcement-saved-actions { border-color: var(--theme-line); }

/* Authentication and registration share the same background and open form treatment. */
.bosco-theme .auth-page { grid-template-rows: auto 1fr auto; background: #fff; }
.bosco-theme .auth-card { padding: 30px 0; border-top-color: var(--theme-gold); }
.bosco-theme .auth-shell { width: min(1140px, 100%); }
.bosco-theme .auth-card h1 { font-family: Georgia, 'Times New Roman', serif; font-weight: 400; font-size: 38px; }
.bosco-theme .eyebrow { color: var(--theme-gold) !important; }
.bosco-theme :is(.field, .remember) { color: var(--theme-muted); }
.bosco-theme .crest-wrap { background: transparent; border: 0; box-shadow: none; border-radius: 0; }
.bosco-theme .auth-visual h2 { font-family: Georgia, 'Times New Roman', serif; font-size: 33px; font-weight: 400; }
.bosco-theme .auth-visual p { color: var(--theme-muted); font-size: 14px; }
.bosco-theme .auth-card .button { background: var(--theme-primary); color: #fff; }
.bosco-theme .student-type { background: transparent; border-radius: 3px; border-color: var(--theme-line); }
.bosco-theme .student-type:has(input:checked) { background: var(--theme-raised); border-color: var(--theme-gold); box-shadow: none; }
.bosco-theme .student-type:has(input:focus-visible) { outline: 2px solid var(--theme-gold); outline-offset: 4px; }
.bosco-theme .consent { background: var(--theme-surface); border-radius: 0; border-top: 1px solid var(--theme-line); }
.bosco-theme.receipt-page { margin: 40px auto; border: 1px solid var(--theme-line); }
.bosco-theme.receipt-page .row { border-color: var(--theme-line); }
.bosco-theme.receipt-page .void { color: var(--theme-danger); }
.bosco-theme fieldset, .bosco-theme .field { min-width: 0; }
.bosco-theme .field :is(input, select, textarea) { min-width: 0; width: 100%; }

/* Breeze profile, password confirmation, and fallback account screens. */
.bosco-theme :is(.bg-white, .bg-gray-100, .bg-gray-50) { background: var(--theme-bg); }
.bosco-theme :is(.text-gray-900, .text-gray-800, .text-gray-700) { color: var(--theme-text); }
.bosco-theme :is(.text-gray-600, .text-gray-500, .text-gray-400) { color: var(--theme-muted); }
.bosco-theme :is(.border-gray-100, .border-gray-200, .border-gray-300) { border-color: var(--theme-line); }
.bosco-theme :is(.shadow, .shadow-sm, .shadow-md) { box-shadow: none; border-radius: 0; border-top: 1px solid var(--theme-line); }
.bosco-theme .bg-gray-800 { background: var(--theme-primary); }
.bosco-theme .bg-red-600 { background: var(--theme-danger-bg); color: var(--theme-danger); }
.bosco-theme .text-red-600 { color: var(--theme-danger); }
.bosco-theme .text-green-600 { color: var(--theme-success); }

/* The crest's navy and royal blue frame a bright, readable workspace. */
.school-home :is(.school-header, .school-footer) {
    --school-navy: #fff;
    --school-ink: #fff;
    --school-muted: #dfebff;
    --school-line: #ffffff36;
    --theme-text: #fff;
    --theme-muted: #dfebff;
    --theme-line: #ffffff36;
    --theme-gold: #f0d58b;
    color: #fff;
}
.school-home .school-nav a, .school-home .school-footer h3 { color: #fff; }
.school-home .school-footer a:hover { color: #fff; }
.school-home .school-community { background: #102747; color: var(--theme-text); }
.school-home .school-community h2 { color: var(--theme-text); }
.school-home .school-community h2 em { color: var(--theme-gold); }
.school-home .school-community p:not(.school-kicker), .school-home .school-community .school-kicker { color: var(--theme-muted); }
.school-home .school-community .school-text-link { color: var(--theme-link); border-color: var(--theme-line); }
.school-home .school-community .school-background img { opacity: 1; }
.school-home .school-photo-section .school-text-link:hover { color: var(--theme-gold); }
.school-home .school-news-arrow { background: #fff; color: var(--theme-primary); }
.school-home .school-text-link:hover, .school-home .school-strands-strip a:hover strong { color: var(--theme-primary); }
.bosco-theme .top { color: #fff; }
.bosco-theme .auth-header__link { color: #fff; }
.bosco-theme .bar :is(.account-menu__trigger, .account-menu__name, .account-menu__role) { color: #fff; }
.bosco-theme .auth-visual { color: var(--theme-text); }
.bosco-theme .auth-card { border-top-color: var(--theme-primary); }
.bosco-theme .shell { min-height: calc(100vh - 170px); }
.bosco-theme .shell > aside :is(p, .staff-nav-toggle), .bosco-theme .staff-nav-chevron { color: var(--theme-primary); }
.bosco-theme .shell > aside a.active { border-left: 3px solid var(--theme-primary); }
.system-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px 32px; padding: 22px max(22px, 5vw); background: var(--theme-brand-gradient); color: #fff; font: 13px/1.6 "Segoe UI", Arial, sans-serif; }
.system-footer strong, .system-footer span { display: block; }
.system-footer strong { font-size: 14px; font-weight: 650; }
.system-footer span, .system-footer small { color: #dfebff; font-size: 12px; }
.bosco-theme .system-footer a { display: inline-flex; align-items: center; gap: 12px; color: #fff; text-decoration: none; }
.system-footer a:hover { text-decoration: underline; }
.bosco-theme .account-navigation { background: var(--theme-brand-gradient); border-color: #ffffff30; }
.bosco-theme .account-navigation :is(a, button) { color: #fff; }
.bosco-theme .account-navigation button { background: transparent; box-shadow: none; }
.bosco-theme .account-navigation .absolute a { color: var(--theme-text); }
.bosco-theme .account-navigation .absolute a:hover { background: var(--theme-raised); }
.bosco-theme .account-navigation .border-gray-200 { border-color: #ffffff30; }

/* Account actions keep their blue hue, with a softer shape and clearer states. */
.bosco-theme:not(.school-home) :where(button, .button, .primary, .secondary, .btn, .billing-button):not(:where(.password-toggle, .student-row, .address-clear-choice, .account-menu__logout, .dismissible-alert-close, .account-navigation button)) {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 44px; padding: 10px 18px; border-radius: 10px;
    border: 1px solid transparent; font: 600 14px/1.35 "Segoe UI", Arial, sans-serif;
    text-decoration: none; vertical-align: middle; text-align: center; text-transform: none; letter-spacing: normal;
    box-shadow: 0 2px 4px #173a8314;
    transition: background .18s, box-shadow .18s, transform .18s;
}
.bosco-theme:not(.school-home) :where(button, .button, .primary, .btn, .billing-button):not(:where(.secondary, .danger, .password-toggle, .student-row, .address-clear-choice, .address-clear-all, .address-retry, .account-menu__logout, .dismissible-alert-close, .account-navigation button)) {
    background: linear-gradient(180deg, #2d659f, #245994); color: #fff; border-color: #245994;
}
.bosco-theme:not(.school-home) :where(button, .button, .primary, .secondary, .btn, .billing-button):not(:where(.password-toggle, .student-row, .address-clear-choice, .account-menu__logout, .dismissible-alert-close, .account-navigation button)):hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 4px 9px #173a8326; filter: none; }
.bosco-theme:not(.school-home) :where(button, .button, .primary, .secondary, .btn, .billing-button):active:not(:disabled) { transform: translateY(0); box-shadow: none; }
.bosco-theme:not(.school-home) :is(.secondary, .billing-button.secondary) { border: 1px solid #bfd0e5; background: #f5f8fd; color: var(--theme-primary); }
.bosco-theme:not(.school-home) :is(button.danger, .button.danger, button.reject) { border: 1px solid #ecc4c8; background: var(--theme-danger-bg); color: var(--theme-danger); }
.bosco-theme:not(.school-home) button:disabled { opacity: .5; box-shadow: none; transform: none; }
.bosco-theme:not(.school-home) :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]), select) { min-height: 44px; padding: 10px 12px; font-size: 14px; }
.bosco-theme:not(.school-home) :is(input, select, textarea):disabled { background: var(--theme-surface); color: var(--theme-muted); }
.bosco-theme:not(.school-home) :is(input, textarea):focus-visible { outline-color: var(--theme-primary); }
.bosco-theme:not(.school-home) form > .grid, .bosco-theme:not(.school-home) form.grid { align-items: end; }
.bosco-theme .form-actions { display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.bosco-theme .form-actions button { margin: 0; }
.bosco-theme .billing-form { gap: 18px; }
.bosco-theme .billing-form :is(input:not([type=checkbox]):not([type=radio]), select, textarea) { margin: 0; }
.bosco-theme .billing-form > button { align-self: end; }

/* Account management uses the same field grid for creation and editing. */
.accounts-workspace { max-width: 1280px; margin-inline: auto; }
.accounts-workspace h1 { margin: 0 0 26px; font-size: clamp(27px, 3vw, 36px); letter-spacing: -.035em; }
.accounts-workspace .card > h2 { margin-bottom: 24px; }
.account-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 22px 24px; }
.account-fields > label { display: grid; align-content: start; gap: 8px; min-width: 0; font-size: 13px; font-weight: 600; color: var(--theme-text); }
.bosco-theme .account-fields :is(input, select) { width: 100%; height: 46px; margin: 0; font-weight: 400; }
.accounts-workspace .student-accounts-table { border-block: 1px solid var(--theme-line); }
.accounts-workspace table { margin-bottom: 0; }
.accounts-workspace :is(th, td) { padding: 15px 16px; vertical-align: middle; }
.accounts-workspace th { white-space: nowrap; }
.accounts-workspace td:last-child { white-space: nowrap; }
.accounts-workspace td[colspan] { white-space: normal; }
.accounts-workspace td form { margin: 0; }
.accounts-workspace .account-edit > summary { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; padding: 8px 0; font-size: 13px; font-weight: 650; color: var(--theme-link); }
.account-edit > summary::before { content: '+'; display: inline-block; font-size: 19px; font-weight: 400; }
.account-edit[open] > summary::before { content: '−'; }
.account-edit > summary::-webkit-details-marker { display: none; }
.accounts-workspace .account-edit form { margin-top: 16px; padding-bottom: 12px; }
.accounts-workspace .account-bulk-actions { gap: 12px 20px; padding-block: 4px 8px; }
.accounts-workspace .account-bulk-actions label { font-size: 13px; font-weight: 600; }
.accounts-workspace .account-bulk-actions button { margin-left: auto; }

/* Registrar review shows the decision and notes directly, with one category select. */
.bosco-theme .billing-review-form { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; max-width: 1040px; }
.billing-review .billing-choice-group { border: 0; padding: 0; margin: 0; min-width: 0; }
.billing-choice-group legend { padding: 0; margin-bottom: 10px; font-size: 13px; font-weight: 650; }
.billing-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 24px; }
.billing-choices-compact { grid-template-columns: repeat(2, minmax(100px, 180px)); }
.bosco-theme .billing-review .billing-choice { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border: 1px solid var(--theme-line); border-radius: 8px; background: #fff; min-height: 48px; cursor: pointer; }
.bosco-theme .billing-choice:has(input:checked) { background: #edf4ff; border-color: var(--theme-primary); }
.bosco-theme .billing-choice:has(input:focus-visible) { outline: 2px solid var(--theme-primary); outline-offset: 3px; }
.bosco-theme .billing-choice input { width: 17px; height: 17px; padding: 0; margin: 0; flex: 0 0 17px; accent-color: var(--theme-primary); }
.bosco-theme .billing-review .billing-verified-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; padding: 24px 0 0; }
.billing-ceiling-action { align-self: end; }
.billing-review-guidance { padding: 15px 18px; border-left: 3px solid #8fb2df; background: var(--theme-surface); }
.billing-review-guidance h3 { margin: 0 0 8px; font-size: 13px; font-weight: 650; }
.billing-review-guidance p { margin: 7px 0 0; font-size: 12px; line-height: 1.7; }
.billing-review .billing-check { margin-top: 4px; }
.billing-review .form-actions { margin-top: 0; }


/* Read-only student records use the same spacing as staff account fields. */
.student-details-page { max-width: 1120px; margin-inline: auto; }
.student-details-page header h2 { margin: 20px 0 8px; font-size: 22px; }
.student-details-section h2 { font-size: 20px; margin: 0 0 24px; }
.student-details-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 32px; margin: 0; }
.student-details-grid > div { min-width: 0; }
.student-details-grid dt { color: var(--theme-muted); font-size: 12px; font-weight: 600; margin-bottom: 6px; }
.student-details-grid dd { margin: 0; color: var(--theme-text); font-size: 15px; overflow-wrap: anywhere; }
@media (max-width: 1100px) { .student-details-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .student-details-grid { grid-template-columns: 1fr; gap: 20px; } }

/* Student actions stay together in an accessible popover above the workbench. */
.bosco-theme .student-profile .profile-header { grid-template-columns: auto minmax(0, 1fr) 44px; }
.student-profile .profile-title { min-width: 0; overflow-wrap: anywhere; }
.student-actions { justify-self: end; }
.bosco-theme .student-actions-toggle { width: 44px; height: 44px; padding: 10px !important; cursor: pointer; }
.bosco-theme .student-actions-toggle[aria-expanded="true"] { background: #173f70; box-shadow: 0 0 0 3px #dce9fa; }
.bosco-theme .student-actions-panel { position: fixed; inset: auto; margin: 0; width: 310px; max-width: calc(100vw - 24px); padding: 10px; overflow-y: auto; overscroll-behavior: contain; border: 1px solid var(--theme-line); border-radius: 14px; background: #fff; color: var(--theme-text); box-shadow: 0 14px 42px #142f532e; }
.student-actions-panel::backdrop { background: transparent; }
.student-actions-panel .student-actions-title { margin: 4px 10px 9px; color: var(--theme-muted); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.student-actions-panel form { margin: 0; }
.bosco-theme .student-actions-panel :is(button, a) { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 44px; padding: 11px 12px; border: 0; border-radius: 8px; background: transparent; color: var(--theme-text); font: 600 14px/1.4 "Segoe UI", Arial, sans-serif; text-align: left; text-decoration: none; box-shadow: none; cursor: pointer; }
.bosco-theme .student-actions-panel :is(button, a):hover:not(:disabled) { background: var(--theme-raised); transform: none; box-shadow: none; }
.bosco-theme .student-actions-panel .danger { color: var(--theme-danger); }
.bosco-theme .student-actions-panel .danger:hover { background: var(--theme-danger-bg); }
.student-actions-divider { height: 1px; margin: 8px 4px; background: var(--theme-line); }
.student-action-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.bosco-theme .student-profile > .back-to-list { margin-bottom: 18px; }
@media (max-width: 600px) {
    .bosco-theme .student-profile .profile-header { gap: 10px; }
    .student-profile .profile-avatar { width: 44px; height: 44px; font-size: 16px; }
    .student-profile .profile-title h2 { font-size: 22px; }
}
@media print { .student-actions, .student-actions-panel, .bosco-theme .student-profile > .back-to-list { display: none !important; } }

@media (max-width: 1100px) { .account-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) {
    .account-fields, .billing-choices, .bosco-theme .billing-review-form, .bosco-theme .billing-review .billing-verified-fields { grid-template-columns: 1fr; }
    .billing-choices-compact { grid-template-columns: 1fr 1fr; }
    .accounts-workspace .account-bulk-actions button { margin-left: 0; }
    .accounts-workspace :is(th, td) { padding: 12px; }
    .system-footer { align-items: flex-start; flex-direction: column; gap: 12px; }
    .system-footer small { order: 3; }
}

@media (max-width: 1100px) {
    .school-home .school-news-carousel { margin-inline: 16px; }
    .school-news-arrow-prev { left: -45px; }
    .school-news-arrow-next { right: -45px; }
    .school-home .school-news-item { padding-inline: 20px; }
    .bosco-theme .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bosco-theme .metric:nth-child(odd) { border-left: 0; padding-left: 0; }
    .bosco-theme .metric:nth-child(n+3) { border-top: 1px solid var(--theme-line); }
}
@media (max-width: 800px) {
    .school-home .school-header-inner { min-height: 106px; }
    .school-home .school-nav { gap: 13px; }
    .school-home .school-nav a { font-size: 11px; }
    .school-home .school-hero { min-height: 600px; padding-block: 64px; }
    .school-home .school-news-grid { grid-template-columns: 1fr; }
    .school-home .school-news-carousel { margin: 0; padding-bottom: 66px; }
    .school-home .school-news-item { padding: 28px 0; border-left: 0; border-top: 1px solid var(--theme-line); }
    .school-home .school-news-item:first-child { padding-top: 0; border-top: 0; }
    .school-home .school-news-controls { display: flex; justify-content: space-between; position: absolute; bottom: 0; width: 100%; }
    .school-home .school-news-arrow { position: static; }
    .school-home .school-community-inner { padding-block: 70px; }
    .school-home .school-footer-top { grid-template-columns: 1fr 1fr; }
    .school-strand-list > article { grid-template-columns: 75px 1fr; gap: 18px; }
    .school-strand-mark { display: none; }
    .school-about-sections > section { grid-template-columns: 1fr; gap: 12px; }
    .school-service-list { grid-template-columns: 1fr; gap: 15px; }
    .school-home .school-section { padding-block: 60px; }
}
@media (max-width: 760px) {
    .bosco-theme .shell { display: block; }
    .bosco-theme .shell > aside { border-right: 0; border-bottom: 1px solid var(--theme-line); }
    .bosco-theme .shell > main { padding: 25px 20px; }
    .bosco-theme .brand-with-crest img { width: 31px; height: 39px; }
    .bosco-theme .brand { font-size: 12px; }
    .bosco-theme .brand small { font-size: 9px; }
    .bosco-theme .student-profile { padding: 20px 8px; }
    .bosco-theme .auth-card { padding-inline: 0; }
    .bosco-theme .dashboard-grid > *, .bosco-theme .grid > * { min-width: 0; }
    .bosco-theme .card:has(> table), .bosco-theme [data-live-results]:has(> table) { overflow-x: auto; }
}
@media (max-width: 480px) {
    .school-home .school-hero { min-height: 560px; }
    .school-home .school-hero h1 { font-size: 49px; }
    .school-home .school-hero-actions { gap: 15px 10px; }
    .school-home .school-button { font-size: 12px; gap: 13px; padding-inline: 13px; }
    .school-home .school-hero-description { font-size: 14px; }
    .school-home .school-nav .school-login { padding: 6px 10px; gap: 8px; }
    .school-about-heading { align-items: flex-start; }
    .school-home .school-motion-toggle { max-width: 110px; }
    .school-strand-list > article { grid-template-columns: 1fr; gap: 12px; }
    .bosco-theme .metric { padding: 18px 12px; }
    .bosco-theme .metric strong { font-size: 29px; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .bosco-theme *, .bosco-theme *::before, .bosco-theme *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
    .school-about .school-slide { opacity: 0; }
    .school-about .school-slide-saint { opacity: 1; }
    .school-motion-toggle { display: none; }
}