:root {
  color-scheme: light;
  --bg: #f8f3e8;
  --surface: #fffdf8;
  --text: #28372d;
  --muted: #667267;
  --primary: #397052;
  --accent: #b96845;
  --border: #e4ddcf;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: 'Inter', sans-serif;
  background: linear-gradient(135deg, #f8f3e8, #edf4ea);
  color: var(--text);
}

/* Refresh cascade lock: keep the shared shell authoritative over legacy components. */
body { background: var(--bg); }
.portal-page { padding-bottom: 72px; }
.app-header { position: relative; min-height: 96px; padding: 20px 24px 16px; }
.app-header h1 { margin: 2px 0 0; font-size: clamp(1.45rem, 3vw, 2rem); letter-spacing: -.035em; }
.app-header .eyebrow { margin: 0 0 4px; font-size: .68rem; letter-spacing: .1em; }
.portal-nav { gap: 4px; margin-bottom: 24px; scrollbar-width: none; }
.nav-btn { min-height: 42px; padding: 8px 14px; border-radius: 10px; font-size: .82rem; white-space: nowrap; }
.nav-btn.active { background: var(--text); box-shadow: 0 4px 12px rgba(29,44,37,.16); }
.admin-card, .weekly-calendar-card, .volunteer-card, .recent-card, .availability-card,
.sessions-card, .message-card, .contact-card, .participant-payment-card,
.verification-card, .welcome-banner { border-color: var(--border); border-radius: 16px; box-shadow: var(--shadow); }
.admin-card { padding: 22px; }
.primary-btn { border-radius: 11px; background: var(--primary); box-shadow: none; }
.text-btn { border-color: var(--border); border-radius: 10px; }
.header-menu-toggle { display: none; }

@media (max-width: 760px) {
  .portal-page { padding-bottom: 94px; }
  .app-header { min-height: 82px; padding: 15px 16px 13px; }
  .app-header h1 { font-size: 1.35rem; }
  .instructor-subtitle { display: none; }
  .header-actions { position: absolute; top: calc(100% - 4px); right: 14px; z-index: 1500; display: none; width: min(280px, calc(100vw - 28px)); gap: 6px; padding: 8px; border: 1px solid var(--border); border-radius: 14px; background: #fff; box-shadow: 0 18px 45px rgba(29,44,37,.2); }
  .header-actions.is-open { display: grid; }
  .header-actions > * { width: 100%; min-height: 48px; justify-content: flex-start; text-align: left; }
  .header-menu-toggle { display: inline-flex; align-items: center; gap: 5px; min-height: 44px; padding: 8px 10px; border: 0; border-radius: 10px; background: var(--soft); color: var(--primary); font-weight: 750; cursor: pointer; }
  .header-menu-toggle span:first-child { font-size: 1.25rem; line-height: .7; }
  .header-menu-toggle span:last-child { font-size: .76rem; }
  .portal-nav { position: fixed; right: 0; bottom: 0; left: 0; z-index: 1000; max-width: none; margin: 0; padding: 8px 10px calc(8px + env(safe-area-inset-bottom)); overflow-x: auto; border-top: 1px solid var(--border); background: rgba(255,255,255,.96); box-shadow: 0 -8px 25px rgba(29,44,37,.08); backdrop-filter: blur(14px); }
  .nav-btn { flex: 1 0 auto; min-width: 76px; min-height: 50px; padding: 7px 11px; border-radius: 12px; font-size: .75rem; }
  .admin-nav .nav-btn { flex-basis: 82px; }
  .dashboard-view, .portal-content { padding-right: 14px; padding-left: 14px; }
  .weekly-calendar-card, .schedule-admin-layout, .quick-add-card, .admin-approval-layout,
  .volunteer-directory, .instructor-content, .staff-content, .staff-admin-area,
  .activity-panel { width: calc(100% - 28px); }
  .admin-card, .weekly-calendar-card, .volunteer-card, .recent-card, .availability-card,
  .sessions-card, .message-card, .contact-card, .participant-payment-card,
  .verification-card { padding: 17px; border-radius: 14px; box-shadow: 0 4px 18px rgba(29,44,37,.055); }
  .site-messenger { bottom: 82px; }
}

/* Brand lock: this block intentionally remains last in the cascade. */
:root {
  --bg: #f8f6fa;
  --surface: #ffffff;
  --text: #302a35;
  --muted: #716a78;
  --primary: #6d568f;
  --accent: #9b7fba;
  --border: #e5dfea;
  --soft: #f1ecf6;
  --shadow: 0 8px 28px rgba(72, 53, 91, .08);
}
body { background: linear-gradient(145deg, #faf8fc, #f4f0f7); }
.nav-btn:hover { background: #f0ebf4; }
.nav-btn.active { background: var(--primary); box-shadow: 0 4px 14px rgba(83, 61, 111, .22); }
.welcome-banner, .dashboard-hero { background: linear-gradient(135deg, #eee6f5, #faf7fc); border-color: #dfd3e8; }
.instructor-welcome { background: linear-gradient(135deg, #695184, #8d72a9); box-shadow: 0 12px 28px rgba(83, 61, 111, .2); }
.schedule-quick-bar, .instructor-schedule-hero, .demo-mode-banner { background: #594371; }
.schedule-quick-bar span, .instructor-schedule-hero > div:first-child > p:last-child, .demo-mode-banner span { color: #eadff2; }
.site-messenger-launcher, .site-messenger-header, .site-messenger-form button, .site-message-visitor p { background: var(--primary); }
.site-messenger-launcher { box-shadow: 0 8px 28px rgba(83, 61, 111, .28); }
.site-messenger-header small { color: #eee5f5; }
.header-menu-toggle { background: var(--soft); color: var(--primary); }
input:focus, select:focus, textarea:focus { outline-color: rgba(109, 86, 143, .18); }
.appointment-key, .participant-calendar-item.appointment { background: var(--primary); }
.quick-add-card { border-color: #d5c5e2; background: linear-gradient(135deg, #fdfbfe, #f3edf7); }
.quick-add-badge, .count-badge, .farm-link-type, .staff-type-badge, .activity-action-badge { background: var(--soft); color: var(--primary); }
.calendar-day.today header, .instructor-agenda-day.today > header { background: #f1ebf6; }
.schedule-pick-time, .calendar-session { background: #f3eef7; }
.calendar-session { border-color: #ddd0e7; }

/* Butterfly Dreams Farm brand palette: lavender, with deep tones for contrast. */
:root {
  --bg: #f8f6fa;
  --surface: #ffffff;
  --text: #302a35;
  --muted: #716a78;
  --primary: #6d568f;
  --accent: #9b7fba;
  --border: #e5dfea;
  --soft: #f1ecf6;
  --shadow: 0 8px 28px rgba(72, 53, 91, .08);
}

body { background: linear-gradient(145deg, #faf8fc, #f4f0f7); }
.nav-btn:hover { background: #f0ebf4; }
.nav-btn.active { background: var(--primary); box-shadow: 0 4px 14px rgba(83, 61, 111, .22); }
.welcome-banner, .dashboard-hero { background: linear-gradient(135deg, #eee6f5, #faf7fc); border-color: #dfd3e8; }
.instructor-welcome { background: linear-gradient(135deg, #695184, #8d72a9); box-shadow: 0 12px 28px rgba(83, 61, 111, .2); }
.schedule-quick-bar, .instructor-schedule-hero, .demo-mode-banner { background: #594371; }
.schedule-quick-bar span, .instructor-schedule-hero > div:first-child > p:last-child,
.demo-mode-banner span { color: #eadff2; }
.site-messenger-launcher, .site-messenger-header, .site-messenger-form button,
.site-message-visitor p { background: var(--primary); }
.site-messenger-launcher { box-shadow: 0 8px 28px rgba(83, 61, 111, .28); }
.site-messenger-header small { color: #eee5f5; }
.header-menu-toggle { background: var(--soft); color: var(--primary); }
input:focus, select:focus, textarea:focus { outline-color: rgba(109, 86, 143, .18); }
.appointment-key, .participant-calendar-item.appointment { background: var(--primary); }
.quick-add-card { border-color: #d5c5e2; background: linear-gradient(135deg, #fdfbfe, #f3edf7); }
.quick-add-badge, .count-badge, .farm-link-type, .staff-type-badge,
.activity-action-badge { background: var(--soft); color: var(--primary); }
.approval-status.eligible, .requirement-done, .billing-paid-alert,
.billing-all-current { background: #f0eaf5; border-color: #cdbbdc; color: var(--primary); }
.calendar-day.today header, .instructor-agenda-day.today > header { background: #f1ebf6; }
.instructor-agenda-day.today { border-color: #b9a2cb; box-shadow: 0 0 0 2px #e8dfee; }
.schedule-pick-time, .calendar-session { background: #f3eef7; }
.calendar-session { border-color: #ddd0e7; }

/* 2026 visual refresh: a quieter, mobile-first shell shared by every portal. */
:root {
  --bg: #f5f7f4;
  --surface: #ffffff;
  --text: #1d2c25;
  --muted: #69766f;
  --primary: #245d46;
  --accent: #cf7650;
  --border: #dfe5e1;
  --soft: #edf4ef;
  --shadow: 0 8px 28px rgba(29, 44, 37, .07);
}

body { background: var(--bg); }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
.portal-page { padding-bottom: 72px; }
.app-header {
  position: relative;
  min-height: 96px;
  padding: 20px 24px 16px;
  background: transparent;
}
.app-header h1 { margin: 2px 0 0; font-size: clamp(1.45rem, 3vw, 2rem); letter-spacing: -.035em; }
.app-header .eyebrow { margin: 0 0 4px; font-size: .68rem; letter-spacing: .1em; }
.instructor-subtitle { margin: 5px 0 0; color: var(--muted); font-size: .82rem; }
.header-menu-toggle { display: none; }

.portal-nav {
  gap: 4px;
  margin-bottom: 24px;
  scrollbar-width: none;
}
.portal-nav::-webkit-scrollbar { display: none; }
.nav-btn { min-height: 42px; padding: 8px 14px; border-radius: 10px; font-size: .82rem; white-space: nowrap; }
.nav-btn:hover { background: #e8eeea; color: var(--text); }
.nav-btn.active { background: var(--text); box-shadow: 0 4px 12px rgba(29,44,37,.16); }

.admin-card, .weekly-calendar-card, .volunteer-card, .recent-card,
.availability-card, .sessions-card, .message-card, .contact-card,
.participant-payment-card, .verification-card, .welcome-banner {
  border-color: var(--border);
  border-radius: 16px;
  box-shadow: var(--shadow);
}
.admin-card { padding: 22px; }
.step-label { color: var(--primary); font-size: .68rem; letter-spacing: .08em; }
h1, h2, h3 { text-wrap: balance; }
h2 { letter-spacing: -.025em; }
.primary-btn { border-radius: 11px; background: var(--primary); box-shadow: none; }
.text-btn { border-color: var(--border); border-radius: 10px; }
input, select, textarea { border-color: #cbd5cf !important; border-radius: 10px !important; background: #fff; }
input:focus, select:focus, textarea:focus { outline: 3px solid rgba(36,93,70,.14); border-color: var(--primary) !important; }
.count-badge { background: var(--soft); color: var(--primary); }
.welcome-banner, .dashboard-hero, .instructor-welcome { background: linear-gradient(135deg, #e8f2eb, #f7f4ea); }

@media (max-width: 760px) {
  body { padding-bottom: env(safe-area-inset-bottom); }
  .portal-page { padding-bottom: 94px; }
  .app-header { min-height: 82px; padding: 15px 16px 13px; }
  .app-header h1 { font-size: 1.35rem; }
  .app-header .eyebrow { margin-bottom: 2px; }
  .instructor-subtitle { display: none; }
  .header-actions {
    position: absolute;
    top: calc(100% - 4px);
    right: 14px;
    z-index: 1500;
    display: none;
    width: min(280px, calc(100vw - 28px));
    gap: 6px;
    padding: 8px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(29,44,37,.2);
  }
  .header-actions.is-open { display: grid; }
  .header-actions > * { width: 100%; min-height: 48px; justify-content: flex-start; text-align: left; }
  .header-actions .primary-btn { justify-content: center; }
  .header-menu-toggle {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 44px;
    padding: 8px 10px;
    border: 0;
    border-radius: 10px;
    background: var(--soft);
    color: var(--primary);
    font-weight: 750;
    cursor: pointer;
  }
  .header-menu-toggle span:first-child { font-size: 1.25rem; line-height: .7; }
  .header-menu-toggle span:last-child { font-size: .76rem; }
  .portal-nav {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1000;
    max-width: none;
    margin: 0;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom));
    overflow-x: auto;
    border-top: 1px solid var(--border);
    background: rgba(255,255,255,.96);
    box-shadow: 0 -8px 25px rgba(29,44,37,.08);
    backdrop-filter: blur(14px);
  }
  .nav-btn { flex: 1 0 auto; min-width: 76px; min-height: 50px; padding: 7px 11px; border-radius: 12px; font-size: .75rem; }
  .admin-nav .nav-btn { flex-basis: 82px; }
  .dashboard-view, .portal-content { padding-right: 14px; padding-left: 14px; }
  .admin-card, .weekly-calendar-card, .volunteer-card, .recent-card,
  .availability-card, .sessions-card, .message-card, .contact-card,
  .participant-payment-card, .verification-card { padding: 17px; border-radius: 14px; box-shadow: 0 4px 18px rgba(29,44,37,.055); }
  .weekly-calendar-card, .schedule-admin-layout, .quick-add-card,
  .admin-approval-layout, .volunteer-directory, .instructor-content,
  .staff-content, .staff-admin-area, .activity-panel {
    width: calc(100% - 28px);
  }
  .welcome-banner { padding: 20px; }
  .volunteer-summary { gap: 8px; margin: 12px 0 22px; }
  .volunteer-summary div { padding: 13px; }
  .participant-payment-card { gap: 16px; }
  .primary-btn, .text-btn, .button-link { min-height: 48px; }
  .site-messenger { bottom: 82px; }
  .standalone-schedule-page { padding-bottom: 28px; }
  .standalone-schedule-page .app-header > .button-link { min-width: 72px; }
}

.cancellation-weekly, .cancellation-availability-card fieldset { border: 1px solid #dce7df; border-radius: 14px; padding: 16px; }
.cancellation-day-grid, .cancellation-exception-list, .open-spot-list { display: grid; gap: 10px; }
.cancellation-day-row, .cancellation-exception-row { display: grid; grid-template-columns: minmax(130px, 1fr) minmax(100px, 140px) auto minmax(100px, 140px) auto; gap: 10px; align-items: center; }
.cancellation-day-row label { font-weight: 600; }
.open-spot-item { display: flex; justify-content: space-between; gap: 18px; padding: 16px; border: 1px solid #dce7df; border-left: 4px solid #b96845; border-radius: 14px; background: #fff; }
.open-spot-item h3, .open-spot-item p { margin: 3px 0; }
.open-spot-candidates { display: grid; gap: 8px; min-width: min(100%, 280px); align-content: start; }
@media (max-width: 680px) {
  .cancellation-day-row, .cancellation-exception-row { grid-template-columns: 1fr 1fr; }
  .cancellation-day-row label, .cancellation-exception-row input[type="date"] { grid-column: 1 / -1; }
  .open-spot-item { flex-direction: column; }
}

/* Keep the Admin phone bar to five calm, always-visible choices. */
@media (max-width: 760px) {
  .admin-nav > .nav-btn { min-width: 64px; flex: 1 1 0; }
}

/* Compact mobile navigation: one obvious control, with every destination
   visible by name instead of hidden beyond a horizontal scroll. */
.mobile-page-chooser { display: none; }

@media (max-width: 720px) {
  .portal-page { padding-bottom: 28px; }

  .mobile-page-chooser {
    display: grid;
    gap: 6px;
    width: calc(100% - 28px);
    max-width: 1080px;
    margin: 0 auto 18px;
  }

  .mobile-page-chooser.hidden { display: none; }
  .mobile-page-chooser > span {
    color: var(--muted);
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  .mobile-page-chooser select {
    width: 100%;
    min-height: 52px;
    padding: 0 44px 0 15px;
    border: 2px solid var(--primary);
    border-radius: 13px;
    background-color: #fff;
    color: var(--text);
    font: inherit;
    font-weight: 800;
    box-shadow: 0 6px 18px rgba(29, 44, 37, .08);
  }

  .admin-subnav { display: none !important; }

  /* Familiar app pattern: the few primary destinations are always reachable
     with one tap; only contextual/secondary pages use the chooser above. */
  .portal-page { padding-bottom: 94px; }
  .portal-nav,
  .horse-portal-nav {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1000;
    display: flex !important;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 7px 8px calc(7px + env(safe-area-inset-bottom));
    overflow: visible;
    border: 0;
    border-top: 1px solid var(--border);
    border-radius: 0;
    background: rgba(255, 255, 255, .97);
    box-shadow: 0 -8px 24px rgba(29, 44, 37, .1);
    backdrop-filter: blur(14px);
  }

  .portal-nav > .nav-btn,
  .horse-portal-nav > .nav-btn {
    flex: 1 1 0;
    min-width: 0;
    min-height: 52px;
    padding: 7px 3px;
    border-radius: 11px;
    overflow: hidden;
    font-size: clamp(.62rem, 2.7vw, .74rem);
    text-overflow: ellipsis;
  }

  .portal-nav > .nav-btn.active,
  .horse-portal-nav > .nav-btn.active {
    background: var(--soft);
    color: var(--primary);
    box-shadow: none;
  }

  .admin-layered-nav {
    display: grid;
    gap: 10px;
    width: 100%;
    margin: 0 0 18px;
  }

  .admin-layered-nav > .mobile-page-chooser { margin-bottom: 0; }
  .admin-secondary-tabs { margin: 0; padding: 0; border: 0; background: transparent; }
  .admin-secondary-tabs .mobile-page-chooser { margin-bottom: 0; }

  .site-messenger { bottom: 82px; }
}

/* Unified management-system shell */
.management-sidebar, .management-bottom-nav { display: none; }

@media (min-width: 721px) {
  body.has-management-shell { padding-left: 248px; }
  .management-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 2000;
    display: flex;
    flex-direction: column;
    width: 248px;
    padding: 22px 14px 16px;
    border-right: 1px solid var(--border);
    background: #fff;
    box-shadow: 8px 0 30px rgba(29, 44, 37, .05);
  }
  .management-brand { display: flex; align-items: center; gap: 11px; margin: 0 7px 24px; color: var(--text); font-weight: 800; line-height: 1.1; text-decoration: none; }
  .management-brand small { color: var(--muted); font-size: .7rem; font-weight: 600; }
  .management-brand-mark { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--primary); color: #fff; font-size: .72rem; letter-spacing: .05em; }
  .management-main-nav { display: grid; gap: 5px; overflow-y: auto; }
  .management-nav-group { display: grid; gap: 3px; }
  .management-nav-primary, .management-nav-child {
    display: flex; align-items: center; width: 100%; border: 0; background: transparent; color: var(--text); font: inherit; text-align: left; text-decoration: none; cursor: pointer;
  }
  .management-nav-primary { gap: 11px; min-height: 44px; padding: 9px 11px; border-radius: 10px; font-size: .88rem; font-weight: 750; }
  .management-nav-primary > span { display: inline-grid; place-items: center; width: 22px; color: var(--muted); font-size: .86rem; }
  .management-nav-group.active > .management-nav-primary, .management-nav-primary.active, .management-nav-primary:hover { background: var(--soft); color: var(--primary); }
  .management-nav-children { display: none; gap: 2px; padding: 2px 0 7px 43px; }
  .management-nav-group.active .management-nav-children { display: grid; }
  .management-nav-child { min-height: 34px; padding: 7px 9px; border-radius: 8px; color: var(--muted); font-size: .78rem; font-weight: 650; }
  .management-nav-child:hover, .management-nav-child.active { background: #f3f5f2; color: var(--primary); }
  .management-sidebar-footer { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--border); }
  .role-switcher summary { padding: 11px; border-radius: 9px; color: var(--muted); font-size: .8rem; font-weight: 750; cursor: pointer; }
  .role-switcher[open] summary { background: var(--soft); color: var(--primary); }
  .role-switcher div { display: grid; gap: 2px; padding: 5px; }
  .role-switcher a { padding: 8px; border-radius: 7px; color: var(--text); font-size: .78rem; text-decoration: none; }
  .role-switcher a:hover { background: var(--soft); }

  #admin-view > .admin-layered-nav, #admin-view > .admin-flat-nav { display: none; }
  #admin-view > .app-header .header-actions a[href*="participant"],
  #admin-view > .app-header .header-actions a[href*="instructor"],
  #admin-view > .app-header .header-actions a[href*="volunteer"],
  #admin-view > .app-header .header-actions a[href="staff.html"] { display: none; }
}

@media (max-width: 720px) {
  .management-sidebar { display: none; }
  .management-bottom-nav {
    position: fixed; right: 0; bottom: 0; left: 0; z-index: 2100;
    display: flex; overflow-x: auto;
    padding: 7px 7px calc(7px + env(safe-area-inset-bottom));
    border-top: 1px solid var(--border); background: rgba(255,255,255,.97); box-shadow: 0 -8px 24px rgba(29,44,37,.1);
  }
  .management-bottom-nav button, .management-bottom-nav a { display: grid; flex: 0 0 auto; place-items: center; min-width: max-content; min-height: 50px; padding: 4px 12px; border: 0; border-radius: 10px; background: transparent; color: var(--muted); font: inherit; font-size: .68rem; font-weight: 750; text-decoration: none; }
  .management-bottom-nav button span { font-size: .9rem; }
  #admin-view > .admin-layered-nav, #admin-view > .admin-flat-nav { display: none !important; }
}
.demo-mode-banner { position: sticky; top: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; gap: 14px; min-height: 46px; padding: 8px 18px; background: #183f32; color: white; box-shadow: 0 3px 12px rgba(20,33,61,.18); }
.demo-mode-banner span { color: #d7e7df; font-size: .78rem; }
.demo-mode-banner button { min-height: 32px; padding: 6px 11px; border: 0; border-radius: 8px; background: white; color: var(--primary); font-weight: 800; cursor: pointer; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.site-messenger { position: fixed; right: 22px; bottom: 22px; z-index: 1200; font-family: inherit; }
.site-messenger-launcher { display: flex; align-items: center; gap: 9px; min-height: 52px; padding: 12px 18px; border: 0; border-radius: 999px; background: #275c49; color: #fff; box-shadow: 0 8px 28px rgba(18, 46, 37, .3); font: inherit; font-weight: 800; cursor: pointer; }
.site-messenger-launcher span:first-child { font-size: 1.2rem; }
.site-messenger-panel { width: min(370px, calc(100vw - 28px)); overflow: hidden; border: 1px solid rgba(39, 92, 73, .18); border-radius: 18px; background: #fff; box-shadow: 0 16px 48px rgba(18, 46, 37, .28); }
.site-messenger-header { display: flex; align-items: center; justify-content: space-between; padding: 16px 17px; background: #275c49; color: #fff; }
.site-messenger-header div { display: grid; gap: 3px; }
.site-messenger-header small { color: #d9eee5; }
.site-messenger-header small span { display: inline-block; width: 7px; height: 7px; margin-right: 4px; border-radius: 50%; background: #76d69f; }
.site-messenger-header button { border: 0; background: transparent; color: #fff; font-size: 1.7rem; line-height: 1; cursor: pointer; }
.site-messenger-thread { display: flex; flex-direction: column; gap: 10px; height: 300px; padding: 16px; overflow-y: auto; background: #f6f8f4; }
.site-message { max-width: 82%; }
.site-message p { margin: 0; padding: 10px 12px; border-radius: 14px; background: #fff; color: #23332d; box-shadow: 0 1px 4px rgba(18, 46, 37, .09); line-height: 1.42; }
.site-message time { display: block; margin: 4px 5px 0; color: #6d7d76; font-size: .7rem; }
.site-message-visitor { align-self: flex-end; }
.site-message-visitor p { background: #275c49; color: #fff; border-bottom-right-radius: 4px; }
.site-message-visitor time { text-align: right; }
.site-message-farm { align-self: flex-start; }
.site-message-farm p { border-bottom-left-radius: 4px; }
.site-messenger-form { display: grid; grid-template-columns: 1fr auto; gap: 9px; align-items: end; padding: 12px; border-top: 1px solid #e0e6e2; }
.site-messenger-form input { grid-column: 1 / -1; min-height: 43px; padding: 10px 11px; border: 1px solid #bdc9c3; border-radius: 10px; font: inherit; }
.site-messenger-form select { grid-column: 1 / -1; min-height: 43px; padding: 9px 11px; border: 1px solid #bdc9c3; border-radius: 10px; background: #fff; font: inherit; }
.site-messenger-form textarea { min-height: 43px; max-height: 100px; resize: vertical; padding: 10px 11px; border: 1px solid #bdc9c3; border-radius: 10px; font: inherit; }
.site-messenger-form button { min-height: 43px; padding: 9px 14px; border: 0; border-radius: 10px; background: #275c49; color: #fff; font-weight: 800; cursor: pointer; }
.site-messenger-form button:disabled { opacity: .55; }
.site-messenger-note { margin: 0; padding: 0 12px 10px; color: #718079; font-size: .7rem; text-align: center; }
.demo-open-profile { display: inline-flex; align-items: center; gap: 7px; width: fit-content; margin-top: 12px; padding: 9px 13px; border: 1px solid #397052; border-radius: 9px; color: #275c49; background: #f2f8f4; font-weight: 800; text-decoration: none; }
.demo-open-profile:hover, .demo-open-profile:focus-visible { background: #275c49; color: #fff; }

.demo-role-banner { display: flex; align-items: center; justify-content: space-between; gap: 18px; width: min(1080px, calc(100% - 48px)); margin: 0 auto 18px; padding: 13px 16px; border: 1px solid #c9bde0; border-radius: 13px; background: #f3eef9; color: #382b4e; }
.demo-role-banner div { display: flex; align-items: baseline; flex-wrap: wrap; gap: 5px 10px; }
.demo-role-banner span { color: #72589a; font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.demo-role-banner strong { font-size: .9rem; }.demo-role-banner small { color: var(--muted); }
.demo-role-banner a { color: #5a407e; font-size: .78rem; font-weight: 800; }
@media (max-width: 720px) { .demo-role-banner { align-items: flex-start; flex-direction: column; width: calc(100% - 28px); margin-top: 4px; }.demo-role-banner div { display: grid; gap: 3px; } }
.admin-demo-link { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 8px 14px; text-decoration: none; white-space: nowrap; }
@media (max-width: 600px) { .site-messenger { right: 14px; bottom: 14px; } .site-messenger-panel { width: calc(100vw - 28px); } .site-messenger-thread { height: min(330px, 48vh); } }
@media (max-width: 600px) { .demo-mode-banner { align-items: flex-start; flex-wrap: wrap; gap: 5px 10px; padding: 8px 12px; } .demo-mode-banner span { order: 3; width: 100%; text-align: center; } }

.participant-payment-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin: 18px 0 24px;
  padding: 22px 24px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: var(--surface);
  box-shadow: 0 10px 24px rgba(20, 33, 61, .05);
}
.participant-next-session-card { margin-bottom: 18px; }
.participant-next-session-card .content-heading { margin-top: 0; }
.participant-payment-card h2 { margin: 3px 0 6px; }
.participant-payment-card p:last-child { margin: 0; color: var(--muted); }
.participant-payment-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.payment-btn { min-width: 150px; padding: 13px 18px; border-radius: 12px; color: #fff; font-weight: 800; text-align: center; text-decoration: none; }
.payment-btn span { display: block; margin-top: 2px; font-size: .78rem; font-weight: 600; opacity: .9; }
.venmo-payment-btn { background: #008cff; }
.paypal-payment-btn { background: #003087; }
.payment-btn:hover { filter: brightness(.94); transform: translateY(-1px); }
.payment-btn:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.payment-progress-card { margin: -12px 0 20px; padding: 14px 18px; border: 1px solid var(--border); border-radius: 13px; background: #f8faf7; }
.payment-progress-card > div { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.payment-progress-card p { margin: 0; color: var(--muted); font-size: .86rem; line-height: 1.45; }
.payment-progress-card .text-btn { margin-top: 12px; }
.payment-progress-card .auth-message { margin-top: 10px; }
.billing-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-bottom:20px; }
.billing-heading h2 { margin:3px 0 5px; }
.billing-at-glance { margin-bottom:20px; border:2px solid #a8c3ae; background:#fbfdfb; }
.billing-open-invoices { display:grid; gap:12px; margin-top:16px; }
.billing-open-row { display:grid; grid-template-columns:minmax(170px,1fr) minmax(280px,1.25fr) auto; gap:18px; align-items:center; padding:17px; border:1px solid var(--border); border-radius:14px; background:#fff; }
.billing-open-person { display:grid; gap:5px; }
.billing-open-person strong { font-size:1.08rem; }
.billing-open-person span { color:var(--muted); font-size:.8rem; }
.billing-open-numbers { display:grid; grid-template-columns:repeat(3,minmax(72px,1fr)); gap:8px; }
.billing-open-numbers span { display:grid; gap:3px; padding:8px 10px; border-radius:9px; background:#f5f7f3; }
.billing-open-numbers small { color:var(--muted); font-size:.67rem; font-weight:800; text-transform:uppercase; }
.billing-open-numbers b { font-size:1rem; }
.billing-open-numbers .billing-open-due { background:#fff1df; }
.billing-open-due b { color:#9a4e16; font-size:1.15rem; }
.billing-open-actions { display:grid; gap:8px; min-width:170px; }
.billing-all-current { padding:24px; border-radius:13px; background:#edf7f0; text-align:center; }
.billing-all-current strong { color:var(--primary); font-size:1.15rem; }
.billing-all-current p { margin:5px 0 0; color:var(--muted); }
.billing-settings-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-bottom:20px; }
.billing-settings-grid hr { margin:22px 0; border:0; border-top:1px solid var(--border); }
.billing-package-list,.participant-billing-accounts { display:grid; gap:9px; margin-top:16px; }
.billing-package-list article,.billing-account { display:flex; justify-content:space-between; gap:14px; align-items:center; padding:12px; border:1px solid var(--border); border-radius:12px; background:#fafbf8; }
.billing-package-list article>div,.billing-account>div { display:grid; gap:3px; }
.billing-package-list span,.billing-account span { color:var(--muted); font-size:.8rem; }
.billing-account>div:last-child { text-align:right; }
.billing-account.invoice_due { border-color:#d5a73b; background:#fff9e8; }
.participant-billing-alerts { display:grid; gap:10px; margin:16px 0; }
.billing-due-alert,.billing-paid-alert { padding:16px; border:1px solid #d5a73b; border-left:5px solid #d5a73b; border-radius:13px; background:#fff9e8; }
.billing-paid-alert { border-color:var(--primary); border-left-color:var(--primary); background:#edf7f0; }
.billing-due-alert p,.billing-paid-alert p { margin:5px 0 0; color:var(--muted); }
.billing-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:20px; }
.billing-summary article { padding:18px; border:1px solid var(--border); border-radius:16px; background:#fff; box-shadow:var(--shadow); }
.billing-summary span { display:block; color:var(--muted); font-size:.82rem; font-weight:700; }
.billing-summary strong { display:block; margin-top:7px; color:var(--ink); font-size:1.45rem; }
.billing-report-card { margin-bottom:20px; }
.billing-report-filters { display:grid; grid-template-columns:repeat(4,minmax(140px,1fr)) auto; gap:12px; align-items:end; margin-top:16px; }
.billing-report-filters label { display:grid; gap:6px; color:var(--ink); font-size:.8rem; font-weight:800; }
.billing-report-filters input,.billing-report-filters select { width:100%; }
.billing-report-output { margin-top:20px; }
.billing-report-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.billing-report-summary article { padding:13px; border-radius:12px; background:#f5f7f3; }
.billing-report-summary span { display:block; color:var(--muted); font-size:.75rem; font-weight:700; }
.billing-report-summary strong { display:block; margin-top:5px; font-size:1.15rem; }
.billing-report-count { margin:16px 0 8px; color:var(--muted); font-size:.82rem; font-weight:700; }
.billing-report-table-wrap { overflow-x:auto; border:1px solid var(--border); border-radius:12px; }
.billing-report-table { width:100%; border-collapse:collapse; font-size:.8rem; }
.billing-report-table th,.billing-report-table td { padding:10px; border-bottom:1px solid var(--border); text-align:left; vertical-align:top; }
.billing-report-table th { background:#f5f7f3; color:var(--muted); font-size:.7rem; text-transform:uppercase; white-space:nowrap; }
.billing-report-table tbody tr:last-child td { border-bottom:0; }
.billing-report-table .report-money { text-align:right; white-space:nowrap; font-weight:800; }
.billing-report-actions { margin-top:14px; }
.billing-layout { display:grid; grid-template-columns:minmax(300px,.8fr) minmax(440px,1.5fr); gap:20px; align-items:start; }
.billing-ledger-card { min-width:0; }
.billing-filters { display:grid; grid-template-columns:1fr 180px; gap:10px; margin:16px 0; }
.billing-filters input,.billing-filters select { width:100%; }
.billing-ledger { display:grid; gap:12px; }
.billing-record { padding:17px; border:1px solid var(--border); border-left:5px solid #d5a73b; border-radius:14px; background:#fff; }
.billing-record.verified { border-left-color:var(--primary); }
.billing-record-main { display:flex; justify-content:space-between; gap:18px; }
.billing-record-main>div { min-width:0; }
.billing-record-main strong { display:block; margin-top:5px; }
.billing-record-main p { margin:3px 0 0; color:var(--muted); }
.billing-record-amount { white-space:nowrap; font-size:1.2rem; }
.billing-type { display:inline-block; padding:3px 8px; border-radius:999px; background:#eef2ed; color:var(--primary); font-size:.7rem; font-weight:800; text-transform:uppercase; }
.billing-type.payment { background:#e8f4ed; }
.billing-type.credit { background:#eaf0f9; color:#315d87; }
.billing-record dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:14px 0; }
.billing-record dt { color:var(--muted); font-size:.7rem; font-weight:800; text-transform:uppercase; }
.billing-record dd { overflow-wrap:anywhere; margin:3px 0 0; font-size:.86rem; }
.billing-internal-note { padding:9px 11px; border-radius:9px; background:#f6f4ed; color:var(--muted); font-size:.84rem; }
.instructor-notification-card { margin:24px 0; }
.payment-notification>div { display:flex; justify-content:space-between; gap:10px; }
@media (max-width:900px) { .billing-open-row{grid-template-columns:1fr}.billing-open-actions{grid-template-columns:1fr 1fr}.billing-summary,.billing-report-summary{grid-template-columns:repeat(2,1fr)} .billing-report-filters{grid-template-columns:repeat(2,1fr)} .billing-layout,.billing-settings-grid{grid-template-columns:1fr} }
@media (max-width:560px) { .billing-heading{flex-direction:column}.billing-open-numbers,.billing-open-actions{grid-template-columns:1fr} .billing-summary,.billing-report-summary,.billing-report-filters,.billing-filters{grid-template-columns:1fr} .billing-record dl{grid-template-columns:repeat(2,minmax(0,1fr))} }

@media (max-width: 640px) {
  .participant-payment-card { align-items: stretch; flex-direction: column; }
  .participant-payment-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .payment-btn { min-width: 0; }
}

.admin-forms-panel,
.shared-forms-dialog {
  color: var(--text, #24342c);
}

.forms-admin-layout {
  display: grid;
  grid-template-columns: minmax(280px, 0.8fr) minmax(360px, 1.2fr);
  gap: 22px;
  padding: 24px;
}

.form-audience-fieldset {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 16px;
  border: 1px solid #cfdad3;
  border-radius: 14px;
}

.form-audience-fieldset label {
  display: flex;
  align-items: center;
  gap: 9px;
  font-weight: 600;
}

.required-form-toggle {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 14px;
  border: 2px solid #d9a39a;
  border-radius: 14px;
  background: #fff7f5;
}

.required-form-toggle span { display: grid; gap: 3px; }
.required-form-toggle small { color: #6d5a55; font-weight: 400; }

.shared-forms-dialog {
  width: min(760px, calc(100% - 28px));
  max-height: 86vh;
  padding: 0;
  border: 0;
  border-radius: 20px;
  box-shadow: 0 24px 70px rgba(25, 43, 33, 0.28);
}

.shared-forms-dialog::backdrop { background: rgba(23, 35, 29, 0.55); }
.shared-forms-heading { display: flex; justify-content: space-between; gap: 20px; padding: 24px; border-bottom: 1px solid #e2e9e4; }
.shared-forms-heading h2, .shared-form-card h3 { margin: 0; }
.shared-forms-heading p:last-child { margin-bottom: 0; }
.shared-forms-list { display: grid; gap: 14px; padding: 20px; }

.shared-form-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 16px;
  border: 1px solid #dce6df;
  border-radius: 16px;
  background: #fff;
}

.shared-form-card p { margin: 5px 0; }
.shared-form-title { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.required-form-badge, .optional-form-badge { padding: 4px 8px; border-radius: 999px; font-size: .74rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.required-form-badge { color: #842f25; background: #f9ddd8; }
.optional-form-badge { color: #526158; background: #edf1ee; }
.required-form-note { color: #842f25; }
.shared-form-card small { color: #66736c; }
.shared-form-icon { display: grid; place-items: center; width: 46px; height: 52px; border-radius: 9px; color: #fff; background: #397052; font-size: 0.72rem; font-weight: 800; }
.shared-form-actions { display: flex; flex-direction: column; gap: 8px; align-items: stretch; }
.form-audience { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 10px; font-size: 0.84rem; }
.form-audience span { padding: 4px 8px; border-radius: 999px; background: #edf5ef; color: #315f45; font-weight: 700; }

@media (max-width: 760px) {
  .forms-admin-layout { grid-template-columns: 1fr; padding: 16px; }
  .shared-form-card { grid-template-columns: auto minmax(0, 1fr); }
  .shared-form-actions { grid-column: 1 / -1; flex-direction: row; }
  .shared-form-actions > * { flex: 1; text-align: center; }
}

button,
input,
textarea {
  font: inherit;
}

.field-help { display: block; margin-top: 6px; color: var(--muted); font-size: .76rem; }

.eyebrow {
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-size: 0.8rem;
  font-weight: 700;
  opacity: 0.8;
}

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

.primary-btn {
  display: inline-block;
  margin-top: 18px;
  padding: 13px 18px;
  background: linear-gradient(135deg, var(--primary), #3d7de0);
  color: white;
  border: none;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(45, 108, 223, 0.18);
}

.hero-card,
.card,
.portal-panel,
.module-card {
  background: var(--surface);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 20px;
  box-shadow: 0 12px 30px rgba(20, 33, 61, 0.08);
}

.hero-card ul,
.priority-list {
  padding-left: 20px;
  line-height: 1.8;
}

.login-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.login-card {
  width: 100%;
  max-width: 460px;
  background: linear-gradient(135deg, #ffffff, #f8fbff);
  border: 1px solid var(--border);
  border-radius: 28px;
  padding: 28px;
  box-shadow: 0 18px 40px rgba(20, 33, 61, 0.10);
}

.login-header {
  margin-bottom: 16px;
}

.welcome-text {
  color: var(--muted);
  line-height: 1.7;
  margin: 0;
}

.portal-panel {
  margin-top: 6px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 20px;
  box-shadow: 0 10px 24px rgba(20, 33, 61, 0.05);
}

.portal-panel h3 {
  color: var(--primary);
}

.login-form {
  display: grid;
  gap: 10px;
  max-width: 360px;
  margin-top: 14px;
}

.login-form input {
  padding: 13px 14px;
  border: 1px solid var(--border);
  border-radius: 12px;
  font: inherit;
  background: #fbfcff;
}

.auth-message {
  margin-top: 12px;
  color: var(--muted);
}

.auth-message.error {
  color: #b42318;
}

.auth-message.success {
  color: var(--accent);
}

.dashboard-panel {
  margin-top: 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 20px;
}

.dashboard-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 16px;
}

.news-box {
  background: linear-gradient(135deg, #f8fbff, #eef4ff);
  border: 1px solid #dfe9fb;
  border-radius: 16px;
  padding: 16px;
}

.news-box h4 {
  margin: 0 0 8px;
  color: var(--primary);
}

.news-box p {
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}

.hidden {
  display: none !important;
}

.portal-page {
  min-height: 100vh;
  padding-bottom: 48px;
}

.app-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  max-width: 1080px;
  margin: 0 auto;
  padding: 24px;
}

.app-header h1 {
  margin-bottom: 0;
}

.portal-brand { display: flex; align-items: center; min-width: 260px; min-height: 96px; }
.business-logo { display: block; width: auto; max-width: 280px; height: 88px; object-fit: contain; object-position: left center; }
.business-brand-card { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 32px; align-items: center; margin-bottom: 20px; }
.business-logo-preview-wrap > span { display: block; margin-bottom: 8px; color: var(--muted); font-size: .76rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.business-logo-preview { display: grid; place-items: center; min-height: 150px; padding: 20px; border: 1px dashed var(--border); border-radius: 14px; background: #faf9fc; color: var(--muted); }
.business-logo-preview img { max-width: 100%; max-height: 120px; object-fit: contain; }

@media (max-width: 700px) {
  .portal-brand { min-width: 0; min-height: 72px; }
  .business-logo { max-width: 210px; height: 68px; }
  .business-brand-card { grid-template-columns: 1fr; }
}

.app-header .eyebrow {
  color: var(--primary);
  margin-bottom: 8px;
}

.text-btn {
  min-height: 44px;
  padding: 8px 14px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
}

.button-link { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.standalone-schedule-page { min-height: 100vh; padding-bottom: 48px; }
.schedule-page-header { padding-top: 30px; padding-bottom: 24px; }
.schedule-quick-bar { display: flex; align-items: center; justify-content: space-between; gap: 18px; width: min(1080px, calc(100% - 48px)); margin: 0 auto 16px; padding: 18px 20px; border-radius: 16px; background: #183f32; color: white; }
.schedule-quick-bar strong, .schedule-quick-bar span { display: block; }
.schedule-quick-bar span { margin-top: 3px; color: #d7e7df; font-size: .78rem; }
.schedule-quick-bar .primary-btn { min-height: 58px; margin: 0; padding: 13px 24px; background: white; color: var(--primary); font-size: 1rem; white-space: nowrap; }
.schedule-quick-bar .primary-btn span { display: inline; margin: 0; color: inherit; font-size: 1.15rem; }
.calendar-help { margin: 4px 0 0; color: var(--muted); font-size: .82rem; }
.standalone-calendar-card .weekly-calendar { display: grid; grid-template-columns: 1fr; gap: 12px; border: 0; border-radius: 0; overflow: visible; background: transparent; }
.standalone-calendar-card .calendar-day { min-height: 0; border: 1px solid var(--border); border-radius: 14px; overflow: hidden; }
.standalone-calendar-card .calendar-day > header { justify-content: space-between; padding: 12px 14px; }
.calendar-day-title { display: flex; align-items: center; gap: 8px; }
.calendar-day-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.standalone-calendar-card .calendar-day-sessions { grid-template-columns: 1fr; gap: 12px; padding: 12px; }
.standalone-calendar-card .calendar-session { padding: 18px; }
.day-contact-button { min-height: 42px; padding: 8px 12px; border: 1px solid #9fbea5; border-radius: 9px; background: white; color: var(--primary); font: inherit; font-size: .76rem; font-weight: 800; cursor: pointer; }
.day-contact-button { background: var(--primary); color: white; }
.schedule-pick-time { min-height: 48px; background: #e8f1e7; }
.schedule-management-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.schedule-delete-btn { min-height: 48px; border-color: #d7aaa3; background: #fff8f6; color: #9b372c; }
.schedule-save-button { min-height: 54px; font-size: 1rem; }
.quick-length-choice { margin: 0; padding: 0; border: 0; }
.quick-length-choice legend { margin-bottom: 8px; font-size: .82rem; font-weight: 700; }
.quick-length-choice > div { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.quick-length-choice button { min-height: 52px; border: 0; border-radius: 11px; background: var(--primary); color: white; font-weight: 800; cursor: pointer; }
@media (max-width: 760px) {
  .schedule-quick-bar { align-items: stretch; flex-direction: column; width: calc(100% - 32px); }
  .schedule-quick-bar .primary-btn { width: 100%; }
  .standalone-calendar-card .calendar-day-sessions { grid-template-columns: 1fr; padding: 9px; }
  .standalone-calendar-card .calendar-day > header { align-items: stretch; flex-direction: column; }
  .calendar-day-actions { display: grid; grid-template-columns: 1fr; }
  .day-contact-button { width: 100%; min-height: 48px; }
  .schedule-contact-btn, .schedule-pick-time { min-height: 48px; }
  .schedule-management-actions { grid-template-columns: 1fr; }
}
.standalone-calendar-card { margin-bottom: 0; }
.schedule-legend { display: flex; justify-content: space-between; gap: 12px; margin: -5px 0 14px; color: var(--muted); font-size: .76rem; }
.schedule-legend span:first-child { display: inline-flex; align-items: center; gap: 6px; }
.schedule-legend i { width: 10px; height: 10px; border-radius: 3px; background: var(--primary); }
.standalone-session { display: grid; grid-template-columns: 150px minmax(230px, .9fr) minmax(260px, 1.1fr); gap: 18px 22px; align-items: start; cursor: default; }
.standalone-session small { display: block; margin-top: 6px; color: var(--muted); font-size: .66rem; line-height: 1.35; }
.schedule-action-status:empty { display: none; }
.schedule-action-status { margin: 0 0 14px; padding: 11px 13px; border-radius: 10px; background: #f2f4ef; }
.schedule-time-block { align-self: stretch; padding: 3px 18px 3px 2px; border-right: 1px solid #d8e3d5; }
.standalone-session .schedule-time { display: grid; gap: 1px; color: var(--primary); font-weight: 850; line-height: 1.1; letter-spacing: -.02em; }
.standalone-session .schedule-time span { display: block; color: inherit; font-size: 1rem !important; line-height: inherit; }
.standalone-session .schedule-time i { margin: 3px 0; color: var(--muted); font-size: .72rem; font-style: normal; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; }
.schedule-duration { display: inline-flex !important; width: fit-content; margin-top: 12px; padding: 5px 8px; border-radius: 999px; background: #e4eee3; color: var(--primary) !important; font-size: .7rem !important; font-weight: 800; }
.schedule-overlap-badge { display: block !important; width: fit-content; margin-top: 8px; padding: 5px 8px; border-radius: 7px; background: #f4e4db; color: #914d32 !important; font-size: .68rem !important; font-weight: 850; line-height: 1.2 !important; }
.has-time-overlap { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--instructor-color) 35%, transparent); }
.schedule-assignment-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 10px; margin-bottom: 10px; }
.schedule-assignment-heading > span { min-width: 0; }
.standalone-session .schedule-assignment-heading small { display: block; margin: 0 0 2px; color: var(--muted); font-size: .66rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.standalone-session .schedule-assignment-heading strong { display: block; overflow: hidden; margin: 0; color: var(--text); font-size: 1rem; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.schedule-assignment-heading > i { color: var(--muted); font-size: .72rem; font-style: normal; font-weight: 750; }
.schedule-instructor-identity { padding: 8px 10px; border: 1px solid var(--instructor-color); border-radius: 9px; background: color-mix(in srgb, var(--instructor-color) 12%, white); }
.standalone-session .schedule-instructor-identity strong { color: var(--instructor-color); }
.schedule-card-label { margin-bottom: 6px; color: var(--muted) !important; font-size: .68rem !important; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.standalone-session .schedule-participant { margin: 0 0 5px; font-size: .98rem; }
.schedule-participant-contact { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid #b8cdbb; border-radius: 10px; background: white; color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.schedule-participant-contact span { color: var(--text); font-size: .94rem; font-weight: 800; }
.schedule-participant-contact small { margin: 0; color: var(--primary); font-size: .72rem; font-weight: 800; white-space: nowrap; }
.schedule-participant-contact:hover, .schedule-participant-contact:focus-visible { border-color: var(--primary); background: #edf5ed; outline: none; }
.schedule-participant-pending { display: block; min-height: 44px; padding: 11px 12px; border: 1px dashed #b8cdbb; border-radius: 10px; color: var(--muted); }
.schedule-session-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 13px 0 0; }
.schedule-session-facts div { min-width: 0; }
.schedule-session-facts dt { margin-bottom: 2px; color: var(--muted); font-size: .67rem; font-weight: 800; text-transform: uppercase; }
.schedule-session-facts dd { margin: 0; color: var(--text); font-size: .86rem; font-weight: 750; line-height: 1.35; }
.schedule-session-notes { margin: 12px 0 0; color: var(--muted); font-size: .76rem; line-height: 1.45; }
.schedule-volunteer-list { display: grid; gap: 7px; font-size: .82rem; }
.schedule-team-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 2px; }
.schedule-team-heading b { font-size: .85rem; }
.standalone-session .schedule-team-heading span { color: var(--muted); font-size: .7rem; font-weight: 750; }
.schedule-volunteer { display: flex; align-items: center; justify-content: space-between; gap: 5px; }
.schedule-volunteer > span:first-child strong, .schedule-volunteer > span:first-child small { display: block; }
.schedule-volunteer-name { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 48px; padding: 9px 11px; border: 1px solid #c9d9cb; border-radius: 9px; background: white; color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.schedule-volunteer-name:hover, .schedule-volunteer-name:focus-visible { border-color: var(--primary); background: #edf5ed; outline: none; }
.schedule-volunteer-name span:first-child strong, .schedule-volunteer-name span:first-child small { display: block; }
.schedule-volunteer-name span:last-child { color: var(--primary); font-size: .7rem; font-weight: 800; white-space: nowrap; }
.schedule-contact-actions { display: flex !important; gap: 3px; }
.schedule-contact-actions a, .schedule-edit-btn { padding: 6px 7px; border: 1px solid #b8cdbb; border-radius: 7px; background: white; color: var(--primary); font: inherit; font-weight: 700; text-decoration: none; }
.schedule-edit-btn { width: 100%; margin-top: 8px; cursor: pointer; }
.schedule-contact-btn { width: 100%; min-height: 42px; margin-top: 10px; padding: 9px 12px; border: 0; border-radius: 8px; background: var(--primary); color: white; font-size: .76rem; font-weight: 800; cursor: pointer; }
.schedule-card-footer { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, .7fr); gap: 8px 12px; grid-column: 2 / -1; padding-top: 14px; border-top: 1px solid #d8e3d5; }
.schedule-card-footer .schedule-edit-btn, .schedule-card-footer .schedule-contact-btn { margin-top: 0; }
.schedule-card-footer .calendar-signup { grid-column: 1 / -1; }
@media (max-width: 980px) {
  .standalone-session { grid-template-columns: 140px minmax(0, 1fr); }
  .standalone-session .schedule-team, .schedule-card-footer { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .standalone-calendar-card .calendar-session { padding: 15px; }
  .standalone-session { grid-template-columns: 1fr; gap: 15px; }
  .schedule-time-block { padding: 0 0 13px; border-right: 0; border-bottom: 1px solid #d8e3d5; }
  .standalone-session .schedule-time { display: flex; align-items: baseline; gap: 7px; }
  .standalone-session .schedule-time span { font-size: 1rem !important; }
  .standalone-session .schedule-time i { margin: 0; }
  .schedule-duration { margin-top: 8px; }
  .standalone-session .schedule-team, .schedule-card-footer { grid-column: 1; }
  .schedule-card-footer { grid-template-columns: 1fr; }
  .schedule-card-footer .calendar-signup { grid-column: 1; }
}
.schedule-unfilled { color: var(--muted); }
.schedule-session-dialog { width: min(440px, calc(100% - 24px)); padding: 0; border: 0; border-radius: 20px; box-shadow: 0 22px 70px rgba(20, 33, 61, .25); }
.schedule-session-dialog::backdrop { background: rgba(20, 33, 61, .55); }
.schedule-session-form { display: grid; gap: 15px; padding: 22px; }
.schedule-sheet-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.schedule-sheet-heading h2 { margin: 3px 0; }
.schedule-session-form label { display: grid; gap: 6px; font-size: .82rem; font-weight: 700; }
.schedule-session-form input { min-height: 46px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; font: inherit; }
.schedule-session-form select { width: 100%; min-height: 48px; padding: 10px 38px 10px 12px; border: 1px solid var(--border); border-radius: 10px; background: white; color: var(--text); font: inherit; }
.schedule-time-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.contact-session-summary { margin: -7px 0 2px; color: var(--muted); }
.quick-contact-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; width: 100%; }
.quick-contact-actions a, .quick-contact-actions button { display: grid; place-items: center; min-height: 46px; padding: 10px 12px; border: 1px solid #b8cdbb; border-radius: 10px; background: white; color: var(--primary); font: inherit; font-weight: 800; text-align: center; text-decoration: none; cursor: pointer; }
.quick-contact-actions a:first-child { background: var(--primary); color: white; }
.contact-everyone-button { width: 100%; min-height: 52px; padding: 11px 14px; border: 0; border-radius: 11px; background: var(--primary); color: white; font: inherit; font-weight: 800; cursor: pointer; }
.contact-popup-list { display: grid; gap: 11px; }
.contact-popup-person { display: grid; gap: 10px; padding: 14px; border: 1px solid var(--border); border-radius: 13px; background: #f7faf6; }
.contact-popup-person > div:first-child strong, .contact-popup-person > div:first-child span { display: block; }
.contact-popup-person > div:first-child span { margin-top: 3px; color: var(--muted); font-size: .78rem; }
.contact-popup-actions { display: grid; grid-template-columns: repeat(2, 1fr); gap: 7px; }
.contact-popup-actions a, .contact-popup-actions button { min-height: 44px; display: grid; place-items: center; padding: 9px; border: 1px solid #b8cdbb; border-radius: 10px; background: white; color: var(--primary); font: inherit; font-weight: 800; text-decoration: none; cursor: pointer; }
.contact-popup-actions > span { grid-column: 1 / -1; color: var(--muted); font-size: .8rem; }
.schedule-session-form textarea { width: 100%; padding: 11px 12px; border: 1px solid var(--border); border-radius: 10px; font: inherit; resize: vertical; }
.calendar-signup { display: grid; gap: 6px; margin-top: 9px; padding-top: 8px; border-top: 1px solid rgba(57, 112, 82, .18); }
.calendar-signup select { width: 100%; min-width: 0; padding: 6px 4px; border: 1px solid var(--border); border-radius: 7px; background: white; color: var(--text); font-size: .68rem; }
.calendar-signup button { width: 100%; min-height: 34px; padding: 6px; border: 0; border-radius: 7px; background: var(--instructor-color, var(--primary)); color: white; font-size: .7rem; font-weight: 700; cursor: pointer; }
.calendar-signed-up { color: var(--primary); font-size: .69rem !important; }
.calendar-full { color: var(--muted); font-size: .68rem !important; }

.header-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.settings-layout {
  display: grid;
  grid-template-columns: minmax(280px, .8fr) minmax(360px, 1.2fr);
  gap: 22px;
  width: min(1080px, calc(100% - 48px));
  margin: 12px auto 0;
}

.activity-panel { width: min(1080px, calc(100% - 48px)); margin: 0 auto 32px; }
.activity-log-card { margin: 0; }
.activity-log-filters { display: grid; grid-template-columns: minmax(220px, 1fr) 180px; gap: 10px; margin: 18px 0; }
.activity-log-filters input, .activity-log-filters select { width: 100%; min-height: 44px; }
.activity-log-list { display: grid; gap: 10px; }
.activity-log-entry { display: grid; grid-template-columns: 10px minmax(0, 1fr); gap: 13px; padding: 15px; border: 1px solid var(--border); border-radius: 13px; background: white; }
.activity-log-marker { border-radius: 999px; background: #718096; }
.activity-added .activity-log-marker { background: #397052; }
.activity-changed .activity-log-marker { background: #b7791f; }
.activity-deleted .activity-log-marker { background: #b94a48; }
.activity-log-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 7px 10px; }
.activity-log-heading time { margin-left: auto; color: var(--muted); font-size: .75rem; }
.activity-action-badge { padding: 3px 7px; border-radius: 999px; background: #eef2ef; color: var(--primary); font-size: .68rem; font-weight: 800; text-transform: uppercase; }
.activity-log-entry p { margin: 6px 0 3px; font-weight: 700; }
.activity-log-entry small { color: var(--muted); }

@media (max-width: 620px) {
  .activity-panel { width: calc(100% - 32px); }
  .activity-log-filters { grid-template-columns: 1fr; }
  .activity-log-heading time { width: 100%; margin-left: 0; }
}

.farm-link-list { display: grid; gap: 12px; }
.farm-link-item { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px; border: 1px solid var(--border); border-radius: 14px; background: #fff; }
.farm-link-item h3 { margin: 4px 0; }
.farm-link-item a { display: block; max-width: 540px; color: var(--primary); overflow-wrap: anywhere; }
.farm-link-item small { display: block; margin-top: 7px; color: var(--muted); }
.farm-link-type { display: inline-block; padding: 4px 8px; border-radius: 999px; background: #edf4ea; color: var(--primary); font-size: .72rem; font-weight: 800; }
.farm-link-actions { display: flex; flex-wrap: wrap; gap: 7px; justify-content: flex-end; }

@media (max-width: 760px) {
  .settings-layout { grid-template-columns: 1fr; width: min(100% - 28px, 1080px); }
  .farm-link-item { align-items: flex-start; flex-direction: column; }
  .farm-link-actions { justify-content: flex-start; }
}

.admin-approval-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  width: min(1080px, calc(100% - 48px));
  margin: 12px auto 0;
}

.admin-card {
  padding: 24px;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: var(--surface);
  box-shadow: 0 10px 24px rgba(20, 33, 61, 0.05);
}

.approved-list-card {
  grid-column: 1 / -1;
}

.admin-intro,
.approval-item small {
  color: var(--muted);
}

.approval-list {
  display: grid;
  gap: 10px;
}

.approval-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: #fff;
}

.approval-item strong,
.approval-item a,
.approval-item small {
  display: block;
  margin: 2px 0;
  overflow-wrap: anywhere;
}

.approval-item a {
  color: var(--primary);
}

.approve-btn,
.remove-approval-btn {
  flex: 0 0 auto;
  padding: 9px 12px;
  border: 0;
  border-radius: 10px;
  cursor: pointer;
  font-weight: 700;
}

.approve-btn { background: var(--primary); color: white; }
.remove-approval-btn { background: #f8e6e1; color: #8b3528; }

.requirement-check {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 12px;
  font-weight: 600;
}

.requirement-actions {
  display: grid;
  gap: 8px;
  min-width: 210px;
}

.requirement-done {
  padding: 9px 12px;
  border: 1px solid #b9d7c4;
  border-radius: 10px;
  background: #eaf6ee;
  color: var(--primary);
  font-weight: 700;
}

.annual-paperwork-field { margin-top: 14px; }

.expiry-label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
}

.expiry-label input {
  min-height: 38px;
  padding: 7px 9px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: white;
}

.approved-controls {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.approved-check { display: flex; align-items: center; gap: 8px; min-height: 42px; padding: 9px 12px; border: 1px solid var(--border); border-radius: 10px; background: #f8faf8; color: var(--text); font-size: .82rem; font-weight: 700; cursor: pointer; }
.approved-check input { width: 19px; height: 19px; margin: 0; accent-color: var(--primary); }

.paperwork-photo-preview { display: flex; align-items: center; gap: 12px; margin-top: 8px; padding: 10px; border: 1px solid #bfd7c5; border-radius: 10px; background: #f2f8f1; }
.paperwork-photo-preview.hidden { display: none; }
.paperwork-photo-preview img { width: 70px; height: 70px; border-radius: 8px; object-fit: cover; }
.paperwork-photo-preview span, .paperwork-photo-preview small { display: block; }
.paperwork-photo-preview small { margin-top: 3px; color: var(--muted); overflow-wrap: anywhere; }

.approval-status {
  display: inline-block;
  width: fit-content;
  margin-top: 7px;
  padding: 5px 8px;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 700;
}

.approval-status.eligible { background: #eaf6ee; color: var(--primary); }
.approval-status.expired,
.approval-status.blocked { background: #f8e6e1; color: #8b3528; }

.paperwork-files {
  max-width: 360px;
  margin-top: 8px !important;
  padding: 7px 9px;
  border-radius: 9px;
  background: #f3f6f1;
}

.paperwork-download-btn {
  width: 100%;
  margin-top: 10px;
  border-style: dashed;
  background: #f3f6f1;
  color: var(--primary);
}

.signed-out-card {
  text-align: center;
}

.signed-out-card .primary-btn {
  width: 100%;
  min-height: 52px;
}

.thank-you-dialog {
  width: min(90vw, 430px);
  padding: 30px;
  border: 0;
  border-radius: 24px;
  color: var(--text);
  text-align: center;
  box-shadow: 0 24px 70px rgba(20, 33, 61, 0.25);
}

.thank-you-dialog::backdrop {
  background: rgba(20, 33, 61, 0.55);
  backdrop-filter: blur(3px);
}

.thank-you-dialog h2 {
  margin-bottom: 10px;
}

.thank-you-dialog p:not(.step-label) {
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}

.thank-you-dialog .primary-btn {
  width: 100%;
  min-height: 52px;
  margin-top: 22px;
}

.thank-you-icon {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin: 0 auto 16px;
  border-radius: 50%;
  background: #e7f7f2;
  color: var(--accent);
  font-size: 1.5rem;
}

.portal-content {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
  gap: 20px;
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 24px;
}

.portal-nav {
  display: flex;
  gap: 6px;
  max-width: 1080px;
  margin: 0 auto 22px;
  padding: 0 24px;
  overflow-x: auto;
}

.nav-btn {
  flex: 0 0 auto;
  min-height: 44px;
  padding: 9px 15px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  font-weight: 700;
  cursor: pointer;
}

.nav-btn.active {
  background: var(--primary);
  color: white;
}

.dashboard-view {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 24px 40px;
}

.welcome-banner {
  padding: 28px;
  border-radius: 24px;
  background: linear-gradient(135deg, #e8f1e5, #fff8e8);
  border: 1px solid #d9e3d4;
}

.welcome-banner h2 { margin: 4px 0 8px; font-size: clamp(1.65rem, 4vw, 2.35rem); }
.welcome-banner > p:last-child { margin: 0; color: var(--muted); }

.volunteer-summary {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
  margin: 18px 0 30px;
}

.volunteer-summary div, .hours-hero {
  display: grid;
  gap: 5px;
  padding: 17px;
  border: 1px solid var(--border);
  border-radius: 15px;
  background: var(--surface);
}

.volunteer-summary span, .hours-hero span { color: var(--muted); font-size: .8rem; }
.good-status { color: var(--primary); }
.content-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 15px; }
.content-heading h2, .content-heading p { margin: 0; }
.link-btn { border: 0; background: transparent; color: var(--primary); font-weight: 700; cursor: pointer; }
.available-session-grid, .schedule-card-list { display: grid; gap: 13px; }
.schedule-help { margin: -7px 0 18px; color: var(--muted); }

.available-session-card {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 17px;
  border: 1px solid var(--border);
  border-radius: 17px;
  background: var(--surface);
  box-shadow: 0 8px 24px rgba(40, 55, 45, .06);
}
.available-session-card.availability-match { border-left: 6px solid var(--instructor-color, var(--primary)); background: linear-gradient(90deg, color-mix(in srgb, var(--instructor-color, var(--primary)) 8%, white), var(--surface) 34%); }

.session-card-date { display: grid; place-items: center; padding: 9px; border-radius: 12px; background: #f4e5d8; color: #914d32; }
.session-card-date strong { font-size: 1.35rem; }
.session-card-date span { font-size: .72rem; font-weight: 700; text-transform: uppercase; }
.session-card-content h3, .session-card-content p { margin: 3px 0; }
.session-card-content p, .session-card-content small { color: var(--muted); }
.session-need { color: var(--accent) !important; font-size: .77rem; font-weight: 700; text-transform: uppercase; }
.signup-btn { min-height: 46px; padding: 10px 18px; border: 0; border-radius: 12px; background: var(--accent); color: white; font-weight: 700; cursor: pointer; }
.signup-btn.signed-up { background: #e5ece5; color: var(--primary); }
.session-signup-actions { display: grid; gap: 8px; min-width: 145px; }
.session-signup-actions select { width: 100%; min-height: 42px; padding: 7px 9px; border: 1px solid var(--border); border-radius: 10px; background: white; color: var(--text); font: inherit; }
.my-schedule-card { display: grid; grid-template-columns: 58px minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 18px; border: 1px solid var(--border); border-radius: 17px; background: var(--surface); }
.my-session-details h3, .my-session-details p { margin: 3px 0; }
.my-session-details small { display: block; margin-top: 4px; color: var(--muted); }
.my-session-details > strong { display: inline-block; margin-top: 5px; color: var(--primary); }
.cancel-signup-btn { min-height: 44px; padding: 9px 14px; border: 1px solid #e2b7aa; border-radius: 11px; background: #fff7f4; color: #9a432c; font-weight: 700; cursor: pointer; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.hours-hero { place-items: center; margin-bottom: 16px; padding: 32px; }
.hours-hero strong { color: var(--primary); font-size: 3rem; }
.verification-card { margin-top: 22px; padding: 24px; border: 1px solid var(--border); border-radius: 20px; background: var(--surface); box-shadow: 0 8px 24px rgba(40, 55, 45, .06); }
.verification-intro { margin: -8px 0 22px; color: var(--muted); line-height: 1.6; }
.verification-form { display: grid; gap: 17px; }
.verification-btn { width: 100%; min-height: 52px; margin-top: 0; }
.verification-request-list { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--border); }
.verification-request-list h3 { margin-bottom: 10px; }
.verification-request { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 13px 0; border-top: 1px solid var(--border); }
.verification-request:first-of-type { border-top: 0; }
.verification-request div, .verification-request div span { display: block; }
.verification-request div span { margin-top: 4px; color: var(--muted); font-size: .85rem; }
.request-status { flex: 0 0 auto; padding: 6px 9px; border-radius: 999px; background: #fff1df; color: #8a5700; font-size: .75rem; font-weight: 700; }
.account-settings { margin-top: 28px; border-top: 1px solid var(--border); padding-top: 18px; }
.account-settings summary { color: var(--muted); font-weight: 700; cursor: pointer; }
.account-settings .profile-actions { margin-top: 16px; padding-top: 0; border-top: 0; }
.portal-sidebar .sessions-card { display: none; }
.volunteer-home-messages { margin-bottom: 30px; }
.volunteer-home-section { margin-bottom: 30px; }
.available-session-card.session-time-conflict { border-color: #d8b4a8; background: #fff8f5; opacity: .82; }
.session-conflict-note { margin: 0 0 4px !important; color: #98452f !important; font-size: .77rem; font-weight: 800; text-transform: uppercase; }
.volunteer-role-options { display: flex; flex-wrap: wrap; gap: 8px 14px; margin: 0; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; }
.volunteer-role-options legend { padding: 0 5px; color: var(--muted); font-size: .78rem; font-weight: 800; }

.volunteer-card,
.recent-card,
.availability-card,
.sessions-card,
.message-card,
.contact-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 24px;
  padding: 24px;
  box-shadow: 0 12px 30px rgba(20, 33, 61, 0.08);
}

.contact-form {
  display: grid;
  gap: 16px;
}

.contact-btn {
  width: 100%;
  min-height: 50px;
  margin-top: 0;
}

.status-badge {
  flex: 0 0 auto;
  padding: 7px 10px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
}

.status-badge.available {
  background: #e7f7f2;
  color: #087a61;
}

.status-badge.unavailable {
  background: #f1f3f7;
  color: var(--muted);
}

.availability-form,
.availability-details {
  display: grid;
  gap: 16px;
}

.availability-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 15px;
  border-radius: 14px;
  background: #f8fbff;
  cursor: pointer;
}

.availability-toggle span,
.availability-toggle small {
  display: block;
}

.availability-toggle small {
  margin-top: 5px;
  color: var(--muted);
  line-height: 1.4;
}

.availability-toggle input {
  flex: 0 0 auto;
  width: 48px;
  height: 26px;
  accent-color: var(--accent);
}

.availability-details {
  padding-top: 2px;
}

.availability-schedule {
  margin: 0;
  padding: 0;
  border: 0;
}

.availability-schedule legend {
  margin-bottom: 10px;
  font-weight: 700;
}

.schedule-head,
.availability-row {
  display: grid;
  grid-template-columns: 30px minmax(75px, 1fr) minmax(86px, 1fr) minmax(86px, 1fr);
  gap: 7px;
  align-items: center;
}

.schedule-head {
  padding: 0 8px 7px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
}

.availability-rows {
  display: grid;
  gap: 7px;
}

.availability-row {
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: #fafbfe;
}

.availability-row.selected {
  border-color: #a9c3f1;
  background: #f2f7ff;
}

.availability-row > input[type="checkbox"] {
  width: 22px;
  height: 22px;
  accent-color: var(--primary);
}

.availability-row > input[type="time"] {
  width: 100%;
  min-width: 0;
  min-height: 42px;
  padding: 6px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: white;
  font-size: 0.85rem;
}

.availability-row > input[type="time"]:disabled {
  background: #eef1f5;
  opacity: 0.65;
}

.secondary-btn {
  width: 100%;
  min-height: 48px;
  padding: 11px 15px;
  border: 1px solid var(--primary);
  border-radius: 12px;
  background: white;
  color: var(--primary);
  font-weight: 700;
  cursor: pointer;
}

.session-list {
  display: grid;
  gap: 12px;
}

.empty-card {
  padding: 22px 14px;
  border-radius: 14px;
  background: #f8fbff;
  color: var(--muted);
  text-align: center;
}

.empty-card p {
  margin: 5px 0 0;
}

.empty-calendar {
  margin-bottom: 8px;
  font-size: 1.8rem;
}

.session-item {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 13px;
  padding: 13px 0;
  border-top: 1px solid var(--border);
}

.session-item:first-child {
  border-top: 0;
}

.session-date {
  display: grid;
  place-items: center;
  align-content: center;
  min-height: 58px;
  border-radius: 12px;
  background: #eaf1ff;
  color: var(--primary);
}

.session-date span {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
}

.session-date strong {
  font-size: 1.25rem;
}

.session-item h3,
.session-item p {
  margin: 0 0 5px;
}

.session-item h3 {
  font-size: 1rem;
}

.session-item p,
.session-item small {
  color: var(--muted);
}

.portal-sidebar {
  display: grid;
  align-content: start;
  gap: 20px;
}

.section-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 22px;
}

.section-heading h2,
.step-label {
  margin: 0;
}

.section-heading > p {
  color: var(--muted);
  font-size: 0.85rem;
}

.step-label {
  color: var(--primary);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 5px;
}

.volunteer-form,
.field-group {
  display: grid;
  gap: 8px;
}

.volunteer-form {
  gap: 18px;
}

.field-row,
.upload-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.field-group label,
.upload-title {
  font-weight: 700;
}

.field-group input,
.field-group textarea,
.field-group select {
  width: 100%;
  min-height: 50px;
  padding: 13px 14px;
  border: 1px solid #cbd5e1;
  border-radius: 12px;
  background: #fbfcff;
  color: var(--text);
}

.field-group input:focus,
.field-group textarea:focus,
.field-group select:focus {
  outline: 3px solid rgba(45, 108, 223, 0.16);
  border-color: var(--primary);
}

.message-form {
  display: grid;
  gap: 16px;
}

.delivery-options {
  display: flex;
  gap: 18px;
  margin: 0;
  padding: 0;
  border: 0;
}

.delivery-options legend {
  width: 100%;
  margin-bottom: 9px;
  font-weight: 700;
}

.delivery-options label {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 36px;
}

.delivery-options input {
  width: 20px;
  height: 20px;
}

.message-btn {
  width: 100%;
  min-height: 50px;
  margin-top: 0;
}

.inbox-help {
  margin: -8px 0 20px;
  color: var(--muted);
  line-height: 1.5;
}

.message-history {
  display: grid;
  gap: 12px;
}

.message-item {
  padding: 12px;
  border-radius: 12px;
  background: #f8fbff;
}

.message-item p {
  margin: 6px 0;
  line-height: 1.45;
}

.message-item small {
  color: var(--muted);
}

.admin-notification-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.admin-answer-btn { flex: 0 0 auto; min-height: 36px; padding: 7px 13px; border: 1px solid var(--primary); border-radius: 9px; color: var(--primary); background: #fff; font-weight: 800; cursor: pointer; }
.admin-answer-form { display: grid; gap: 9px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
.admin-answer-form textarea { width: 100%; min-height: 70px; resize: vertical; padding: 10px 11px; border: 1px solid #bdc9c3; border-radius: 10px; font: inherit; }
.admin-answer-form > div { display: flex; gap: 9px; justify-content: flex-end; }
.admin-answer-form .primary-btn, .admin-answer-form .text-btn { min-height: 38px; padding: 8px 13px; }

.upload-box {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  padding: 16px;
  border: 1px dashed #aebbd0;
  border-radius: 16px;
  background: #f8fbff;
}

.photo-preview {
  display: grid;
  place-items: center;
  width: 96px;
  height: 96px;
  overflow: hidden;
  border-radius: 50%;
  background: #e8eef8;
  color: var(--muted);
  font-size: 0.78rem;
}

.photo-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.file-input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

.upload-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 10px 14px;
  border: 1px solid var(--primary);
  border-radius: 12px;
  color: var(--primary);
  background: white;
  font-weight: 700;
  cursor: pointer;
}

.upload-help,
.empty-state {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.document-list {
  margin: 0;
  padding-left: 20px;
  color: var(--muted);
  overflow-wrap: anywhere;
}

.save-btn {
  width: 100%;
  min-height: 54px;
  margin-top: 0;
  font-size: 1rem;
}

.profile-actions {
  display: grid;
  gap: 12px;
  margin-top: 30px;
  padding-top: 22px;
  border-top: 1px solid var(--border);
}

.profile-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 15px;
  border-radius: 14px;
}

.pause-action {
  background: #fff9eb;
}

.delete-action {
  background: #fff8f7;
}

.profile-action h3 {
  margin: 0 0 5px;
  font-size: 1rem;
}

.profile-action p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.danger-btn,
.pause-btn {
  flex: 0 0 auto;
  min-height: 46px;
  padding: 10px 15px;
  border-radius: 12px;
  background: white;
  font-weight: 700;
  cursor: pointer;
}

.danger-btn {
  border: 1px solid #b42318;
  color: #b42318;
}

.pause-btn {
  border: 1px solid #a66700;
  color: #8a5700;
}

.pause-btn.reactivate {
  border-color: var(--accent);
  color: #087a61;
}

.section-heading.compact {
  align-items: center;
}

.count-badge {
  display: grid;
  place-items: center;
  min-width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #eaf1ff;
  color: var(--primary);
  font-weight: 700;
}

.volunteer-list {
  display: grid;
  gap: 12px;
}

.volunteer-item {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 12px;
  padding: 14px 0;
  border-top: 1px solid var(--border);
}

.volunteer-item:first-child {
  border-top: 0;
}

.avatar {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: #eaf1ff;
  color: var(--primary);
  font-weight: 700;
}

.volunteer-item h3 {
  margin: 0 0 6px;
  font-size: 1rem;
}

.volunteer-item a,
.volunteer-item small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  overflow-wrap: anywhere;
}

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

.module-card h3 {
  color: var(--primary);
}

.module-card p {
  color: var(--muted);
  line-height: 1.6;
}

.schedule-section {
  padding-top: 72px;
}

.schedule-layout {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 18px;
}

.instructor-subtitle { margin: 6px 0 0; color: var(--muted); }
.staff-content { width: min(1080px, calc(100% - 48px)); margin: 0 auto 28px; }
.staff-page-heading { margin: 24px 0 18px; }
.staff-page-heading h2, .staff-page-heading p { margin-top: 5px; margin-bottom: 5px; }
.staff-orientation-layout, .staff-message-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: start; }
.staff-orientation-layout .admin-card, .staff-message-layout .admin-card { margin: 0; }
.staff-orientation-layout { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); }
.staff-operations-admin { display: grid; gap: 24px; margin-top: 28px; }
#admin-staff-panel + #staff-operations-admin { display: none; }
.staff-admin-page { width: min(1320px, calc(100% - 48px)); margin: 28px auto 40px; }
.staff-admin-page .staff-operations-admin { margin-top: 0; }
.staff-admin-tab-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.staff-admin-tab-heading h2, .staff-admin-tab-heading p { margin: 4px 0; }
.staff-sheet-card { padding: 0; overflow: hidden; }
.staff-sheet-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; padding: 16px 18px; border-bottom: 1px solid var(--border); }
.staff-sheet-toolbar > div { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.staff-sheet-scroll { width: 100%; overflow-x: auto; }
.staff-job-sheet { width: 100%; min-width: 1050px; border-collapse: collapse; background: #fff; font-size: .84rem; }
.staff-job-sheet th { padding: 11px 12px; border-right: 1px solid #d8e1d6; border-bottom: 2px solid #b9c9b7; background: #eef4ed; color: var(--muted); font-size: .7rem; letter-spacing: .045em; text-align: left; text-transform: uppercase; }
.staff-job-sheet td { padding: 11px 12px; border-right: 1px solid #e1e7df; border-bottom: 1px solid #e1e7df; vertical-align: top; }
.staff-job-sheet tr:hover td { background: #fafcf9; }
.staff-job-sheet tr.is-complete td { background: #f2f6f1; color: var(--muted); }
.staff-job-sheet td small { display: block; max-width: 260px; margin-top: 3px; color: var(--muted); line-height: 1.35; }
.staff-sheet-entry td { background: #f8fbf7; }
.staff-sheet-entry.is-editing td { background: #fff6df; border-top: 2px solid #c78928; border-bottom-color: #d5ad66; }
.staff-sheet-entry.is-editing .sheet-check { border-color: #c78928; }
.staff-sheet-entry input, .staff-sheet-entry select, .staff-sheet-entry textarea { width: 100%; min-width: 120px; margin: 0 0 6px; padding: 8px 9px; border: 1px solid #bdcbbb; border-radius: 7px; background: #fff; font: inherit; box-sizing: border-box; }
.staff-sheet-entry textarea { min-width: 220px; resize: vertical; }
.staff-sheet-entry .primary-btn { min-height: 36px; margin: 0 0 6px; padding: 7px 12px; }
.staff-sheet-status { margin: 0; padding: 10px 18px; }
.sheet-check-cell { width: 48px; text-align: center; }
.sheet-check { display: inline-grid; width: 24px; height: 24px; place-items: center; border: 2px solid #9aaa9a; border-radius: 5px; background: #fff; color: #fff; font-weight: 900; }
.sheet-check.checked { border-color: var(--primary); background: var(--primary); }
.sheet-actions { white-space: nowrap; }
.sheet-actions button { min-height: 32px; margin: 0 4px 0 0; padding: 5px 8px; }
.staff-operations-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.staff-operations-toolbar label { font-weight: 700; color: var(--muted); }
.staff-operations-toolbar input, .staff-operations-toolbar select { min-height: 42px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 10px; background: white; }
.staff-job-list { display: grid; gap: 10px; }
.staff-job-card { display: grid; gap: 9px; padding: 14px 16px; border: 1px solid var(--border); border-left: 5px solid #78937f; border-radius: 14px; background: white; }
.staff-job-card.priority-high { border-left-color: #c67b32; }
.staff-job-card.priority-urgent { border-left-color: #b8413d; }
.staff-job-card.priority-low { border-left-color: #8aa9b7; }
.staff-job-card.completed { opacity: .72; background: #f4f7f3; }
.staff-job-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.staff-job-heading h3, .staff-job-card p { margin: 0; }
.staff-priority { display: inline-block; margin-bottom: 4px; color: var(--muted); font-size: .7rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.staff-job-meta { color: var(--muted); font-size: .84rem; font-weight: 650; }
.staff-job-facts { display: flex; align-items: stretch; flex-wrap: wrap; gap: 7px; }
.staff-job-facts > span { display: grid; gap: 2px; min-width: 92px; padding: 7px 10px; border-radius: 9px; background: #f7f4f9; }
.staff-job-facts small { color: var(--muted); font-size: .62rem; font-weight: 750; letter-spacing: .055em; text-transform: uppercase; }
.staff-job-facts strong { color: var(--text); font-size: .78rem; text-transform: capitalize; }
.staff-job-facts .staff-job-assignee { min-width: 170px; background: var(--soft); }
.staff-job-facts .staff-job-assignee strong { color: var(--primary); font-size: .88rem; text-transform: none; }
.staff-job-instructions { color: var(--muted); font-size: .84rem; line-height: 1.45; }
.staff-job-actions { display: flex; justify-content: flex-end; gap: 7px; padding-top: 2px; }
.staff-job-actions button { min-height: 34px; margin: 0; padding: 6px 11px; }
.staff-completion-note { padding: 9px 11px; border-radius: 9px; background: #eef4ed; }
.staff-job-completed { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border: 1px solid #a9c8ae; border-radius: 10px; background: #e9f5ea; color: #285b35; }
.staff-job-completed span { color: var(--muted); font-size: .82rem; }
.staff-job-card > label { display: grid; gap: 5px; font-weight: 700; }
.staff-job-card select, .staff-job-note-form input { min-height: 42px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 9px; background: white; }
.staff-job-note-form { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.staff-shift-calendar { display: grid; grid-template-columns: repeat(7, minmax(135px, 1fr)); gap: 8px; overflow-x: auto; padding-bottom: 8px; }
.staff-shift-day { min-height: 180px; padding: 10px; border: 1px solid var(--border); border-radius: 12px; background: #f7f9f6; }
.staff-shift-day > header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 9px; color: var(--muted); }
.staff-shift-card { display: grid; gap: 4px; margin-bottom: 8px; padding: 10px; border-left: 4px solid var(--primary); border-radius: 9px; background: white; box-shadow: 0 2px 8px rgba(35, 67, 45, .08); }
.staff-shift-card time { color: var(--primary); font-size: .78rem; font-weight: 800; }
.staff-shift-card span, .staff-shift-card small { color: var(--muted); font-size: .76rem; }
.staff-shift-card p { margin: 4px 0; font-size: .78rem; }
.staff-orientation-layout #staff-approved-list .approval-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  gap: 12px;
}
.staff-orientation-layout #staff-approved-list .requirement-actions { min-width: 0; width: 100%; }
.staff-orientation-layout #staff-approved-list .expiry-label input { width: 100%; min-width: 0; box-sizing: border-box; }
.staff-orientation-layout #staff-approved-list .requirement-done,
.staff-orientation-layout #staff-approved-list .approve-btn { width: 100%; }
.instructor-content { width: min(1080px, calc(100% - 48px)); margin: 0 auto 28px; }
.instructor-workflow-card { margin-bottom: 22px; }
.instructor-workflow-steps { display: grid; gap: 10px; margin-top: 18px; }
.instructor-workflow-step { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 14px; border: 1px solid #ded8e5; border-radius: 14px; background: #fff; }
.instructor-workflow-step.is-done { background: #f7f4fa; border-color: #cfc3db; }
.instructor-workflow-step h3, .instructor-workflow-step p { margin: 0; }
.instructor-workflow-step p { margin-top: 3px; color: var(--muted, #657068); font-size: .92rem; }
.workflow-step-number { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #695184; color: #fff; font-weight: 800; }
.instructor-workflow-step.is-done .workflow-step-number { background: #397052; }
.workflow-action-disabled { pointer-events: none; opacity: .75; }
.instructor-participant-heading-actions { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.instructor-welcome { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 18px; padding: 24px; border-radius: 20px; background: linear-gradient(135deg, #315f48, #497b5f); color: white; box-shadow: 0 12px 28px rgba(40, 80, 58, .18); }
.instructor-welcome h2, .instructor-welcome p { margin: 3px 0; }
.instructor-stat { display: grid; min-width: 130px; padding: 16px; border-radius: 15px; background: rgba(255,255,255,.14); text-align: center; }
.instructor-stat strong { font-size: 1.8rem; }
.instructor-stat span { font-size: .75rem; }
.instructor-content > .content-heading { margin-top: 24px; }
.instructor-tip { color: var(--muted); font-size: .8rem; }
.instructor-session-list, .instructor-availability-list { display: grid; gap: 14px; }
.instructor-session-card { display: grid; grid-template-columns: minmax(250px, 1fr) auto; gap: 14px 20px; padding: 20px; border: 1px solid var(--border); border-left: 6px solid var(--instructor-color, var(--primary)); border-radius: 17px; background: var(--surface); box-shadow: 0 8px 20px rgba(20,33,61,.05); }
.instructor-session-actions { display: grid; align-content: start; gap: 10px; }
.quick-note-btn { width: 100%; margin: 0; }
.quick-note-dialog { width: min(580px, calc(100% - 28px)); max-height: calc(100vh - 32px); padding: 24px; border: 0; border-radius: 20px; background: #fffdf8; color: var(--text); box-shadow: 0 24px 70px rgba(20,33,61,.28); }
.quick-note-dialog::backdrop { background: rgba(20,33,61,.52); backdrop-filter: blur(3px); }
.quick-note-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.quick-note-heading h2, .quick-note-heading p { margin: 3px 0; }
.quick-note-heading > div > p:last-child { color: var(--muted); }
.quick-note-more { padding: 11px 13px; border: 1px solid var(--border); border-radius: 11px; background: #f8faf8; }
.quick-note-more summary { color: var(--primary); font-size: .84rem; font-weight: 700; cursor: pointer; }
.quick-note-more[open] { display: grid; gap: 11px; }
.quick-note-actions { display: flex; align-items: center; gap: 12px; }
.quick-note-actions .primary-btn { margin: 0; }
.instructor-session-main h3, .instructor-session-main p { margin: 4px 0; }
.instructor-session-main small { color: var(--muted); }
.quick-time-buttons { display: flex; align-items: start; gap: 7px; }
.quick-time-buttons button, .volunteer-contact-actions a { padding: 9px 11px; border: 1px solid var(--border); border-radius: 10px; background: white; color: var(--primary); font-weight: 700; text-decoration: none; cursor: pointer; }
.quick-time-form { grid-column: 1 / -1; display: flex; align-items: end; gap: 10px; padding-top: 14px; border-top: 1px solid var(--border); }
.quick-time-form label { display: grid; gap: 5px; color: var(--muted); font-size: .75rem; font-weight: 700; }
.quick-time-form input { min-height: 42px; padding: 8px; border: 1px solid var(--border); border-radius: 9px; background: white; }
.quick-time-form .primary-btn { min-height: 42px; margin: 0; padding: 9px 17px; }
.available-volunteer-card { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; padding: 18px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); }
.available-volunteer-card h3, .available-volunteer-card p { margin: 3px 0; }
.available-volunteer-card small { color: var(--muted); }
.volunteer-contact-actions { display: flex; gap: 7px; }
.instructor-calendar-toolbar { margin-top: 24px; }
.instructor-schedule-hero { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 24px; padding: 22px 24px; border-radius: 20px; background: #183f32; color: white; }
.instructor-schedule-hero .instructor-add-session-toggle { flex: 0 0 auto; background: #fff; color: #594371; box-shadow: 0 5px 14px rgba(28, 16, 43, .18); }
.instructor-empty-days-toggle { display: inline-flex; align-items: center; gap: 9px; margin: 2px 0 14px; font-weight: 700; color: var(--muted); }
.instructor-empty-days-toggle input { width: 20px; height: 20px; accent-color: #695184; }
.instructor-agenda-day-actions { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.instructor-contact-day { min-height: 36px; margin: 0; padding: 7px 10px; font-size: .78rem; }
.instructor-week-empty { margin: 0; }
.instructor-schedule-hero h2, .instructor-schedule-hero p { margin: 4px 0; }
.instructor-schedule-hero > div:first-child > p:last-child { color: #d7e7df; }
.schedule-speed-key { display: flex; gap: 8px; flex-wrap: wrap; }
.schedule-speed-key span { padding: 9px 11px; border-radius: 10px; background: rgba(255,255,255,.12); font-size: .75rem; white-space: nowrap; }
#instructor-update-status:empty { display: none; }
#instructor-update-status { position: sticky; top: 8px; z-index: 8; margin: 0 0 12px; padding: 12px 15px; border-radius: 11px; box-shadow: 0 8px 18px rgba(20,33,61,.1); }
.instructor-agenda { display: grid; gap: 12px; }
.instructor-agenda-day { overflow: hidden; border: 1px solid var(--border); border-radius: 16px; background: white; }
.instructor-agenda-day > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border-bottom: 1px solid var(--border); background: #f7f7f3; }
.instructor-agenda-day.today { border-color: #89ad96; box-shadow: 0 0 0 2px #dcecdf; }
.instructor-agenda-day.today > header { background: #eaf4eb; }
.agenda-date { display: flex; align-items: baseline; gap: 9px; color: var(--primary); }
.agenda-date span { font-size: .75rem; font-weight: 800; text-transform: uppercase; }
.agenda-date strong { font-size: 1.2rem; }
.agenda-count { color: var(--muted); font-size: .75rem; font-weight: 700; }
.agenda-empty { margin: 0; padding: 14px; color: #8b918a; font-size: .82rem; }
.instructor-agenda-session { display: grid; grid-template-columns: 92px minmax(210px,1fr) auto; align-items: center; gap: 16px; padding: 14px; border-left: 5px solid var(--instructor-color,var(--primary)); border-top: 1px solid #edf0ec; }
.instructor-agenda-session:first-child { border-top: 0; }
.agenda-time time, .agenda-time span { display: block; }
.agenda-time time { color: var(--text); font-size: .98rem; font-weight: 800; }
.agenda-time span { margin-top: 2px; color: var(--muted); font-size: .72rem; }
.agenda-session-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.agenda-session-title strong, .agenda-session-title span { display: block; }
.agenda-session-title strong { font-size: .92rem; }
.agenda-session-title > div span { margin-top: 3px; color: var(--muted); font-size: .72rem; }
.agenda-duration { flex: none; padding: 5px 8px; border-radius: 999px; background: #eef3ed; color: var(--primary); font-size: .68rem; font-weight: 800; }
.agenda-volunteers { margin-top: 7px; color: var(--muted); font-size: .72rem; }
.agenda-volunteers summary { cursor: pointer; }
.agenda-quick-actions { display: flex; align-items: center; gap: 6px; }
.agenda-quick-actions button { min-width: 44px; min-height: 40px; padding: 7px 10px; border: 1px solid #cbd8cd; border-radius: 9px; background: white; color: var(--primary); font-weight: 800; cursor: pointer; }
.agenda-quick-actions button:hover, .agenda-quick-actions button:focus-visible { border-color: var(--primary); background: #edf5ed; outline: none; }
.agenda-duration-buttons { display: flex; align-items: center; gap: 4px; margin-left: 5px; padding-left: 10px; border-left: 1px solid var(--border); }
.agenda-duration-buttons span { margin-right: 3px; color: var(--muted); font-size: .65rem; font-weight: 700; }
.agenda-duration-buttons button { min-width: 38px; font-size: .7rem; }
.agenda-duration-buttons button.active { border-color: var(--primary); background: var(--primary); color: white; }
.agenda-quick-actions .agenda-more { color: var(--muted); }
.instructor-weekly-calendar { margin-top: 14px; }
.instructor-calendar-session { cursor: default; }
.instructor-calendar-session > strong { font-size: .82rem; }
.instructor-calendar-volunteers { display: grid; gap: 5px; margin-top: 7px; padding-top: 7px; border-top: 1px solid #d8e3d5; font-size: .65rem; }
.instructor-calendar-volunteer { display: grid; gap: 3px; }
.instructor-calendar-contact { display: flex !important; flex-wrap: wrap; gap: 3px; }
.instructor-calendar-contact a, .instructor-calendar-edit { padding: 5px 6px; border: 1px solid #b8cdbb; border-radius: 6px; background: #fff; color: var(--primary); font-size: .62rem; font-weight: 800; text-decoration: none; }
.instructor-calendar-edit { width: 100%; margin-top: 7px; cursor: pointer; }
.calendar-no-volunteers { color: var(--muted); }
.instructor-calendar-edit-form { flex-wrap: wrap; }
.instructor-calendar-edit-form .primary-btn { min-height: 48px; margin: 0; }
.instructor-simple-editor { position: sticky; bottom: 12px; z-index: 5; margin-top: 18px; padding: 20px; border: 2px solid var(--primary); border-radius: 18px; background: #fffdf8; box-shadow: 0 16px 40px rgba(31,65,45,.22); }
.simple-editor-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.simple-editor-heading h3, .simple-editor-heading p { margin: 3px 0; }
.simple-editor-heading > div > p:last-child { color: var(--muted); }
.instructor-simple-editor .quick-time-buttons { margin-top: 16px; }
.instructor-simple-editor .quick-time-form { margin-top: 16px; }
.instructor-summary-card { grid-template-columns: 1fr; }
.simple-duration-form { display: flex; align-items: end; gap: 14px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--border); }
.simple-duration-form label { display: grid; gap: 6px; color: var(--muted); font-size: .78rem; font-weight: 700; }
.simple-duration-form input { min-height: 48px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; background: white; }
.duration-buttons { display: flex; gap: 10px; }
.duration-buttons button { min-height: 48px; padding: 10px 20px; border: 0; border-radius: 999px; background: var(--primary); color: white; font-weight: 700; cursor: pointer; }
.card-duration-form { grid-column: 1 / -1; }
.instructor-add-card { max-width: 720px; margin: 24px auto 0; }
.instructor-profile-card { max-width: 680px; margin: 24px auto 0; }
.instructor-sessions-companion { margin-top: -4px; }
.instructor-message-card { margin-top: 24px; }
.paperwork-home-card { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 24px; }
.paperwork-home-card h2 { margin: 2px 0 6px; }
.paperwork-home-card .primary-btn { flex: 0 0 auto; }
#paperwork-upload:focus { outline: 3px solid rgba(49, 104, 62, .28); outline-offset: 4px; }
.admin-attention-center { border-top: 5px solid #c98217; }
.admin-attention-center h2 { display: flex; align-items: center; gap: 8px; }
.help-icon { position: relative; display: inline-grid; width: 24px; height: 24px; padding: 0; place-items: center; border: 1px solid #9aa8a0; border-radius: 50%; background: #fff; color: var(--primary); font: 800 .78rem/1 Inter, sans-serif; cursor: help; }
.help-icon::after { position: absolute; z-index: 20; top: calc(100% + 8px); left: 50%; display: none; width: min(280px, 75vw); padding: 10px 12px; border-radius: 9px; background: #20352a; color: #fff; box-shadow: 0 8px 24px rgba(0,0,0,.2); content: attr(data-help); font-size: .76rem; font-weight: 500; line-height: 1.45; transform: translateX(-50%); }
.help-icon:hover::after, .help-icon:focus-visible::after { display: block; }
.attention-summary { display: flex; flex-wrap: wrap; gap: 8px; margin: 15px 0; }
.attention-summary button { padding: 8px 11px; border: 1px solid var(--border); border-radius: 999px; background: #f7faf6; color: var(--text); font: inherit; font-size: .76rem; font-weight: 750; cursor: pointer; }
.attention-summary button strong { color: #a55b08; }
.attention-list { display: grid; gap: 10px; }
.attention-item { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 14px; border: 1px solid var(--border); border-left: 5px solid #d39a3b; border-radius: 12px; background: #fffdf8; }
.attention-item.urgent { border-left-color: #b33a3a; background: #fffafa; }
.attention-symbol { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 50%; background: #fff0d5; color: #8a4a05; font-weight: 900; }
.attention-item.urgent .attention-symbol { background: #fde5e5; color: #9b2424; }
.attention-copy strong, .attention-copy span { display: block; }
.attention-copy span { margin-top: 3px; color: var(--muted); font-size: .8rem; line-height: 1.4; }
.attention-empty { padding: 24px; border-radius: 12px; background: #eef8f0; text-align: center; }
.attention-empty strong, .attention-empty span { display: block; }.attention-empty span { margin-top: 5px; color: var(--muted); font-size: .82rem; }
@media (max-width: 700px) {
  .paperwork-home-card { align-items: stretch; flex-direction: column; }
  .paperwork-home-card .primary-btn { width: 100%; }
  .attention-item { grid-template-columns: auto 1fr; }
  .attention-item .primary-btn { grid-column: 1 / -1; width: 100%; }
}
.admin-notification-card { margin: 0 0 20px; }
.instructor-message-card .content-heading { margin-top: 0; }
.instructor-message-card .message-history { margin-top: 22px; }
.duration-choice { display: grid; gap: 9px; }
.duration-choice > span { color: var(--muted); font-size: .82rem; font-weight: 700; }

.admin-layered-nav { width: min(1080px, calc(100% - 48px)); margin: 0 auto 22px; }
.admin-layered-nav .admin-nav { width: 100%; max-width: none; margin: 0; }
.admin-secondary-tabs { padding: 7px; border: 1px solid var(--border); border-top: 0; border-radius: 0 0 14px 14px; background: rgba(255, 255, 255, .72); }
.admin-subnav { display: flex; gap: 5px; overflow-x: auto; scrollbar-width: none; }
.admin-subnav::-webkit-scrollbar { display: none; }
.admin-subnav.hidden { display: none; }
.admin-subnav .nav-btn { min-height: 38px; padding: 7px 12px; color: var(--muted); }
.admin-subnav .nav-btn.active { background: var(--soft); color: var(--primary); box-shadow: none; }

/* One admin level: every destination is a directly selectable tab. */
.admin-flat-nav { justify-content: flex-start; width: min(1080px, calc(100% - 48px)); max-width: 1080px; overflow-x: auto; scrollbar-width: thin; }
.admin-flat-nav > .nav-btn { flex: 0 0 auto; min-width: max-content; }

@media (max-width: 760px) {
  .admin-layered-nav { width: 100%; margin-bottom: 18px; }
  .admin-layered-nav .admin-nav { width: 100%; }
  .admin-layered-nav .admin-nav > .nav-btn { min-width: 68px; flex: 1 1 0; }
  .admin-secondary-tabs { margin: 0 14px; padding: 6px; border-top: 1px solid var(--border); border-radius: 13px; }
  .admin-subnav .nav-btn { flex: 1 0 auto; min-width: 92px; min-height: 44px; }
}
.volunteer-directory { width: min(1080px, calc(100% - 48px)); margin: 0 auto; padding: 26px; border: 1px solid var(--border); border-radius: 20px; background: var(--surface); box-shadow: 0 10px 24px rgba(20, 33, 61, .05); }
.directory-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.directory-heading h2, .directory-heading p { margin-top: 0; }
.directory-count { flex: none; padding: 8px 12px; border-radius: 999px; background: #eaf1ff; color: var(--primary); font-size: .82rem; font-weight: 700; }
.directory-search { display: grid; gap: 8px; margin: 22px 0; }
.directory-search label { font-weight: 700; }
.directory-search input { width: 100%; min-height: 52px; padding: 13px 16px 13px 44px; border: 1px solid #cbd5e1; border-radius: 13px; background: #fbfcff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' stroke='%2364758b' stroke-width='2' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E") no-repeat 15px center; color: var(--text); font: inherit; }
.directory-search input:focus { border-color: var(--primary); outline: 3px solid rgba(57, 112, 82, .14); }
.directory-list { display: grid; gap: 10px; }
.directory-card { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 14px; padding: 16px; border: 1px solid var(--border); border-radius: 15px; }
.directory-person { min-width: 0; }
.directory-name { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.directory-name h3 { margin: 0; font-size: 1rem; }
.volunteer-statuses { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.volunteer-admin-controls { display: flex; align-items: end; flex-wrap: wrap; gap: 10px; margin-top: 12px; padding: 12px; border-radius: 11px; background: #f7faf6; }
.volunteer-admin-controls label { display: grid; flex: 1 1 190px; gap: 5px; color: var(--text); font-size: .78rem; font-weight: 700; }
.volunteer-admin-controls select { min-height: 42px; padding: 8px 10px; border: 1px solid #cbd5e1; border-radius: 9px; background: white; color: var(--text); font: inherit; font-weight: 400; }
.volunteer-admin-controls button { min-height: 42px; }
.horse-leader-training-control .approved-check { flex: 1 1 230px; align-self: end; }
.directory-card .volunteer-admin-controls { align-items: center; gap: 8px; margin-top: 9px; padding: 8px 10px; }
.directory-card .volunteer-role-options { flex: 0 1 auto; width: auto; min-width: 0; gap: 6px; padding: 5px 8px 7px; }
.directory-card .volunteer-role-options legend { line-height: 1; }
.directory-card .volunteer-role-options .approved-check { display: flex; flex: 0 0 auto; min-height: 32px; padding: 5px 8px; gap: 6px; }
.directory-card .volunteer-role-options .approved-check input,
.directory-card .horse-leader-training-control > .approved-check input { width: 17px; height: 17px; }
.directory-card .horse-leader-training-control > .approved-check { display: flex; flex: 0 1 auto; align-self: center; min-height: 34px; padding: 6px 9px; }
.directory-card .volunteer-admin-controls button { min-height: 36px; padding-top: 7px; padding-bottom: 7px; }
.directory-details { display: flex; flex-wrap: wrap; gap: 5px 20px; margin-top: 7px; }
.directory-details a, .directory-details span { color: var(--muted); font-size: .88rem; overflow-wrap: anywhere; }
.person-record-card { align-items: start; }
.person-details { margin-top: 12px; border-top: 1px solid var(--border); }
.person-details summary { padding: 11px 0 2px; color: var(--primary); font-size: .84rem; font-weight: 700; cursor: pointer; }
.person-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; padding-top: 12px; }
.person-detail-grid p { display: grid; gap: 3px; margin: 0; }
.person-detail-grid strong { color: var(--text); font-size: .76rem; text-transform: uppercase; letter-spacing: .04em; }
.person-detail-grid span { color: var(--muted); font-size: .88rem; line-height: 1.45; overflow-wrap: anywhere; }
.person-detail-grid .detail-wide { grid-column: 1 / -1; }
.staff-notes-form { display: grid; gap: 9px; margin-top: 4px; padding-top: 12px; border-top: 1px solid var(--border); }
.staff-notes-form label { display: grid; gap: 7px; color: var(--text); font-size: .82rem; font-weight: 700; }
.staff-notes-form textarea { width: 100%; padding: 11px 12px; border: 1px solid #cbd5e1; border-radius: 11px; background: #fff; color: var(--text); font: inherit; font-weight: 400; resize: vertical; }
.staff-notes-form textarea:focus { border-color: var(--primary); outline: 3px solid rgba(57, 112, 82, .14); }
.staff-notes-form > div { display: flex; align-items: center; gap: 12px; }
.staff-notes-form .primary-btn { min-height: 40px; margin: 0; padding: 8px 14px; font-size: .82rem; }
.staff-notes-status { color: var(--primary); font-size: .82rem; font-weight: 700; }
.staff-admin-area { width: min(1180px, calc(100% - 48px)); margin: 0 auto 32px; }
.staff-admin-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin: 24px 0 18px; }
.staff-admin-heading h2, .staff-admin-heading p { margin: 4px 0; }
.staff-access-summary { display: flex; gap: 8px; flex-wrap: wrap; }
.staff-access-summary span { padding: 9px 12px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: var(--muted); font-size: .8rem; }
.staff-access-summary strong { color: var(--text); }
.staff-admin-layout { display: grid; grid-template-columns: minmax(320px, .75fr) minmax(460px, 1.25fr); gap: 20px; align-items: start; }
.staff-admin-layout .admin-card { margin: 0; }
.staff-roster-card .section-heading select { min-height: 40px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 10px; background: white; }
.staff-record-list { display: grid; gap: 12px; margin-top: 16px; }
.staff-record-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; padding: 17px; border: 1px solid var(--border); border-radius: 15px; background: #fff; }
.staff-record-name { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.staff-record-name h3 { margin: 5px 0 8px; }
.staff-type-badge, .access-status { display: inline-flex; padding: 5px 8px; border-radius: 999px; font-size: .72rem; font-weight: 800; }
.staff-type-badge { background: #eef4ed; color: var(--primary); }
.access-status.pending { background: #fff4d6; color: #835b00; }.access-status.approved { background: #e4f4e8; color: #24623d; }.access-status.denied { background: #fbe8e7; color: #8a302c; }
.staff-contact-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px 14px; font-size: .82rem; }
.staff-contact-grid a { color: var(--primary); overflow-wrap: anywhere; }.staff-contact-grid span { color: var(--muted); }
.staff-record-notes { margin: 10px 0 6px; color: var(--text); font-size: .86rem; white-space: pre-wrap; }
.staff-record-main > small { color: var(--muted); }
.staff-paperwork-section { margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--border); }
.staff-paperwork-section h4 { display: flex; align-items: center; gap: 7px; margin: 0 0 9px; }
.staff-paperwork-section h4 span { min-width: 23px; padding: 3px 6px; border-radius: 999px; background: #eef4ed; color: var(--primary); font-size: .7rem; text-align: center; }
.staff-document-list { display: grid; gap: 7px; }
.staff-document-list .empty-state { margin: 4px 0 8px; }
.staff-document-item { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 10px; border-radius: 10px; background: #f7faf6; }
.staff-document-item > div { display: grid; gap: 2px; min-width: 0; }.staff-document-item span { color: var(--muted); font-size: .7rem; font-weight: 800; text-transform: uppercase; }.staff-document-item a { color: var(--primary); font-size: .84rem; font-weight: 700; overflow-wrap: anywhere; }.staff-document-item small { color: var(--muted); font-size: .72rem; }
.staff-document-upload { display: grid; grid-template-columns: .7fr 1fr auto; align-items: end; gap: 8px; margin-top: 10px; padding: 10px; border: 1px dashed var(--border); border-radius: 11px; }
.staff-document-upload label { display: grid; gap: 5px; color: var(--muted); font-size: .75rem; font-weight: 700; }.staff-document-upload select, .staff-document-upload input { width: 100%; min-height: 40px; padding: 7px; border: 1px solid var(--border); border-radius: 9px; background: white; }.staff-document-upload input { font-size: .72rem; }
.staff-record-actions { display: flex; flex-direction: column; align-items: stretch; gap: 7px; min-width: 126px; }
.staff-record-actions button { margin: 0; white-space: nowrap; }
.staff-schedule-permission { display: flex; align-items: flex-start; gap: 9px; margin-top: 13px; padding: 11px; border-radius: 10px; background: #f1f6ef; cursor: pointer; }
.staff-schedule-permission input { width: 19px; height: 19px; accent-color: var(--primary); }
.staff-schedule-permission span, .staff-schedule-permission small { display: block; }
.staff-schedule-permission small { margin-top: 2px; color: var(--muted); }
.calendar-read-only { margin-top: 7px; color: var(--muted); font-size: .62rem; font-weight: 800; text-transform: uppercase; }
.schedule-edit-denied { display: none !important; }
.participant-care-notes { display: grid; gap: 14px; margin-top: 8px; padding: 16px; border: 1px solid #d8e3d5; border-radius: 14px; background: #f7faf6; }
.participant-instructor-assignment { display: grid; gap: 6px; max-width: 340px; margin-top: 12px; color: var(--text); font-size: .8rem; font-weight: 700; }
.participant-instructor-assignment select { min-height: 42px; padding: 8px 10px; border: 1px solid #cbd5e1; border-radius: 10px; background: white; color: var(--text); font: inherit; font-weight: 400; }
.participant-care-notes h4, .participant-care-notes h5 { margin: 0; }
.participant-care-notes h4 { color: var(--primary); font-size: 1rem; }
.participant-care-notes h5 { font-size: .9rem; }
.participant-goals-form, .participant-session-note-form { display: grid; gap: 11px; }
.participant-goals-form label, .participant-session-note-form label { display: grid; gap: 6px; color: var(--text); font-size: .8rem; font-weight: 700; }
.participant-goals-form textarea, .participant-session-note-form textarea, .participant-session-note-form input, .participant-session-note-form select { width: 100%; min-height: 44px; padding: 10px 11px; border: 1px solid #cbd5e1; border-radius: 10px; background: white; color: var(--text); font: inherit; font-weight: 400; }
.participant-goals-form textarea, .participant-session-note-form textarea { resize: vertical; }
.participant-goals-form > div { display: flex; align-items: center; gap: 12px; }
.participant-goals-form .primary-btn, .participant-session-note-form .primary-btn { justify-self: start; min-height: 40px; margin: 0; padding: 8px 14px; font-size: .82rem; }
.care-goals-summary { padding: 12px; border-radius: 10px; background: white; }
.care-goals-summary p { margin: 6px 0 0; color: var(--muted); line-height: 1.45; }
.participant-note-history { display: grid; gap: 9px; }
.participant-note-entry { padding: 13px; border: 1px solid var(--border); border-radius: 11px; background: white; }
.participant-note-entry > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.participant-note-entry time { color: var(--muted); font-size: .78rem; }
.participant-note-entry p { margin: 8px 0 0; color: var(--muted); font-size: .86rem; line-height: 1.45; }
.participant-note-entry b { color: var(--text); }
.session-note-empty { padding: 16px; border: 1px dashed var(--border); border-radius: 10px; color: var(--muted); text-align: center; }
.approval-status.pending { background: #fff4d6; color: #805b00; }
.directory-empty { padding: 44px 20px; border: 1px dashed var(--border); border-radius: 15px; color: var(--muted); text-align: center; }
.directory-empty strong { color: var(--text); }
.directory-empty p { margin: 7px 0 0; }
.participant-hero { margin-bottom: 24px; }
.participant-session-list { display: grid; gap: 12px; }
.participant-session-card { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 16px; padding: 18px; border: 1px solid var(--border); border-left: 5px solid var(--instructor-color, var(--primary)); border-radius: 16px; background: var(--surface); box-shadow: 0 8px 20px rgba(20, 33, 61, .04); }
.participant-session-card h3, .participant-session-card p { margin: 3px 0; }
.participant-session-card small { display: block; margin-top: 6px; color: var(--muted); }
.participant-profile-card { max-width: 720px; margin: 0 auto; }
.participant-upload-grid .status-badge { justify-self: start; margin: 8px 0; }
.participant-calendar-card { margin-bottom: 20px; }
.participant-calendar-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.participant-calendar-heading h2, .participant-calendar-heading p { margin: 3px 0; }
.participant-calendar-controls { display: flex; gap: 7px; }
.participant-calendar-legend { display: flex; flex-wrap: wrap; gap: 14px; margin: 18px 0 12px; color: var(--muted); font-size: .76rem; font-weight: 700; }
.participant-calendar-legend span { display: flex; align-items: center; gap: 6px; }
.participant-calendar-legend i { width: 12px; height: 12px; border-radius: 4px; }
.appointment-key { background: #397052; }
.farm-event-key { background: #b96845; }
.cancelled-key { background: #9b9488; }
.participant-month-weekdays, .participant-month-calendar { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.participant-month-weekdays { border: 1px solid var(--border); border-bottom: 0; border-radius: 14px 14px 0 0; overflow: hidden; background: #f5f3ed; }
.participant-month-weekdays span { padding: 9px 5px; color: var(--muted); font-size: .7rem; font-weight: 800; text-align: center; text-transform: uppercase; }
.participant-month-calendar { border: 1px solid var(--border); border-radius: 0 0 14px 14px; overflow: hidden; }
.participant-month-day { min-width: 0; min-height: 116px; padding: 7px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); background: white; }
.participant-month-day:nth-child(7n) { border-right: 0; }
.participant-month-day:nth-last-child(-n+7) { border-bottom: 0; }
.participant-month-day.outside-month { background: #faf9f6; color: #aaa69c; }
.participant-month-day.today { box-shadow: inset 0 0 0 2px var(--primary); }
.participant-month-day-number { display: grid; place-items: center; width: 26px; height: 26px; margin-bottom: 5px; border-radius: 50%; font-size: .75rem; font-weight: 800; }
.participant-month-day.today .participant-month-day-number { background: var(--primary); color: white; }
.participant-month-day > div { display: grid; gap: 4px; }
.participant-calendar-item { width: 100%; padding: 6px; border: 0; border-radius: 7px; color: white; font: inherit; text-align: left; cursor: pointer; }
.participant-calendar-item.appointment { background: #397052; }
.participant-calendar-item.event { background: #b96845; }
.participant-calendar-item.cancelled { background: #9b9488; text-decoration: line-through; }
.participant-calendar-item time, .participant-calendar-item span, .participant-calendar-item small { display: block; overflow: hidden; font-size: .65rem; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.participant-calendar-item span { margin-top: 2px; font-weight: 800; }
.participant-calendar-detail { display: grid; gap: 18px; padding: 22px; }
.participant-calendar-detail-list { display: grid; gap: 10px; margin: 0; }
.participant-calendar-detail-list div { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--border); }
.participant-calendar-detail-list dt { color: var(--muted); font-size: .76rem; font-weight: 800; text-transform: uppercase; }
.participant-calendar-detail-list dd { margin: 0; }
.participant-calendar-cancel { justify-self: start; }
.participant-cancelled-note { margin: 0; color: var(--muted); }
.weekly-calendar-card { width: min(1080px, calc(100% - 48px)); margin: 0 auto 20px; padding: 22px; border: 1px solid var(--border); border-radius: 20px; background: var(--surface); box-shadow: 0 10px 24px rgba(20, 33, 61, .05); }
.calendar-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.calendar-toolbar h2, .calendar-toolbar p { margin: 0; }
.calendar-toolbar h2 { margin-top: 4px; }
.calendar-controls { display: flex; gap: 7px; }
.calendar-controls .text-btn { font-weight: 700; }
.weekly-calendar { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border: 1px solid var(--border); border-radius: 16px; overflow: hidden; background: #f5f3ed; }
.calendar-day { min-width: 0; min-height: 250px; border-left: 1px solid var(--border); background: #fff; }
.calendar-day:first-child { border-left: 0; }
.calendar-day header { display: flex; align-items: center; justify-content: space-between; gap: 5px; padding: 10px; border-bottom: 1px solid var(--border); color: var(--muted); }
.calendar-day header span { font-size: .7rem; font-weight: 700; text-transform: uppercase; }
.calendar-day header strong { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 50%; }
.calendar-day.today header { color: var(--primary); background: #eef5ed; }
.calendar-day.today header strong { background: var(--primary); color: white; }
.calendar-day-sessions { display: grid; align-content: start; gap: 7px; padding: 7px; }
.calendar-session { width: 100%; padding: 9px; border: 1px solid #d8e3d5; border-left: 5px solid var(--instructor-color, var(--primary)); border-radius: 9px; background: #f1f7f0; color: var(--text); text-align: left; cursor: pointer; overflow: hidden; }
.calendar-session time, .calendar-session strong, .calendar-session span { display: block; }
.calendar-session time { color: var(--accent); font-size: .67rem; font-weight: 700; }
.calendar-session strong { margin: 3px 0; font-size: .78rem; line-height: 1.25; }
.calendar-session span { color: var(--muted); font-size: .65rem; line-height: 1.35; }
.admin-calendar-session { cursor: default; }
.admin-calendar-volunteers { display: grid; gap: 4px; margin-top: 7px; padding-top: 7px; border-top: 1px solid #d8e3d5; }
.portal-volunteer-button { display: grid; gap: 1px; width: 100%; padding: 6px 7px; border: 1px solid #bfd0c1; border-radius: 7px; background: white; color: var(--primary); font: inherit; text-align: left; cursor: pointer; }
.portal-volunteer-button span { color: var(--primary); font-size: .68rem; font-weight: 800; }
.portal-volunteer-button small { color: var(--muted); font-size: .58rem; }
.portal-volunteer-button:hover, .portal-volunteer-button:focus-visible { border-color: var(--primary); background: #eaf4eb; outline: none; }
.admin-calendar-edit { width: 100%; margin-top: 7px; padding: 6px; border: 0; border-radius: 7px; background: var(--primary); color: white; font-size: .65rem; font-weight: 800; cursor: pointer; }
.portal-contact-sheet { display: grid; gap: 20px; padding: 22px; }
.portal-contact-sheet h2, .portal-contact-sheet p { margin: 3px 0; }
.portal-contact-sheet .schedule-sheet-heading p:last-child { color: var(--muted); }
.portal-contact-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.portal-contact-actions a { display: grid; place-items: center; min-height: 54px; padding: 12px; border: 1px solid #b8cdbb; border-radius: 12px; background: white; color: var(--primary); font-weight: 800; text-decoration: none; }
.portal-contact-actions .contact-call { background: var(--primary); color: white; }
.admin-day-contact { width: 100%; margin-top: 6px; padding: 5px 4px; border: 1px solid #9fbea5; border-radius: 7px; background: white; color: var(--primary); font: inherit; font-size: .6rem; font-weight: 800; cursor: pointer; }
.admin-calendar-contact { width: 100%; margin-top: 5px; padding: 6px; border: 1px solid #b8cdbb; border-radius: 7px; background: white; color: var(--primary); font: inherit; font-size: .62rem; font-weight: 800; cursor: pointer; }
.admin-calendar-contact:hover, .admin-day-contact:hover { border-color: var(--primary); background: #edf5ed; }
.admin-calendar-participant { margin-top: 3px; color: var(--text) !important; font-size: .72rem; line-height: 1.25; }
.admin-calendar-participant b { color: var(--primary); }
.calendar-empty { display: block; padding: 10px; color: #aaa69c; text-align: center; }
.schedule-admin-layout { display: grid; grid-template-columns: minmax(300px, .8fr) minmax(380px, 1.2fr); gap: 20px; width: min(1080px, calc(100% - 48px)); margin: 0 auto; }
.schedule-admin-layout-single { grid-template-columns: 1fr; }
.quick-add-card { width: min(1080px, calc(100% - 48px)); margin: 0 auto 20px; border: 2px solid #bfd7c5; background: linear-gradient(135deg, #fbfefb, #f2f8f1); }
.quick-add-badge { padding: 7px 10px; border-radius: 999px; background: #dfeee1; color: #315f48; font-size: .72rem; font-weight: 800; }
.quick-add-defaults { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.quick-add-preview { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--border); }
.quick-add-review-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.quick-add-review-heading h3 { margin: 3px 0; }
.quick-add-review-list { display: grid; gap: 8px; }
.quick-add-review-row { display: grid; grid-template-columns: auto minmax(145px, .55fr) minmax(180px, 1fr) minmax(180px, .75fr); align-items: center; gap: 13px; padding: 13px; border: 1px solid var(--border); border-left: 5px solid var(--instructor-color, var(--primary)); border-radius: 11px; background: white; }
.quick-add-review-row > input[type="checkbox"] { width: 19px; height: 19px; accent-color: var(--primary); }
.quick-add-review-row span, .quick-add-review-row small { display: block; }
.quick-add-review-row small { margin-top: 3px; color: var(--muted); }
.quick-add-instructor-field { display: grid; gap: 5px; color: var(--text); font-size: .75rem; font-weight: 700; }
.quick-add-instructor-field input { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid #cbd5e1; border-radius: 9px; background: white; color: var(--text); font: inherit; font-weight: 400; }
.quick-add-warnings { display: grid; gap: 4px; margin-top: 13px; padding: 12px; border-radius: 10px; background: #fff4ea; color: #914d32; font-size: .8rem; }
.staffing-fields { margin: 0; padding: 16px; border: 1px solid var(--border); border-radius: 14px; }
.instructor-color-field > div { display: flex; align-items: center; gap: 10px; min-height: 48px; }
.instructor-color-field input[type="color"] { width: 54px; height: 44px; padding: 3px; border: 1px solid var(--border); border-radius: 10px; background: white; cursor: pointer; }
.instructor-color-field span { color: var(--muted); font-size: .8rem; }
.staffing-fields legend { padding: 0 7px; font-weight: 700; }
.staffing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.staffing-grid label { display: grid; gap: 7px; color: var(--muted); font-size: .82rem; font-weight: 700; }
.staffing-grid input { width: 100%; min-height: 44px; padding: 9px; border: 1px solid var(--border); border-radius: 10px; background: white; }
.form-actions { display: flex; align-items: center; gap: 10px; }
.form-actions .primary-btn { margin-top: 0; }
.admin-session-list { display: grid; gap: 12px; }
.admin-session-item { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px; border: 1px solid var(--border); border-left: 5px solid var(--instructor-color, var(--primary)); border-radius: 15px; background: white; }
.admin-session-item h3, .admin-session-item p { margin: 3px 0; }
.staffing-summary { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.staffing-summary span { padding: 5px 8px; border-radius: 999px; background: #eef4ed; color: var(--primary); font-size: .75rem; }
.session-admin-actions { display: grid; gap: 7px; flex: 0 0 auto; }

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

th,
td {
  text-align: left;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}

@media (max-width: 760px) {
  .hero-content,
  .schedule-layout {
    grid-template-columns: 1fr;
  }

  .portal-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-header {
    flex-direction: column;
    align-items: flex-start;
  }

  .portal-content,
  .field-row,
  .upload-grid {
    grid-template-columns: 1fr;
  }

  .volunteer-summary { grid-template-columns: 1fr 1fr; }
  .available-session-card { grid-template-columns: 52px minmax(0, 1fr); }
  .available-session-card .session-signup-actions { grid-column: 1 / -1; width: 100%; }
  .dashboard-view, .portal-nav { padding-left: 16px; padding-right: 16px; }
  .verification-card { padding: 18px; }
  .verification-request { align-items: flex-start; flex-direction: column; }
  .admin-approval-layout { grid-template-columns: 1fr; width: calc(100% - 32px); }
  .volunteer-directory { width: calc(100% - 32px); padding: 18px; }
  .directory-heading, .directory-name { align-items: flex-start; flex-direction: column; }
  .directory-heading { gap: 4px; }
  .directory-details { display: grid; gap: 6px; }
  .person-detail-grid { grid-template-columns: 1fr; }
  .person-detail-grid .detail-wide { grid-column: auto; }
  .schedule-admin-layout { grid-template-columns: 1fr; width: calc(100% - 32px); }
  .quick-add-card { width: calc(100% - 32px); }
  .quick-add-defaults { grid-template-columns: 1fr 1fr; }
  .weekly-calendar-card { width: calc(100% - 32px); padding: 16px; }
  .calendar-toolbar { align-items: flex-start; flex-direction: column; }
  .schedule-page-header { align-items: flex-start; }
  .schedule-legend { align-items: flex-start; flex-direction: column; }
  .calendar-controls { width: 100%; }
  #current-week, #standalone-current-week { flex: 1; }
  .weekly-calendar { grid-template-columns: 1fr; border-radius: 13px; }
  .calendar-day { min-height: 0; border-left: 0; border-top: 1px solid var(--border); }
  .calendar-day:first-child { border-top: 0; }
  .calendar-day header { justify-content: flex-start; }
  .calendar-day header span { min-width: 35px; }
  .calendar-day-sessions { padding: 9px; }
  .calendar-empty { padding: 2px 10px 8px; text-align: left; }
  .participant-calendar-heading { align-items: stretch; flex-direction: column; }
  .participant-calendar-controls { width: 100%; }
  .participant-calendar-controls #participant-calendar-today { flex: 1; }
  .participant-month-weekdays { display: none; }
  .participant-month-calendar { grid-template-columns: 1fr; border-radius: 13px; }
  .participant-month-day { display: grid; grid-template-columns: 38px minmax(0, 1fr); min-height: 52px; border-right: 0; }
  .participant-month-day.outside-month { display: none; }
  .participant-month-day:nth-last-child(-n+7) { border-bottom: 1px solid var(--border); }
  .participant-month-day:last-child:not(.outside-month) { border-bottom: 0; }
  .participant-calendar-item { min-height: 42px; padding: 8px; }
  .participant-calendar-detail-list div { grid-template-columns: 1fr; gap: 4px; }
  .staffing-grid { grid-template-columns: 1fr; }
  .admin-session-item { align-items: flex-start; flex-direction: column; }
  .quick-add-defaults { grid-template-columns: 1fr; }
  .quick-add-review-heading { align-items: stretch; flex-direction: column; }
  .quick-add-review-row { grid-template-columns: auto 1fr; }
  .quick-add-review-row > span:nth-of-type(2), .quick-add-instructor-field { grid-column: 2; }
  .session-admin-actions { display: flex; width: 100%; }
  .my-schedule-card { grid-template-columns: 52px minmax(0, 1fr); }
  .my-schedule-card .cancel-signup-btn { grid-column: 1 / -1; width: 100%; }
  .approved-list-card { grid-column: auto; }
  .approval-item { align-items: stretch; flex-direction: column; }
  .approved-controls { grid-template-columns: 1fr; }
  .header-actions { flex-wrap: wrap; justify-content: flex-end; }
  .instructor-content { width: calc(100% - 32px); }
  .instructor-workflow-step { grid-template-columns: 38px minmax(0, 1fr); }
  .instructor-workflow-step > :last-child { grid-column: 1 / -1; width: 100%; text-align: center; }
  .staff-content { width: calc(100% - 32px); }
  .staff-admin-page { width: calc(100% - 28px); }
  .staff-admin-tab-heading { align-items: flex-start; flex-direction: column; }
  .staff-orientation-layout, .staff-message-layout { grid-template-columns: 1fr; }
  .staff-shift-calendar { grid-template-columns: repeat(7, minmax(150px, 1fr)); }
  .staff-job-note-form { grid-template-columns: 1fr; }
  .staff-admin-area { width: calc(100% - 32px); }.staff-admin-heading { align-items: flex-start; flex-direction: column; }.staff-admin-layout { grid-template-columns: 1fr; }.staff-record-card { grid-template-columns: 1fr; }.staff-record-actions { flex-direction: row; flex-wrap: wrap; }.staff-contact-grid, .staff-document-upload { grid-template-columns: 1fr; }
  .instructor-welcome { grid-template-columns: 1fr 1fr; }
  .instructor-welcome > div:first-child { grid-column: 1 / -1; }
  .instructor-stat { min-width: 0; }
  .instructor-session-card { grid-template-columns: 1fr; }
  .quick-time-buttons { flex-wrap: wrap; }
  .quick-time-form { flex-wrap: wrap; }
  .quick-time-form label { flex: 1; min-width: 120px; }
  .quick-time-form .primary-btn { width: 100%; }
  .available-volunteer-card { grid-template-columns: auto 1fr; }
  .volunteer-contact-actions { grid-column: 1 / -1; }
  .volunteer-contact-actions a { flex: 1; text-align: center; }
  .instructor-simple-editor { position: static; padding: 16px; }
  .instructor-schedule-hero { align-items: flex-start; flex-direction: column; padding: 19px; }
  .instructor-add-session-toggle { width: 100%; }
  .instructor-calendar-toolbar { align-items: flex-start; }
  .instructor-agenda-session { grid-template-columns: 72px minmax(0, 1fr); gap: 12px; }
  .agenda-quick-actions { grid-column: 1 / -1; flex-wrap: wrap; padding-top: 10px; border-top: 1px solid var(--border); }
  .agenda-duration-buttons { flex: 1; }
  .agenda-duration-buttons button { flex: 1; }
  .simple-duration-form { align-items: stretch; flex-direction: column; }
  .duration-buttons button { flex: 1; }

  .app-header,
  .portal-content {
    padding-left: 16px;
    padding-right: 16px;
  }

  .app-header h1 {
    font-size: 1.55rem;
  }

  .volunteer-card,
  .recent-card,
  .availability-card,
  .sessions-card,
  .message-card,
  .contact-card {
    padding: 18px;
    border-radius: 18px;
  }

  .section-heading {
    display: block;
  }

  .section-heading > p {
    margin-bottom: 0;
  }

  .profile-action {
    align-items: stretch;
    flex-direction: column;
  }

  .danger-btn,
  .pause-btn {
    width: 100%;
  }

  .schedule-head,
  .availability-row {
    grid-template-columns: 28px minmax(68px, 0.8fr) minmax(80px, 1fr) minmax(80px, 1fr);
    gap: 5px;
  }

  .availability-row {
    padding: 7px 5px;
  }

  .availability-row strong,
  .availability-row > input[type="time"] {
    font-size: 0.78rem;
  }
}

/* Final visual-refresh overrides (must remain after legacy portal rules). */
body { background: var(--bg); }
.portal-page { padding-bottom: 72px; }
.app-header { position: relative; min-height: 96px; padding: 20px 24px 16px; }
.app-header h1 { margin: 2px 0 0; font-size: clamp(1.45rem, 3vw, 2rem); letter-spacing: -.035em; }
.app-header .eyebrow { margin: 0 0 4px; font-size: .68rem; letter-spacing: .1em; }
.portal-nav { gap: 4px; margin-bottom: 24px; scrollbar-width: none; }
.nav-btn { min-height: 42px; padding: 8px 14px; border-radius: 10px; font-size: .82rem; white-space: nowrap; }
.nav-btn.active { background: var(--text); box-shadow: 0 4px 12px rgba(29,44,37,.16); }
.admin-card, .weekly-calendar-card, .volunteer-card, .recent-card, .availability-card,
.sessions-card, .message-card, .contact-card, .participant-payment-card,
.verification-card, .welcome-banner { border-color: var(--border); border-radius: 16px; box-shadow: var(--shadow); }
.admin-card { padding: 22px; }
.primary-btn { border-radius: 11px; background: var(--primary); box-shadow: none; }
.text-btn { border-color: var(--border); border-radius: 10px; }
.header-menu-toggle { display: none; }

@media (max-width: 760px) {
  .portal-page { padding-bottom: 94px; }
  .app-header { min-height: 82px; padding: 15px 16px 13px; }
  .app-header h1 { font-size: 1.35rem; }
  .instructor-subtitle { display: none; }
  .header-actions { position: absolute; top: calc(100% - 4px); right: 14px; z-index: 1500; display: none; width: min(280px, calc(100vw - 28px)); gap: 6px; padding: 8px; border: 1px solid var(--border); border-radius: 14px; background: #fff; box-shadow: 0 18px 45px rgba(29,44,37,.2); }
  .header-actions.is-open { display: grid; }
  .header-actions > * { width: 100%; min-height: 48px; justify-content: flex-start; text-align: left; }
  .header-menu-toggle { display: inline-flex; align-items: center; gap: 5px; min-height: 44px; padding: 8px 10px; border: 0; border-radius: 10px; background: var(--soft); color: var(--primary); font-weight: 750; cursor: pointer; }
  .header-menu-toggle span:first-child { font-size: 1.25rem; line-height: .7; }
  .header-menu-toggle span:last-child { font-size: .76rem; }
  .portal-nav { position: fixed; right: 0; bottom: 0; left: 0; z-index: 1000; max-width: none; margin: 0; padding: 8px 10px calc(8px + env(safe-area-inset-bottom)); overflow-x: auto; border-top: 1px solid var(--border); background: rgba(255,255,255,.96); box-shadow: 0 -8px 25px rgba(29,44,37,.08); backdrop-filter: blur(14px); }
  .nav-btn { flex: 1 0 auto; min-width: 76px; min-height: 50px; padding: 7px 11px; border-radius: 12px; font-size: .75rem; }
  .admin-nav .nav-btn { flex-basis: 82px; }
  .dashboard-view, .portal-content { padding-right: 14px; padding-left: 14px; }
  .weekly-calendar-card, .schedule-admin-layout, .quick-add-card, .admin-approval-layout,
  .volunteer-directory, .instructor-content, .staff-content, .staff-admin-area,
  .activity-panel { width: calc(100% - 28px); }
  .admin-card, .weekly-calendar-card, .volunteer-card, .recent-card, .availability-card,
  .sessions-card, .message-card, .contact-card, .participant-payment-card,
  .verification-card { padding: 17px; border-radius: 14px; box-shadow: 0 4px 18px rgba(29,44,37,.055); }
  .site-messenger { bottom: 82px; }
}
.bdf-access-gate {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
  background: var(--page-bg, #f7f4fb);
}

.bdf-access-gate .login-card {
  width: min(100%, 440px);
}

/* Horse management */
.horse-management { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }

/* Admin workspace polish: one rhythm and one width for every dashboard card. */
body.has-management-shell #admin-view {
  --admin-content-width: 1180px;
}

body.has-management-shell #admin-schedule-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 20px;
  width: min(var(--admin-content-width), calc(100% - 48px));
  margin: 0 auto 32px;
}

body.has-management-shell #admin-schedule-panel > .admin-card,
body.has-management-shell #admin-schedule-panel > .weekly-calendar-card,
body.has-management-shell #admin-schedule-panel > .schedule-admin-layout {
  width: 100%;
  margin: 0;
}

body.has-management-shell #admin-schedule-panel > .weekly-calendar-card,
body.has-management-shell #admin-schedule-panel > .schedule-admin-layout {
  grid-column: 1 / -1;
}

body.has-management-shell #admin-schedule-panel > .admin-card,
body.has-management-shell #admin-schedule-panel > .weekly-calendar-card,
body.has-management-shell #admin-schedule-panel .schedule-admin-layout > .admin-card {
  border: 1px solid #e4ddea;
  border-radius: 18px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 10px 30px rgba(72, 53, 91, .07);
}

body.has-management-shell #admin-schedule-panel > .admin-card {
  min-height: 190px;
  padding: 24px;
}

body.has-management-shell #admin-schedule-panel .content-heading {
  align-items: flex-start;
  margin-bottom: 16px;
}

body.has-management-shell #admin-schedule-panel .content-heading h2,
body.has-management-shell #admin-schedule-panel .calendar-toolbar h2 {
  margin-bottom: 0;
  letter-spacing: -.025em;
}

body.has-management-shell #admin-schedule-panel .count-badge {
  flex: 0 0 auto;
  min-width: 42px;
  min-height: 34px;
  display: inline-grid;
  place-items: center;
  padding: 7px 11px;
}

body.has-management-shell #admin-schedule-panel .open-spot-list:empty,
body.has-management-shell #admin-schedule-panel .message-history:empty {
  min-height: 54px;
}

body.has-management-shell #admin-schedule-panel > .weekly-calendar-card {
  padding: 24px;
}

@media (max-width: 900px) {
  body.has-management-shell #admin-schedule-panel {
    grid-template-columns: 1fr;
  }

  body.has-management-shell #admin-schedule-panel > .weekly-calendar-card,
  body.has-management-shell #admin-schedule-panel > .schedule-admin-layout {
    grid-column: auto;
  }
}

@media (max-width: 760px) {
  body.has-management-shell #admin-schedule-panel {
    gap: 14px;
    width: calc(100% - 28px);
    margin-bottom: 24px;
  }

  body.has-management-shell #admin-schedule-panel > .admin-card,
  body.has-management-shell #admin-schedule-panel > .weekly-calendar-card,
  body.has-management-shell #admin-schedule-panel .schedule-admin-layout > .admin-card {
    min-height: 0;
    padding: 18px;
    border-radius: 15px;
  }
}
.horse-management-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.horse-management-heading h2 { margin: 3px 0; }
.horse-summary { display: flex; gap: 10px; }
.horse-summary span { min-width: 110px; padding: 11px 14px; border: 1px solid var(--border); border-radius: 12px; background: #fff; color: var(--muted); font-size: .78rem; }
.horse-summary strong { display: block; color: var(--text); font-size: 1.15rem; }
.horse-management-layout { display: grid; grid-template-columns: minmax(300px, .8fr) minmax(420px, 1.2fr); gap: 20px; align-items: start; }
.horse-roster-card { min-width: 0; }
.horse-filters { display: grid; grid-template-columns: 1fr auto; gap: 10px; margin: 16px 0; }
.horse-filters input, .horse-filters select { min-height: 44px; }
.horse-list { display: grid; gap: 13px; }
.horse-card { padding: 16px; border: 1px solid var(--border); border-radius: 14px; background: var(--card, #fff); }
.horse-card.needs-attention { border-left: 5px solid #b96845; }
.horse-card-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.horse-card-heading h3 { margin: 0 0 6px; }
.horse-card-actions { display: flex; gap: 7px; }
.horse-facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; margin: 14px 0; }
.horse-facts span { padding: 9px; border-radius: 10px; background: var(--soft); color: var(--muted); font-size: .72rem; }
.horse-facts strong { display: block; color: var(--text); font-size: .95rem; }
.horse-care { margin-top: 13px; border-top: 1px solid var(--border); padding-top: 11px; }
.horse-care summary { cursor: pointer; font-weight: 700; color: var(--primary); }
.horse-care-form { display: grid; gap: 10px; margin: 13px 0; padding: 12px; border-radius: 12px; background: var(--soft); }
.horse-care-form label { display: grid; gap: 5px; font-size: .78rem; font-weight: 650; }
.horse-care-list { display: grid; gap: 7px; }
.horse-care-item { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--border); }
.horse-care-item small { display: block; margin-top: 3px; color: var(--muted); }
.horse-care-item.completed { opacity: .58; }
.horse-portal-management { padding-top: 6px; }
.horse-portal-layout { grid-template-columns: minmax(330px, .9fr) minmax(480px, 1.25fr); }
.horse-editor-card { max-height: calc(100vh - 135px); overflow-y: auto; position: sticky; top: 18px; }
.horse-form-section { display: grid; gap: 12px; margin: 10px 0; padding: 15px; border: 1px solid var(--border); border-radius: 13px; }
.horse-form-section legend { padding: 0 7px; color: var(--primary); font-weight: 750; }
.horse-photo-editor { display: flex; align-items: center; gap: 14px; padding: 12px; border-radius: 13px; background: var(--soft); }
.horse-photo-preview { width: 94px; height: 94px; border-radius: 14px; object-fit: cover; }
.horse-profile-top { display: grid; grid-template-columns: 86px minmax(0, 1fr); gap: 14px; }
.horse-profile-photo { width: 86px; height: 86px; border-radius: 15px; object-fit: cover; background: var(--soft); }
.horse-photo-placeholder { display: grid; place-items: center; color: var(--primary); font-size: 2rem; font-weight: 800; }
.horse-profile-top .horse-card-heading { min-width: 0; }
.horse-profile-top .horse-card-heading > div:first-child { min-width: 0; }
.horse-profile-top h3 { font-size: 1.25rem; }
.horse-profile-top p { margin: -2px 0 7px; color: var(--muted); font-size: .82rem; }
.horse-alert-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 12px 0; }
.horse-alert-grid p { margin: 0; padding: 10px; border-radius: 10px; background: var(--soft); white-space: pre-line; font-size: .8rem; }
.horse-alert-grid p strong { display: block; margin-bottom: 4px; }
.horse-alert-grid .horse-alert { background: #fff0ed; color: #79382b; }
.horse-document-grid { display: grid; gap: 8px; margin-top: 12px; }
.horse-document-grid article { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto auto; align-items: center; gap: 9px; padding: 9px; border: 1px solid var(--border); border-radius: 11px; }
.horse-document-grid img, .horse-file-icon { width: 52px; height: 52px; border-radius: 8px; object-fit: cover; background: var(--soft); }
.horse-file-icon { display: grid; place-items: center; color: var(--primary); font-size: .68rem; font-weight: 800; }
.horse-document-grid small { display: block; margin-top: 3px; color: var(--muted); }
.horse-schedule-list { display: grid; gap: 7px; margin-top: 12px; }
.horse-schedule-list p { display: grid; gap: 3px; margin: 0; padding: 10px; border-radius: 10px; background: var(--soft); }
.horse-schedule-list span { color: var(--muted); font-size: .8rem; }
#horse-pending-files { display: grid; gap: 5px; margin-top: 8px; font-size: .78rem; }
.horse-command-center, .horse-operations-panel { width: min(1180px, calc(100% - 48px)); margin: 0 auto 24px; }
.horse-command-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin: 24px 0 16px; }
.horse-command-heading h2 { margin: 3px 0; }
.horse-dashboard-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.horse-dashboard-metrics article { display: grid; gap: 4px; padding: 18px; border: 1px solid var(--border); border-radius: 15px; background: #fff; box-shadow: 0 8px 25px rgba(45, 73, 57, .05); }
.horse-dashboard-metrics span, .horse-dashboard-metrics small { color: var(--muted); }
.horse-dashboard-metrics span { font-size: .74rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.horse-dashboard-metrics strong { color: var(--primary); font-size: 2rem; line-height: 1; }
.horse-dashboard-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.horse-action-list { display: grid; gap: 8px; margin-top: 14px; }
.horse-action-item { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 11px; padding: 11px; border-radius: 11px; background: var(--soft); }
.horse-action-item p { margin: 3px 0 0; color: var(--muted); font-size: .8rem; }
.horse-action-item time { min-width: 64px; color: var(--primary); font-weight: 750; }
.horse-alert-dot { width: 10px; height: 10px; border-radius: 50%; background: #47795c; }
.horse-action-item.warning .horse-alert-dot { background: #d89437; }.horse-action-item.danger .horse-alert-dot { background: #b94c3e; }
.horse-portal-nav { display: flex; gap: 8px; width: min(1180px, calc(100% - 48px)); margin: 0 auto 20px; padding: 7px; overflow-x: auto; border: 1px solid var(--border); border-radius: 14px; background: #fff; }
.horse-portal-nav .nav-btn { flex: 1 0 auto; }
.horse-portal-nav .nav-btn.active { background: var(--primary); color: #fff; }
.horse-wide-card { margin-top: 16px; }.horse-wide-card select { min-height: 40px; }
.horse-task-list { display: grid; gap: 9px; margin-top: 15px; }
.horse-task-row { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 14px; border: 1px solid var(--border); border-radius: 12px; }
.horse-task-row > div { min-width: 0; }.horse-task-row strong { margin-left: 8px; }.horse-task-row p { margin: 7px 0 4px; }.horse-task-row small { color: var(--muted); }.horse-task-row.completed { opacity: .62; }
.horse-compliance-table { display: grid; min-width: 760px; }#horse-compliance-panel .admin-card { overflow-x: auto; }
.horse-compliance-row { display: grid; grid-template-columns: 1.15fr repeat(4, 1fr); gap: 10px; align-items: center; padding: 12px; border-bottom: 1px solid var(--border); }
.horse-compliance-row.heading { color: var(--muted); font-size: .75rem; text-transform: uppercase; }.compliance-state { display: grid; gap: 2px; padding: 9px; border-radius: 9px; background: var(--soft); }.compliance-state small { color: var(--muted); }.compliance-state.success b { color: #397052; }.compliance-state.warning b { color: #9a671c; }.compliance-state.danger b { color: #a53e32; }
.horse-report-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }.horse-report-card > div { display: flex; justify-content: space-between; align-items: center; gap: 10px; }.horse-report-card > div > strong { font-size: 1.15rem; }.horse-report-card dl { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 16px 0 0; }.horse-report-card dl div { padding: 10px; border-radius: 9px; background: var(--soft); }.horse-report-card dt { color: var(--muted); font-size: .72rem; }.horse-report-card dd { margin: 3px 0 0; font-weight: 700; }
@media print { .app-header, .horse-portal-nav, .horse-editor-card, #site-messenger, button { display: none !important; }.horse-command-center, .horse-operations-panel, .horse-management { width: 100%; }.hidden { display: none !important; } }

@media (max-width: 820px) {
  .horse-management { width: calc(100% - 28px); }
  .horse-management-heading { align-items: flex-start; flex-direction: column; }
  .horse-summary { width: 100%; }
  .horse-summary span { flex: 1; }
  .horse-management-layout { grid-template-columns: 1fr; }
  .horse-editor-card { position: static; max-height: none; }
  .horse-facts { grid-template-columns: 1fr 1fr; }
  .horse-card-heading { flex-direction: column; }
  .horse-alert-grid { grid-template-columns: 1fr; }
  .horse-document-grid article { grid-template-columns: 44px minmax(0, 1fr); }
  .horse-document-grid article > .text-btn, .horse-document-grid article > .danger-btn { width: 100%; }
  .horse-command-center, .horse-operations-panel, .horse-portal-nav { width: calc(100% - 28px); }
  .horse-dashboard-metrics, .horse-dashboard-grid, .horse-report-grid { grid-template-columns: 1fr; }
  .horse-command-heading { align-items: flex-start; flex-direction: column; }
  .horse-compliance-list { overflow-x: auto; }
}

@media (max-width: 760px) {
  .admin-nav > .nav-btn { min-width: 64px; flex: 1 1 0; }
}