:root {
  color-scheme: light;
  --ink: #162033;
  --muted: #5d6878;
  --line: #ded7cb;
  --surface: #ffffff;
  --page: #f8f4ec;
  --soft-surface: #fbf8f1;
  --paper-edge: #ece2d1;
  --accent: #c82127;
  --accent-dark: #9e171d;
  --accent-soft: #fff0f1;
  --heritage-blue: #1f4f82;
  --focus: #1f6feb;
  --header-surface: rgb(255 255 255 / 96%);
  --shadow-color: rgb(74 57 34 / 7%);
  --header-shadow: rgb(22 32 51 / 5%);
  --field-surface: #ffffff;
  --field-border-hover: #b9c2d1;
  --panel-wash: linear-gradient(
    90deg,
    rgb(31 79 130 / 5%),
    transparent 24%,
    transparent 76%,
    rgb(200 33 39 / 4%)
  );
  --button-primary-hover: #173d66;
  --secondary-surface: #fffdf8;
  --secondary-hover: #eef4fb;
  --disabled-surface: #c8d0db;
  --disabled-ink: #526172;
  --pill-surface: #eef4fb;
  --pill-border: #b8cbe1;
  --pill-ink: #234f7a;
  --pill-ok-surface: #e8f5ec;
  --pill-ok-border: #b7dfc2;
  --pill-ok-ink: #235c33;
  --pill-missing-surface: #fff3f3;
  --pill-missing-border: #efc0c0;
  --pill-review-surface: #fff8e6;
  --pill-review-border: #efd58e;
  --pill-review-ink: #6f4b00;
  --pill-inactive-surface: #eef1f4;
  --pill-inactive-border: #c6ced8;
  --pill-inactive-ink: #465464;
  --anchor-offset: 116px;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --ink: #f3f8ff;
  --muted: #c9d7e8;
  --line: #41546d;
  --surface: #14263d;
  --page: #0f1722;
  --soft-surface: #1a304b;
  --paper-edge: #3f5570;
  --accent: #e05a62;
  --accent-dark: #ff858b;
  --accent-soft: #351d26;
  --heritage-blue: #6fa8dc;
  --focus: #8dbfff;
  --header-surface: rgb(16 23 34 / 96%);
  --shadow-color: rgb(0 0 0 / 35%);
  --header-shadow: rgb(0 0 0 / 34%);
  --field-surface: #111b2a;
  --field-border-hover: #67809e;
  --panel-wash: linear-gradient(
    90deg,
    rgb(111 168 220 / 8%),
    transparent 24%,
    transparent 76%,
    rgb(224 90 98 / 7%)
  );
  --button-primary-hover: #8dbfff;
  --secondary-surface: #102033;
  --secondary-hover: #223148;
  --disabled-surface: #354255;
  --disabled-ink: #93a1b3;
  --pill-surface: #172d46;
  --pill-border: #42678b;
  --pill-ink: #b9dcff;
  --pill-ok-surface: #183426;
  --pill-ok-border: #3e7d58;
  --pill-ok-ink: #a8e6bd;
  --pill-missing-surface: #3b2029;
  --pill-missing-border: #9c5961;
  --pill-review-surface: #352b16;
  --pill-review-border: #8e7333;
  --pill-review-ink: #f5d889;
  --pill-inactive-surface: #243044;
  --pill-inactive-border: #52647a;
  --pill-inactive-ink: #c3ccd8;
}

* {
  box-sizing: border-box;
}

html {
  scroll-padding-top: var(--anchor-offset);
}

body {
  background: var(--page);
  color: var(--ink);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.5;
  margin: 0;
}

a {
  color: var(--accent-dark);
}

.site-header {
  background: var(--header-surface);
  border-bottom: 0;
  box-shadow: 0 2px 12px var(--header-shadow);
  padding: 10px clamp(12px, 2.2vw, 20px);
  position: sticky;
  top: 0;
  z-index: 20;
}

.site-header::after {
  background: linear-gradient(
    90deg,
    var(--heritage-blue) 0%,
    var(--heritage-blue) 50%,
    var(--accent) 50%,
    var(--accent) 100%
  );
  bottom: 0;
  content: "";
  display: block;
  height: 4px;
  left: 0;
  position: absolute;
  right: 0;
}

.site-header-inner {
  align-items: center;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(320px, 1fr) auto;
  margin: 0 auto;
  max-width: 960px;
  min-height: 70px;
  width: min(100%, 960px);
}

.brand-title {
  color: var(--ink);
  text-decoration: none;
}

.brand-title a {
  color: inherit;
  text-decoration: none;
}

.brand-title {
  align-items: center;
  display: grid;
  gap: 10px;
  grid-column: 1;
  grid-template-columns: 84px minmax(190px, max-content) 92px;
  justify-content: center;
  justify-self: center;
  min-width: 0;
}

.brand-logo-slot {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  justify-content: center;
}

.brand-logo {
  display: block;
  height: 78px;
  object-fit: contain;
  width: 78px;
}

.brand-logo-usa {
  width: 88px;
}

.brand-text {
  display: grid;
  gap: 0;
  max-width: 560px;
  overflow-wrap: anywhere;
  text-align: center;
}

.brand-text span {
  color: var(--ink);
  font-size: 1.08rem;
  font-weight: 800;
}

.brand-text .brand-polish-name {
  color: var(--ink);
  font-size: 0.94rem;
  font-weight: 800;
  line-height: 1.2;
}

.brand-text small {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 650;
  line-height: 1.22;
}

.site-nav {
  align-items: center;
  display: grid;
  gap: 6px;
  grid-column: 2;
  justify-self: end;
}

.site-nav-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.site-nav-links {
  gap: 6px;
}

.site-nav-links a + a::before {
  color: var(--muted);
  content: "|";
  font-weight: 650;
  margin-right: 6px;
  pointer-events: none;
}

.site-nav form {
  margin: 0;
}

.preferences-menu {
  position: relative;
}

.preferences-menu summary {
  list-style: none;
}

.preferences-menu summary::-webkit-details-marker {
  display: none;
}

.preferences-menu-trigger {
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--paper-edge);
  border-radius: 999px;
  color: var(--ink);
  cursor: pointer;
  display: inline-flex;
  font-size: 0.9rem;
  font-weight: 800;
  gap: 7px;
  min-height: 40px;
  padding: 7px 14px;
  white-space: nowrap;
}

.preferences-menu-trigger:hover,
.preferences-menu[open] .preferences-menu-trigger {
  border-color: var(--heritage-blue);
  box-shadow: 0 5px 14px rgb(31 79 130 / 14%);
  color: var(--heritage-blue);
}

.preferences-menu-trigger:focus-visible {
  outline: 3px solid rgb(31 79 130 / 28%);
  outline-offset: 2px;
}

.preferences-menu-icon {
  border: 2px solid currentColor;
  border-radius: 999px;
  display: inline-block;
  height: 14px;
  position: relative;
  width: 14px;
}

.preferences-menu-icon::before,
.preferences-menu-icon::after {
  background: currentColor;
  content: "";
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
}

.preferences-menu-icon::before {
  height: 2px;
  width: 20px;
}

.preferences-menu-icon::after {
  height: 20px;
  width: 2px;
}

.preferences-menu-panel {
  background: var(--surface);
  border: 1px solid var(--paper-edge);
  border-radius: 8px;
  box-shadow: 0 18px 40px rgb(22 32 51 / 16%);
  display: grid;
  gap: 8px;
  max-height: min(430px, calc(100vh - 150px));
  min-width: 300px;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 10px;
  position: absolute;
  right: 0;
  scrollbar-gutter: stable;
  top: calc(100% + 8px);
  z-index: 30;
}

.language-switcher,
.theme-switcher {
  align-items: center;
  display: inline-flex;
}

.display-preferences-switcher {
  display: grid;
  gap: 8px;
}

.segmented-control {
  align-items: center;
  background: var(--secondary-surface);
  border: 1px solid var(--paper-edge);
  border-radius: 999px;
  display: inline-flex;
  gap: 2px;
  margin: 0;
  min-height: 36px;
  padding: 3px;
}

.preferences-menu-panel .segmented-control {
  align-items: stretch;
  border-radius: 8px;
  display: grid;
  gap: 5px;
  padding: 7px;
  width: 100%;
}

.preferences-menu-panel .segmented-control legend {
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 850;
  grid-column: 1 / -1;
  letter-spacing: 0.02em;
  margin-bottom: 2px;
  text-transform: uppercase;
}

.preferences-menu-panel .theme-segmented-control {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.preferences-menu-panel .language-segmented-control {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.preferences-menu-panel .time-format-segmented-control {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.display-preferences-switcher,
.time-display-switcher,
.time-display-control,
.pagination-preference-switcher,
.pagination-preference-control {
  min-width: 0;
  width: 100%;
}

.time-display-control,
.pagination-preference-control {
  background: var(--secondary-surface);
  border: 1px solid var(--paper-edge);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 8px;
}

.time-display-control > legend,
.pagination-preference-control > legend {
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 850;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.preferences-field {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.preferences-field label {
  color: var(--ink);
  font-size: 0.84rem;
  font-weight: 800;
}

.preferences-field select,
.preferences-field input[type="text"] {
  min-height: 32px;
  width: 100%;
}

.preferences-custom-offset-field[hidden] {
  display: none;
}

.segmented-control button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 999px;
  color: var(--ink);
  display: inline-flex;
  font-size: 0.86rem;
  font-weight: 800;
  gap: 6px;
  justify-content: center;
  min-height: 28px;
  padding: 4px 10px;
  white-space: nowrap;
}

.segmented-control button[aria-pressed="true"] {
  background: var(--heritage-blue);
  box-shadow: 0 5px 12px rgb(31 79 130 / 18%);
  color: var(--surface);
}

.language-segmented-control button[aria-pressed="true"] {
  background: var(--accent-dark);
}

.theme-option-icon {
  display: inline-block;
  flex: 0 0 auto;
}

.theme-option-icon-system {
  border: 2px solid currentColor;
  border-radius: 3px;
  height: 12px;
  position: relative;
  width: 14px;
}

.theme-option-icon-system::after {
  background: currentColor;
  bottom: -5px;
  content: "";
  height: 2px;
  left: 3px;
  position: absolute;
  right: 3px;
}

.theme-option-icon-light {
  border: 2px solid currentColor;
  border-radius: 999px;
  height: 12px;
  width: 12px;
}

.theme-option-icon-dark {
  background: currentColor;
  border-radius: 999px;
  box-shadow: inset 5px 0 0 var(--secondary-surface);
  height: 13px;
  width: 13px;
}

.site-nav a {
  border-radius: 999px;
  color: var(--accent-dark);
  font-weight: 750;
  min-height: 34px;
  padding: 6px 0;
  text-decoration: none;
  white-space: nowrap;
}

.site-nav a:hover {
  background: var(--accent-soft);
}

.site-nav button {
  border-radius: 999px;
  min-height: 36px;
  padding-inline: 12px;
  white-space: nowrap;
}

.site-nav .segmented-control button {
  min-height: 28px;
  padding: 4px 10px;
}

.preferences-menu-panel .segmented-control button {
  border: 1px solid transparent;
  border-radius: 6px;
  min-height: 31px;
}

.preferences-menu-panel .segmented-control button:hover,
.preferences-menu-panel .segmented-control button:focus {
  border-color: var(--heritage-blue);
}

.preferences-apply-button {
  width: 100%;
}

@media (max-width: 900px) {
  :root {
    --anchor-offset: 150px;
  }

  .site-header-inner {
    grid-template-columns: 1fr;
  }

  .brand-title {
    grid-column: 1;
  }

  .site-nav {
    grid-column: 1 / -1;
    justify-self: stretch;
  }

  .site-nav-row {
    justify-content: center;
  }
}

@media (max-width: 520px) {
  :root {
    --anchor-offset: 190px;
  }

  .site-header {
    padding: 10px 14px;
  }

  .site-header-inner {
    align-items: center;
    grid-template-columns: 1fr;
    justify-items: center;
  }

  .brand-title,
  .site-nav {
    grid-column: 1;
    justify-self: center;
  }

  .brand-title {
    gap: 8px;
    grid-template-columns: 60px minmax(0, 1fr) 68px;
    width: min(100%, 420px);
  }

  .site-nav {
    width: 100%;
  }

  .site-nav-row {
    justify-content: center;
  }

  .brand-logo {
    height: 60px;
    width: 60px;
  }

  .brand-logo-usa {
    width: 68px;
  }

  .brand-text span {
    font-size: 0.98rem;
  }

}

.page {
  margin: 0 auto;
  max-width: 960px;
  padding: clamp(16px, 2.6vw, 28px) clamp(12px, 2vw, 18px);
  width: min(100%, 960px);
}

.page:has(> .data-panel) {
  max-width: 1100px;
  width: min(100%, 1100px);
}

.site-footer {
  color: var(--muted);
  font-size: 0.78rem;
  margin: 0 auto;
  max-width: 960px;
  padding: 0 clamp(12px, 2vw, 18px) 18px;
  width: min(100%, 960px);
}

.site-footer-inner {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  justify-content: space-between;
}

.site-footer a {
  color: inherit;
}

.site-footer-links {
  align-items: center;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
}

.panel,
.form-panel {
  background:
    var(--panel-wash),
    var(--surface);
  border: 1px solid var(--paper-edge);
  border-radius: 8px;
  box-shadow: 0 10px 24px var(--shadow-color);
  padding: 20px;
  position: relative;
}

.panel::before,
.form-panel::before {
  background: linear-gradient(90deg, var(--heritage-blue) 0 50%, var(--accent) 50% 100%);
  border-radius: 8px 8px 0 0;
  content: "";
  height: 4px;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.form-panel {
  max-width: 560px;
}

.panel > .title-row:first-child:not(.account-profile-title-row),
.form-panel > .title-row:first-child:not(.account-profile-title-row) {
  border-bottom: 1px solid var(--line);
  padding-bottom: 12px;
  position: relative;
}

.panel:not(.scout-profile-panel) > .title-row:first-child:not(.account-profile-title-row)::after,
.form-panel > .title-row:first-child:not(.account-profile-title-row)::after {
  background: linear-gradient(90deg, var(--heritage-blue), var(--accent));
  bottom: -1px;
  content: "";
  height: 3px;
  left: 0;
  position: absolute;
  width: 100%;
}

.panel > h1:first-child,
.form-panel > h1:first-child {
  border-bottom: 1px solid var(--line);
  margin-bottom: 14px;
  padding-bottom: 12px;
  position: relative;
}

.panel > h1:first-child::after,
.form-panel > h1:first-child::after {
  background: linear-gradient(90deg, var(--heritage-blue), var(--accent));
  bottom: -1px;
  content: "";
  height: 3px;
  left: 0;
  position: absolute;
  width: 100%;
}

.auth-panel {
  margin-left: auto;
  margin-right: auto;
  width: min(100%, 560px);
}

.auth-compass-mark {
  align-items: center;
  display: flex;
  height: 116px;
  justify-content: center;
  margin: -8px auto 16px;
  width: 116px;
}

.auth-compass-mark img {
  display: block;
  height: 116px;
  object-fit: contain;
  width: 116px;
}

.register-profile-panel .auth-compass-mark {
  height: 116px;
  margin-bottom: 16px;
  margin-top: -8px;
  width: 116px;
}

.register-profile-panel .auth-compass-mark img {
  height: 116px;
  width: 116px;
}

.register-profile-panel {
  width: min(100%, 680px);
}

.register-profile-form {
  background:
    linear-gradient(180deg, var(--surface) 0%, var(--secondary-surface) 100%);
  border: 1px solid var(--paper-edge);
  border-radius: 6px;
  border-top: 4px solid var(--heritage-blue);
  display: grid;
  gap: 8px;
  padding: 14px;
}

.register-profile-form .field {
  margin-bottom: 0;
}

.register-profile-form label {
  margin-bottom: 4px;
}

.register-profile-form .help {
  line-height: 1.35;
  margin-top: 4px;
}

.register-profile-form .field:has(.help) {
  margin-bottom: -4px;
}

.field {
  margin-bottom: 18px;
  scroll-margin-top: var(--anchor-offset);
}

[hidden],
.field[hidden] {
  display: none !important;
}

section[id],
form[id],
details[id] {
  scroll-margin-top: var(--anchor-offset);
}

.scroll-anchor {
  scroll-margin-top: var(--anchor-offset);
}

.field-required label,
.field-missing label {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.required-marker,
.missing-marker {
  border-radius: 999px;
  display: inline-flex;
  font-size: 0.74rem;
  font-weight: 750;
  line-height: 1;
  padding: 4px 7px;
}

.required-marker[hidden],
.missing-marker[hidden] {
  display: none;
}

.required-marker {
  background: var(--pill-surface);
  color: var(--pill-ink);
}

.missing-marker {
  background: var(--accent-soft);
  color: var(--accent-dark);
}

.field-missing {
  background: color-mix(in srgb, var(--accent-soft) 35%, var(--surface));
  border: 1px solid var(--pill-missing-border);
  border-left: 5px solid var(--accent);
  border-radius: 8px;
  padding: 12px;
}

.field-error,
.field-client-invalid {
  background: #fff7f8;
  border: 1px solid #e8a5ad;
  border-left: 5px solid var(--accent);
  border-radius: 8px;
  padding: 12px;
}

.field-missing:target,
.field-client-invalid:target {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px #f4c8cc;
}

.field-client-invalid-primary {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px #f4c8cc;
}

.field-alert {
  color: var(--accent-dark);
  font-weight: 750;
}

.validation-error-message {
  background: #fff0f1;
  border: 1px solid #e8a5ad;
  border-left: 5px solid var(--accent);
  border-radius: 8px;
  color: var(--accent-dark);
  margin-top: 8px;
  padding: 10px 12px;
}

.troop-picker-field select[multiple],
.troop-picker-native,
.pill-multiselect-native {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  display: none !important;
  height: 1px;
  min-height: 0;
  opacity: 0;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

.troop-picker,
.pill-multiselect {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
}

.troop-picker-selected,
.pill-multiselect-selected {
  align-items: center;
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-height: 48px;
  padding: 10px;
}

.troop-selected-chip,
.pill-selected-chip {
  align-items: center;
  background: var(--pill-surface) !important;
  border: 1px solid var(--pill-border) !important;
  border-radius: 999px !important;
  color: var(--pill-ink) !important;
  column-gap: 8px;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) 24px;
  font-weight: 750;
  justify-items: center;
  min-height: 58px;
  line-height: 1.2;
  max-width: 100%;
  padding: 6px 12px;
  text-align: center;
  width: 100%;
}

.troop-selected-chip:hover,
.pill-selected-chip:hover {
  border-color: var(--field-border-hover) !important;
}

.troop-selected-chip::before,
.pill-selected-chip::before {
  content: "";
  grid-column: 1;
  width: 24px;
}

.troop-selected-chip span:first-child,
.pill-selected-chip span:first-child {
  grid-column: 2;
  text-align: center;
  white-space: normal;
  word-break: normal;
}

.troop-selected-chip span:last-child,
.pill-selected-chip span:last-child {
  grid-column: 3;
  justify-self: center;
}

.troop-picker-add-label,
.pill-multiselect-add-label {
  display: block;
  margin: 12px 0 6px;
}

.troop-picker-add,
.pill-multiselect-add {
  width: 100%;
}

.errorlist {
  background: #fff0f1;
  border: 1px solid #e8a5ad;
  border-radius: 8px;
  color: var(--accent-dark);
  font-weight: 750;
  list-style: none;
  margin: 10px 0 0;
  padding: 12px 14px;
}

.errorlist li + li {
  margin-top: 6px;
}

.checkbox-option-list ul {
  list-style: none;
  margin: 0.35rem 0 0;
  padding: 0;
}

.checkbox-option-list li {
  margin: 0.35rem 0;
}

.checkbox-option-list label {
  align-items: center;
  display: inline-flex;
  gap: 0.45rem;
  margin: 0;
}

/* Shared by weekday selectors for all trip reminder schedules. */
.reminder-weekday-options {
  margin-top: 0.35rem;
}

.reminder-weekday-options .field > div[id] {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 22px;
}

.reminder-weekday-options .field > div[id] > div {
  flex: 0 0 auto;
}

.reminder-weekday-options .field > div[id] label {
  align-items: center;
  display: inline-flex;
  gap: 7px;
  margin: 0;
  white-space: nowrap;
}

.reminder-weekday-options .field > div[id] input[type="checkbox"] {
  margin: 0;
}

.existing-file-notice {
  background: #eef8f1;
  border: 1px solid #b9dfc2;
  border-radius: 8px;
  color: #235a32;
  padding: 10px 12px;
}

html[data-theme="dark"] .existing-file-notice {
  background: var(--pill-ok-surface);
  border-color: var(--pill-ok-border);
  color: var(--pill-ok-ink);
}

.document-requirement-current-file {
  align-items: flex-start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.document-requirement-current-file .secondary-link {
  flex: 0 0 auto;
  white-space: nowrap;
}

.document-requirement-current-file p {
  overflow-wrap: anywhere;
}

.file-replace-control {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}

.checkbox-row {
  align-items: center;
  display: inline-flex;
  gap: 8px;
  margin-bottom: 0;
}

.checkbox-row input[type="checkbox"] {
  flex: 0 0 auto;
}

.file-replace-label {
  font-size: 0.95rem;
}

.file-replace-control input[type="file"] {
  width: 100%;
}

.zelle-qr-upload-control {
  gap: 10px;
}

.zelle-qr-current-file {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.zelle-qr-current-file > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.zelle-qr-current-file a {
  overflow-wrap: anywhere;
}

.zelle-qr-current-file .checkbox-row {
  flex: 0 0 auto;
}

.current-photo-preview {
  align-items: center;
  display: flex;
  gap: 14px;
  margin: 0 0 14px;
}

.current-photo-preview p {
  margin: 0;
}

label {
  display: block;
  font-weight: 650;
  margin-bottom: 6px;
}

input,
select,
textarea {
  background: var(--field-surface);
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--ink);
  font: inherit;
  min-height: 42px;
  padding: 8px 10px;
  width: 100%;
}

input:hover,
select:hover,
textarea:hover {
  border-color: var(--field-border-hover);
}

input::placeholder,
textarea::placeholder {
  color: color-mix(in srgb, var(--muted) 75%, transparent);
}

input[type="checkbox"] {
  min-height: 0;
  width: auto;
}

.payment-method-field {
  margin-top: 18px;
}

.payment-method-options > div {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 20px;
}

.payment-method-options > div > div {
  align-items: center;
  display: inline-flex;
}

.payment-method-options label {
  align-items: center;
  display: inline-flex;
  gap: 7px;
  line-height: 1.2;
  margin: 0;
}

.payment-method-options input[type="radio"],
.radio-option-list input[type="radio"] {
  flex: 0 0 auto;
  height: 16px;
  margin: 0;
  min-height: 0;
  padding: 0;
  width: 16px;
}

/* Stacked choices keep a compact control beside the first line of its label. */
.radio-option-list {
  display: grid;
  gap: 8px;
  margin-block: 16px;
}

.radio-option-list label {
  align-items: flex-start;
  display: flex;
  gap: 8px;
  line-height: 1.5;
  margin: 0;
  min-height: 36px;
  padding-block: 6px;
  cursor: pointer;
}

.radio-option-list input[type="radio"] {
  margin-top: 0.25em;
}

.family-review-profile {
  display: grid;
  gap: 6px;
  min-width: 0;
  overflow-wrap: anywhere;
}

.payment-zelle-details[hidden] {
  display: none;
}

.payment-zelle-qr-card {
  align-items: flex-start;
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-left: 4px solid var(--heritage-blue);
  border-radius: 8px;
  display: inline-flex;
  flex-direction: column;
  gap: 0.875rem;
  margin-top: 1.125rem;
  padding: 1rem;
}

.payment-zelle-qr-heading {
  align-items: center;
  color: var(--heritage-blue);
  display: flex;
  gap: 0.625rem;
}

.payment-zelle-qr-heading span {
  display: grid;
  gap: 0.125rem;
}

.payment-zelle-qr-heading strong,
.payment-zelle-qr-heading small {
  line-height: 1.25;
}

.payment-zelle-qr-heading small {
  color: var(--muted);
}

.payment-zelle-qr-icon {
  fill: currentColor;
  flex: 0 0 auto;
  height: 2rem;
  width: 2rem;
}

.payment-zelle-qr-code {
  display: block;
  height: auto;
  max-width: min(100%, 160px);
  width: 160px;
}

.payment-management-table .errorlist {
  margin: 4px 0 0;
}

.payment-management-table input,
.payment-management-table select,
.payment-management-table textarea {
  min-width: 0;
}

.payment-management-status-cell {
  min-width: 150px;
}

.payment-management-method-cell {
  min-width: 155px;
  width: 155px;
}

.payment-management-method-cell select {
  min-width: 145px;
  width: 145px;
}

.payment-management-amount-cell {
  min-width: 126px;
}

.payment-management-original-amount-cell {
  white-space: nowrap;
}

.payment-currency-input {
  align-items: center;
  display: flex;
  gap: 4px;
}

.payment-currency-input input {
  width: 98px;
}

.payment-management-date-cell {
  min-width: 190px;
}

.payment-management-note-cell {
  min-width: 220px;
}

.payment-management-note-cell textarea {
  min-height: 42px;
  resize: vertical;
}

.payment-management-save-cell {
  min-width: 92px;
  white-space: nowrap;
}

.payment-management-row-form {
  align-items: center;
  gap: 6px;
  margin: 0;
}

.payment-management-row .payment-row-edit {
  display: none;
}

.payment-management-row.is-editing .payment-row-display {
  display: none;
}

.payment-management-row.is-editing .payment-row-edit {
  display: block;
}

.payment-management-row.is-editing .payment-currency-input.payment-row-edit,
.payment-management-row.is-editing .payment-management-row-form.payment-row-edit {
  display: flex;
}

.detail-grid.payment-management-totals {
  column-gap: 24px;
  grid-template-columns: minmax(150px, 220px) max-content;
  max-width: 380px;
  row-gap: 0;
}

.payment-management-totals dt,
.payment-management-totals dd {
  border-bottom: 1px solid var(--line);
  margin: 0;
  padding: 7px 0;
}

.payment-management-totals dd {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  text-align: right;
}

.payment-management-totals dt:last-of-type,
.payment-management-totals dd:last-of-type {
  border-bottom: 0;
}

.payment-management-totals-content {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 24px 48px;
}

.payment-status-chart {
  --payment-chart-pending: #d18a00;
  --payment-chart-received: #2d7a46;
  --payment-chart-waived: #7d8795;
  align-items: center;
  display: flex;
  gap: 18px;
}

.payment-status-chart-graphic {
  display: block;
  height: 150px;
  overflow: visible;
  transform: rotate(-90deg);
  width: 150px;
}

.payment-status-chart-base,
.payment-status-chart-slice {
  fill: none;
  stroke-width: 8;
}

.payment-status-chart-base {
  stroke: var(--line);
}

.payment-status-chart-slice {
  stroke-linecap: butt;
}

.payment-status-chart-slice.is-received {
  stroke: var(--payment-chart-received);
}

.payment-status-chart-slice.is-waived {
  stroke: var(--payment-chart-waived);
}

.payment-status-chart-slice.is-pending {
  stroke: var(--payment-chart-pending);
}

.payment-status-chart-legend {
  display: grid;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.payment-status-chart-legend li {
  align-items: center;
  display: flex;
  font-size: 0.9rem;
  font-weight: 700;
  gap: 8px;
}

.payment-chart-swatch {
  background: var(--line);
  border-radius: 50%;
  display: inline-block;
  height: 12px;
  width: 12px;
}

.payment-chart-swatch.is-received {
  background: var(--payment-chart-received);
}

.payment-chart-swatch.is-waived {
  background: var(--payment-chart-waived);
}

.payment-chart-swatch.is-pending {
  background: var(--payment-chart-pending);
}

html[data-theme="dark"] .payment-status-chart {
  --payment-chart-pending: #f2b84b;
  --payment-chart-received: #68bd82;
  --payment-chart-waived: #aab4c2;
}

.responsive-signature-canvas {
  background: var(--field-surface);
  border: 1px solid var(--line);
  border-radius: 6px;
  display: block;
  height: auto;
  max-width: 100%;
  touch-action: none;
  width: 100%;
}

.phone-country-code {
  display: inline-block;
  margin-right: 8px;
  max-width: 92px;
  vertical-align: top;
  width: 92px;
}

.phone-national-number {
  display: inline-block;
  vertical-align: top;
  width: calc(100% - 104px);
}

.password-toggle-wrap {
  display: block;
  position: relative;
  width: 100%;
}

.password-toggle-wrap input {
  padding-right: 48px;
}

.password-toggle-button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 4px;
  color: #7890aa;
  display: inline-flex;
  height: 34px;
  justify-content: center;
  min-height: 0;
  opacity: 0;
  padding: 0;
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  transition: opacity 0.15s ease, color 0.15s ease, background-color 0.15s ease;
  width: 34px;
}

.password-toggle-wrap:focus-within .password-toggle-button {
  opacity: 1;
}

.password-toggle-button:hover {
  background: var(--secondary-hover);
  color: var(--heritage-blue);
}

.password-toggle-button svg {
  height: 20px;
  pointer-events: none;
  width: 20px;
}

input:focus,
select:focus,
textarea:focus,
button:focus {
  outline: 3px solid color-mix(in srgb, var(--focus) 25%, transparent);
  outline-offset: 2px;
}

/*
  Shared action system. New pages should use these classes instead of one-off
  button/link styles: primary button/button-link, secondary-button/secondary-link,
  danger-button/danger-link, and compact row actions via record-actions.
*/
button {
  background: var(--heritage-blue);
  border: 0;
  border-radius: 6px;
  color: var(--surface);
  cursor: pointer;
  font: inherit;
  font-size: 0.95rem;
  font-weight: 700;
  min-height: 36px;
  padding: 6px 12px;
}

button:hover {
  background: var(--button-primary-hover);
}

.button-link {
  align-items: center;
  background: var(--heritage-blue);
  border-radius: 6px;
  color: var(--surface);
  display: inline-flex;
  font-size: 0.95rem;
  font-weight: 700;
  min-height: 36px;
  padding: 6px 12px;
  text-decoration: none;
}

.button-link:hover {
  background: var(--button-primary-hover);
}

.secondary-button {
  background: var(--secondary-surface);
  border: 1px solid var(--heritage-blue);
  color: var(--heritage-blue);
}

.secondary-button:hover {
  background: var(--secondary-hover);
  color: var(--ink);
}

.secondary-link {
  align-items: center;
  color: var(--heritage-blue);
  display: inline-flex;
  font-size: 0.95rem;
  font-weight: 700;
  min-height: 36px;
  text-underline-offset: 3px;
}

.danger-button {
  background: var(--accent);
  box-shadow: inset 0 0 0 2px var(--accent-dark);
}

.danger-button:hover {
  background: var(--accent-dark);
}

.secondary-button.danger-button {
  background: var(--secondary-surface);
  border: 1px solid var(--accent-dark);
  box-shadow: none;
  color: var(--accent-dark);
}

.secondary-button.danger-button:hover {
  background: var(--accent-soft);
  color: #5f0c11;
}

.danger-link {
  color: #7c1117;
  font-weight: 800;
}

.form-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-start;
  margin-top: 16px;
}

.form-actions form {
  margin: 0;
}

.link-button {
  background: transparent;
  color: var(--accent-dark);
  font-size: 0.95rem;
  min-height: 0;
  padding: 0;
  text-decoration: underline;
}

.link-button:hover {
  background: transparent;
  color: var(--ink);
}

button:disabled,
button:disabled:hover {
  background: var(--disabled-surface);
  border-color: var(--disabled-surface);
  color: var(--disabled-ink);
  cursor: not-allowed;
}

.help,
.notice {
  color: var(--muted);
}

.trip-request-field-help {
  font-size: 0.94rem;
  line-height: 1.45;
  margin: 6px 0 0;
}

.password-requirements {
  margin: 10px 0 0;
  padding-left: 24px;
}

.password-requirements li + li {
  margin-top: 4px;
}

.password-requirements li,
.password-match-status,
.email-match-status {
  transition: color 0.15s ease;
}

.password-requirements li.is-met,
.password-match-status.is-met,
.email-match-status.is-met {
  color: #1f7a4c;
}

.password-requirements li.is-unmet,
.password-match-status.is-unmet,
.email-match-status.is-unmet {
  color: #9b1c31;
}

.password-requirements li.is-pending,
.password-match-status.is-pending,
.email-match-status.is-pending {
  color: var(--muted);
}

.password-requirements li.is-met::marker {
  content: "+ ";
}

.password-requirements li.is-unmet::marker {
  content: "- ";
}

.caps-lock-warning {
  background: #fff8e6;
  border: 1px solid #d3a122;
  border-radius: 6px;
  box-shadow: 0 10px 24px rgba(15, 37, 68, 0.18);
  color: #5d3d00;
  font-weight: 700;
  left: 0;
  margin: 0;
  max-width: min(320px, 100%);
  padding: 8px 10px;
  position: absolute;
  top: calc(100% + 8px);
  z-index: 30;
}

.caps-lock-warning::before {
  background: #fff8e6;
  border-left: 1px solid #d3a122;
  border-top: 1px solid #d3a122;
  content: "";
  height: 10px;
  left: 18px;
  position: absolute;
  top: -6px;
  transform: rotate(45deg);
  width: 10px;
}

.warning-notice {
  background: #fff8e6;
  border: 1px solid #d3a122;
  border-radius: 6px;
  color: #5d3d00;
  padding: 12px 14px;
}

.success-notice {
  background: var(--pill-ok-surface);
  border: 1px solid var(--pill-ok-border);
  border-radius: 6px;
  color: var(--pill-ok-ink);
  padding: 12px 14px;
}

.warning-text {
  color: #9a5a00;
  display: block;
  font-weight: 700;
  margin-top: 6px;
}

.success-text {
  color: #176b3a;
  display: block;
  font-weight: 700;
  margin-top: 6px;
}

html[data-theme="dark"] .warning-notice {
  background: var(--pill-review-surface);
  border-color: var(--pill-review-border);
  color: var(--pill-review-ink);
}

html[data-theme="dark"] .success-notice,
html[data-theme="dark"] .success-text {
  color: var(--pill-ok-ink);
}

html[data-theme="dark"] .warning-text {
  color: var(--pill-review-ink);
}

.action-blocked-summary {
  background: #fff3f3;
  border: 2px solid #c4364f;
  border-radius: 8px;
  box-shadow: inset 4px 0 0 #c4364f;
  display: grid;
  gap: 8px;
  margin: 0 0 18px;
  padding: 16px 18px;
}

.action-blocked-summary h2 {
  color: var(--accent-dark);
  font-size: 1.35rem;
  margin: 0;
}

.action-blocked-summary p {
  color: var(--ink);
  font-weight: 700;
  margin: 0;
}

html[data-theme="dark"] .action-blocked-summary {
  background: var(--pill-missing-surface);
  border-color: var(--pill-missing-border);
  box-shadow: inset 4px 0 0 var(--accent);
}

.message {
  border-radius: 6px;
  margin: 0 0 16px;
  padding: 12px 14px;
}

.message-success {
  background: #e8f5ec;
  border: 1px solid #b7dfc2;
}

.message.message-info {
  background: #eef6ff;
  border: 2px solid #8eb9df;
  border-left: 8px solid var(--heritage-blue);
  box-shadow: 0 4px 12px rgb(31 79 130 / 14%);
  color: var(--heritage-blue);
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.5;
  padding: 16px 18px;
}

.message-warning {
  background: #fff7e6;
  border: 1px solid #f0d49b;
}

.message-error {
  background: #fff0f1;
  border: 1px solid #e8a5ad;
  border-left: 5px solid var(--accent);
  color: var(--accent-dark);
  font-weight: 750;
}

html[data-theme="dark"] .message-success {
  background: #183426;
  border-color: #3e7d58;
  color: #d6f5df;
}

html[data-theme="dark"] .message.message-info {
  background: #152b3f;
  border-color: #477aa6;
  border-left-color: var(--heritage-blue);
  box-shadow: 0 4px 12px rgb(0 0 0 / 28%);
  color: #d7ebff;
}

html[data-theme="dark"] .message-warning {
  background: #352b16;
  border-color: #8e7333;
  color: #f5d889;
}

html[data-theme="dark"] .message-error {
  background: var(--pill-missing-surface);
  border-color: var(--pill-missing-border);
  color: #ffdfe3;
}

.security-education-card {
  background: #eef6ff;
  border: 1px solid #b8d7f4;
  border-radius: 8px;
  color: var(--ink);
  display: grid;
  gap: 8px;
  margin: 0 0 16px;
  padding: 14px 16px;
}

.security-education-card h2,
.security-education-card p {
  margin: 0;
}

.guide-link-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.mfa-setup-grid {
  align-items: stretch;
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(180px, 240px) 1fr;
  margin: 16px 0;
}

.mfa-qr-panel,
.mfa-secret-panel {
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 6px;
  padding: 14px;
}

.mfa-qr-panel {
  justify-items: center;
}

.mfa-qr-panel img {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 6px;
  height: auto;
  max-width: 190px;
  padding: 8px;
  width: 100%;
}

.mfa-secret-panel code {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--ink);
  font-size: 1rem;
  overflow-wrap: anywhere;
  padding: 10px;
}

.setup-list {
  margin-bottom: 16px;
}

.security-status-card {
  align-items: flex-start;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  margin-bottom: 16px;
  padding: 16px;
}

.security-status-card h2 {
  margin: 0 0 6px;
}

.security-status-heading {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.security-status-card p {
  margin: 0;
}

.security-status-actions {
  flex: 0 0 auto;
  padding-top: 2px;
}

@media (max-width: 720px) {
  .mfa-setup-grid {
    grid-template-columns: 1fr;
  }

  .mfa-cartoon-card {
    grid-template-columns: 1fr;
  }

  .security-status-card {
    align-items: flex-start;
    flex-direction: column;
  }

  .security-status-actions {
    padding-top: 0;
  }
}

.leadership-replacement-warning {
  background: #fff7e6;
  border: 2px solid #d68400;
  border-radius: 8px;
  color: #5b3300;
  display: grid;
  gap: 4px;
  margin: 0 0 18px;
  padding: 14px 16px;
}

html[data-theme="dark"] .leadership-replacement-warning {
  background: var(--pill-review-surface);
  border-color: var(--pill-review-border);
  color: var(--pill-review-ink);
}

.leadership-replacement-warning strong {
  color: #3f2400;
  font-size: 1.02rem;
}

html[data-theme="dark"] .leadership-replacement-warning strong {
  color: var(--pill-review-ink);
}

.leadership-scope-group {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.leadership-scope-group h2,
.leadership-scope-group h3 {
  border-bottom: 1px solid var(--line);
  font-size: 1rem;
  margin: 0;
  padding-bottom: 6px;
}

.leader-scope-list li {
  align-items: center;
}

.leader-scope-row-main {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.leader-scope-row-main strong {
  color: var(--ink);
}

.trip-request-dashboard-scope {
  display: flex;
  flex-wrap: wrap;
  gap: 3px 14px;
}

.trip-request-dashboard-timestamp {
  display: block;
}

.leader-scope-list .admin-tile-label {
  margin-bottom: 0;
}

.leader-scope-list .record-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.leader-scope-list li.event-scope-row {
  align-items: flex-start;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.event-scope-row .leader-scope-row-main {
  width: 100%;
}

.event-scope-row .success-text,
.event-scope-row .warning-text {
  max-width: 68ch;
  overflow-wrap: anywhere;
}

.leader-scope-list .event-scope-row .camping-trip-actions {
  align-items: center;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px 14px;
  justify-content: flex-end;
  text-align: right;
  width: auto;
}

.leader-dashboard-section {
  border-top: 0;
  overflow: hidden;
  padding-top: 18px;
  position: relative;
}

.leader-dashboard-section::before {
  background: linear-gradient(90deg, var(--heritage-blue) 0 50%, var(--accent) 50% 100%);
  content: "";
  height: 4px;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.leader-dashboard-section > h2,
.leader-dashboard-section > .title-row h2 {
  color: var(--ink);
}

.leader-dashboard-primary-actions {
  display: flex;
  flex-wrap: nowrap;
  gap: 14px;
}

.inherited-access-toggle-form,
.leader-dashboard-toggle-form {
  align-items: center;
  display: flex;
  justify-content: flex-end;
  margin: 0;
}

.toggle-switch {
  align-items: center;
  color: var(--ink);
  cursor: pointer;
  display: inline-flex;
  font-size: 0.95rem;
  font-weight: 800;
  gap: 8px;
  margin: 0;
}

.toggle-switch input {
  height: 1px;
  opacity: 0;
  position: absolute;
  width: 1px;
}

.toggle-switch-track {
  background: color-mix(in srgb, var(--line) 78%, white);
  border: 1px solid color-mix(in srgb, var(--muted) 45%, white);
  border-radius: 999px;
  flex: 0 0 44px;
  height: 24px;
  position: relative;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease;
  width: 44px;
}

.toggle-switch-track::before {
  background: #fff;
  border: 1px solid color-mix(in srgb, var(--muted) 35%, white);
  border-radius: 50%;
  box-shadow: 0 2px 6px rgba(13, 31, 61, 0.18);
  content: "";
  height: 18px;
  left: 2px;
  position: absolute;
  top: 2px;
  transition: transform 0.15s ease;
  width: 18px;
}

.toggle-switch input:checked + .toggle-switch-track {
  background: var(--heritage-blue);
  border-color: var(--heritage-blue);
}

.toggle-switch input:checked + .toggle-switch-track::before {
  transform: translateX(20px);
}

.toggle-switch input:focus-visible + .toggle-switch-track {
  outline: 3px solid color-mix(in srgb, var(--heritage-blue) 28%, transparent);
  outline-offset: 2px;
}

.toggle-switch-label {
  line-height: 1.2;
}

.camping-scope-section .notice {
  margin-bottom: 16px;
}

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

.camping-scope-field {
  align-content: start;
  display: grid;
  gap: 8px;
}

.actions,
.title-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

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

.title-row {
  justify-content: space-between;
  margin-bottom: 20px;
}

.title-row h1,
.title-row h2 {
  letter-spacing: 0;
}

.title-row h1,
.title-row p {
  margin-bottom: 0;
}

.dashboard-jump-links {
  align-items: center;
  display: flex;
  flex: 1 1 100%;
  flex-wrap: wrap;
  gap: 8px 14px;
  justify-content: space-evenly;
  min-width: 0;
  width: 100%;
}

.organization-structure-actions {
  align-items: flex-end;
  display: grid;
  gap: 8px;
  justify-items: end;
}

.organization-structure-panel > .title-row {
  align-items: flex-start;
}

.organization-structure-panel > .title-row h1 {
  margin-top: 0;
}

.organization-structure-action-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  justify-content: flex-end;
}

.organization-structure-button-row {
  gap: 8px;
}

.system-announcements {
  display: grid;
  gap: 10px;
  margin: 0 auto;
  padding: 14px clamp(12px, 2.2vw, 20px) 0;
  width: min(100%, 960px);
}

.system-announcement {
  align-items: start;
  background: var(--pill-surface);
  border: 1px solid var(--pill-border);
  border-left: 5px solid var(--heritage-blue);
  border-radius: 8px;
  color: var(--ink);
  display: flex;
  gap: 14px;
  justify-content: space-between;
  padding: 14px 16px;
}

.system-announcement strong {
  color: var(--ink);
  display: block;
  font-size: 1rem;
}

.system-announcement p {
  color: var(--ink);
  margin: 4px 0 0;
}

.system-announcement form {
  flex: 0 0 auto;
  margin: 0;
}

.system-announcement-warning {
  background: #fff8e6;
  border-color: #d3a122;
  border-left-color: #d68400;
}

.system-announcement-urgent {
  background: #fff3f3;
  border-color: #d48b8b;
  border-left-color: var(--accent);
}

.profile-heading {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

.profile-heading-copy {
  display: grid;
  gap: 7px;
}

.profile-heading-copy h1 {
  margin: 0;
}

.profile-heading .tile-status-row .status-pill {
  min-height: 30px;
  min-width: 9rem;
  padding-inline: 12px;
  text-align: center;
}

.profile-photo {
  aspect-ratio: 1;
  border: 1px solid var(--line);
  border-radius: 8px;
  height: 96px;
  object-fit: cover;
  width: 96px;
}

.profile-photo-placeholder {
  align-items: center;
  background: var(--soft-surface);
  color: var(--heritage-blue);
  display: inline-flex;
  font-size: 1.45rem;
  font-weight: 800;
  justify-content: center;
  text-transform: uppercase;
}

.profile-detail-panel {
  display: grid;
  gap: 18px;
}

.scout-profile-panel {
  background:
    var(--panel-wash),
    var(--surface);
}

.scout-profile-panel > .title-row {
  border-bottom: 1px solid var(--line);
  padding-bottom: 18px;
  position: relative;
}

.scout-profile-panel > .title-row::after {
  background: linear-gradient(90deg, var(--heritage-blue), var(--accent));
  bottom: -1px;
  content: "";
  height: 3px;
  left: 0;
  position: absolute;
  width: 100%;
}

.profile-section-nav {
  align-items: center;
  background: var(--soft-surface);
  border: 1px solid var(--paper-edge);
  border-left: 5px solid var(--heritage-blue);
  border-radius: 6px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  padding: 12px 14px;
}

.profile-section-nav a {
  color: var(--accent-dark);
  font-weight: 750;
}

.profile-document-section,
.scout-profile-form-panel .profile-form-section,
.scout-profile-panel .document-panel {
  background:
    linear-gradient(180deg, var(--surface) 0%, var(--secondary-surface) 100%);
  border: 1px solid var(--paper-edge);
  border-radius: 6px;
  border-top: 4px solid var(--heritage-blue);
  display: grid;
  gap: 10px;
  margin-top: 0;
  padding: 14px;
}

.profile-document-section + .profile-document-section,
.profile-document-section + .document-panel,
.scout-profile-panel .document-panel + .profile-document-section {
  margin-top: 6px;
}

.profile-document-section h2,
.scout-profile-panel .document-panel h2,
.scout-profile-form-panel .profile-form-section legend {
  margin: 0;
}

.profile-document-section h3 {
  color: var(--heritage-blue);
  font-size: 0.98rem;
  margin-bottom: 2px;
}

.profile-document-section > p {
  margin-top: 0;
}

.form-section {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.inline-edit-panel {
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-radius: 6px;
  margin-top: 6px;
}

.inline-edit-panel summary {
  color: var(--accent-dark);
  cursor: pointer;
  font-weight: 800;
  padding: 12px 14px;
}

.inline-edit-panel[open] summary {
  border-bottom: 1px solid var(--line);
}

.inline-edit-form {
  display: grid;
  gap: 14px;
  padding: 14px;
}

.inline-edit-form .form-grid {
  margin: 0;
}

.profile-review-continue-section {
  border-left: 5px solid var(--accent);
}

.instructor-profile-review-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 16px;
}

.instructor-registration-questions-section {
  grid-template-columns: minmax(0, 1fr);
}

.instructor-registration-question-list {
  display: grid;
  gap: 22px;
  max-width: 100%;
  min-width: 0;
  width: 100%;
}

.instructor-registration-question-row {
  margin: 0;
  min-width: 0;
}

.instructor-registration-question-row .field-label-row,
.instructor-registration-question-row label,
.instructor-registration-questions-section .notice a {
  min-width: 0;
  overflow-wrap: anywhere;
}

.instructor-registration-question-row input:not([type="checkbox"]):not([type="radio"]),
.instructor-registration-question-row select,
.instructor-registration-question-row textarea {
  box-sizing: border-box;
  max-width: 100%;
  width: 100%;
}

.profile-review-continue-button {
  background: var(--accent);
  box-shadow: inset 0 0 0 2px var(--accent-dark), 0 8px 18px rgb(158 30 39 / 18%);
  padding-inline: 14px;
}

.profile-review-continue-button:hover,
.profile-review-continue-button:focus {
  background: var(--accent-dark);
}

.camping-provisional-medical-notice {
  background: #fff8e6;
  border: 2px solid #d3a122;
  border-left: 6px solid var(--accent);
  border-radius: 8px;
  color: var(--ink);
  display: grid;
  gap: 8px;
  margin: 18px 0;
  padding: 16px 18px;
}

.camping-provisional-medical-notice strong {
  color: var(--accent-dark);
  font-size: 1.15rem;
}

.camping-provisional-medical-notice p {
  margin: 0;
}

html[data-theme="dark"] .camping-provisional-medical-notice {
  background: var(--pill-review-surface);
  border-color: var(--pill-review-border);
  color: var(--pill-review-ink);
}

.profile-overview-grid > div {
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-left: 4px solid rgb(31 79 130 / 35%);
  border-radius: 6px;
  padding: 12px 12px 12px 18px;
}

.profile-overview-grid .detail-action-row {
  border-left-color: var(--accent);
}

.scout-profile-form-panel {
  background:
    var(--panel-wash),
    var(--surface);
}

.scout-form-title-row {
  border-bottom: 1px solid var(--line);
  margin-bottom: 18px;
  padding-bottom: 14px;
}

.scout-profile-form-panel form {
  display: grid;
  gap: 14px;
}

.scout-profile-form-panel .profile-form-section {
  margin-bottom: 0;
  gap: 10px;
  padding: 14px;
}

.scout-profile-form-panel .profile-form-section + .profile-form-section {
  border-top-color: var(--heritage-blue);
  padding-top: 14px;
}

.scout-profile-form-panel .profile-form-section legend {
  color: var(--heritage-blue);
  display: flex;
  font-size: 1.12rem;
  gap: 8px;
}

.scout-profile-form-panel .profile-form-section legend::before {
  background: var(--accent);
  border-radius: 999px;
  content: "";
  display: inline-block;
  flex: 0 0 auto;
  height: 0.65rem;
  margin-top: 0.48rem;
  width: 0.65rem;
}

.scout-profile-form-panel .form-grid {
  gap: 8px 16px;
}

.scout-profile-form-panel .field {
  margin-bottom: 0;
}

.scout-profile-form-panel label {
  margin-bottom: 4px;
}

.scout-profile-form-panel .help {
  line-height: 1.35;
  margin-top: 4px;
}

.scout-profile-form-panel .field:has(.help) {
  margin-bottom: -4px;
}

.scout-profile-form-panel .form-section-divider {
  margin-top: 4px;
  padding-top: 12px;
}

/*
  Profile shell contract: compact auth flows stay on auth-panel, rich account
  and organization profile editing surfaces use branded-profile-panel, and child
  profile editing keeps the specialized scout-profile-form-panel treatment.
*/
.branded-profile-panel {
  background:
    var(--panel-wash),
    var(--surface);
}

.branded-profile-panel .profile-document-section[data-signature-form] {
  gap: 12px;
}

.branded-profile-panel .profile-document-section[data-signature-form].is-processing {
  cursor: progress;
}

.branded-profile-panel .profile-document-section[data-signature-form] .profile-record-card {
  border-left: 4px solid var(--heritage-blue);
}

.branded-profile-panel .profile-document-section[data-signature-form] .annual-agreement-card {
  padding-left: clamp(24px, 3vw, 32px);
}

.agreement-section-separator {
  border: 0;
  border-top: 2px solid var(--line);
  margin: 2px 0 18px clamp(24px, 3vw, 32px);
}

.submitted-registration-message {
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
}

.submitted-registration-message > :first-child {
  margin-top: 0;
}

.submitted-registration-message > :last-child {
  margin-bottom: 0;
}

.accepted-agreement-list {
  display: grid;
  gap: 0;
}

.accepted-agreement-item {
  border-top: 1px solid var(--line);
  padding: 10px 0;
}

.accepted-agreement-item:first-child {
  border-top: 0;
  padding-top: 0;
}

.accepted-agreement-item h3,
.accepted-agreement-item p {
  margin: 0;
}

.accepted-agreement-item p {
  color: var(--muted);
  margin-top: 4px;
}

.branded-profile-panel .profile-document-section[data-signature-form] .signature-card {
  padding-left: clamp(24px, 3vw, 32px);
}

.signature-instruction {
  margin: 10px 0 0;
}

.signature-card .signature-canvas {
  margin-top: 12px;
}

.signature-card [data-signature-clear] {
  margin-top: 14px;
}

.instructor-registration-submit-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
  margin-top: 18px;
}

.registration-processing-overlay {
  align-items: center;
  background: rgb(15 23 42 / 45%);
  display: grid;
  inset: 0;
  justify-items: center;
  padding: 24px;
  position: fixed;
  z-index: 1000;
}

.registration-processing-card {
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 22px 60px rgb(15 23 42 / 24%);
  color: var(--text);
  display: grid;
  gap: 10px;
  justify-items: center;
  max-width: min(420px, 100%);
  padding: 28px;
  text-align: center;
}

.registration-processing-card p {
  color: var(--muted);
  margin: 0;
}

.document-confirmation-dialog {
  background: var(--surface);
  border: 2px solid var(--heritage-blue);
  border-radius: 8px;
  box-shadow: 0 24px 70px rgb(15 23 42 / 32%);
  color: var(--text);
  margin: auto;
  max-height: calc(100vh - 48px);
  max-width: min(560px, calc(100vw - 32px));
  overflow: auto;
  padding: 0;
  width: 100%;
}

.document-confirmation-dialog::backdrop {
  background: rgb(15 23 42 / 58%);
}

.document-confirmation-content {
  display: grid;
  gap: 14px;
  padding: 26px;
  position: relative;
}

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

.document-confirmation-content h2 {
  color: var(--heritage-blue);
  font-size: 1.45rem;
}

.document-confirmation-consequences {
  border-block: 1px solid var(--line);
  display: grid;
  gap: 10px;
  margin-top: 14px;
  padding-block: 14px;
}

.document-confirmation-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.document-confirmation-processing {
  align-items: center;
  background: color-mix(in srgb, var(--surface) 96%, transparent);
  border-radius: 8px;
  color: var(--text);
  display: grid;
  gap: 16px;
  inset: 0;
  justify-items: center;
  padding: 32px;
  position: absolute;
  text-align: center;
  z-index: 2;
}

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

.document-confirmation-processing .registration-processing-spinner {
  height: 46px;
  width: 46px;
}

.document-confirmation-processing > span:last-child {
  display: grid;
  gap: 8px;
  justify-items: center;
}

.document-confirmation-processing strong {
  color: var(--heritage-blue);
  font-size: 1.2rem;
}

.document-confirmation-processing span span {
  color: var(--muted);
}

@media (max-width: 520px) {
  .document-confirmation-content {
    padding: 20px;
  }

  .document-confirmation-actions > * {
    flex: 1 1 100%;
  }
}

.zip-password-notice-card {
  justify-items: stretch;
  text-align: left;
}

.zip-password-notice-card strong {
  color: var(--heritage-blue);
  font-size: 1.2rem;
  text-align: center;
}

.zip-password-notice-card button {
  justify-self: center;
  margin-top: 6px;
}

.registration-processing-spinner {
  animation: registration-processing-spin 0.8s linear infinite;
  border: 4px solid color-mix(in srgb, var(--heritage-blue) 18%, transparent);
  border-radius: 999px;
  border-top-color: var(--heritage-blue);
  height: 42px;
  width: 42px;
}

@keyframes registration-processing-spin {
  to {
    transform: rotate(360deg);
  }
}

.agreement-language-grid {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.agreement-language-column {
  display: grid;
  gap: 8px;
}

.agreement-language-column h2 {
  color: var(--muted);
  font-size: 1.08rem;
  font-weight: 750;
  margin: 0;
}

.agreement-language-column p {
  margin: 0;
}

.branded-profile-panel .profile-document-section[data-signature-form] .profile-record-card:has(.signature-canvas) {
  border-left-color: var(--accent);
}

.branded-profile-panel .signature-canvas {
  box-shadow: inset 0 0 0 1px rgb(31 79 130 / 8%);
}

.branded-profile-panel .signature-canvas:focus {
  border-color: var(--focus);
  outline: 3px solid color-mix(in srgb, var(--focus) 28%, transparent);
  outline-offset: 2px;
}

.account-profile-title-row {
  border-bottom: 1px solid var(--line);
  margin-bottom: 12px;
  min-width: 0;
  padding-bottom: 14px;
  position: relative;
  width: 100%;
}

.account-profile-title-row::after {
  background: linear-gradient(90deg, var(--heritage-blue), var(--accent));
  bottom: -1px;
  content: "";
  height: 3px;
  left: 0;
  position: absolute;
  width: 100%;
}

.account-title-mark {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  height: 82px;
  justify-content: center;
  margin-left: auto;
  width: 82px;
}

.account-title-mark img {
  display: block;
  height: 82px;
  object-fit: contain;
  width: 82px;
}

@media (max-width: 520px) {
  .auth-compass-mark,
  .auth-compass-mark img {
    height: 92px;
    width: 92px;
  }

  .register-profile-panel .auth-compass-mark,
  .register-profile-panel .auth-compass-mark img {
    height: 92px;
    width: 92px;
  }

  .account-title-mark,
  .account-title-mark img {
    height: 64px;
    width: 64px;
  }

  .account-title-mark {
    align-self: flex-end;
    margin-left: 0;
  }
}

.account-profile-panel {
  display: grid;
  gap: 14px;
}

.account-profile-panel .section-block {
  margin-top: 0;
}

.account-profile-form {
  background:
    linear-gradient(180deg, var(--surface) 0%, var(--secondary-surface) 100%);
  border: 1px solid var(--paper-edge);
  border-radius: 6px;
  border-top: 4px solid var(--heritage-blue);
  display: grid;
  gap: 12px;
  padding: 14px;
}

.account-profile-form-grid {
  gap: 8px 16px;
}

.account-profile-form .field {
  margin-bottom: 0;
}

.account-profile-form label {
  margin-bottom: 4px;
}

.account-profile-form .help {
  line-height: 1.35;
  margin-top: 4px;
}

.account-profile-form .field:has(.help) {
  margin-bottom: -4px;
}

.account-profile-form .form-section-divider,
.register-profile-form .form-section-divider {
  border-top: 3px solid var(--heritage-blue);
  margin-top: 8px;
  padding-top: 12px;
  position: relative;
}

.account-profile-form .form-section-divider::before,
.register-profile-form .form-section-divider::before {
  background: var(--accent);
  border-radius: 999px;
  content: "";
  height: 0.65rem;
  left: 0;
  position: absolute;
  top: -0.45rem;
  width: 0.65rem;
}

.account-profile-form .form-section-divider h3,
.register-profile-form .form-section-divider h3 {
  color: var(--heritage-blue);
}

.account-secondary-panel {
  max-width: none;
}

.family-access-panel {
  display: grid;
  gap: 14px;
}

.family-access-panel .section-block {
  margin-top: 0;
}

.family-access-panel .record-list {
  margin: 0;
}

.family-access-panel .record-list li {
  padding-block: 12px;
}

.family-access-shared-row {
  align-items: flex-start;
  gap: 16px;
}

.family-access-shared-details {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.family-access-shared-name {
  display: block;
  margin-top: 2px;
}

.family-access-shared-meta {
  display: grid;
  gap: 8px;
  margin: 0;
}

.family-access-shared-meta div {
  display: grid;
  gap: 4px;
}

.family-access-shared-meta dt {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.family-access-shared-meta dd {
  margin: 0;
}

.family-access-child-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.family-access-child-chips li {
  background: var(--pill-bg);
  border: 1px solid var(--pill-border);
  border-radius: 999px;
  color: var(--heritage-blue);
  font-size: 0.86rem;
  font-weight: 700;
  padding: 3px 9px;
}

.family-access-child-list {
  column-gap: 24px;
  columns: 2;
  margin: 0;
}

.family-access-child-list li {
  break-inside: avoid;
}

.family-access-panel .guardian-add-form {
  align-items: end;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(220px, 1fr) minmax(160px, 320px) auto;
}

.family-access-panel .guardian-add-form .form-grid {
  display: contents;
}

.family-access-panel .guardian-add-form .field {
  margin-bottom: 0;
}

.family-access-panel .guardian-add-form .actions {
  align-self: end;
  margin: 0;
}

.account-security-panel {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr);
}

.account-security-panel .account-profile-title-row {
  margin-bottom: 0;
}

.account-security-panel .profile-document-section {
  gap: 10px;
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
  padding: 14px 16px;
}

.account-security-panel .security-status-card {
  margin-bottom: 0;
  min-width: 0;
  padding: 14px;
  width: 100%;
}

.account-security-panel .inline-form {
  align-items: end;
  gap: 12px;
  margin-top: 2px;
}

.account-security-panel .form-grid {
  gap: 8px 16px;
}

.account-security-panel .form-field {
  margin-bottom: 0;
}

.password-policy-panel form {
  display: grid;
  gap: 12px;
}

.password-policy-panel fieldset {
  margin-bottom: 0;
}

.password-policy-panel fieldset + fieldset {
  padding-top: 12px;
}

.password-policy-panel .form-grid {
  gap: 8px 16px;
}

.password-policy-panel .field {
  margin-bottom: 0;
}

.authentication-rate-limit-panel form {
  display: grid;
  gap: 12px;
}

.authentication-rate-limit-panel fieldset {
  margin-bottom: 0;
}

.authentication-rate-limit-panel .form-grid {
  gap: 8px 16px;
}

.authentication-rate-limit-panel .field {
  margin-bottom: 0;
}

.checkbox-setting-field {
  align-content: start;
}

.checkbox-setting-field label {
  margin-bottom: 4px;
}

.checkbox-setting-field input[type="checkbox"] {
  min-height: 0;
}

.account-security-panel .notice,
.account-security-panel .message,
.account-security-panel .record-list,
.account-security-panel dl {
  margin-bottom: 0;
}

.account-security-panel .mfa-cartoon-card,
.account-security-panel .compact-detail-grid {
  min-width: 0;
  width: 100%;
}

.mfa-cartoon-card {
  align-items: center;
  background: linear-gradient(180deg, var(--surface) 0%, var(--secondary-surface) 100%);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 0.95fr) minmax(280px, 1.2fr);
  margin: 16px 0;
  padding: 16px;
}

.mfa-cartoon-copy {
  display: grid;
  gap: 8px;
}

.mfa-cartoon-copy h2,
.mfa-cartoon-copy p {
  margin: 0;
}

.mfa-cartoon-copy h2 {
  color: var(--heritage-blue);
  font-size: 1.18rem;
}

.mfa-cartoon-video {
  aspect-ratio: 16 / 9;
  background: #f8f3e8;
  border: 1px solid var(--paper-edge);
  border-radius: 8px;
  display: block;
  width: 100%;
}

.mfa-help-panel {
  display: grid;
  gap: 14px;
}

.mfa-help-panel .mfa-cartoon-card {
  grid-template-columns: 1fr;
  margin: 0;
}

.form-panel:not(.wide-form) .mfa-cartoon-card {
  grid-template-columns: 1fr;
}

.mfa-cartoon-download {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0;
}

.secure-documents-section {
  max-width: none;
}

.secure-documents-section > h2 {
  margin: 0;
}

.profile-checkbox-label {
  align-items: flex-start;
  display: inline-flex;
  gap: 9px;
  margin-bottom: 0;
}

.profile-checkbox-label input[type="checkbox"] {
  flex: 0 0 auto;
  margin-top: 0.35rem;
}

.organization-emblem {
  aspect-ratio: 1;
  border: 1px solid var(--line);
  border-radius: 6px;
  flex: 0 0 auto;
  height: 36px;
  object-fit: contain;
  padding: 3px;
  width: 36px;
}

.organization-emblem-preview {
  height: 84px;
  width: 84px;
}

.organization-emblem-strip {
  align-items: center;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-right: 8px;
  vertical-align: middle;
}

.organization-record-main {
  align-items: center;
  display: flex;
  gap: 10px;
  min-width: 0;
}

.compact-photo {
  height: 72px;
  margin-top: 8px;
  width: 72px;
}

.section-block {
  border-top: 1px solid var(--line);
  margin-top: 18px;
  padding-top: 14px;
}

.organization-structure-panel {
  display: grid;
  gap: 14px;
}

.organization-structure-panel .filter-form {
  margin-bottom: 0;
}

.organization-structure-panel .profile-document-section {
  margin-top: 0;
}

.organization-record-title {
  align-items: center;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
}

.notification-settings-panel form {
  display: grid;
  gap: 14px;
}

.notification-settings-fields {
  display: grid;
  gap: 12px;
}

.notification-settings-fields > .reminder-weekday-options {
  grid-column: 1 / -1;
}

.notification-settings-section .notice {
  margin-bottom: 12px;
}

.trip-notification-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 390px), 1fr));
  margin-top: 14px;
}

.trip-notification-card {
  background: color-mix(in srgb, var(--surface) 88%, var(--secondary-surface));
  border: 1px solid var(--paper-edge);
  border-left: 4px solid var(--heritage-blue);
  border-radius: 6px;
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 14px;
}

.trip-notification-card h3 {
  color: var(--heritage-blue);
  font-size: 1.05rem;
  margin: 0;
}

.trip-notification-primary-fields,
.trip-notification-schedule-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.trip-notification-card .field {
  margin-bottom: 0;
}

.trip-notification-card .reminder-weekday-options {
  margin: 0;
}

.trip-notification-card .reminder-weekday-options .field > div[id] {
  gap: 8px 10px;
}

@media (max-width: 900px) {
  .trip-notification-primary-fields,
  .trip-notification-schedule-grid {
    grid-template-columns: 1fr;
  }
}

.document-requirement-role-sections {
  display: grid;
  gap: 14px;
  margin: 8px 0 18px;
}

.document-requirement-role-group {
  margin-top: 0;
}

.document-requirement-role-group h2 {
  font-size: 1.15rem;
}

.document-requirement-role-group > .help {
  margin: 0 0 6px;
}

.document-requirement-role-fields {
  display: grid;
  gap: 12px;
}

.document-requirement-role-fields .field {
  margin-bottom: 0;
}

.dashboard-panel {
  display: grid;
  gap: 24px;
}

.dashboard-section {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 14px;
  padding-top: 22px;
}

.dashboard-section:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.dashboard-section h2,
.section-heading-row p {
  margin-bottom: 0;
}

.dashboard-alert,
.dashboard-onboarding {
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  padding: 16px;
}

.dashboard-alert h2,
.dashboard-onboarding h2 {
  margin-bottom: 4px;
}

.dashboard-alert-warning {
  background: #fff7e6;
  border-color: #f0d49b;
}

.dashboard-alert-info {
  align-items: center;
  background: #eef6ff;
  border-color: #b8d7f4;
  grid-template-columns: minmax(0, 1fr) auto;
}

.dashboard-onboarding {
  align-items: start;
  background: #fff;
  grid-template-columns: minmax(0, 1fr) minmax(190px, auto);
}

.public-home-title {
  align-items: center;
  display: flex;
  gap: 14px;
}

.public-home-title-logo {
  display: block;
  flex: 0 0 auto;
  height: 72px;
  object-fit: contain;
  width: 72px;
}

.dashboard-welcome-copy {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.dashboard-welcome-intro {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: 120px minmax(0, 1fr);
  min-width: 0;
}

.dashboard-welcome-logo {
  display: block;
  height: 120px;
  object-fit: contain;
  width: 120px;
}

.dashboard-welcome-text {
  min-width: 0;
}

.dashboard-message-list {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.dashboard-message-list ul {
  display: grid;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.dashboard-message {
  align-items: center;
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-left: 4px solid var(--heritage-blue);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 10px 12px;
}

.dashboard-message-warning {
  border-left-color: var(--heritage-red);
}

.dashboard-message span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

html[data-theme="dark"] .dashboard-alert-warning {
  background: #352b16;
  border-color: #8e7333;
}

html[data-theme="dark"] .dashboard-alert-info,
html[data-theme="dark"] .dashboard-onboarding {
  background: var(--soft-surface);
  border-color: var(--paper-edge);
}

html[data-theme="dark"] .dashboard-alert-info .notice,
html[data-theme="dark"] .dashboard-onboarding .notice {
  color: var(--muted);
}

.account-role-summary {
  align-content: start;
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  min-width: 240px;
  padding: 12px;
}

.account-role-summary > .dashboard-attention-heading {
  color: var(--heritage-blue);
  font-size: 0.86rem;
  letter-spacing: 0;
}

.dashboard-identity-list {
  display: grid;
  gap: 10px;
  margin: 0;
}

.dashboard-identity-list div {
  border-top: 1px solid rgba(32, 80, 129, 0.16);
  display: grid;
  gap: 2px;
  padding-top: 8px;
}

.dashboard-identity-list div:first-child {
  border-top: 0;
  padding-top: 0;
}

.dashboard-identity-list dt {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 750;
  margin: 0;
  text-transform: uppercase;
}

.dashboard-identity-list dd {
  color: var(--ink);
  font-weight: 650;
  margin: 0;
  overflow-wrap: anywhere;
}

.dashboard-next-steps {
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 14px;
  margin-bottom: 22px;
  padding: 16px;
}

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

.next-step-item {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 12px 14px;
}

.next-step-item p {
  margin: 4px 0 0;
}

html[data-theme="dark"] .next-step-item,
html[data-theme="dark"] .dashboard-attention-panel,
html[data-theme="dark"] .child-card-unit,
html[data-theme="dark"] .profile-action-grid .dashboard-attention-panel {
  background: var(--secondary-surface);
  border-color: var(--paper-edge);
  color: var(--ink);
}

html[data-theme="dark"] .next-step-item .notice,
html[data-theme="dark"] .dashboard-attention-panel .notice,
html[data-theme="dark"] .child-card-unit span {
  color: var(--muted);
}

.section-heading-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: space-between;
}

.security-summary-panel {
  display: grid;
  gap: 14px;
}

.security-summary-action-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

.security-summary-status {
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 2px;
  margin: 0;
  min-width: min(100%, 220px);
  padding: 10px 12px;
}

.security-summary-status span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 750;
  text-transform: uppercase;
}

.security-summary-status strong {
  color: var(--ink);
}

.dashboard-tile-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}

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

.pending-review-list {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
}

.pending-review-card {
  min-height: 0;
}

.pending-review-card .dashboard-card-actions {
  align-items: center;
  justify-content: space-between;
}

.annual-signup-opportunity {
  background: var(--surface);
  border: 1px solid var(--paper-edge);
  border-left: 4px solid var(--heritage-blue);
  border-radius: 6px;
  padding: 0;
}

.completed-registration-section {
  border-top: 2px solid rgb(31 79 130 / 45%);
}

.completed-registration-summary {
  cursor: pointer;
  display: block;
  list-style: none;
  list-style-type: none;
  padding-right: 44px;
  position: relative;
}

.completed-registration-heading {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.completed-registration-title-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
}

.completed-registration-title-row h2 {
  margin: 0;
}

.completed-registration-heading .notice {
  margin-bottom: 0;
}

.completed-registration-summary::marker {
  content: none;
  font-size: 0;
}

.completed-registration-summary::-webkit-details-marker {
  display: none;
}

.completed-registration-summary::after {
  color: var(--heritage-blue);
  content: "+";
  font-size: 1.4rem;
  font-weight: 800;
  line-height: 1;
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
}

.completed-registration-section[open] .completed-registration-summary::after {
  content: "-";
}

.completed-registration-section[open] .completed-registration-summary {
  margin-bottom: 14px;
}

.annual-signup-completed-list {
  background: #f8fafc;
  border: 1px solid #cbd5e1;
  border-left: 4px solid rgb(100 116 139 / 75%);
  border-radius: 6px;
  padding: 12px;
}

.annual-signup-summary-content,
.annual-signup-participant {
  align-items: center;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.annual-signup-summary {
  cursor: pointer;
  list-style: none;
  padding: 16px 44px 16px 18px;
  position: relative;
}

.annual-signup-summary::-webkit-details-marker {
  display: none;
}

.annual-signup-summary::after {
  color: var(--heritage-blue);
  content: "+";
  font-size: 1.4rem;
  font-weight: 800;
  line-height: 1;
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
}

.annual-signup-opportunity[open] .annual-signup-summary::after {
  content: "-";
}

.annual-signup-summary-content > span:first-child,
.annual-signup-person {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.annual-signup-summary-content strong {
  font-size: 1.12rem;
}

.annual-signup-participants {
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-left: 3px solid var(--heritage-blue);
  border-radius: 6px;
  display: grid;
  margin: 0 18px 16px 48px;
  padding: 0 14px;
}

.annual-signup-opportunity:not([open]) .annual-signup-participants {
  display: none;
}

.annual-signup-participant {
  align-items: center;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 10px 0;
}

.annual-signup-participant + .annual-signup-participant {
  border-top: 1px solid var(--line);
}

.annual-signup-participant .organization-emblem-strip {
  justify-content: flex-start;
  margin-right: 0;
}

.annual-signup-blocked-actions {
  align-items: flex-end;
  flex-direction: column;
  max-width: min(360px, 42vw);
  text-align: right;
}

.annual-signup-blocked-actions .subtle {
  max-width: 100%;
}

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

.record-list li.registration-history-item {
  align-items: center;
  display: grid;
  gap: 10px 16px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding-block: 10px;
}

.registration-history-main {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.registration-history-heading,
.registration-history-meta {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
  min-width: 0;
}

.registration-history-heading .admin-tile-label {
  margin: 0;
}

.registration-history-type {
  background: var(--secondary-surface);
  border: 1px solid var(--line);
  border-radius: 4px;
  color: var(--heritage-blue);
  line-height: 1;
  padding: 4px 6px;
}

.registration-history-heading strong {
  line-height: 1.2;
}

.registration-history-meta {
  gap: 5px 12px;
}

.registration-history-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.parent-dashboard-card-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
}

.admin-tile-grid,
.dashboard-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

.annual-council-window-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
}

.annual-council-window-card {
  background:
    linear-gradient(180deg, var(--surface) 0%, var(--secondary-surface) 100%);
  border: 1px solid var(--paper-edge);
  border-radius: 6px;
  border-top: 4px solid var(--heritage-blue);
  display: grid;
  gap: 14px;
  min-width: 0;
  padding: 16px;
}

.annual-council-window-card.is-collapsed {
  background: var(--surface);
  gap: 0;
}

.annual-council-window-heading {
  align-items: start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.annual-council-window-title {
  border-left: 4px solid var(--heritage-blue);
  color: var(--heritage-blue);
  display: grid;
  gap: 3px;
  min-width: 0;
  padding-left: 10px;
}

.annual-council-window-heading strong {
  font-size: 1.3rem;
  line-height: 1.15;
}

.annual-council-window-fields {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.annual-council-window-fields[hidden] {
  display: none;
}

.annual-council-window-fields > * {
  min-width: 0;
}

.annual-council-window-field-label {
  color: var(--ink);
  display: block;
  font-weight: 650;
  margin-bottom: 6px;
}

.annual-council-window-wide {
  grid-column: 1 / -1;
}

@media (max-width: 760px) {
  .annual-council-window-heading {
    display: grid;
  }

  .annual-council-window-fields {
    grid-template-columns: 1fr;
  }
}

.organization-console {
  display: grid;
  gap: 28px;
}

.organization-console-section {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.organization-console-section-heading {
  align-items: baseline;
  border-bottom: 1px solid color-mix(in srgb, var(--heritage-blue) 26%, var(--paper-edge));
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding-bottom: 8px;
}

.organization-console-section-heading h2 {
  font-size: 1.25rem;
  margin: 0;
}

.organization-console-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
}

.document-processing-panel {
  display: grid;
  gap: 18px;
}

.document-processing-panel > * {
  min-width: 0;
}

.document-processing-panel .section-block {
  margin-top: 0;
}

.document-processing-section-heading {
  align-items: center;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  margin-bottom: 14px;
}

.document-processing-section-heading h2 {
  margin: 0;
}

.document-processing-heading-actions {
  align-items: end;
  display: flex;
  gap: 10px;
}

.document-processing-heading-actions form {
  margin: 0;
}

.document-processing-refresh-control {
  display: grid;
  gap: 4px;
}

.document-processing-refresh-control label {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 750;
}

.document-processing-refresh-control select {
  min-height: 36px;
  min-width: 120px;
}

.document-processing-status-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
}

.document-processing-subheading {
  font-size: 1rem;
  margin: 20px 0 10px;
}

.document-processing-memory-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin: 0;
}

.document-processing-memory-grid small {
  color: var(--muted);
  display: block;
  font-size: 0.75rem;
  font-weight: 650;
  margin-top: 4px;
}

.document-processing-status-card {
  background: var(--secondary-surface);
  border: 1px solid var(--line);
  border-radius: 6px;
  border-top: 3px solid var(--heritage-blue);
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 14px;
}

.document-processing-status-card-emphasis {
  border-top-color: var(--accent);
}

.document-processing-status-card-wide {
  grid-column: span 2;
}

.document-processing-status-card dt {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 750;
  letter-spacing: 0.02em;
}

.document-processing-status-card dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.document-processing-metric {
  color: var(--heritage-blue);
  font-size: 1.35rem;
  font-weight: 750;
  line-height: 1.15;
}

@media (max-width: 900px) {
  .document-processing-memory-grid,
  .document-processing-status-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.admin-tile,
.dashboard-card {
  align-content: start;
  background:
    linear-gradient(180deg, var(--surface) 0%, var(--secondary-surface) 100%);
  border: 1px solid var(--paper-edge);
  border-radius: 6px;
  border-top: 4px solid var(--heritage-blue);
  color: var(--ink);
  display: grid;
  gap: 8px;
  grid-auto-rows: max-content;
  min-height: 142px;
  min-width: 0;
  padding: 18px;
  position: relative;
  text-decoration: none;
}

.admin-tile::after,
.dashboard-card::after {
  background: linear-gradient(180deg, rgb(31 79 130 / 6%), transparent 58%);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
}

.admin-tile:hover,
.dashboard-card:hover {
  border-color: color-mix(in srgb, var(--heritage-blue) 30%, var(--paper-edge));
  border-top-color: var(--accent);
  box-shadow: 0 12px 22px var(--shadow-color);
  transform: translateY(-1px);
}

.static-admin-tile:hover {
  border-color: var(--paper-edge);
  border-top-color: var(--heritage-blue);
  box-shadow: none;
  transform: none;
}

.compact-admin-tile {
  gap: 6px;
  min-height: 118px;
  padding: 15px 16px;
}

.compact-admin-tile strong {
  font-size: 1.05rem;
}

.admin-tile > *,
.dashboard-card > * {
  position: relative;
  z-index: 1;
}

.admin-tile span,
.dashboard-card span {
  color: var(--muted);
}

.admin-tile strong,
.dashboard-card strong {
  font-size: 1.15rem;
}

.admin-tile-label {
  color: var(--heritage-blue);
  font-size: 0.78rem;
  font-weight: 750;
  text-transform: uppercase;
}

.tile-status-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.tile-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 8px;
}

.camping-trip-admin-card {
  align-items: center;
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 0;
}

.camping-trip-admin-main {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.camping-trip-admin-actions {
  gap: 8px;
  justify-content: flex-end;
  margin-top: 0;
}

.camping-trip-admin-actions form {
  margin: 0;
}

.camping-trip-admin-actions .secondary-button {
  min-height: 36px;
  padding: 6px 12px;
  text-decoration: none;
}

.system-info-list {
  display: grid;
  gap: 6px;
  margin: 0;
}

.system-info-list div {
  align-items: baseline;
  display: grid;
  gap: 8px;
  grid-template-columns: 76px 1fr;
}

.system-info-list dt {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 750;
  text-transform: uppercase;
}

.system-info-list dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.readiness-item {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.45rem;
  padding-top: 0.75rem;
}

.readiness-item label {
  color: var(--ink);
  font-weight: 700;
}

.readiness-summary,
.dashboard-card-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.dashboard-card-actions {
  justify-content: flex-start;
  margin-top: auto;
  min-width: 0;
}

.child-dashboard-card {
  align-content: start;
  gap: 12px;
  min-height: 0;
}

.child-card-header {
  align-items: flex-start;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) max-content;
}

.child-card-header > .secondary-link {
  justify-self: end;
  white-space: nowrap;
}

.child-card-title {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.child-card-title strong {
  line-height: 1.2;
}

.child-card-name-row {
  align-items: baseline;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
}

.child-card-unit {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  gap: 10px;
  padding: 10px;
}

.child-card-unit > span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.child-card-unit strong {
  font-size: 0.9rem;
}

.child-card-unit .emblem-strip {
  flex: 0 0 auto;
}

.child-dashboard-card .dashboard-attention-grid {
  grid-template-columns: 1fr;
}

.child-dashboard-card .dashboard-card-actions {
  border-top: 1px solid var(--line);
  padding-top: 10px;
}

.dashboard-attention-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.dashboard-attention-panel {
  align-content: start;
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 12px;
}

.dashboard-attention-heading {
  color: var(--ink);
  font-weight: 750;
}

.profile-action-summary {
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  margin: 0;
  padding: 16px;
}

.profile-action-summary h2 {
  margin: 0;
}

.profile-action-grid .dashboard-attention-panel {
  align-content: start;
  background: #fff;
}

.profile-overview-grid,
#troop-details,
#troop-assignment,
#medical-notes,
#secure-documents,
.document-checklist-row,
#family-access {
  scroll-margin-top: var(--anchor-offset);
}

.self-status-panel {
  display: grid;
  gap: 14px;
}

.self-status-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.self-status-actions {
  justify-content: flex-start;
}

.compact-action-link {
  font-size: 0.9rem;
  min-height: 32px;
  padding: 5px 10px;
}

.dashboard-document-statuses {
  display: grid;
  gap: 0.35rem;
}

.dashboard-document-status {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.dashboard-document-status-group {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.35rem;
  padding-top: 0.45rem;
}

.dashboard-document-status-group:first-child {
  border-top: 0;
  padding-top: 0;
}

.dashboard-document-status strong {
  color: var(--ink);
  flex: 1 1 100%;
  font-size: 0.95rem;
  line-height: 1.25;
}

.tile-status-pill {
  background: var(--pill-surface);
  border: 1px solid var(--pill-border);
  border-radius: 999px;
  color: var(--pill-ink);
  display: inline-flex;
  font-size: 0.78rem;
  font-weight: 750;
  padding: 2px 8px;
}

.tile-status-attention {
  background: var(--pill-missing-surface);
  border-color: var(--pill-missing-border);
  color: var(--accent-dark);
}

.security-tile {
  background:
    linear-gradient(
      180deg,
      var(--surface) 0%,
      color-mix(in srgb, var(--accent-soft) 45%, var(--secondary-surface)) 100%
    );
  border-color: color-mix(in srgb, var(--accent) 24%, var(--paper-edge));
  border-top-color: var(--accent-dark);
}

.security-panel {
  border-color: #e8c6c8;
  box-shadow: inset 4px 0 0 var(--accent);
}

.security-panel .title-row h1 {
  margin-bottom: 4px;
}

.empty-state {
  background: var(--page);
  border: 1px dashed var(--line);
  border-radius: 8px;
  color: var(--muted);
  margin: 10px 0 0;
  padding: 12px;
}

.dashboard-empty-state {
  display: grid;
  gap: 10px;
  margin-top: 0;
}

.dashboard-empty-state p {
  margin: 0;
}

.record-list {
  display: grid;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.record-list li,
.record-row {
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  min-width: 0;
  padding: 12px;
}

.record-list li.organization-record-inactive {
  background: #f7f8fa;
  border-color: #c8d0db;
  opacity: 0.78;
}

.record-list li.organization-record-inactive strong {
  color: #516070;
  text-decoration: line-through;
  text-decoration-thickness: 1px;
}

.record-list span {
  color: var(--muted);
  min-width: 0;
}

.record-list .success-text {
  color: #176b3a;
}

.record-list .warning-text {
  color: #9a5a00;
}

html[data-theme="dark"] .record-list .success-text {
  color: var(--pill-ok-ink);
}

html[data-theme="dark"] .record-list .warning-text {
  color: var(--pill-review-ink);
}

.record-row strong {
  color: var(--ink);
  display: block;
}

.instructor-division-settings-panel {
  align-items: stretch;
  display: grid;
  gap: 14px;
  justify-content: stretch;
}

.instructor-division-panel-header {
  align-items: flex-start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.instructor-division-panel-header .compact-action-link {
  flex: 0 0 auto;
}

.instructor-division-settings-grid {
  align-items: start;
  width: 100%;
}

.instructor-division-message-field {
  grid-column: 1 / -1;
  min-width: 0;
}

.instructor-division-message-field > .field {
  margin: 0;
}

.muted {
  color: var(--muted);
}

.troop-settings-row {
  align-items: center;
}

.troop-settings-filter-field {
  max-width: 520px;
}

.troop-settings-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-end;
}

.file-upload-panel {
  border: 1px dashed var(--line);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  margin-top: 12px;
  padding: 14px;
}

.agreement-edit-list {
  display: grid;
  gap: 14px;
}

.agreement-edit-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  padding: 14px;
}

.agreement-edit-card-header {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding-bottom: 10px;
}

.agreement-edit-card-header strong {
  color: var(--ink);
  display: block;
}

.agreement-edit-card-controls {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  justify-content: flex-end;
}

.agreement-edit-checkbox {
  align-items: center;
  color: var(--ink);
  display: inline-flex;
  font-weight: 700;
  gap: 6px;
  line-height: 1.2;
  white-space: nowrap;
}

.agreement-edit-checkbox input[type="checkbox"] {
  margin: 0;
}

.agreement-edit-grid {
  align-items: start;
}

.agreement-edit-body textarea {
  min-height: 150px;
}

.rich-text-toolbar {
  align-items: center;
  background: color-mix(in srgb, var(--surface) 88%, var(--page));
  border: 1px solid var(--line);
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  padding: 6px;
}

.rich-text-toolbar button {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 0;
  color: var(--ink);
  min-height: 32px;
  min-width: 34px;
  padding: 0 9px;
}

.rich-text-toolbar button:first-child {
  border-radius: 5px 0 0 5px;
}

.rich-text-toolbar button:last-child {
  border-radius: 0 5px 5px 0;
}

.rich-text-toolbar button:hover,
.rich-text-toolbar button:focus {
  background: color-mix(in srgb, var(--heritage-blue) 10%, var(--surface));
  border-color: color-mix(in srgb, var(--heritage-blue) 35%, var(--line));
}

.rich-text-toolbar button.rich-text-toolbar-button-active,
.rich-text-toolbar button[aria-pressed="true"] {
  background: var(--heritage-blue);
  border-color: var(--heritage-blue);
  color: #fff;
}

.rich-text-toolbar button.rich-text-toolbar-button-active:hover,
.rich-text-toolbar button.rich-text-toolbar-button-active:focus,
.rich-text-toolbar button[aria-pressed="true"]:hover,
.rich-text-toolbar button[aria-pressed="true"]:focus {
  background: color-mix(in srgb, var(--heritage-blue) 88%, #000);
  border-color: color-mix(in srgb, var(--heritage-blue) 88%, #000);
}

.rich-text-toolbar-group {
  align-items: center;
  border-right: 1px solid var(--line);
  display: inline-flex;
  gap: 0;
  margin-right: 6px;
  padding-right: 6px;
}

.rich-text-toolbar-group:last-child {
  border-right: 0;
  margin-right: 0;
  padding-right: 0;
}

.rich-text-toolbar-selects {
  gap: 6px;
}

.rich-text-toolbar label {
  align-items: center;
  display: inline-flex;
  gap: 6px;
  margin: 0;
}

.rich-text-toolbar label span {
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 750;
  text-transform: uppercase;
}

.rich-text-toolbar select {
  background-color: var(--surface);
  border-radius: 5px;
  font-size: 0.9rem;
  min-height: 32px;
  min-width: 118px;
  padding: 0 28px 0 8px;
}

.rich-text-link-panel {
  align-items: end;
  background: color-mix(in srgb, var(--surface) 92%, var(--page));
  border: 1px solid var(--line);
  border-bottom: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 8px;
}

.rich-text-link-panel label {
  display: grid;
  gap: 4px;
  margin: 0;
  min-width: min(100%, 280px);
}

.rich-text-link-panel label span {
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 750;
  text-transform: uppercase;
}

.rich-text-link-panel input {
  min-height: 34px;
}

.rich-text-link-panel button {
  min-height: 34px;
  padding: 0 12px;
}

.rich-text-editor {
  background: var(--field-surface);
  border: 1px solid var(--line);
  border-radius: 0 0 8px 8px;
  min-height: 260px;
  overflow: auto;
  padding: 12px;
}

.rich-text-editor:focus {
  border-color: var(--focus);
  outline: 3px solid color-mix(in srgb, var(--focus) 28%, transparent);
  outline-offset: 2px;
}

.rich-text-pending-link {
  background: color-mix(in srgb, var(--focus) 28%, transparent);
  border-radius: 3px;
  box-shadow: inset 0 -2px 0 var(--heritage-blue);
}

.record-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  justify-content: flex-end;
}

.record-actions form {
  margin: 0;
}

.record-actions .secondary-link,
.record-actions .link-button {
  font-size: 0.92rem;
  min-height: 30px;
}

.audit-event-list-header {
  color: var(--muted);
  display: grid;
  font-size: 0.84rem;
  font-weight: 700;
  grid-template-columns: minmax(0, 1fr) minmax(280px, auto);
  margin: 0 0 8px;
  padding: 0 14px;
  text-transform: uppercase;
}

.audit-event-list-header span:last-child {
  text-align: right;
}

.org-chart {
  display: grid;
  gap: 18px;
  margin-top: 24px;
}

.org-node {
  display: grid;
  gap: 14px;
  min-width: 0;
  position: relative;
}

.org-node-card {
  background: linear-gradient(180deg, var(--surface) 0%, var(--soft-surface) 100%);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 16px;
}

.org-node-card h2 {
  font-size: 1.2rem;
  margin: 0;
}

.org-node-card > .admin-tile-label {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}

.org-children {
  border-left: 2px solid var(--line);
  display: grid;
  gap: 14px;
  margin-left: 18px;
  padding-left: 18px;
}

.org-leader-list {
  display: grid;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.org-leader-list li {
  align-items: center;
  background: var(--secondary-surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 6px;
  grid-template-columns: minmax(9rem, 1fr) minmax(12rem, 1.2fr) auto;
  min-width: 0;
  padding: 10px 12px;
}

.org-leader-list span {
  min-width: 0;
}

.summary-strip {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));
  margin: 1rem 0;
}

.summary-strip > a {
  background: var(--page);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0.8rem;
  text-decoration: none;
}

.summary-strip > a:hover {
  border-color: var(--accent);
}

.summary-strip strong {
  color: var(--ink);
  display: block;
  font-size: 1.35rem;
}

.summary-strip span {
  color: var(--muted);
  display: block;
  font-size: 0.88rem;
  font-weight: 700;
  margin-top: 0.15rem;
}

.summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, max-content));
  gap: 0.75rem;
  margin: 1.5rem 0;
}

.registration-performance-filter {
  align-items: end;
}

.registration-performance-filter-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: center;
}

.registration-performance-workflows,
.registration-performance-trends,
.registration-performance-settings {
  margin-top: 1.25rem;
}

.registration-performance-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem;
  margin-bottom: 1rem;
  color: var(--muted-text);
  font-size: 0.9rem;
}

.registration-performance-legend span::before {
  content: "";
  display: inline-block;
  width: 0.75rem;
  height: 0.75rem;
  margin-right: 0.35rem;
  border-radius: 0.2rem;
  background: var(--heritage-blue);
}

.registration-performance-legend .performance-legend-validation::before,
.performance-trend-validation {
  background: #7c3aed;
}

.registration-performance-legend .performance-legend-pdf::before,
.performance-trend-pdf {
  background: #64748b;
}

.registration-performance-legend .performance-legend-audit::before,
.performance-trend-audit {
  background: #0891b2;
}

.registration-performance-legend .performance-legend-submitter-email::before,
.performance-trend-submitter-email {
  background: #c62828;
}

.registration-performance-legend .performance-legend-recipient-email::before,
.performance-trend-recipient-email {
  background: #e87924;
}

.registration-performance-legend .performance-legend-rendering::before,
.performance-trend-rendering {
  background: #2f855a;
}

.registration-performance-chart {
  display: grid;
  gap: 0.7rem;
}

.performance-trend-row {
  display: grid;
  grid-template-columns: minmax(12rem, 18rem) minmax(12rem, 1fr) 6rem;
  gap: 0.75rem;
  align-items: center;
}

.performance-trend-label {
  display: flex;
  justify-content: space-between;
  gap: 0.6rem;
}

.performance-trend-label span {
  color: var(--muted);
}

.performance-trend-track {
  display: flex;
  min-height: 1rem;
  overflow: hidden;
  border-radius: 999px;
  background: var(--soft-surface);
}

.performance-trend-segment {
  min-width: 0;
}

.performance-trend-database {
  background: var(--heritage-blue);
}

.performance-trend-total {
  text-align: right;
  white-space: nowrap;
}

.registration-performance-table-wrap {
  max-width: 100%;
  overflow-x: auto;
  width: 100%;
}

.registration-performance-table {
  min-width: 1480px;
  width: 100%;
}

.registration-performance-table th,
.registration-performance-table td {
  white-space: nowrap;
}

.registration-performance-table th:first-child,
.registration-performance-table td:first-child {
  min-width: 165px;
}

.registration-performance-table th:nth-child(2),
.registration-performance-table td:nth-child(2) {
  min-width: 150px;
}

.registration-performance-table th:nth-child(9),
.registration-performance-table td:nth-child(9),
.registration-performance-table th:nth-child(10),
.registration-performance-table td:nth-child(10) {
  min-width: 145px;
}

@media (max-width: 760px) {
  .performance-trend-row {
    grid-template-columns: 1fr auto;
  }

  .performance-trend-track {
    grid-column: 1 / -1;
    grid-row: 2;
  }
}

.summary-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  min-width: 160px;
  padding: 0.75rem 1rem;
}

.summary-card strong,
.summary-card span {
  display: block;
}

.summary-card strong {
  color: var(--ink);
  font-size: 1.35rem;
}

.summary-card h3 {
  margin: 0;
}

.summary-card span {
  color: var(--muted);
  font-size: 0.88rem;
  font-weight: 700;
  margin-top: 0.15rem;
}

.compact-detail-grid {
  gap: 0.75rem;
  margin-top: 0.75rem;
}

.compact-detail-grid > div {
  min-width: 0;
  padding: 0.55rem 0;
}

.message-preview.wrap-long-content {
  max-width: 100%;
  overflow-x: auto;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
  word-break: break-word;
}

.active-filter-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0.85rem 0;
}

.filter-pill {
  align-items: center;
  background: #eef7f7;
  border: 1px solid #b9dfdf;
  border-radius: 999px;
  color: #315a6d;
  display: inline-flex;
  font-size: 0.86rem;
  font-weight: 700;
  gap: 0.45rem;
  padding: 0.3rem 0.65rem;
}

.compact-table {
  border-collapse: collapse;
  margin-top: 0.75rem;
  width: min(100%, 42rem);
}

.compact-table th,
.compact-table td {
  border-bottom: 1px solid #d7deea;
  padding: 0.4rem 0.5rem;
  text-align: left;
  vertical-align: top;
}

.compact-table th {
  color: #4b5870;
  font-size: 0.85rem;
}

.record-select {
  align-items: center;
  display: flex;
  min-height: 28px;
}

.profile-record-row {
  align-items: center;
  display: grid;
  gap: 12px;
  grid-template-columns: 28px minmax(0, 1fr) minmax(180px, max-content);
  justify-content: stretch;
  justify-items: start;
}

.profile-record-main {
  display: grid;
  gap: 4px;
  grid-column: 2;
  justify-self: stretch;
  min-width: 0;
  text-align: left;
  width: 100%;
}

.profile-record-meta {
  align-items: center;
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  gap: 4px 14px;
}

.profile-record-row .record-select {
  grid-column: 1;
  justify-content: center;
  justify-self: center;
}

.profile-record-row > .secondary-link,
.profile-record-row > .profile-record-actions {
  grid-column: 3;
  justify-self: end;
}

.profile-missing-details {
  color: var(--muted);
  font-size: 0.9rem;
}

.profile-record-actions {
  align-items: center;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 14px;
  white-space: nowrap;
  width: max-content;
}

.profile-record-actions .secondary-link {
  min-height: 30px;
}

.compact-status-row {
  margin-top: 4px;
}

.document-review-list .document-review-row {
  align-items: start;
  display: grid;
  gap: 14px;
  grid-template-columns: 24px minmax(0, 1fr) minmax(150px, max-content);
  justify-content: stretch;
}

.insurance-card-review-panel .insurance-card-review-row {
  grid-template-columns:
    minmax(260px, 1fr)
    minmax(150px, max-content)
    minmax(260px, 0.8fr);
  justify-items: stretch;
}

.insurance-card-review-panel .insurance-card-review-filter {
  margin-bottom: 16px;
}

.document-review-main {
  display: block;
  justify-self: stretch;
  min-width: 0;
  text-align: left;
}

.insurance-card-review-panel .compact-document-meta {
  display: grid;
  gap: 10px 16px;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  margin-top: 10px;
}

.insurance-card-review-panel .compact-document-meta > div {
  min-width: 0;
}

.document-review-actions {
  align-content: start;
  align-items: flex-end;
  flex-direction: column;
  justify-self: end;
}

.insurance-card-review-panel .insurance-card-review-form {
  align-content: start;
  justify-self: stretch;
  min-width: 0;
  padding: 0;
}

.insurance-card-review-panel .insurance-card-review-form .field,
.insurance-card-review-panel .insurance-card-review-form textarea {
  min-width: 0;
  width: 100%;
}

.insurance-card-review-panel .insurance-card-review-result {
  align-content: start;
  color: var(--muted);
  display: grid;
  gap: 6px;
  justify-self: stretch;
  min-width: 0;
}

.insurance-card-review-panel .insurance-card-review-result strong {
  color: var(--ink);
}

@media (max-width: 900px) {
  .insurance-card-review-panel .insurance-card-review-row {
    grid-template-columns: 1fr;
  }

  .insurance-card-review-panel .document-review-actions {
    align-items: flex-start;
    justify-self: start;
  }
}

.document-reminder-meta {
  color: var(--muted);
  display: block;
  font-size: 0.9rem;
  margin-top: 8px;
}

.document-reminder-error {
  color: var(--accent-dark);
  display: block;
  font-weight: 700;
  margin-top: 4px;
}

.bulk-actions {
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0 0 16px;
  padding: 12px;
}

.checkbox-label {
  align-items: center;
  display: inline-flex;
  font-weight: 700;
  gap: 8px;
}

.selection-list {
  display: grid;
  gap: 10px;
  margin: 16px 0;
}

.selection-list-select-all {
  margin-top: 12px;
}

.selection-list-item {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
}

.selection-list-item span span {
  display: block;
  font-weight: 500;
  margin-top: 2px;
}

.role-selection-intro {
  margin-bottom: 10px;
}

.role-selection-heading,
.section-heading-with-pill {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.info-pill {
  align-items: center;
  background: var(--pill-surface);
  border: 1px solid var(--pill-border);
  border-radius: 999px;
  color: var(--pill-ink);
  display: inline-flex;
  font-size: 0.74rem;
  font-weight: 750;
  line-height: 1;
  padding: 4px 7px;
}

.role-guidance {
  margin-top: 6px;
}

.role-checkbox-field {
  margin-bottom: 6px;
}

.role-checkbox-field-last {
  margin-bottom: 18px;
}

.role-checkbox-label {
  justify-content: flex-start;
  margin-bottom: 0;
}

.role-checkbox-label input[type="checkbox"] {
  flex: 0 0 auto;
  margin: 0;
}

.field-help-compact {
  margin-top: 6px;
}

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

.compact-list {
  margin-bottom: 0;
  margin-top: 6px;
  padding-left: 20px;
}

.camping-leader-list {
  display: grid;
  gap: 10px;
  list-style: none;
  padding-left: 0;
}

.camping-leader-row {
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  justify-content: space-between;
  padding: 12px 14px;
}

.camping-leader-summary {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.camping-leader-identity {
  display: grid;
  gap: 2px;
}

.camping-leader-delete-form {
  margin: 0;
}

.camping-leader-delete-button {
  background: var(--secondary-surface);
  border: 1px solid var(--accent-dark);
  border-radius: 6px;
  box-shadow: none;
  color: var(--accent-dark);
  cursor: pointer;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.1;
  min-height: 32px;
  padding: 5px 10px;
  text-decoration: none;
}

.camping-leader-delete-button:hover,
.camping-leader-delete-button:focus {
  background: var(--accent-soft);
  box-shadow: none;
  color: #5f0c11;
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

.camping-leader-self-note {
  font-size: 0.95rem;
  font-weight: 700;
}

.leader-email-picker {
  position: relative;
}

.trip-request-leadership-grid {
  border: 1px solid var(--line);
  border-radius: 8px;
  margin-top: 16px;
}

.trip-request-details-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
}

.trip-request-detail-item {
  background: var(--secondary-surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  min-width: 0;
  padding: 14px 16px;
}

.trip-request-detail-item-wide {
  grid-column: 1 / -1;
}

.trip-request-detail-item dt {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.trip-request-detail-item dd {
  color: var(--ink);
  font-size: 1rem;
  line-height: 1.5;
  margin: 5px 0 0;
  overflow-wrap: anywhere;
}

.trip-request-detail-item dd a {
  display: block;
  width: fit-content;
}

.trip-request-detail-primary {
  display: block;
  font-weight: 700;
}

.trip-request-leader-details {
  display: grid;
  gap: 6px;
  width: 100%;
}

.record-list .trip-request-leader-name {
  align-items: center;
  color: var(--ink);
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.trip-request-leader-assignment,
.trip-request-leader-contact {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.trip-request-leader-message {
  display: block;
}

.trip-request-approval-details {
  display: grid;
  gap: 6px;
  width: 100%;
}

.trip-request-approval-rounds {
  display: grid;
  gap: 24px;
}

.trip-request-approval-round {
  display: grid;
  gap: 10px;
}

.trip-request-approval-round-heading {
  align-items: center;
  color: var(--heritage-blue);
  display: flex;
  font-size: 1.05rem;
  gap: 12px;
  margin: 0;
}

.trip-request-approval-round-heading::after {
  background: var(--line);
  content: "";
  flex: 1;
  height: 1px;
}

.trip-request-approval-details > :not(.trip-request-approval-header) {
  margin-left: 18px;
}

.record-list .trip-request-approval-header,
.record-list .trip-request-approval-actor {
  align-items: center;
  color: var(--ink);
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.trip-request-approval-email {
  display: block;
}

.trip-request-approval-timestamp {
  font-size: 0.9rem;
  margin-left: auto;
  white-space: nowrap;
}

.trip-request-approval-notes {
  display: grid;
  gap: 2px;
  padding-top: 2px;
}

.record-list .trip-request-approval-notes strong {
  color: var(--ink);
}

.trip-request-leader-grid-header,
.trip-request-leader-form {
  column-gap: 12px;
  display: grid;
  grid-template-columns: minmax(145px, 0.75fr) minmax(240px, 1.35fr) minmax(180px, 1fr) 38px;
}

.trip-request-leader-grid-header {
  background: var(--secondary-surface);
  border-radius: 7px 7px 0 0;
  color: var(--heritage-blue);
  font-size: 0.92rem;
  font-weight: 800;
  padding: 10px 12px;
}

.trip-request-leader-form {
  align-items: start;
  border-bottom: 1px solid var(--line);
  padding: 12px;
}

.trip-request-leader-form:last-child {
  border-bottom: 0;
}

.trip-request-leader-form > .errorlist {
  grid-column: 1 / -1;
}

.trip-request-leader-form .field,
.trip-request-leader-role-cell {
  margin: 0;
  min-width: 0;
}

.trip-request-leader-form input,
.trip-request-leader-form select {
  width: 100%;
}

.trip-request-leader-role-name {
  display: block;
  font-weight: 800;
  line-height: 1.3;
  padding: 12px 0;
}

.trip-request-leader-mobile-label {
  display: none;
}

.trip-request-custom-role-field {
  margin-top: 8px;
}

.trip-request-leader-row-action {
  align-items: center;
  display: flex;
  justify-content: center;
  min-height: 46px;
}

.trip-request-leader-remove-button {
  align-items: center;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--accent-dark);
  cursor: pointer;
  display: inline-flex;
  font-size: 1.55rem;
  height: 36px;
  justify-content: center;
  line-height: 1;
  min-height: 36px;
  padding: 0;
  width: 36px;
}

.trip-request-leader-remove-button:hover,
.trip-request-leader-remove-button:focus {
  background: var(--accent-soft);
  border-color: var(--accent);
  outline: 2px solid var(--focus-ring);
  outline-offset: 1px;
}

.trip-request-add-leader-controls {
  align-items: end;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(190px, 300px) auto;
  margin-top: 16px;
}

.trip-request-add-leader-controls .field {
  margin: 0;
}

.trip-request-add-leader-controls .secondary-button {
  margin: 0;
}

.form-grid.trip-request-single-column-grid {
  grid-template-columns: minmax(0, 1fr);
}

.currency-input {
  position: relative;
}

.currency-input-symbol {
  align-items: center;
  background: var(--secondary-surface);
  border-radius: 5px 0 0 5px;
  border-right: 1px solid var(--line);
  bottom: 1px;
  color: var(--muted);
  display: flex;
  font-weight: 750;
  justify-content: center;
  left: 1px;
  pointer-events: none;
  position: absolute;
  top: 1px;
  width: 40px;
  z-index: 1;
}

.currency-input input {
  padding-left: 50px;
}

.trip-request-form-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 16px;
}

.trip-request-reviewer-context {
  margin: 0 0 4px;
}

.trip-request-decision-actions {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 16px;
}

.trip-request-decision-action {
  align-content: start;
  display: grid;
  gap: 8px;
  justify-items: start;
}

.trip-request-decision-action .help {
  margin: 0;
}

@media (max-width: 760px) {
  .trip-request-decision-actions {
    grid-template-columns: minmax(0, 1fr);
  }

  .trip-request-approval-timestamp {
    flex-basis: 100%;
    margin-left: 0;
  }
}

.trip-request-leader-form.is-deleted {
  opacity: 0.6;
}

.email-access-picker {
  display: grid;
  gap: 10px;
}

.polish-school-combobox {
  position: relative;
  min-width: 0;
}

.polish-school-options {
  position: absolute;
  z-index: 20;
  top: 100%;
  left: 0;
  right: 0;
  max-height: 16rem;
  overflow-y: auto;
  margin: 0;
  padding: 0.25rem;
  list-style: none;
  border: 1px solid var(--line);
  border-radius: 0.5rem;
  background: var(--surface);
  color: var(--ink);
  box-shadow: 0 8px 24px rgb(0 0 0 / 15%);
}

.polish-school-options [role="option"] {
  min-height: 32px;
  padding: 0.4rem 0.6rem;
  cursor: pointer;
  overflow-wrap: anywhere;
}

.polish-school-options [role="option"]:hover,
.polish-school-options .is-active {
  background: var(--soft-surface);
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

.email-access-combobox {
  display: grid;
  gap: 6px;
  position: relative;
}

.email-access-combobox input {
  padding-right: 44px;
  width: 100%;
}

.email-access-menu button {
  display: grid;
  gap: 2px;
}

.email-access-menu button span {
  color: var(--muted);
  font-size: 0.92rem;
}

.email-access-add-button {
  justify-self: start;
}

.email-access-chip {
  min-height: 48px;
}

.leader-email-picker input {
  padding-right: 44px;
}

.leader-email-toggle {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 6px;
  cursor: pointer;
  display: inline-flex;
  height: 34px;
  justify-content: center;
  min-height: 0;
  padding: 0;
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
}

.leader-email-toggle:hover,
.leader-email-toggle:focus {
  background: var(--secondary-surface);
  outline: 2px solid var(--focus-ring);
  outline-offset: 1px;
}

.leader-email-toggle span {
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 7px solid var(--heritage-blue);
  display: block;
  height: 0;
  width: 0;
}

.leader-email-menu {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 12px 22px var(--shadow-color);
  display: grid;
  gap: 2px;
  left: 0;
  margin-top: 4px;
  max-height: 240px;
  overflow-y: auto;
  padding: 6px;
  position: absolute;
  right: 0;
  z-index: 10;
}

.leader-email-menu button {
  background: transparent;
  border: 0;
  border-radius: 6px;
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  min-height: 34px;
  padding: 6px 8px;
  text-align: left;
}

.leader-email-menu button:hover,
.leader-email-menu button:focus {
  background: var(--secondary-surface);
  color: var(--heritage-blue);
  outline: none;
}

.trip-request-leader-email-menu button {
  display: grid;
  gap: 2px;
}

.trip-request-leader-email-menu button strong,
.trip-request-leader-email-menu button span {
  display: block;
  overflow-wrap: anywhere;
}

.trip-request-leader-email-menu button span {
  color: var(--muted);
  font-size: 0.9rem;
}

@media (max-width: 820px) {
  .trip-request-details-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .trip-request-detail-item-wide {
    grid-column: auto;
  }

  .trip-request-leader-grid-header {
    display: none;
  }

  .trip-request-leader-form {
    gap: 12px;
    grid-template-columns: minmax(0, 1fr);
  }

  .trip-request-leader-mobile-label {
    display: block;
    font-weight: 800;
    margin-bottom: 6px;
  }

  .trip-request-leader-role-name {
    padding: 0;
  }

  .trip-request-leader-row-action {
    justify-content: flex-start;
    min-height: 0;
  }

  .trip-request-add-leader-controls {
    align-items: stretch;
    grid-template-columns: minmax(0, 1fr);
  }

  .trip-request-add-leader-controls .secondary-button {
    justify-self: start;
  }
}

.leader-email-no-results {
  margin: 4px 6px;
}

.leader-email-menu.email-access-menu {
  box-shadow: none;
  gap: 6px;
  left: auto;
  margin-top: 0;
  max-height: 320px;
  position: static;
  right: auto;
  z-index: auto;
}

.leader-email-menu.email-access-menu[hidden] {
  display: none;
}

.leader-email-menu.email-access-menu button {
  align-items: start;
  border-bottom: 1px solid var(--line);
  gap: 4px;
  line-height: 1.25;
  min-height: 64px;
  padding: 10px 12px;
}

.leader-email-menu.email-access-menu button:last-of-type {
  border-bottom: 0;
}

.leader-email-menu.email-access-menu button strong,
.leader-email-menu.email-access-menu button span {
  display: block;
  overflow-wrap: anywhere;
}

.leader-email-menu.email-access-menu button span {
  line-height: 1.25;
}

.table-scroll {
  overflow-x: auto;
}

/*
  Table pattern contract:
  - .data-table is the standard browse/list table inside .table-scroll.
  - .submission-table is the neutral shared submission-admin table; legacy
    .camping-submissions-table and .submission-admin-table remain aliases.
  - Review/audit queues use compact row actions and page-specific queue classes
    when they need denser controls than ordinary lists.
  - Report/export pages build on .report-table for wider, column-selectable data.
*/
.data-table {
  border-collapse: collapse;
  min-width: 860px;
  width: 100%;
}

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

.data-table th {
  color: var(--heritage-blue);
  font-size: 0.82rem;
  text-transform: uppercase;
}

.report-table {
  min-width: 980px;
}

.registration-compliance-table {
  min-width: 1080px;
}

.report-table th,
.report-table td {
  overflow-wrap: break-word;
}

.submission-table-form,
.submission-admin-form,
.camping-submissions-form {
  display: grid;
  gap: 18px;
}

.submission-actions,
.submission-admin-actions,
.camping-submissions-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-start;
  margin: 0;
}

.data-table-actions {
  margin-block: 24px 14px;
}

.submission-action-form,
.submission-admin-action-form,
.camping-submissions-action-form {
  margin: 0;
}

.submission-table-wrap,
.submission-admin-table-wrap,
.camping-submissions-table-wrap {
  border: 1px solid var(--line);
  border-radius: 8px;
}

.submission-table,
.submission-admin-table,
.camping-submissions-table {
  border-collapse: separate;
  border-spacing: 0;
  min-width: 760px;
}

.submission-table th,
.submission-table td,
.submission-admin-table th,
.submission-admin-table td,
.camping-submissions-table th,
.camping-submissions-table td {
  border-bottom: 1px solid var(--line);
  padding: 12px 16px;
}

.submission-table thead th,
.submission-admin-table thead th,
.camping-submissions-table thead th {
  background: color-mix(in srgb, var(--soft-surface) 82%, #fff);
  border-bottom: 2px solid var(--heritage-blue);
  color: var(--heritage-blue);
  font-size: 0.84rem;
  letter-spacing: 0;
  line-height: 1.35;
  text-transform: none;
}

.submission-table tbody tr:last-child td,
.submission-admin-table tbody tr:last-child td,
.camping-submissions-table tbody tr:last-child td {
  border-bottom: 0;
}

.submission-table .submission-admin-select-column,
.submission-table .camping-submissions-select-column,
.submission-table .camping-report-select-column,
.submission-admin-table .submission-admin-select-column,
.submission-admin-table .camping-submissions-select-column,
.camping-submissions-table .camping-submissions-select-column,
.camping-submissions-table .camping-report-select-column {
  text-align: center;
  white-space: nowrap;
  width: 56px;
}

.submission-table td.submission-admin-select-column,
.submission-table td.camping-submissions-select-column,
.submission-table td.camping-report-select-column,
.submission-admin-table td.submission-admin-select-column,
.submission-admin-table td.camping-submissions-select-column,
.camping-submissions-table td.camping-submissions-select-column,
.camping-submissions-table td.camping-report-select-column {
  width: 54px;
}

.submission-admin-select-all,
.camping-submissions-select-all,
.camping-report-select-all {
  justify-content: center;
}

.camping-submissions-participant-column {
  width: 26%;
}

.camping-submissions-trip-column {
  width: 32%;
}

.camping-submissions-status-column {
  width: 18%;
}

.camping-submissions-submitted-column {
  width: 24%;
}

.camping-report-actions {
  align-items: stretch;
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  margin: 0 0 14px;
}

.camping-report-actions .secondary-button {
  align-items: center;
  display: inline-flex;
  justify-content: center;
  line-height: 1.25;
  min-height: 32px;
  padding: 5px 10px;
  text-align: center;
  text-decoration: none;
  white-space: normal;
  width: 100%;
}

.table-row-error {
  background: #fffafa;
}

.profile-completeness-card {
  align-items: start;
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) auto;
  margin: 16px 0 20px;
  padding: 14px;
}

.profile-completeness-card p {
  margin: 4px 0 0;
}

/*
  Form summaries can contain long translated field labels. Keep the explanation
  above the list so those labels cannot collapse the summary into a narrow column.
*/
.profile-completeness-card.form-completeness-card {
  grid-template-columns: minmax(0, 1fr);
}

.form-completeness-summary,
.form-completeness-missing-list {
  min-width: 0;
}

.form-completeness-missing-list {
  margin: 0;
}

.form-completeness-missing-list li {
  overflow-wrap: anywhere;
}

.form-completeness-missing-list li + li {
  margin-top: 6px;
}

.profile-admin-title-row {
  align-items: flex-start;
}

.profile-admin-title-row .actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-end;
}

.admin-account-panel {
  background: var(--secondary-surface);
  border: 1px solid var(--paper-edge);
  border-radius: 8px;
  box-shadow: inset 4px 0 0 var(--heritage-blue);
  display: grid;
  gap: 10px;
  margin: 14px 0 18px;
  padding: 14px;
}

.admin-account-panel-header {
  align-items: start;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding-bottom: 10px;
}

.admin-account-panel-header h2 {
  color: var(--ink);
  font-size: 1.25rem;
  margin: 0;
}

.admin-account-panel .compact-account-details {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  gap: 0;
  margin: 0;
  overflow: hidden;
}

.admin-account-panel .compact-account-details > div {
  border-bottom: 0;
  padding: 10px 12px;
}

.admin-account-panel > .profile-completeness-card {
  background: var(--surface);
  margin: 0;
}

.admin-account-panel > .record-list,
.admin-account-panel > .inline-form {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  margin: 0;
  padding: 10px;
}

.admin-account-panel > .inline-form {
  align-items: end;
}

.admin-account-panel .record-list li {
  background: var(--secondary-surface);
}

.account-completeness-card {
  align-items: start;
  grid-template-columns: minmax(0, 1fr);
}

.account-completeness-card .profile-completeness-summary,
.account-completeness-card .profile-completeness-missing-list,
.account-completeness-card .profile-completeness-action {
  min-width: 0;
}

.account-completeness-card .profile-completeness-missing-list {
  grid-column: 1 / -1;
  margin: 0;
  max-width: 100%;
}

.account-completeness-card .profile-completeness-missing-list li {
  overflow-wrap: anywhere;
}

.account-completeness-card .profile-completeness-action {
  grid-column: 1 / -1;
  justify-self: start;
  max-width: 100%;
  text-align: center;
  white-space: normal;
}

.contact-list {
  color: var(--ink);
}

.contact-list li + li {
  margin-top: 3px;
}

.document-status-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.status-pill {
  align-items: center;
  align-self: flex-start;
  background: var(--pill-surface);
  border: 1px solid var(--pill-border);
  border-radius: 999px;
  color: var(--pill-ink);
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 0.82rem;
  font-weight: 700;
  justify-content: center;
  line-height: 1.25;
  min-height: 0;
  padding: 3px 8px;
  width: fit-content;
}

.status-pill-ok {
  background: var(--pill-ok-surface);
  border-color: var(--pill-ok-border);
  color: var(--pill-ok-ink);
}

.status-pill-missing {
  background: var(--pill-missing-surface);
  border-color: var(--pill-missing-border);
  color: var(--accent-dark);
}

.status-pill-review {
  background: var(--pill-review-surface);
  border-color: var(--pill-review-border);
  color: var(--pill-review-ink);
}

.status-pill-expired {
  background: var(--pill-missing-surface);
  border-color: var(--pill-missing-border);
  color: var(--accent-dark);
}

.status-pill-inactive {
  background: var(--pill-inactive-surface);
  border-color: var(--pill-inactive-border);
  color: var(--pill-inactive-ink);
}

.document-panel {
  margin-top: 24px;
}

.document-panel h2 {
  margin-top: 0;
}

.document-checklist {
  display: grid;
  gap: 10px;
}

.document-checklist-row {
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
  padding: 14px;
}

.document-checklist-row-attention {
  background: linear-gradient(90deg, #fffafa 0%, #fff 70%);
  border-color: #efc5ca;
}

html[data-theme="dark"] .document-checklist-row-attention {
  background: linear-gradient(90deg, var(--secondary-surface) 0%, var(--soft-surface) 100%);
  border-color: var(--pill-missing-border);
}

.document-checklist-row:target {
  border-color: var(--focus);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--focus) 25%, transparent);
}

html[data-theme="dark"] .document-checklist-row:target {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--focus) 35%, transparent);
}

.document-checklist-title {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.document-checklist-main strong {
  display: inline-block;
}

.document-quarantine-notice {
  color: var(--accent-dark);
  font-size: 0.92rem;
  font-weight: 700;
  margin: 4px 0 0;
}

.document-status-explanation {
  color: var(--muted);
  font-size: 0.9rem;
  margin: 2px 0 0;
}

.document-checklist-actions {
  justify-content: flex-start;
}

.document-row-note {
  margin: 4px 0 0;
}

.other-documents {
  border-top: 1px solid var(--line);
  margin-top: 16px;
  padding-top: 14px;
}

.other-documents summary {
  color: var(--accent-dark);
  cursor: pointer;
  font-weight: 800;
}

.other-documents .document-list {
  margin-top: 12px;
}

.document-list li {
  align-items: start;
}

.document-list strong {
  display: block;
}

.document-meta {
  color: var(--muted);
  display: grid;
  font-size: 0.92rem;
  gap: 6px 18px;
  grid-template-columns: repeat(2, minmax(0, max-content));
  margin-top: 2px;
}

.document-meta div {
  align-items: center;
  display: grid;
  gap: 2px;
  min-width: 0;
}

.document-meta dt {
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 800;
}

.document-meta dd {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.document-meta.compact-document-meta {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  margin-top: 8px;
}

.document-upload-form {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin-top: 16px;
  padding-top: 16px;
}

.document-upload-selection {
  background: var(--pill-surface);
  border: 1px solid var(--pill-border);
  border-radius: 8px;
  color: var(--pill-ink);
  font-weight: 700;
  grid-column: 1 / -1;
  margin: 0;
  padding: 10px 12px;
}

.document-file-field,
.document-upload-actions {
  grid-column: 1 / -1;
}

.field-label-row {
  align-items: center;
  display: flex;
  gap: 8px;
}

.info-tooltip {
  display: inline-flex;
  position: relative;
}

.info-tooltip summary {
  align-items: center;
  background: var(--pill-surface);
  border: 1px solid var(--pill-border);
  border-radius: 999px;
  color: var(--pill-ink);
  cursor: pointer;
  display: inline-flex;
  font-size: 0.78rem;
  font-weight: 800;
  height: 20px;
  justify-content: center;
  line-height: 1;
  list-style: none;
  width: 20px;
}

.info-tooltip summary::-webkit-details-marker {
  display: none;
}

.info-tooltip-panel {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  color: var(--muted);
  left: 0;
  margin-top: 8px;
  min-width: min(420px, 80vw);
  padding: 12px;
  position: absolute;
  top: 100%;
  z-index: 30;
}

html[data-theme="dark"] .field .info-tooltip .info-tooltip-panel {
  background: var(--field-surface);
  border-color: var(--pill-border);
  box-shadow: 0 14px 36px rgb(0 0 0 / 55%);
  color: var(--ink);
}

.info-tooltip-panel strong {
  color: var(--ink);
  display: block;
  font-size: 0.9rem;
  margin-bottom: 4px;
}

.info-tooltip-panel p {
  margin: 0;
}

html[data-theme="dark"] .field .info-tooltip .info-tooltip-panel p {
  color: var(--muted);
}

.access-level-guidance {
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  margin-top: 8px;
  padding: 12px;
}

.access-level-guidance-item {
  display: grid;
  gap: 3px;
}

.access-level-guidance-item strong {
  color: var(--ink);
  font-size: 0.92rem;
}

.access-level-guidance-item p,
.access-level-guidance-note {
  margin: 0;
}

html[data-theme="dark"] .access-level-guidance {
  background: var(--field-surface);
  border-color: var(--pill-border);
  color: var(--ink);
}

html[data-theme="dark"] .access-level-guidance-item p,
html[data-theme="dark"] .access-level-guidance-note {
  color: var(--muted);
}

.document-upload-form > .field {
  grid-column: span 3;
}

.document-insurance-fields {
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  grid-column: 1 / -1;
  margin: 4px 0 0;
  padding: 16px;
}

.document-insurance-fields legend {
  margin-bottom: 10px;
  padding: 0 4px;
}

.document-insurance-fields .form-grid {
  gap: 16px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.document-insurance-fields .field {
  grid-column: span 2;
}

.document-insurance-fields .document-insurance-format {
  grid-column: 1 / -1;
}

.document-insurance-fields .document-file-field {
  grid-column: span 3;
}

.document-insurance-fields .document-file-field input[type="file"],
.document-upload-form > .document-file-field input[type="file"] {
  width: 100%;
}

.selected-file-list {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--muted);
  font-size: 0.92rem;
  margin: 8px 0 0;
  padding: 8px 12px 8px 28px;
}

.selected-file-list li + li {
  margin-top: 4px;
}

.notification-attachment-list {
  margin-top: 14px;
}

.notification-attachment-list h3 {
  font-size: 1rem;
  margin: 12px 0 4px;
}

.notification-attachment-list .selected-file-list {
  list-style: none;
  padding-left: 12px;
  width: 100%;
}

.notification-attachment-item {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: space-between;
  width: 100%;
}

.notification-attachment-name {
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
}

.attachment-delete-button {
  flex: 0 0 auto;
}

.attachment-delete-confirmation {
  align-items: center;
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-radius: 6px;
  display: flex;
  flex: 1 1 100%;
  flex-wrap: wrap;
  gap: 8px 10px;
  justify-content: flex-end;
  margin-top: 8px;
  padding: 10px;
}

.attachment-delete-confirmation p {
  flex: 1 1 220px;
  margin: 0;
}

.document-upload-actions {
  align-items: center;
  display: flex;
  justify-content: flex-start;
}

.wide-form {
  max-width: 860px;
}

.data-panel {
  margin-left: 50%;
  max-width: none;
  transform: translateX(-50%);
  width: min(1100px, calc(100vw - 24px));
}

.page:has(> .wide-data-panel) {
  max-width: none;
  width: calc(100vw - 24px);
}

.wide-data-panel {
  width: calc(100vw - 24px);
}

@media (min-width: 1400px) and (min-aspect-ratio: 16/10) {
  .page:has(> .data-panel) {
    max-width: min(1600px, calc(100vw - 64px));
    width: min(100%, calc(100vw - 64px));
  }

  .data-panel {
    width: min(1600px, calc(100vw - 64px));
  }

  .page:has(> .wide-data-panel) {
    max-width: none;
    width: calc(100vw - 64px);
  }

  .wide-data-panel {
    width: calc(100vw - 64px);
  }
}

@media (max-aspect-ratio: 4/3) {
  .page:has(> .data-panel:not(.wide-data-panel)) {
    max-width: 1100px;
  }

  .data-panel:not(.wide-data-panel) {
    width: min(1100px, calc(100vw - 24px));
  }
}

.account-profile-panel {
  max-width: none;
}

fieldset {
  border: 0;
  margin: 0 0 16px;
  padding: 0;
}

fieldset + fieldset {
  border-top: 1px solid var(--line);
  padding-top: 16px;
}

legend {
  font-size: 1.2rem;
  font-weight: 750;
  margin-bottom: 10px;
}

.form-grid,
.detail-grid {
  display: grid;
  gap: 12px 16px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.span-2 {
  grid-column: 1 / -1;
}

.form-section-divider {
  border-top: 1px solid var(--line);
  margin-top: 6px;
  padding-top: 12px;
}

.form-section-divider h3 {
  font-size: 1rem;
  margin: 0 0 4px;
}

.form-section-divider p {
  color: var(--muted);
  margin: 0;
}

.detail-grid {
  margin: 0;
}

.detail-list {
  display: grid;
  gap: 0;
  margin: 0;
}

.detail-grid div {
  border-bottom: 1px solid var(--line);
  padding: 0 0 12px;
}

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

.detail-grid.profile-overview-grid > div {
  padding: 12px 12px 12px 18px;
}

.detail-list dd {
  margin: 4px 0 12px;
  overflow-wrap: anywhere;
}

.detail-list dd:last-child {
  margin-bottom: 0;
}

.detail-list dd + dt {
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.detail-grid .detail-action-row {
  grid-column: 1 / -1;
  padding-bottom: 0;
}

.detail-grid dt {
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 700;
}

.detail-grid dd {
  margin: 4px 0 0;
}

.binder-workspace {
  display: grid;
  gap: 16px;
  width: min(1240px, calc(100vw - 32px));
}

.binder-workspace > .title-row {
  margin-bottom: 0;
}

.binder-copy-label,
.binder-section-eyebrow {
  color: var(--accent-dark);
  font-size: 0.82rem;
  font-weight: 800;
  margin: 6px 0 0;
  text-transform: uppercase;
}

.binder-summary-grid {
  background: var(--secondary-surface);
  border-bottom: 1px solid var(--line);
  border-top: 1px solid var(--line);
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
}

.binder-summary-grid > div {
  border-right: 1px solid var(--line);
  min-width: 0;
  padding: 14px 16px;
}

.binder-summary-grid > div:last-child {
  border-right: 0;
}

.binder-summary-grid dt,
.binder-packet-metrics dt {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 750;
}

.binder-summary-grid dd,
.binder-packet-metrics dd {
  font-weight: 750;
  margin: 5px 0 0;
  overflow-wrap: anywhere;
}

.binder-technical-details {
  border-bottom: 1px solid var(--line);
  margin-top: -16px;
  padding: 10px 2px;
}

.binder-technical-details summary {
  color: var(--muted);
  cursor: pointer;
  font-size: 0.88rem;
  font-weight: 750;
}

.binder-technical-details .detail-grid {
  margin-top: 12px;
}

.binder-section {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 14px;
  padding-top: 20px;
}

.binder-section > h2,
.binder-section-heading h2,
.binder-section > p,
.binder-section-heading p,
.binder-download-actions p {
  margin: 0;
}

.binder-section-heading,
.binder-download-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
  justify-content: space-between;
}

.binder-download-section {
  background: color-mix(in srgb, var(--pill-ok-surface) 55%, var(--surface));
  border-bottom: 1px solid var(--pill-ok-border);
  border-top: 3px solid var(--pill-ok-border);
  margin-left: -20px;
  margin-right: -20px;
  padding: 20px;
}

.binder-packet-metrics {
  display: grid;
  gap: 12px 28px;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  margin: 0;
  max-width: 680px;
}

.binder-download-actions {
  justify-content: flex-start;
}

.binder-download-actions p {
  color: var(--muted);
  flex: 1 1 360px;
  font-size: 0.92rem;
}

.binder-deferred-section {
  border-top-color: var(--pill-review-border);
}

.binder-deferred-table .compact-list {
  margin: 0;
  padding-left: 20px;
}

.binder-deferred-table,
.binder-history-section table {
  width: 100%;
}

.binder-data-table {
  border: 1px solid var(--line);
  border-collapse: separate;
  border-radius: 6px;
  border-spacing: 0;
  overflow: hidden;
  table-layout: fixed;
}

.binder-data-table th,
.binder-data-table td {
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
  padding: 11px 14px;
  text-align: left;
  vertical-align: top;
}

.binder-data-table th {
  background: var(--secondary-surface);
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 800;
}

.binder-data-table tr:last-child td {
  border-bottom: 0;
}

.binder-data-table th:last-child,
.binder-data-table td:last-child {
  border-right: 0;
}

.annual-binder-management-table-wrap {
  border: 1px solid var(--line);
  border-radius: 6px;
  max-width: 100%;
  overflow-x: auto;
  width: 100%;
}

.page:has(> .binder-management-list-panel) {
  max-width: 1640px;
  width: calc(100vw - 32px);
}

.binder-management-list-panel {
  margin-left: 0;
  transform: none;
  width: 100%;
}

.annual-binder-management-table {
  border-collapse: separate;
  border-spacing: 0;
  min-width: 1020px;
  table-layout: fixed;
  width: 100%;
}

.annual-binder-management-table th,
.annual-binder-management-table td {
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
  overflow-wrap: anywhere;
  padding: 12px 14px;
  text-align: left;
  vertical-align: top;
}

.annual-binder-management-table th {
  background: var(--secondary-surface);
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 800;
}

.annual-binder-management-table tr:last-child td {
  border-bottom: 0;
}

.annual-binder-management-table th:last-child,
.annual-binder-management-table td:last-child {
  border-right: 0;
}

.annual-binder-management-table .record-actions {
  justify-content: flex-start;
}

.annual-binder-custodian-column {
  width: 20%;
}

.annual-binder-scope-column {
  width: 20%;
}

.annual-binder-status-column {
  width: 10%;
}

.annual-binder-allocation-column {
  width: 15%;
}

.annual-binder-deadline-column {
  width: 12%;
}

.annual-binder-evidence-column {
  width: 15%;
}

.annual-binder-actions-column {
  width: 8%;
}

.binder-packet-list-table-wrap {
  border: 1px solid var(--line);
  border-radius: 6px;
  max-width: 100%;
  overflow-x: auto;
  width: 100%;
}

.binder-packet-list-table {
  border-collapse: separate;
  border-spacing: 0;
  min-width: 1050px;
  table-layout: fixed;
  width: 100%;
}

.binder-packet-list-table th,
.binder-packet-list-table td {
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
  overflow-wrap: anywhere;
  padding: 12px 14px;
  text-align: left;
  vertical-align: top;
}

.binder-packet-list-table th {
  background: var(--secondary-surface);
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 800;
}

.binder-packet-list-table tr:last-child td {
  border-bottom: 0;
}

.binder-packet-list-table th:last-child,
.binder-packet-list-table td:last-child {
  border-right: 0;
}

.binder-packet-list-table .record-actions {
  justify-content: flex-start;
}

.binder-packet-identity-column {
  width: 24%;
}

.binder-packet-custody-column {
  width: 26%;
}

.binder-packet-status-column {
  width: 11%;
}

.binder-packet-delivery-column {
  width: 20%;
}

.binder-packet-evidence-column {
  width: 11%;
}

.binder-packet-actions-column {
  width: 8%;
}

.binder-attestation-list-table-wrap {
  border: 1px solid var(--line);
  border-radius: 6px;
  max-width: 100%;
  overflow-x: auto;
  width: 100%;
}

.binder-attestation-list-table {
  border-collapse: separate;
  border-spacing: 0;
  min-width: 1080px;
  table-layout: fixed;
  width: 100%;
}

.binder-attestation-list-table th,
.binder-attestation-list-table td {
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
  overflow-wrap: anywhere;
  padding: 12px 14px;
  text-align: left;
  vertical-align: top;
}

.binder-attestation-list-table th {
  background: var(--secondary-surface);
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 800;
}

.binder-attestation-list-table tr:last-child td {
  border-bottom: 0;
}

.binder-attestation-list-table th:last-child,
.binder-attestation-list-table td:last-child {
  border-right: 0;
}

.binder-attestation-list-table .record-actions {
  justify-content: flex-start;
}

.binder-attestation-type-column {
  width: 21%;
}

.binder-attestation-custody-column {
  width: 31%;
}

.binder-attestation-signer-column {
  width: 19%;
}

.binder-attestation-recorded-column {
  width: 17%;
}

.binder-attestation-actions-column {
  width: 12%;
}

.binder-management-detail {
  display: grid;
  gap: 24px;
}

.binder-management-detail > .title-row {
  margin-bottom: 0;
}

.binder-management-summary {
  background: var(--secondary-surface);
  border: 1px solid var(--line);
  border-radius: 6px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  overflow: hidden;
}

.binder-management-summary > div {
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
  min-width: 0;
  padding: 14px 16px;
}

.binder-management-summary > div:nth-child(3n) {
  border-right: 0;
}

.binder-management-summary > div:nth-last-child(-n + 3) {
  border-bottom: 0;
}

.binder-management-summary dt {
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 800;
  text-transform: uppercase;
}

.binder-management-summary dd {
  font-weight: 700;
  margin: 5px 0 0;
  overflow-wrap: anywhere;
}

.binder-management-evidence-section {
  display: grid;
  gap: 12px;
}

.binder-management-section-heading {
  align-items: baseline;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.binder-management-section-heading h2 {
  margin: 0;
}

.binder-management-evidence-table-wrap {
  border: 1px solid var(--line);
  border-radius: 6px;
  max-width: 100%;
  overflow-x: auto;
  width: 100%;
}

.binder-management-evidence-table {
  border-collapse: separate;
  border-spacing: 0;
  min-width: 760px;
  table-layout: fixed;
  width: 100%;
}

.binder-management-evidence-table th,
.binder-management-evidence-table td {
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
  overflow-wrap: anywhere;
  padding: 12px 14px;
  text-align: left;
  vertical-align: top;
}

.binder-management-evidence-table th {
  background: var(--secondary-surface);
  font-size: 0.88rem;
  font-weight: 800;
}

.binder-management-evidence-table tr:last-child td {
  border-bottom: 0;
}

.binder-management-evidence-table th:last-child,
.binder-management-evidence-table td:last-child {
  border-right: 0;
}

.binder-management-evidence-table .record-actions {
  justify-content: flex-start;
}

.binder-management-packet-version-column {
  width: 9%;
}

.binder-management-packet-type-column {
  width: 25%;
}

.binder-management-packet-status-column {
  width: 17%;
}

.binder-management-packet-generated-column {
  width: 22%;
}

.binder-management-packet-attempts-column {
  width: 15%;
}

.binder-management-packet-actions-column {
  width: 12%;
}

.binder-packet-detail {
  display: grid;
  gap: 24px;
}

.binder-packet-detail > .title-row {
  margin-bottom: 0;
}

.binder-evidence-notice {
  align-items: baseline;
  background: var(--secondary-surface);
  border-bottom: 1px solid var(--line);
  border-top: 1px solid var(--line);
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin-left: -20px;
  margin-right: -20px;
  padding: 12px 20px;
}

.binder-evidence-notice strong {
  color: var(--accent-dark);
  white-space: nowrap;
}

.binder-evidence-notice p {
  color: var(--muted);
  margin: 0;
}

.binder-packet-summary {
  background: var(--secondary-surface);
  border: 1px solid var(--line);
  border-radius: 6px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
  overflow: hidden;
}

.binder-packet-summary > div {
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
  min-width: 0;
  padding: 13px 14px;
}

.binder-packet-summary > div:nth-child(4n) {
  border-right: 0;
}

.binder-packet-summary > div:nth-last-child(-n + 4) {
  border-bottom: 0;
}

.binder-packet-summary dt {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.binder-packet-summary dd {
  font-weight: 700;
  margin: 5px 0 0;
  overflow-wrap: anywhere;
}

.binder-packet-manifest-table {
  min-width: 1050px;
}

.binder-packet-manifest-scout-column {
  width: 18%;
}

.binder-packet-manifest-section-column {
  width: 12%;
}

.binder-packet-manifest-component-column {
  width: 18%;
}

.binder-packet-manifest-action-column {
  width: 12%;
}

.binder-packet-manifest-source-column {
  width: 40%;
}

.binder-packet-deferred-table {
  min-width: 720px;
}

.binder-packet-deferred-scout-column {
  width: 30%;
}

.binder-packet-deferred-table .compact-list {
  margin: 0;
  padding-left: 20px;
}

@media (max-width: 760px) {
  .binder-packet-list-panel {
    width: min(1100px, calc(100vw - 28px));
  }

  .binder-management-detail {
    width: min(1100px, calc(100vw - 28px));
  }

  .binder-packet-detail {
    width: min(1100px, calc(100vw - 28px));
  }

  .binder-evidence-notice {
    margin-left: 0;
    margin-right: 0;
  }

  .binder-packet-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .binder-packet-summary > div,
  .binder-packet-summary > div:nth-child(4n) {
    border-bottom: 1px solid var(--line);
    border-right: 1px solid var(--line);
  }

  .binder-packet-summary > div:nth-child(2n) {
    border-right: 0;
  }

  .binder-packet-summary > div:nth-last-child(-n + 2) {
    border-bottom: 0;
  }

  .binder-management-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .binder-management-summary > div,
  .binder-management-summary > div:nth-child(3n) {
    border-bottom: 1px solid var(--line);
    border-right: 1px solid var(--line);
  }

  .binder-management-summary > div:nth-child(2n) {
    border-right: 0;
  }

  .binder-management-summary > div:last-child {
    border-bottom: 0;
    border-right: 0;
    grid-column: 1 / -1;
  }
}

@media (max-width: 520px) {
  .binder-evidence-notice {
    align-items: flex-start;
    flex-direction: column;
    margin-left: 0;
    margin-right: 0;
    padding: 12px 16px;
  }

  .binder-packet-summary {
    grid-template-columns: 1fr;
  }

  .binder-packet-summary > div,
  .binder-packet-summary > div:nth-child(2n),
  .binder-packet-summary > div:nth-child(4n) {
    border-bottom: 1px solid var(--line);
    border-right: 0;
  }

  .binder-packet-summary > div:last-child {
    border-bottom: 0;
  }

  .binder-management-summary {
    grid-template-columns: 1fr;
  }

  .binder-management-summary > div,
  .binder-management-summary > div:nth-child(2n),
  .binder-management-summary > div:nth-child(3n) {
    border-bottom: 1px solid var(--line);
    border-right: 0;
  }

  .binder-management-summary > div:last-child {
    border-bottom: 0;
    grid-column: auto;
  }
}

.binder-deferred-scout-column {
  width: 30%;
}

.binder-history-version-column {
  width: 10%;
}

.binder-history-type-column {
  width: 24%;
}

.binder-history-status-column {
  width: 16%;
}

.binder-history-generated-column {
  width: 32%;
}

.binder-history-attempts-column {
  width: 18%;
}

.binder-action-form {
  display: grid;
  gap: 14px;
  max-width: 780px;
}

.binder-statement {
  align-items: flex-start;
  background: var(--secondary-surface);
  border: 1px solid var(--line);
  border-radius: 6px;
  display: grid;
  gap: 10px;
  grid-template-columns: auto minmax(0, 1fr);
  line-height: 1.5;
  margin: 0;
  padding: 14px;
}

.binder-statement input {
  margin-top: 4px;
}

.binder-name-field {
  max-width: 420px;
}

.binder-action-form button {
  justify-self: start;
}

.binder-history-section {
  padding-bottom: 2px;
}

@media (max-width: 760px) {
  .binder-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .binder-summary-grid > div:nth-child(2) {
    border-right: 0;
  }

  .binder-summary-grid > div:nth-child(-n + 2) {
    border-bottom: 1px solid var(--line);
  }
}

@media (max-width: 520px) {
  .binder-summary-grid,
  .binder-packet-metrics {
    grid-template-columns: 1fr;
  }

  .binder-summary-grid > div,
  .binder-summary-grid > div:nth-child(2) {
    border-bottom: 1px solid var(--line);
    border-right: 0;
  }

  .binder-summary-grid > div:last-child {
    border-bottom: 0;
  }

  .binder-download-section {
    margin-left: -16px;
    margin-right: -16px;
    padding: 18px 16px;
  }

  .binder-workspace {
    width: min(100%, calc(100vw - 24px));
  }

  .binder-download-actions,
  .binder-section-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .binder-download-actions .button-link,
  .binder-action-form button {
    justify-content: center;
    width: 100%;
  }

  .binder-deferred-table {
    min-width: 560px;
  }

  .binder-history-table {
    min-width: 760px;
  }
}

.parent-contact-list {
  display: grid;
  gap: 20px;
}

.parent-contact-item {
  border-top: 1px solid var(--line);
  padding-top: 18px;
}

.parent-contact-item:first-child {
  border-top: 0;
  padding-top: 0;
}

.parent-contact-heading {
  display: grid;
  gap: 6px;
  margin-bottom: 10px;
}

.parent-contact-heading h3 {
  color: var(--accent-dark);
  font-size: 1rem;
  margin: 0;
}

.parent-contact-relationship {
  align-items: center;
  color: var(--ink);
  display: flex;
  font-size: 1.2rem;
  font-weight: 800;
  gap: 12px;
  line-height: 1.25;
}

.parent-contact-relationship::after {
  background: var(--line);
  content: "";
  flex: 1 1 auto;
  height: 1px;
}

.inline-form {
  align-items: end;
  display: grid;
  gap: 10px 12px;
  grid-template-columns: minmax(220px, 1fr) auto;
}

.compact-field {
  margin-bottom: 0;
}

.subtle {
  color: var(--muted);
}

.troop-current-row {
  align-items: start;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  justify-content: space-between;
}

.change-troop summary {
  color: var(--accent-dark);
  cursor: pointer;
  font-weight: 700;
  line-height: 1.5;
  list-style-position: inside;
}

.change-troop[open] {
  border-top: 1px solid var(--line);
  flex-basis: 100%;
  margin-top: 4px;
  padding-top: 12px;
}

.compact-inline-form {
  align-items: end;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
  margin-top: 10px;
}

.compact-inline-form button {
  justify-self: start;
}

.support-details,
.mfa-method-section {
  border: 1px solid var(--line);
  border-radius: 8px;
  margin-top: 18px;
  padding: 12px 14px;
}

.mfa-method-section h2 {
  color: var(--accent-dark);
  font-size: 1rem;
  margin: 0 0 14px;
}

.mfa-method-section form {
  margin-top: 14px;
}

.mfa-method-section form:first-of-type {
  margin-top: 0;
}

.mfa-secondary-method {
  margin-top: 18px;
}

.support-details summary {
  color: var(--accent-dark);
  cursor: pointer;
  font-weight: 700;
}

.support-details form {
  margin-top: 14px;
}

.guardian-section h2 {
  margin-bottom: 14px;
}

.guardian-list {
  border: 1px solid var(--line);
  border-radius: 6px;
  list-style: none;
  margin: 0 0 14px;
  padding: 0;
}

.guardian-list li {
  align-items: center;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(160px, 1fr) auto;
  min-height: 52px;
  padding: 8px 10px;
}

.guardian-list li + li {
  border-top: 1px solid var(--line);
}

.guardian-name {
  color: var(--ink);
}

.guardian-row-form,
.guardian-add-form {
  align-items: end;
  display: grid;
  gap: 10px;
}

.guardian-row-form {
  grid-template-columns: 140px auto;
}

.guardian-add-form {
  grid-template-columns: minmax(220px, 1fr) minmax(160px, 220px) auto;
}

.guardian-row-form select,
.guardian-row-form button,
.guardian-add-form input,
.guardian-add-form select,
.guardian-add-form button {
  min-height: 36px;
  padding-bottom: 6px;
  padding-top: 6px;
}

.search-form {
  align-items: start;
}

.binder-filter-form {
  align-items: end;
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-radius: 6px;
  gap: 12px;
  grid-template-columns:
    minmax(240px, 2fr)
    minmax(150px, 0.8fr)
    minmax(220px, 1.5fr)
    minmax(160px, 0.8fr)
    minmax(180px, 1fr)
    minmax(140px, 0.7fr);
  margin-bottom: 18px;
  padding: 12px;
}

.binder-filter-field {
  min-width: 0;
}

.binder-filter-field input,
.binder-filter-field select {
  width: 100%;
}

.binder-filter-actions {
  align-items: stretch;
  display: grid;
  gap: 6px;
}

.binder-filter-actions button,
.binder-filter-actions .secondary-link {
  justify-content: center;
  width: 100%;
  white-space: nowrap;
}

@media (max-width: 1300px) {
  .binder-filter-form {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }

  .binder-filter-field-q,
  .binder-filter-field-troop {
    grid-column: span 5;
  }

  .binder-filter-field-cycle {
    grid-column: span 2;
  }

  .binder-filter-field-status,
  .binder-filter-field-event_type,
  .binder-filter-field-allocation,
  .binder-filter-field-packet_type,
  .binder-filter-field-attestation_type,
  .binder-filter-field-method {
    grid-column: span 3;
  }

  .binder-filter-actions {
    grid-column: span 6;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .page:has(> .binder-management-list-panel) {
    width: calc(100vw - 16px);
  }

  .binder-filter-field,
  .binder-filter-actions {
    grid-column: 1 / -1;
  }

  .binder-filter-actions {
    grid-template-columns: 1fr;
  }
}

.backup-filter-form {
  align-items: end;
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 10px 12px;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  margin: 0 0 16px;
  padding: 12px;
}

.backup-dashboard-panel {
  width: 100%;
}

.backup-run-row {
  align-items: flex-start;
}

.backup-run-details {
  flex: 1 1 480px;
  min-width: 0;
}

.backup-run-error {
  display: block;
  overflow-wrap: anywhere;
  white-space: normal;
}

.backup-run-components {
  flex: 0 1 auto;
  max-width: 100%;
}

.backup-filter-form .field {
  min-width: 0;
}

.backup-filter-form label {
  font-size: 0.86rem;
  margin-bottom: 4px;
}

.backup-filter-form input,
.backup-filter-form select {
  min-height: 36px;
  padding-bottom: 6px;
  padding-top: 6px;
}

.backup-filter-field-q {
  grid-column: span 4;
}

.backup-filter-field-status,
.backup-filter-field-component,
.backup-filter-field-sort,
.backup-filter-field-date_from,
.backup-filter-field-date_to {
  grid-column: span 2;
}

.backup-filter-actions {
  align-items: center;
  align-self: end;
  display: flex;
  gap: 10px;
  grid-column: span 8;
  justify-content: flex-end;
}

.backup-filter-actions button {
  min-width: 110px;
}

@media (max-width: 1000px) {
  .backup-run-row {
    align-items: stretch;
    flex-direction: column;
  }

  .backup-run-details {
    flex-basis: auto;
    width: 100%;
  }

  .backup-run-components {
    justify-content: flex-start;
    width: 100%;
  }

  .backup-filter-field-q {
    grid-column: span 6;
  }

  .backup-filter-field-status,
  .backup-filter-field-component,
  .backup-filter-field-sort,
  .backup-filter-field-date_from,
  .backup-filter-field-date_to {
    grid-column: span 3;
  }

  .backup-filter-actions {
    grid-column: span 6;
  }
}

.filter-form {
  align-items: start;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 10px 12px;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  margin: 0 0 16px;
  padding: 12px;
}

.profile-filter-form {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.report-column-picker {
  background: var(--soft-surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  grid-column: 1 / -1;
}

.report-column-picker summary {
  color: var(--accent-dark);
  cursor: pointer;
  font-weight: 800;
  padding: 12px 14px;
}

.report-column-picker[open] summary {
  border-bottom: 1px solid var(--line);
}

.report-column-picker .checkbox-grid {
  padding: 14px;
}

.filter-actions {
  align-items: center;
  align-self: end;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.pagination {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  justify-content: flex-end;
  margin-top: 12px;
}

.pagination .notice {
  color: var(--muted);
  flex: 1 1 130px;
  font-weight: 650;
  margin: 0;
}

.pagination-size-form label {
  align-items: center;
  display: flex;
  gap: 6px;
  margin: 0;
}

.pagination-size-form span {
  font-size: 0.88rem;
  font-weight: 700;
  white-space: nowrap;
}

.pagination-size-form select {
  font-size: 0.92rem;
  min-height: 30px;
  min-width: 58px;
  padding: 3px 24px 3px 8px;
  width: auto;
}

.pagination-controls {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.pagination-page,
.pagination-step,
.pagination-ellipsis {
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 4px;
  display: inline-flex;
  font-size: 0.92rem;
  font-weight: 750;
  justify-content: center;
  line-height: 1;
  min-height: 34px;
}

.pagination-page {
  background: var(--surface);
  color: var(--ink);
  min-width: 34px;
  padding: 0 8px;
  text-decoration: none;
}

.pagination-page:hover,
.pagination-page:focus {
  border-color: var(--heritage-blue);
  color: var(--heritage-blue);
}

.pagination-page-current {
  background: var(--heritage-blue);
  border-color: var(--heritage-blue);
  color: var(--surface);
}

.pagination-step {
  background: var(--surface);
  color: var(--ink);
  min-width: 72px;
  padding: 0 10px;
  text-decoration: none;
}

.pagination-step:hover,
.pagination-step:focus {
  border-color: var(--heritage-blue);
  color: var(--heritage-blue);
}

.pagination-ellipsis {
  background: var(--surface);
  color: var(--muted);
  min-width: 34px;
  padding: 0 8px;
}

.pagination-disabled {
  background: var(--soft-surface);
  border-color: color-mix(in srgb, var(--line) 70%, transparent);
  color: var(--muted);
  cursor: default;
}

.is-hidden {
  display: none;
}

@media (max-width: 640px) {
  .document-processing-section-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .document-processing-heading-actions {
    align-items: stretch;
    flex-direction: column;
    width: 100%;
  }

  .document-processing-refresh-control select {
    width: 100%;
  }

  .document-processing-section-heading form,
  .document-processing-section-heading button {
    width: 100%;
  }

  .document-processing-memory-grid,
  .document-processing-status-grid {
    grid-template-columns: 1fr;
  }

  .document-processing-status-card-wide {
    grid-column: auto;
  }

  .leader-dashboard-primary-actions {
    flex-direction: column;
    width: 100%;
  }

  .actions,
  .title-row {
    align-items: flex-start;
    flex-direction: column;
  }

  .actions,
  .filter-actions,
  .language-switcher,
  .theme-switcher,
  .time-display-switcher {
    gap: 8px;
  }

  .panel,
  .form-panel {
    padding: 16px;
  }

  .profile-detail-panel {
    gap: 14px;
  }

  .profile-heading {
    align-items: flex-start;
  }

  .dashboard-jump-links {
    align-self: stretch;
    flex: 0 1 auto;
    justify-content: space-evenly;
    width: auto;
  }

  .organization-structure-actions {
    align-items: flex-start;
    justify-items: start;
  }

  .organization-structure-action-row {
    justify-content: flex-start;
  }

  .profile-photo {
    height: 76px;
    width: 76px;
  }

  .profile-section-nav {
    gap: 8px;
  }

  .profile-section-nav a {
    background: var(--soft-surface);
    border: 1px solid var(--line);
    border-radius: 999px;
    min-height: 34px;
    padding: 5px 10px;
    text-decoration: none;
  }

  .dashboard-alert,
  .dashboard-onboarding,
  .dashboard-next-steps {
    padding: 14px;
  }

  .admin-tile,
  .dashboard-card {
    min-height: 0;
    padding: 14px;
  }

  .camping-trip-admin-card {
    align-items: stretch;
    grid-template-columns: 1fr;
  }

  .camping-trip-admin-actions {
    justify-content: flex-start;
  }

  .agreement-edit-card-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .agreement-edit-card-controls {
    justify-content: flex-start;
  }

  .language-switcher,
  .theme-switcher,
  .time-display-switcher,
  .segmented-control {
    width: auto;
  }

  .brand-text small {
    font-size: 0.72rem;
  }

  .next-step-item {
    grid-template-columns: 1fr;
  }

  .dashboard-onboarding {
    grid-template-columns: 1fr;
  }

  .public-home-title {
    gap: 12px;
  }

  .public-home-title-logo {
    height: 54px;
    width: 54px;
  }

  .dashboard-welcome-intro {
    gap: 12px;
    grid-template-columns: 82px minmax(0, 1fr);
  }

  .dashboard-welcome-logo {
    height: 82px;
    width: 82px;
  }

  .dashboard-alert-info {
    grid-template-columns: 1fr;
  }

  .annual-signup-summary-content,
  .annual-signup-participant {
    align-items: flex-start;
    grid-template-columns: 1fr;
  }

  .annual-signup-participants {
    margin-left: 12px;
    margin-right: 10px;
    padding: 0 12px;
  }

  .annual-signup-completed-list {
    padding: 10px;
  }

  .annual-signup-participant .organization-emblem-strip {
    justify-content: flex-start;
  }

  .annual-signup-blocked-actions {
    align-items: flex-start;
    max-width: 100%;
    text-align: left;
  }

  .actions .button-link,
  .actions .secondary-link,
  .actions form,
  .filter-actions button,
  .filter-actions .secondary-link,
  .record-actions,
  .record-actions .secondary-link,
  .record-actions form {
    width: 100%;
  }

  .actions .button-link,
  .actions .secondary-link,
  .filter-actions .secondary-link,
  .record-actions .secondary-link {
    justify-content: center;
  }

  .leader-scope-list .event-scope-row .camping-trip-actions {
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-end;
    width: 100%;
  }

  .leader-scope-list .event-scope-row .camping-trip-actions .secondary-link {
    justify-content: flex-start;
    width: auto;
  }

  .site-nav a,
  .site-nav button,
  .language-switcher select,
  .theme-switcher select {
    min-height: 36px;
  }

  .site-nav-row {
    position: relative;
  }

  .preferences-menu {
    position: static;
  }

  .preferences-menu-panel {
    left: 50%;
    min-width: 0;
    right: auto;
    transform: translateX(-50%);
    width: min(320px, calc(100vw - 28px));
  }

  .record-list li {
    align-items: stretch;
    flex-direction: column;
    gap: 12px;
  }

  .record-list li.registration-history-item {
    display: grid;
    grid-template-columns: 1fr;
  }

  .registration-history-actions {
    justify-content: flex-start;
  }

  .audit-event-list-header {
    grid-template-columns: 1fr;
    gap: 4px;
    padding: 0;
  }

  .audit-event-list-header span:last-child {
    text-align: left;
  }

  .org-children {
    margin-left: 10px;
    padding-left: 12px;
  }

  .org-leader-list li {
    grid-template-columns: 1fr;
  }

  .profile-record-row {
    grid-template-columns: 24px minmax(0, 1fr);
  }

  .profile-record-row > .secondary-link,
  .profile-record-row > .profile-record-actions {
    grid-column: 1 / -1;
    justify-self: stretch;
  }

  .profile-record-row > .secondary-link {
    justify-content: center;
  }

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

  .profile-record-actions .secondary-link {
    width: auto;
  }

  .record-actions {
    align-items: stretch;
    justify-content: flex-start;
  }

  .link-button,
  .record-actions button {
    min-height: 36px;
    text-align: center;
    width: 100%;
  }

  .form-grid,
  .detail-grid,
  .agreement-language-grid,
  .inline-form,
  .document-checklist-row,
  .document-meta,
  .document-review-list .document-review-row,
  .document-upload-form,
  .document-insurance-fields .form-grid,
  .filter-form,
  .guardian-list li,
  .profile-completeness-card,
  .guardian-row-form,
  .guardian-add-form {
    grid-template-columns: 1fr;
  }

  .backup-filter-form > .field,
  .backup-filter-actions {
    grid-column: 1 / -1;
  }

  .backup-filter-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .backup-filter-actions button,
  .backup-filter-actions .secondary-link {
    justify-content: center;
    width: 100%;
  }

  .document-checklist-actions {
    justify-content: flex-start;
  }

  .document-insurance-fields .field,
  .document-insurance-fields .document-file-field,
  .document-upload-form > .field {
    grid-column: 1 / -1;
  }

  .profile-completeness-card.form-completeness-card {
    margin-top: 0;
  }

  .phone-country-code,
  .phone-national-number {
    display: block;
    margin-right: 0;
    width: 100%;
  }

  .phone-country-code {
    margin-bottom: 8px;
    max-width: none;
  }
}

@media (max-width: 380px) {
  .site-nav {
    align-items: stretch;
    width: 100%;
  }

  .site-nav a,
  .site-nav form,
  .site-nav button,
  .language-switcher,
  .language-switcher select,
  .theme-switcher,
  .theme-switcher select,
  .time-display-switcher,
  .time-display-switcher select {
    justify-content: center;
    width: 100%;
  }

  .brand-text span {
    font-size: 0.92rem;
  }

  .brand-text .brand-polish-name {
    font-size: 0.88rem;
  }

  .brand-text small {
    font-size: 0.68rem;
  }
}