/* SK Badminton shared design system.
   Tokens follow the club layout review; Bootstrap components are restyled here so
   every page shares the same header, cards, buttons, pills, forms and tables. */

:root {
  --sk-green: #078458;
  --sk-green-strong: #066a47;
  --sk-green-ink: #087950;
  --sk-green-soft: #e5f4ec;
  --sk-green-wash: #f0f8f4;
  --sk-ink: #17313a;
  --sk-muted: #6b817d;
  --sk-bg: #f5f9f7;
  --sk-surface: #ffffff;
  --sk-border: #dbe8e1;
  --sk-border-soft: #e6eee9;
  --sk-amber: #a56903;
  --sk-amber-soft: #fff3dc;
  --sk-red: #b84e4e;
  --sk-red-soft: #fcebec;
  --sk-gray: #60717a;
  --sk-gray-soft: #eef2f4;
  --sk-blue: #1f5f9e;
  --sk-blue-soft: #e8f1fb;
  --sk-radius: 16px;
  --sk-radius-sm: 9px;
  --sk-shadow: 0 5px 20px rgba(23, 58, 41, .063);

  --bs-font-sans-serif: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --bs-body-font-size: .9375rem;
  --bs-body-color: var(--sk-ink);
  --bs-body-color-rgb: 23, 49, 58;
  --bs-body-bg: var(--sk-bg);
  --bs-emphasis-color: #10272e;
  --bs-secondary-color: var(--sk-muted);
  --bs-tertiary-bg: #eef4f1;
  --bs-border-color: var(--sk-border);
  --bs-border-color-translucent: rgba(23, 58, 41, .1);
  --bs-border-radius: .5625rem;
  --bs-border-radius-lg: 1rem;
  --bs-primary: var(--sk-green);
  --bs-primary-rgb: 7, 132, 88;
  --bs-success: var(--sk-green);
  --bs-success-rgb: 7, 132, 88;
  --bs-primary-text-emphasis: var(--sk-green-strong);
  --bs-primary-bg-subtle: var(--sk-green-soft);
  --bs-primary-border-subtle: #bfe2d0;
  --bs-success-text-emphasis: var(--sk-green-strong);
  --bs-success-bg-subtle: var(--sk-green-soft);
  --bs-success-border-subtle: #bfe2d0;
  --bs-warning-text-emphasis: #8a5802;
  --bs-link-color: var(--sk-green-ink);
  --bs-link-color-rgb: 8, 121, 80;
  --bs-link-hover-color: var(--sk-green-strong);
  --bs-link-hover-color-rgb: 6, 106, 71;
  --bs-focus-ring-color: rgba(7, 132, 88, .22);
}

body {
  background: var(--sk-bg);
  color: var(--sk-ink);
  font-feature-settings: "cv11", "ss01";
  -webkit-font-smoothing: antialiased;
}
a { text-underline-offset: .15em; }
.disabled-link { pointer-events: none; opacity: .5; }

/* ---------- App header ---------- */
.sk-appbar {
  background: var(--sk-surface);
  border-bottom: 1px solid var(--sk-border);
  padding: .6rem 0;
  --bs-navbar-color: var(--sk-muted);
  --bs-navbar-hover-color: var(--sk-ink);
  --bs-navbar-active-color: var(--sk-green-ink);
  --bs-navbar-brand-color: var(--sk-ink);
  --bs-navbar-brand-hover-color: var(--sk-ink);
  --bs-navbar-toggler-border-color: var(--sk-border);
  --bs-navbar-toggler-focus-width: .18rem;
}
.sk-appbar > .container-fluid { padding-inline: clamp(16px, 2vw, 28px); gap: .5rem; }
.sk-appbar .navbar-brand { font-size: 1.0625rem; font-weight: 750; letter-spacing: -.02em; }
.sk-appbar .navbar-brand strong { color: var(--sk-green-ink); font-weight: 800; }
.sk-appbar .nav-link { padding: .5rem .7rem !important; border-radius: var(--sk-radius-sm); font-weight: 550; white-space: nowrap; }
.sk-appbar .nav-link:hover { background: #f1f6f3; }
.sk-appbar .nav-link.active,
.sk-appbar .nav-link.show { background: var(--sk-green-soft); color: var(--sk-green-ink) !important; font-weight: 750; }
.sk-appbar .navbar-toggler { border-radius: 10px; padding: .35rem .55rem; }
.sk-appbar .navbar-toggler:focus { box-shadow: 0 0 0 .18rem var(--bs-focus-ring-color); }
.sk-user-chip {
  width: 32px; height: 32px; flex: none; border-radius: 50%;
  display: inline-grid; place-items: center;
  background: var(--sk-green); color: #fff !important;
  font-size: .72rem; font-weight: 800; text-decoration: none; letter-spacing: .02em;
}
.sk-user-chip:hover { background: var(--sk-green-strong); }
@media (max-width: 991.98px) {
  .sk-appbar .navbar-collapse { margin-top: .6rem; padding-top: .6rem; border-top: 1px solid var(--sk-border-soft); }
  .sk-appbar .navbar-nav { gap: 2px; }
  .sk-appbar .dropdown-menu { box-shadow: none; border: 0; background: var(--sk-bg); margin: 2px 0 6px; }
}
@media (min-width: 992px) {
  .sk-appbar .navbar-collapse { min-width: 0; flex-basis: 0; }
  .sk-appbar .navbar-brand { flex-shrink: 0; }
  .sk-appbar .navbar-nav { gap: 2px; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
}

/* ---------- Page scaffolding ---------- */
.container.sk-main {
  max-width: none;
  width: 100%;
  padding-left: clamp(16px, 2.8vw, 42px);
  padding-right: clamp(16px, 2.8vw, 42px);
}
.sk-main { padding-top: clamp(1rem, 2.2vw, 1.75rem); padding-bottom: 3rem; }
.sk-main .container { max-width: none; }
.sk-main .container { padding-left: 0; padding-right: 0; }
:where(.sk-main) h1 {
  font-size: clamp(1.55rem, 1.1rem + 1.4vw, 1.9rem);
}
.sk-main :is(h1, h2, h3, h4, .h1, .h2, .h3, .h4) {
  color: #10272e;
  font-weight: 750;
  letter-spacing: -.03em;
}
.sk-main :is(h5, h6, .h5, .h6) { font-weight: 700; letter-spacing: -.01em; }

.sk-eyebrow {
  color: var(--sk-green-ink);
  font-size: .6875rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  margin: 0 0 .35rem;
}
.sk-page-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 1.35rem;
}
.sk-page-head h1 { margin: 0 0 .3rem; line-height: 1.12; }
.sk-page-head p:not(.sk-eyebrow) { margin: 0; color: var(--sk-muted); max-width: 52rem; }
.sk-page-head .sk-tools { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; }
@media (max-width: 575.98px) {
  .sk-page-head { display: block; }
  .sk-page-head .sk-tools { margin-top: .85rem; }
  .sk-page-head .sk-tools > .btn { flex: 1 1 auto; }
}
.sk-narrow { max-width: 30rem; margin-inline: auto; }
.sk-medium { max-width: 46rem; margin-inline: auto; }
.sk-wide { max-width: none; }
.sk-muted { color: var(--sk-muted); }
.sk-money { font-variant-numeric: tabular-nums; }
.sk-section-title {
  display: flex; align-items: center; justify-content: space-between; gap: .5rem;
  margin-bottom: .75rem;
}
.sk-section-title h2, .sk-section-title h3 { font-size: 1rem; margin: 0; letter-spacing: -.02em; }
.sk-section-title small { color: var(--sk-muted); }
.sk-empty {
  text-align: center; color: var(--sk-muted);
  padding: 2.25rem 1rem;
}
.sk-empty i { display: block; font-size: 1.5rem; color: #a9c4b8; margin-bottom: .6rem; }
.sk-footnote { color: var(--sk-muted); font-size: .8rem; margin-top: .85rem; }

/* Layout grids */
.sk-grid { display: grid; gap: .8rem; }
.sk-grid-2 { display: grid; gap: .8rem; grid-template-columns: minmax(0, 1.55fr) minmax(270px, .8fr); align-items: start; }
.sk-grid-even { display: grid; gap: .8rem; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
.sk-metrics { display: grid; gap: .8rem; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 1.05rem; }
.sk-metrics.sk-metrics-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 991.98px) {
  .sk-grid-2, .sk-grid-even { grid-template-columns: 1fr; }
}
@media (max-width: 767.98px) {
  .sk-metrics, .sk-metrics.sk-metrics-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sk-metrics > :last-child:nth-child(odd) { grid-column: span 2; }
}

/* Metric tile */
.sk-metric {
  background: var(--sk-surface);
  border: 1px solid var(--sk-border);
  border-radius: var(--sk-radius);
  box-shadow: var(--sk-shadow);
  padding: 1rem 1.1rem;
  min-width: 0;
}
.sk-metric > span { display: block; color: var(--sk-muted); font-size: .75rem; font-weight: 600; }
.sk-metric > strong { display: block; font-size: 1.5rem; font-weight: 750; letter-spacing: -.04em; margin-top: .3rem; line-height: 1.15; overflow-wrap: anywhere; }
.sk-metric > small { display: block; color: var(--sk-green-ink); margin-top: .15rem; font-size: .78rem; }
.sk-metric.is-warn > small { color: var(--sk-amber); }
.sk-metric.is-bad > small { color: var(--sk-red); }
@media (max-width: 575.98px) {
  .sk-metric { padding: .85rem .9rem; }
  .sk-metric > strong { font-size: 1.3rem; }
}

/* Key/value line list */
.sk-line {
  display: flex; justify-content: space-between; align-items: center; gap: .75rem;
  padding: .6rem 0; border-bottom: 1px solid var(--sk-border-soft);
}
.sk-line:last-child { border-bottom: 0; }
.sk-line > :first-child { min-width: 0; }
.sk-line small { display: block; color: var(--sk-muted); }
.sk-line strong { white-space: nowrap; }

/* Person row */
.sk-avatar {
  width: 30px; height: 30px; flex: none; border-radius: 50%;
  display: inline-grid; place-items: center;
  background: var(--sk-green-soft); color: var(--sk-green-ink);
  font-size: .66rem; font-weight: 850;
}
.sk-avatar.lg { width: 56px; height: 56px; border-radius: 14px; font-size: 1.15rem; }
.sk-person { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.sk-person b { display: block; font-weight: 650; }
.sk-person small { display: block; color: var(--sk-muted); overflow-wrap: anywhere; }

/* Date tile */
.sk-date {
  display: grid; justify-items: center; align-content: center;
  min-width: 4.25rem; padding-right: .9rem; border-right: 1px solid var(--sk-border-soft);
  line-height: 1.05; text-align: center;
}
.sk-date small:first-child { color: var(--sk-green-ink); font-size: .66rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.sk-date strong { font-size: 1.75rem; font-weight: 750; letter-spacing: -.05em; }
.sk-date small:last-child { color: var(--sk-muted); font-size: .7rem; }

/* Soft pill (same palette as badges below) */
.sk-pill {
  display: inline-block; padding: .3rem .6rem; border-radius: 8px;
  background: var(--sk-green-soft); color: var(--sk-green-ink);
  font-size: .72rem; font-weight: 800; white-space: nowrap; line-height: 1.2;
}
.sk-pill.amber { background: var(--sk-amber-soft); color: var(--sk-amber); }
.sk-pill.gray { background: var(--sk-gray-soft); color: var(--sk-gray); }
.sk-pill.red { background: var(--sk-red-soft); color: var(--sk-red); }

/* Soft segmented tabs (links) */
.sk-tabs { display: flex; flex-wrap: wrap; gap: .35rem; margin: 0 0 1rem; }
.sk-tabs > a, .sk-tabs > span, .sk-tabs > button {
  padding: .55rem .8rem; border-radius: 8px; border: 0;
  background: #e9f0ec; color: #5c756d; font-weight: 700; text-decoration: none; font-size: .875rem;
}
.sk-tabs > a:hover { background: #dde9e2; color: var(--sk-ink); }
.sk-tabs > .active { background: var(--sk-green); color: #fff; }

/* Centered auth / single task card */
.sk-auth { max-width: 28rem; margin: clamp(.5rem, 4vw, 2.5rem) auto; }
.sk-auth .card-body { padding: clamp(1.25rem, 3vw, 2rem); }
.sk-auth-mark {
  width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center;
  background: var(--sk-green-soft); color: var(--sk-green-ink); font-size: 1.1rem; margin-bottom: 1rem;
}

/* QR presentation */
.sk-qr {
  display: block; margin: .9rem auto; padding: 8px; background: #fff;
  border: 1px solid var(--sk-border); border-radius: 14px; max-width: 100%; height: auto;
}

/* ---------- Bootstrap components ---------- */
.card {
  --bs-card-bg: var(--sk-surface);
  --bs-card-border-color: var(--sk-border);
  --bs-card-border-radius: var(--sk-radius);
  --bs-card-inner-border-radius: calc(var(--sk-radius) - 1px);
  --bs-card-cap-bg: var(--sk-surface);
  --bs-card-cap-padding-y: .85rem;
  --bs-card-cap-padding-x: 1.1rem;
  --bs-card-spacer-x: 1.1rem;
  --bs-card-spacer-y: 1.05rem;
  box-shadow: var(--sk-shadow);
  min-width: 0;
}
.card.shadow-sm { box-shadow: var(--sk-shadow) !important; }
.card-header { font-weight: 700; border-bottom-color: var(--sk-border-soft); }
.card-footer { background: #fafcfb; border-top-color: var(--sk-border-soft); }
.card-title { font-weight: 700; letter-spacing: -.02em; }
.card.border-0 { box-shadow: var(--sk-shadow); }
.card .card { box-shadow: none; }

.btn {
  --bs-btn-font-weight: 650;
  --bs-btn-border-radius: var(--sk-radius-sm);
  --bs-btn-padding-x: .85rem;
  --bs-btn-padding-y: .5rem;
  --bs-btn-focus-box-shadow: 0 0 0 .2rem var(--bs-focus-ring-color);
  display: inline-flex; align-items: center; justify-content: center; gap: .3rem;
}
.btn.d-block, .btn.w-100 { display: flex; }
.btn-sm { --bs-btn-padding-x: .6rem; --bs-btn-padding-y: .3rem; --bs-btn-border-radius: 8px; --bs-btn-font-size: .8125rem; }
.btn-lg { --bs-btn-padding-y: .7rem; --bs-btn-border-radius: 11px; }
.btn-primary, .btn-success {
  --bs-btn-bg: var(--sk-green); --bs-btn-border-color: var(--sk-green);
  --bs-btn-hover-bg: var(--sk-green-strong); --bs-btn-hover-border-color: var(--sk-green-strong);
  --bs-btn-active-bg: #055a3c; --bs-btn-active-border-color: #055a3c;
  --bs-btn-disabled-bg: var(--sk-green); --bs-btn-disabled-border-color: var(--sk-green);
}
.btn-outline-primary, .btn-outline-success {
  --bs-btn-color: var(--sk-green-ink); --bs-btn-border-color: #bfdccd; --bs-btn-bg: #fff;
  --bs-btn-hover-color: var(--sk-green-strong); --bs-btn-hover-bg: var(--sk-green-soft); --bs-btn-hover-border-color: #a9d2bd;
  --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--sk-green); --bs-btn-active-border-color: var(--sk-green);
  --bs-btn-disabled-color: var(--sk-green-ink); --bs-btn-disabled-border-color: #bfdccd;
}
.btn-outline-secondary, .btn-light, .btn-outline-dark {
  --bs-btn-color: #135342; --bs-btn-bg: #fff; --bs-btn-border-color: #cbded4;
  --bs-btn-hover-color: var(--sk-ink); --bs-btn-hover-bg: #f1f6f3; --bs-btn-hover-border-color: #b9d0c4;
  --bs-btn-active-color: var(--sk-ink); --bs-btn-active-bg: #e4eee8; --bs-btn-active-border-color: #b9d0c4;
  --bs-btn-disabled-color: #7e948d; --bs-btn-disabled-bg: #fff; --bs-btn-disabled-border-color: #dbe8e1;
}
.btn-secondary, .btn-dark {
  --bs-btn-bg: #33514a; --bs-btn-border-color: #33514a;
  --bs-btn-hover-bg: #26413b; --bs-btn-hover-border-color: #26413b;
  --bs-btn-active-bg: #1d352f; --bs-btn-active-border-color: #1d352f;
}
.btn-outline-danger {
  --bs-btn-color: #a33335; --bs-btn-border-color: #ecc3c4; --bs-btn-bg: #fff;
  --bs-btn-hover-color: #fff; --bs-btn-hover-bg: #b33b3d; --bs-btn-hover-border-color: #b33b3d;
}
.btn-danger {
  --bs-btn-bg: #b33b3d; --bs-btn-border-color: #b33b3d;
  --bs-btn-hover-bg: #982f31; --bs-btn-hover-border-color: #982f31;
}
.btn-outline-warning {
  --bs-btn-color: #93600a; --bs-btn-border-color: #f0cf8a; --bs-btn-bg: #fff;
  --bs-btn-hover-color: #6f4800; --bs-btn-hover-bg: var(--sk-amber-soft); --bs-btn-hover-border-color: #e9bd5e;
  --bs-btn-active-color: #4d3200; --bs-btn-active-bg: #f5b83d; --bs-btn-active-border-color: #f5b83d;
}
.btn-warning {
  --bs-btn-bg: #f5b83d; --bs-btn-border-color: #f5b83d; --bs-btn-color: #3f2a00;
  --bs-btn-hover-bg: #eaa820; --bs-btn-hover-border-color: #eaa820;
}
.btn-outline-info {
  --bs-btn-color: var(--sk-blue); --bs-btn-border-color: #c3d8ee; --bs-btn-bg: #fff;
  --bs-btn-hover-color: var(--sk-blue); --bs-btn-hover-bg: var(--sk-blue-soft); --bs-btn-hover-border-color: #a8c6e6;
}
.btn-link { --bs-btn-color: var(--sk-green-ink); --bs-btn-hover-color: var(--sk-green-strong); font-weight: 650; }
.btn-group > .btn { display: inline-flex; }

/* Badges become soft pills */
.badge { --bs-badge-font-weight: 750; --bs-badge-border-radius: 7px; --bs-badge-padding-x: .55em; --bs-badge-padding-y: .38em; letter-spacing: .01em; }
.badge.rounded-pill { --bs-badge-border-radius: 7px; border-radius: 7px !important; }
.badge.text-bg-success, .badge.bg-success, .badge.text-bg-primary, .badge.bg-primary { background: var(--sk-green-soft) !important; color: var(--sk-green-ink) !important; }
.badge.text-bg-warning, .badge.bg-warning { background: var(--sk-amber-soft) !important; color: var(--sk-amber) !important; }
.badge.text-bg-danger, .badge.bg-danger { background: var(--sk-red-soft) !important; color: var(--sk-red) !important; }
.badge.text-bg-secondary, .badge.bg-secondary, .badge.text-bg-light, .badge.bg-light { background: var(--sk-gray-soft) !important; color: var(--sk-gray) !important; border-color: transparent !important; }
.badge.text-bg-info, .badge.bg-info { background: var(--sk-blue-soft) !important; color: var(--sk-blue) !important; }
.badge.text-bg-dark, .badge.bg-dark { background: #24403a !important; color: #fff !important; }

/* Forms */
.form-label { color: #4a655e; font-size: .8125rem; font-weight: 650; margin-bottom: .3rem; }
.form-control, .form-select {
  border-color: #cdded5; border-radius: var(--sk-radius-sm); min-height: 2.5rem; color: var(--sk-ink);
}
.form-control-sm, .form-select-sm { min-height: 2rem; border-radius: 8px; }
.form-control:focus, .form-select:focus, .form-check-input:focus {
  border-color: #7fc3a3; box-shadow: 0 0 0 .2rem var(--bs-focus-ring-color);
}
.form-control[readonly], .form-control:disabled { background: #f8fbf9; }
textarea.form-control { min-height: 5rem; }
.form-check-input:checked { background-color: var(--sk-green); border-color: var(--sk-green); }
.form-text { color: var(--sk-muted); }
.input-group-text { background: #f1f6f3; border-color: #cdded5; color: var(--sk-muted); }

/* Tables */
.table {
  --bs-table-color: var(--sk-ink);
  --bs-table-border-color: var(--sk-border-soft);
  --bs-table-striped-bg: #f7faf8;
  --bs-table-hover-bg: #f2f7f4;
  margin-bottom: 0;
}
.table > thead > tr > th, .table > thead > tr > td {
  color: var(--sk-muted); font-size: .72rem; font-weight: 750; letter-spacing: .05em; text-transform: uppercase;
  background: #fafcfb; border-bottom-color: var(--sk-border); white-space: nowrap;
}
.table > :not(caption) > * > * { padding: .7rem .75rem; }
.table-sm > :not(caption) > * > * { padding: .45rem .55rem; }
.table > thead.table-light > tr > th, .table > thead.table-dark > tr > th { --bs-table-bg: #fafcfb; --bs-table-color: var(--sk-muted); border-color: var(--sk-border); }
.table-bordered > :not(caption) > * { border-color: var(--sk-border-soft); }
.card > .table-responsive:last-child .table > tbody > tr:last-child > *,
.card > .table:last-child > tbody > tr:last-child > * { border-bottom: 0; }
.sk-table-card { overflow: hidden; }
.sk-table-card .table-responsive { margin: 0; }

/* Alerts */
.alert { border-radius: 12px; border-width: 1px; font-size: .9rem; }
.alert-success { --bs-alert-bg: var(--sk-green-wash); --bs-alert-border-color: #c6e5d5; --bs-alert-color: var(--sk-green-strong); }
.alert-info { --bs-alert-bg: var(--sk-blue-soft); --bs-alert-border-color: #cbdcef; --bs-alert-color: #1c4f82; }
.alert-warning { --bs-alert-bg: #fff8e8; --bs-alert-border-color: #f2dca6; --bs-alert-color: #7a4f02; }
.alert-danger { --bs-alert-bg: #fdf1f1; --bs-alert-border-color: #f0cccd; --bs-alert-color: #8f2f31; }
.alert-light, .alert-secondary { --bs-alert-bg: #fafcfb; --bs-alert-border-color: var(--sk-border); --bs-alert-color: #4a655e; }
.alert-primary { --bs-alert-bg: var(--sk-green-wash); --bs-alert-border-color: #c6e5d5; --bs-alert-color: var(--sk-green-strong); }

/* Dropdowns, list groups, nav, pagination, modal */
.dropdown-menu {
  --bs-dropdown-border-color: var(--sk-border);
  --bs-dropdown-border-radius: 12px;
  --bs-dropdown-link-active-bg: var(--sk-green);
  --bs-dropdown-link-hover-bg: #f1f6f3;
  --bs-dropdown-item-padding-y: .45rem;
  --bs-dropdown-font-size: .9rem;
  box-shadow: 0 12px 32px rgba(23, 58, 41, .12);
  padding: .35rem;
}
.dropdown-item { border-radius: 8px; }
.list-group { --bs-list-group-border-color: var(--sk-border-soft); --bs-list-group-active-bg: var(--sk-green); --bs-list-group-active-border-color: var(--sk-green); --bs-list-group-action-hover-bg: #f2f7f4; }
.nav-pills { --bs-nav-pills-link-active-bg: var(--sk-green); --bs-nav-pills-border-radius: 8px; gap: .3rem; }
.nav-pills .nav-link { color: #5c756d; background: #e9f0ec; font-weight: 700; }
.nav-pills .nav-link.active { color: #fff; }
.nav-tabs { --bs-nav-tabs-border-color: var(--sk-border); --bs-nav-tabs-link-active-color: var(--sk-green-ink); --bs-nav-tabs-link-active-border-color: var(--sk-border) var(--sk-border) #fff; }
.nav-tabs .nav-link { color: var(--sk-muted); font-weight: 650; }
.pagination { --bs-pagination-color: var(--sk-green-ink); --bs-pagination-active-bg: var(--sk-green); --bs-pagination-active-border-color: var(--sk-green); --bs-pagination-border-color: var(--sk-border); --bs-pagination-hover-bg: #f1f6f3; --bs-pagination-focus-box-shadow: 0 0 0 .2rem var(--bs-focus-ring-color); }
.modal { --bs-modal-border-radius: var(--sk-radius); --bs-modal-border-color: var(--sk-border); --bs-modal-header-border-color: var(--sk-border-soft); --bs-modal-footer-border-color: var(--sk-border-soft); }
.progress { --bs-progress-bg: #ebf2ed; --bs-progress-border-radius: 6px; }
.progress-bar.bg-success, .progress-bar.bg-primary { background-color: #0b9565 !important; }
.progress-bar.bg-warning { background-color: #eba630 !important; }
.border-success { border-color: #bfe2d0 !important; }
.bg-light { background-color: #f4f8f6 !important; }
.text-success { color: var(--sk-green-ink) !important; }
.text-primary { color: var(--sk-green-ink) !important; }
hr { border-color: var(--sk-border-soft); opacity: 1; }
.sk-flash { margin-bottom: 1rem; }

/* ---------- Group B (payments): shared additions ---------- */
/* .sk-stack: a table that collapses to labelled stacked rows below 768px.
   Put data-label="..." on each <td>; .sk-stack-title marks the row's lead cell,
   .sk-stack-block renders a cell full-width without a label (forms, notes). */
@media (max-width: 767.98px) {
  .table.sk-stack thead { display: none; }
  .table.sk-stack, .table.sk-stack tbody, .table.sk-stack tr, .table.sk-stack td { display: block; width: 100%; }
  .table.sk-stack > tbody > tr { border-bottom: 1px solid var(--sk-border-soft); }
  .table.sk-stack > tbody > tr:last-child { border-bottom: 0; }
  .table.sk-stack > :not(caption) > * > * { padding: .2rem 1rem; border: 0; }
  .table.sk-stack > tbody > tr > :first-child { padding-top: .75rem; }
  .table.sk-stack > tbody > tr > :last-child { padding-bottom: .75rem; }
  .table.sk-stack td[data-label] { display: flex; justify-content: space-between; align-items: center; gap: 1rem; text-align: right !important; }
  .table.sk-stack td[data-label]::before {
    content: attr(data-label); color: var(--sk-muted); font-size: .78rem; font-weight: 600; text-align: left; flex: none;
  }
  .table.sk-stack td.sk-stack-title { font-weight: 700; padding-bottom: .35rem; }
  .table.sk-stack td.sk-stack-block { padding-top: .5rem; text-align: left !important; }
  .table.sk-stack td.sk-empty { padding: 2rem 1rem; }
}
.table td.sk-empty { padding: 2.25rem 1rem; }
/* Horizontal strip of compact inline forms (e.g. payment corrections). */
.sk-inline-forms { display: flex; flex-wrap: wrap; gap: .4rem; }
.sk-inline-forms > form { display: flex; gap: .3rem; align-items: center; }
.sk-inline-forms .form-select-sm { width: auto; min-width: 7rem; }
.sk-inline-forms .form-control-sm { width: 6.5rem; }
@media (min-width: 768px) { .sk-inline-forms { flex-wrap: nowrap; } }
/* Toolbar row that sits between the page head and content: tabs left, filters right. */
.sk-toolbar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .6rem; margin-bottom: 1rem; }
.sk-toolbar > .sk-tabs { margin: 0; }
/* ---------- /Group B ---------- */

/* ---------- Group C (admin): link tiles ----------
   .sk-tiles grid of .card.sk-tile; head = .sk-tile-icon + h2/p; actions in .sk-tile-links.
   .sk-tile-icon also works standalone (modifiers is-warn / is-gray). */
.sk-tiles { display: grid; gap: .8rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.sk-tile .card-body { display: flex; flex-direction: column; gap: .9rem; height: 100%; }
.sk-tile-head { display: flex; align-items: flex-start; gap: .8rem; }
.sk-tile-head h2 { font-size: 1rem; margin: 0 0 .15rem; letter-spacing: -.02em; }
.sk-tile-head p { margin: 0; color: var(--sk-muted); font-size: .85rem; }
.sk-tile-icon {
  width: 40px; height: 40px; flex: none; border-radius: 11px;
  display: inline-grid; place-items: center;
  background: var(--sk-green-soft); color: var(--sk-green-ink); font-size: 1rem;
}
.sk-tile-icon.is-warn { background: var(--sk-amber-soft); color: var(--sk-amber); }
.sk-tile-icon.is-gray { background: var(--sk-gray-soft); color: var(--sk-gray); }
.sk-tile-links { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: auto; }

/* ---------- Group D: auth / QR / check-in additions ---------- */
.sk-auth-mark.is-warn { background: var(--sk-amber-soft); color: var(--sk-amber); }
.sk-auth-mark.is-bad { background: var(--sk-red-soft); color: var(--sk-red); }
.sk-auth-mark.mx-auto { margin-inline: auto; }
.sk-qr-link { font-size: .78rem; color: var(--sk-muted); overflow-wrap: anywhere; word-break: break-all; }
/* Group C (admin): dated list rows. <div class="sk-dated"><div class="sk-date">..</div><div>info</div><div>status/side</div>
   <div class="sk-dated-actions">optional full-width actions</div></div> inside a .card. */
.sk-dated {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: .35rem .9rem; align-items: center;
  padding: .85rem 1.1rem; border-bottom: 1px solid var(--sk-border-soft);
}
.sk-dated:last-child { border-bottom: 0; }
.sk-dated .sk-date { min-width: 3.6rem; padding-right: .8rem; }
.sk-dated .sk-date strong { font-size: 1.45rem; }
.sk-dated h3 { font-size: .98rem; margin: 0; letter-spacing: -.01em; }
.sk-dated-meta { color: var(--sk-muted); font-size: .82rem; overflow-wrap: anywhere; }
.sk-dated-actions { grid-column: 2 / -1; display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; padding-top: .35rem; }
.sk-dated-actions > form { display: flex; align-items: center; gap: .35rem; margin: 0; }
@media (max-width: 575.98px) {
  .sk-dated { grid-template-columns: auto minmax(0, 1fr); padding: .8rem .9rem; }
  .sk-dated > :nth-child(3) { grid-column: 2; justify-self: start; }
  .sk-dated-actions { grid-column: 1 / -1; }
}
/* Group C (admin): opt-in modifier for Group B's .sk-stack - lifts the .sk-stack-title cell to the top of each stacked row. */
@media (max-width: 767.98px) {
  .table.sk-stack.sk-stack-lead > tbody > tr { display: flex; flex-direction: column; }
  .table.sk-stack.sk-stack-lead > tbody > tr > td.sk-stack-title { order: -1; }
}
/* ---------- /Group C ---------- */

/* Push prompt banners only appear while notifications can still be turned on. */
.alert[data-push-ui]:not([data-state="off"]):not([data-state="ios-install"]) { display: none !important; }