/* Admin workspace — calm practical shell
   Uses !important selectively to override square-design resets in custom.css.scss */

:root {
  --admin-sidebar-bg: #f7f4ec;
  --admin-content-bg: #ffffff;
  --admin-metric-bg: #f3efe6;
  --admin-selected: #ccdafc;
  --admin-selected-text: #1a2a6b;
  --admin-lime: #e1ef96;
  --admin-ink: #141414;
  --admin-muted: #6b7280;
  --admin-border: #e5e2da;
  --admin-blue: #2c40ab;
  --admin-radius: 8px;
  --admin-sidebar-width: 252px;
  --admin-header-height: 68px;
  --admin-font: "Galano Grotesque", system-ui, sans-serif;
  --admin-body-size: 0.9375rem; /* 15px */
  --admin-control-h: 2.625rem; /* ~42px */
  --admin-row-h: 3.25rem; /* ~52px target for simple rows */
}

body.admin-workspace {
  background: var(--admin-content-bg) !important;
  overflow-x: hidden; /* page must not scroll horizontally; tables scroll in .admin-table-wrap */
  font-size: var(--admin-body-size);
}

body.admin-workspace main {
  padding: 0 !important;
  max-width: none !important;
  overflow-x: clip;
}

/* Keep the shared site navbar; full-bleed above the sidebar */
body.admin-workspace > nav.navbar {
  border-bottom: 1px solid var(--admin-border);
  position: sticky;
  top: 0;
  z-index: 50;
  padding-top: 0.55rem !important;
  padding-bottom: 0.55rem !important;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  min-height: var(--admin-header-height);
}

body.admin-workspace > nav.navbar > .container {
  max-width: none;
  width: 100%;
  padding-left: 1rem;
  padding-right: 1.25rem;
}

body.admin-workspace > nav.navbar .navbar-brand img {
  height: 32px !important;
}

body.admin-workspace > nav.navbar .nav-link {
  font-size: 0.9375rem !important;
  padding-top: 0.35rem !important;
  padding-bottom: 0.35rem !important;
}

body.admin-workspace .nav-link.admin-nav-active {
  color: var(--admin-blue) !important;
  font-weight: 700;
}

body.admin-workspace .app-nav-org,
body.admin-workspace .app-nav-user {
  font-size: 0.875rem;
}

body.admin-workspace .app-nav-avatar {
  width: 1.75rem;
  height: 1.75rem;
  font-size: 0.75rem;
}

/* —— Shell —— */
.admin-shell {
  display: flex;
  min-height: calc(100vh - var(--admin-header-height));
  font-family: var(--admin-font);
  color: var(--admin-ink);
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

.admin-shell__main {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
  background: var(--admin-content-bg);
  display: flex;
  flex-direction: column;
  overflow-x: clip;
}

.admin-shell__mobile-bar {
  padding: 0.55rem 1rem;
  border-bottom: 1px solid var(--admin-border);
  background: var(--admin-content-bg);
}

.admin-shell__content {
  --admin-content-pad-x: 1.75rem;
  --admin-content-pad-bottom: 2.5rem;
  flex: 1;
  padding: 1.5rem var(--admin-content-pad-x) var(--admin-content-pad-bottom);
  max-width: none;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  overflow-x: clip;
}

#details,
#ticket-types,
#settings,
#plan,
#team {
  scroll-margin-top: 5rem;
}

.admin-env-banner {
  margin: 0 !important;
  border-radius: 0 !important;
  padding: 0.35rem 1rem !important;
  font-size: 0.8rem !important;
  text-align: center;
}

/* —— Sidebar —— */
.admin-sidebar {
  width: var(--admin-sidebar-width);
  flex: 0 0 var(--admin-sidebar-width);
  background: var(--admin-sidebar-bg);
  border-right: 1px solid var(--admin-border);
  display: flex;
  flex-direction: column;
  padding: 0.85rem 0.75rem 1.25rem;
  position: sticky;
  top: var(--admin-header-height);
  height: calc(100vh - var(--admin-header-height));
  overflow-x: hidden;
  overflow-y: auto;
  z-index: 40;
  box-sizing: border-box;
}


.admin-nav-section {
  margin-bottom: 1.15rem;
}

.admin-nav-section__label {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--admin-muted);
  padding: 0.35rem 0.75rem;
  margin-bottom: 0.15rem;
}

.admin-nav-section__org {
  text-transform: none;
  letter-spacing: 0;
  font-weight: 600;
  opacity: 0.85;
}

.admin-nav-section--platform {
  margin-top: auto;
  padding-top: 0.75rem;
  border-top: 1px solid var(--admin-border);
}

.admin-nav-link {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 2.625rem; /* ~42px */
  padding: 0.45rem 0.7rem;
  border-radius: var(--admin-radius) !important;
  color: var(--admin-ink) !important;
  text-decoration: none !important;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25;
  border: none;
  background: transparent;
  width: 100%;
  text-align: left;
  transition: background 0.15s ease;
  box-sizing: border-box;
}

.admin-nav-link i {
  font-size: 1rem;
  color: #4b5563;
  width: 1.15rem;
  text-align: center;
  flex-shrink: 0;
}

.admin-nav-link:hover {
  background: rgba(0, 0, 0, 0.04);
}

.admin-nav-link:focus-visible {
  outline: 2px solid var(--admin-blue);
  outline-offset: 1px;
}

.admin-nav-link.is-active {
  background: var(--admin-selected) !important;
  color: var(--admin-selected-text) !important;
  font-weight: 600;
  box-shadow: inset 3px 0 0 var(--admin-blue);
}

.admin-nav-link.is-active i {
  color: var(--admin-selected-text);
}

.admin-sidebar__close {
  display: none;
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  border: none;
  background: transparent;
  font-size: 1.25rem;
  color: var(--admin-ink);
  padding: 0.25rem;
  border-radius: 4px;
}

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

.admin-menu-toggle {
  display: inline-flex;
  border: 1px solid var(--admin-border);
  background: #fff;
  border-radius: var(--admin-radius) !important;
  padding: 0.4rem 0.65rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--admin-ink);
  align-items: center;
  gap: 0.4rem;
}

.admin-menu-toggle:focus-visible {
  outline: 2px solid var(--admin-blue);
  outline-offset: 1px;
}

/* —— Page header —— */
.admin-page-header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.admin-breadcrumb {
  font-size: 0.8rem;
  color: var(--admin-muted);
  margin-bottom: 0.35rem;
}

.admin-breadcrumb a,
.admin-breadcrumb-link {
  color: var(--admin-muted);
  text-decoration: none;
}

.admin-breadcrumb a:hover,
.admin-breadcrumb-link:hover {
  color: var(--admin-blue);
}

.admin-back-link {
  margin: 0 0 0.55rem;
  font-size: 0.875rem;
  font-weight: 600;
}

.admin-back-link a {
  color: var(--admin-blue) !important;
  text-decoration: none !important;
}

.admin-back-link a:hover {
  text-decoration: underline !important;
}

.admin-dl {
  margin: 0;
}

.admin-dl__row {
  display: grid;
  grid-template-columns: 8.5rem minmax(0, 1fr);
  gap: 0.5rem 1rem;
  padding: 0.45rem 0;
  border-bottom: 1px solid var(--admin-border);
}

.admin-dl__row:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.admin-dl__row:first-child {
  padding-top: 0;
}

.admin-dl__row dt {
  margin: 0;
  color: var(--admin-muted);
  font-weight: 500;
  font-size: 0.875rem;
}

.admin-dl__row dd {
  margin: 0;
  min-width: 0;
}

@media (max-width: 575.98px) {
  .admin-dl__row {
    grid-template-columns: 1fr;
    gap: 0.15rem;
  }
}

.admin-page-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem 0.75rem;
}

.admin-page-title {
  font-size: 1.875rem; /* 30px */
  font-weight: 700;
  margin: 0;
  letter-spacing: -0.02em;
  color: var(--admin-ink);
  line-height: 1.2;
}

.admin-page-title-badge {
  display: inline-flex;
  align-items: center;
}

.admin-page-meta {
  margin: 0.35rem 0 0;
  color: var(--admin-muted);
  font-size: 0.9375rem;
}

.admin-page-desc {
  margin: 0.35rem 0 0;
  color: var(--admin-muted);
  font-size: 0.9375rem;
  max-width: 42rem;
}

.admin-page-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

/* —— Buttons —— */
.admin-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  min-height: var(--admin-control-h);
  padding: 0.45rem 0.9rem;
  border-radius: var(--admin-radius) !important;
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none !important;
  border: 1px solid transparent;
  line-height: 1.25;
  cursor: pointer;
  box-shadow: none !important;
  transition: background 0.15s ease, border-color 0.15s ease;
  box-sizing: border-box;
}

.admin-btn:focus-visible {
  outline: 2px solid var(--admin-blue);
  outline-offset: 2px;
}

.admin-btn--primary {
  background: var(--admin-lime) !important;
  color: var(--admin-ink) !important;
  border-color: #d4e07a;
}

.admin-btn--primary:hover {
  background: #d8e87a !important;
  color: var(--admin-ink) !important;
}

.admin-btn--secondary {
  background: #fff !important;
  color: var(--admin-blue) !important;
  border-color: var(--admin-border);
}

.admin-btn--secondary:hover {
  background: #f8fafc !important;
  border-color: #c5cdd8;
}

.admin-btn--ghost {
  background: transparent !important;
  color: var(--admin-blue) !important;
  border-color: transparent;
  padding-left: 0.35rem;
  padding-right: 0.35rem;
}

.admin-btn--ghost:hover {
  text-decoration: underline !important;
}

.admin-btn--sm {
  min-height: 2.125rem;
  padding: 0.3rem 0.65rem;
  font-size: 0.8125rem;
}

.admin-btn--danger {
  background: #fff !important;
  color: #991b1b !important;
  border-color: #fecaca;
}

.admin-btn--danger:hover {
  background: #fef2f2 !important;
  border-color: #fca5a5;
}

.admin-btn--block {
  width: 100%;
}

/* —— Metrics —— */
.admin-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}

.admin-metric {
  background: var(--admin-metric-bg);
  border-radius: var(--admin-radius) !important;
  padding: 1rem 1.1rem;
  border: 1px solid transparent;
  box-shadow: none !important;
}

.admin-metric__value {
  display: block;
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: var(--admin-ink);
}

.admin-metric__label {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.8rem;
  color: var(--admin-muted);
}

/* —— Panels / upcoming —— */
.admin-panel {
  border: 1px solid var(--admin-border);
  border-radius: var(--admin-radius) !important;
  background: #fff;
  margin-bottom: 1.25rem;
  box-shadow: none !important;
  overflow: hidden;
  min-width: 0;
}

/* Bootstrap columns: panel margin must not poke into the next row */
.row > [class*="col"] > .admin-panel,
.row > [class*="col"] > .admin-panel.h-100 {
  margin-bottom: 0;
  height: 100%;
}

/* Organisation overview — explicit grid avoids stacked-row overlap */
.admin-org-overview {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 1rem;
  align-items: stretch;
}

.admin-org-overview > .admin-panel {
  margin-bottom: 0;
  min-width: 0;
}

.admin-org-overview__details {
  grid-column: 1;
  grid-row: 1;
}

.admin-org-overview__plan {
  grid-column: 2;
  grid-row: 1;
}

.admin-org-overview__team {
  grid-column: 1;
  grid-row: 2;
}

.admin-org-overview__events {
  grid-column: 2;
  grid-row: 2;
}

.admin-org-team {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
}

.admin-org-team > .admin-panel {
  margin-bottom: 0;
  min-width: 0;
}

@media (max-width: 991.98px) {
  .admin-org-overview,
  .admin-org-team {
    grid-template-columns: 1fr;
  }

  .admin-org-overview__details,
  .admin-org-overview__plan,
  .admin-org-overview__team,
  .admin-org-overview__events {
    grid-column: 1;
    grid-row: auto;
  }
}

.admin-panel--emphasis {
  background: var(--admin-selected);
  border-color: transparent;
}

.admin-upcoming {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.15rem;
  flex-wrap: wrap;
}

.admin-upcoming__body {
  flex: 1;
  min-width: 160px;
}

.admin-upcoming__title {
  margin: 0 0 0.2rem;
  font-size: 1.05rem;
  font-weight: 700;
}

.admin-upcoming__meta {
  margin: 0;
  font-size: 0.875rem;
  color: #374151;
}

.admin-upcoming__sub {
  margin: 0.15rem 0 0;
  font-size: 0.8rem;
  color: var(--admin-muted);
}

.admin-date-block {
  flex-shrink: 0;
  width: 3.5rem;
  height: 3.5rem;
  background: #fff;
  border-radius: 6px !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(0, 0, 0, 0.06);
}

.admin-date-block__day {
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1;
}

.admin-date-block__month {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--admin-muted);
}

/* —— Section heads —— */
.admin-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.85rem;
}

.admin-section-title {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
}

.admin-section-link {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--admin-blue) !important;
  text-decoration: none !important;
}

.admin-section-link:hover {
  text-decoration: underline !important;
}

/* —— Filters —— */
.admin-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-bottom: 0.75rem;
  align-items: flex-end;
}

.admin-filters-panel {
  border: 1px solid var(--admin-border);
  border-radius: var(--admin-radius) !important;
  background: #fff;
  padding: 0.85rem 1rem;
  margin-bottom: 0.85rem;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

/* Keep Select2 from blowing out the content column */
.admin-shell .select2-container {
  max-width: 100% !important;
  width: 100% !important;
}

/* Match Select2 to admin inputs */
.admin-shell .select2-container--default .select2-selection--single,
.admin-shell .select2-container--default .select2-selection--multiple {
  border: 1px solid var(--admin-border) !important;
  border-radius: var(--admin-radius) !important;
  min-height: var(--admin-control-h) !important;
  background: #fff !important;
  box-shadow: none !important;
}

.admin-shell .select2-container--default .select2-selection--single {
  height: var(--admin-control-h) !important;
  padding: 0 0.75rem !important;
  display: flex;
  align-items: center;
}

.admin-shell .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--admin-ink) !important;
  line-height: 1.3 !important;
  padding: 0 !important;
  font-size: 0.875rem !important;
}

.admin-shell .select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--admin-muted) !important;
}

.admin-shell .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 100% !important;
  top: 0 !important;
  right: 0.55rem !important;
}

.admin-shell .select2-container--default .select2-selection--multiple {
  padding: 0.2rem 0.45rem !important;
}

.admin-shell .select2-container--default .select2-selection--multiple .select2-selection__rendered {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  padding: 0 !important;
}

.admin-shell .select2-container--default .select2-selection--multiple .select2-selection__choice {
  background: var(--admin-selected) !important;
  border: 1px solid transparent !important;
  border-radius: 6px !important;
  color: var(--admin-selected-text) !important;
  font-size: 0.75rem !important;
  font-weight: 600;
  margin: 0 !important;
  padding: 0.15rem 0.4rem !important;
}

.admin-shell .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  color: var(--admin-selected-text) !important;
  margin-right: 0.25rem;
  border: 0 !important;
}

.admin-shell .select2-container--default .select2-selection--multiple .select2-selection__placeholder {
  color: var(--admin-muted) !important;
  margin-top: 0.35rem;
  font-size: 0.875rem;
}

.admin-shell .select2-container--default.select2-container--focus .select2-selection--single,
.admin-shell .select2-container--default.select2-container--focus .select2-selection--multiple,
.admin-shell .select2-container--default.select2-container--open .select2-selection--single,
.admin-shell .select2-container--default.select2-container--open .select2-selection--multiple {
  border-color: #a8b8e0 !important;
  outline: 2px solid var(--admin-selected);
  outline-offset: 0;
}

.admin-shell .select2-dropdown,
.select2-container--default .select2-dropdown {
  border: 1px solid var(--admin-border) !important;
  border-radius: var(--admin-radius) !important;
  box-shadow: 0 8px 24px rgba(20, 20, 20, 0.08) !important;
  overflow: hidden;
}

.admin-shell .select2-results__option,
.select2-container--default .select2-results__option {
  font-size: 0.875rem;
  padding: 0.45rem 0.75rem;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background: var(--admin-selected) !important;
  color: var(--admin-selected-text) !important;
}

.admin-filters__primary {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: flex-end;
}

.admin-filters__more {
  margin-top: 0.65rem;
  padding-top: 0.65rem;
  border-top: 1px solid var(--admin-border);
}

.admin-filters__more[hidden] {
  display: none !important;
}

.admin-filters__more-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: 0.55rem;
  padding: 0;
  border: 0;
  background: none;
  color: var(--admin-blue);
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
}

.admin-filters__more-toggle:hover {
  text-decoration: underline;
}

.admin-filters__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0.55rem 0 0;
}

.admin-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.2rem 0.5rem;
  border-radius: 999px !important;
  background: #f3f4f6;
  color: #374151;
  font-size: 0.75rem;
  font-weight: 600;
}

.admin-filter-chip a {
  color: inherit;
  text-decoration: none;
  opacity: 0.7;
}

.admin-filter-chip a:hover {
  opacity: 1;
}

.admin-field {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
  flex: 0 1 10.5rem;
}

.admin-field--grow {
  flex: 1 1 12rem;
}

.admin-field--narrow {
  flex: 0 1 8.5rem;
}

.admin-field--actions {
  flex: 0 0 auto;
  align-self: flex-end;
}

.admin-field label,
.admin-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--admin-muted);
}

.admin-input,
.admin-select,
.admin-shell .form-control,
.admin-shell .form-select {
  border: 1px solid var(--admin-border) !important;
  border-radius: var(--admin-radius) !important;
  padding: 0.45rem 0.7rem !important;
  font-size: 0.875rem !important;
  background: #fff !important;
  color: var(--admin-ink) !important;
  box-shadow: none !important;
  min-height: var(--admin-control-h);
  width: 100%;
  box-sizing: border-box;
  appearance: none;
}

.admin-input:focus,
.admin-select:focus,
.admin-shell .form-control:focus,
.admin-shell .form-select:focus {
  border-color: #a8b8e0 !important;
  outline: 2px solid var(--admin-selected);
  outline-offset: 0;
}

.admin-input-with-icon {
  position: relative;
}

.admin-input-with-icon i {
  position: absolute;
  left: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--admin-muted);
  pointer-events: none;
}

.admin-input-with-icon .admin-input,
.admin-input-with-icon .form-control {
  padding-left: 2.15rem !important;
}

/* Prefixed inputs (short URL, org handle) — single cohesive control */
.admin-input-group {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  width: 100%;
  min-width: 0;
  border: 1px solid var(--admin-border);
  border-radius: var(--admin-radius) !important;
  background: #fff;
  overflow: hidden;
}

.admin-input-group:focus-within {
  border-color: #a8b8e0;
  outline: 2px solid var(--admin-selected);
  outline-offset: 0;
}

.admin-input-group__prefix,
.admin-input-group__suffix {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  padding: 0 0.75rem;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--admin-muted);
  background: #fafaf8;
  white-space: nowrap;
  border: 0;
  border-radius: 0 !important;
}

.admin-input-group__prefix {
  border-right: 1px solid var(--admin-border);
}

.admin-input-group__suffix {
  border-left: 1px solid var(--admin-border);
  min-width: 2.5rem;
  justify-content: center;
  padding-left: 0.55rem;
  padding-right: 0.55rem;
}

.admin-input-group .admin-input,
.admin-input-group .form-control {
  flex: 1 1 auto;
  width: 1% !important;
  min-width: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  background: #fff !important;
}

.admin-input-group .admin-input:focus,
.admin-input-group .form-control:focus {
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

.admin-shell .form-text code,
.admin-field .form-text code {
  color: var(--admin-ink);
  background: #f3f4f6;
  border: 1px solid var(--admin-border);
  border-radius: 4px;
  padding: 0.1rem 0.35rem;
  font-size: 0.8125rem;
}

.admin-status-icon--ok {
  color: #1f6b3a !important;
}

.admin-status-icon--bad {
  color: #991b1b !important;
}

.admin-status-icon--warn {
  color: #92400e !important;
}

.admin-status-icon--muted {
  color: var(--admin-muted) !important;
}

.admin-status-icon--busy {
  color: var(--admin-blue) !important;
}

/* —— Tables —— */
.admin-table-wrap {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--admin-border);
  border-radius: var(--admin-radius) !important;
  background: #fff;
  contain: inline-size;
}

.admin-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
  margin: 0 !important;
  table-layout: auto;
}

.admin-table thead th {
  text-align: left;
  color: var(--admin-muted);
  font-weight: 600;
  font-size: 0.75rem;
  padding: 0.55rem 0.85rem;
  border-bottom: 1px solid var(--admin-border);
  white-space: nowrap;
  background: #fafaf8;
  height: auto;
}

.admin-table tbody td {
  padding: 0.55rem 0.85rem;
  border-bottom: 1px solid #eceae3;
  vertical-align: middle;
  color: var(--admin-ink);
  height: var(--admin-row-h);
  max-width: 16rem;
}

.admin-table tbody td.admin-cell--wrap {
  white-space: normal;
  max-width: 18rem;
}

.admin-table tbody td.admin-cell--clip,
.admin-table .admin-cell--clip {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-table tbody td.admin-cell--nowrap,
.admin-table .admin-nowrap {
  white-space: nowrap;
  max-width: none;
}

.admin-table tbody tr:last-child td {
  border-bottom: none;
}

.admin-table tbody tr:hover {
  background: #fafaf8;
}

.admin-table a.admin-row-link {
  color: inherit;
  text-decoration: none;
}

.admin-table .admin-code {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
  white-space: nowrap;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.8125rem;
}

.admin-table .admin-secondary {
  display: block;
  margin-top: 0.1rem;
  font-size: 0.75rem;
  color: var(--admin-muted);
  line-height: 1.3;
}

.admin-table .admin-num,
.admin-table th.admin-num,
.admin-table td.admin-num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.admin-table .admin-row-action {
  width: 1px;
  white-space: nowrap;
  text-align: right;
  color: var(--admin-muted);
  max-width: none;
}

.admin-row-actions {
  display: inline-flex;
  justify-content: flex-end;
}

.admin-row-actions__trigger {
  min-width: 2rem;
  padding-left: 0.35rem !important;
  padding-right: 0.35rem !important;
  color: var(--admin-muted) !important;
}

.admin-row-actions__trigger:hover,
.admin-row-actions__trigger:focus,
.admin-row-actions__trigger[aria-expanded="true"] {
  color: var(--admin-ink) !important;
  background: #f3f4f6 !important;
}

.admin-row-actions .dropdown-menu {
  min-width: 10.5rem;
  font-size: 0.875rem;
  border: 1px solid var(--admin-border);
  border-radius: var(--admin-radius) !important;
  box-shadow: 0 8px 24px rgba(20, 20, 20, 0.08);
  padding: 0.35rem;
}

.admin-row-actions .dropdown-item {
  border-radius: 6px !important;
  padding: 0.45rem 0.65rem;
  color: var(--admin-ink);
}

.admin-row-actions .dropdown-item:hover,
.admin-row-actions .dropdown-item:focus {
  background: #f3efe6;
  color: var(--admin-ink);
}

.admin-row-actions form.d-grid {
  margin: 0;
}

.admin-row-actions form.d-grid .dropdown-item {
  text-align: left;
  width: 100%;
  border: 0;
  background: transparent;
}

.admin-table-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.75rem 0 0;
  font-size: 0.8rem;
  color: var(--admin-muted);
}

/* Pagination inside admin */
.admin-shell .pagination {
  display: flex !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
}

.admin-shell .pagination .page-link {
  color: var(--admin-blue) !important;
  background: #fff !important;
  border: 1px solid var(--admin-border) !important;
  border-radius: 6px !important;
  padding: 0.35rem 0.65rem !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  min-width: 2rem;
  text-align: center;
}

.admin-shell .pagination .page-item.active .page-link {
  background: var(--admin-blue) !important;
  border-color: var(--admin-blue) !important;
  color: #fff !important;
}

.admin-shell .pagination .page-item.disabled .page-link {
  color: #9ca3af !important;
  background: #f9fafb !important;
}

/* —— Badges —— */
.admin-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.2rem 0.55rem;
  border-radius: 999px !important;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.3;
  box-shadow: none !important;
  white-space: nowrap;
}

.admin-badge__dot {
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 999px;
  background: currentColor;
  flex-shrink: 0;
}

.admin-badge--neutral {
  background: #f3f4f6;
  color: #4b5563;
}

.admin-badge--neutral .admin-badge__dot {
  background: #9ca3af;
}

.admin-badge--success {
  background: #e5f6d8;
  color: #1f6b3a;
}

.admin-badge--success .admin-badge__dot {
  background: #3d9a4a;
}

.admin-badge--warning {
  background: #fff1d6;
  color: #92400e;
}

.admin-badge--warning .admin-badge__dot {
  background: #f59e0b;
}

.admin-badge--danger {
  background: #fee2e2;
  color: #991b1b;
}

.admin-badge--danger .admin-badge__dot {
  background: #ef4444;
}

.admin-badge--info {
  background: var(--admin-selected);
  color: var(--admin-selected-text);
}

.admin-badge--info .admin-badge__dot {
  background: var(--admin-blue);
}

.admin-badge--platform {
  background: #eef2ff;
  color: #3730a3;
}

/* Callout / info banner */
.admin-callout {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.75rem 1rem;
  padding: 0.9rem 1.05rem;
  border-radius: var(--admin-radius) !important;
  margin: 1rem 0 0;
}

.admin-callout--info {
  background: #eef4ff;
  border: 1px solid #c7d7f5;
  color: #1e3a6e;
}

.admin-callout--neutral {
  background: var(--admin-metric-bg);
  border: 1px solid var(--admin-border);
  color: var(--admin-ink);
}

.admin-callout__icon {
  flex-shrink: 0;
  font-size: 1.1rem;
  line-height: 1;
  margin-top: 0.1rem;
}

.admin-callout__body {
  flex: 1 1 12rem;
  min-width: 0;
}

.admin-callout__title {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 700;
}

.admin-callout__text {
  margin: 0.2rem 0 0;
  font-size: 0.8125rem;
  opacity: 0.9;
  line-height: 1.4;
}

.admin-callout__actions {
  flex-shrink: 0;
  align-self: center;
}

/* Side cards (edit publication / tips) */
.admin-side-card {
  background: var(--admin-metric-bg);
  border-radius: var(--admin-radius) !important;
  padding: 1rem 1.1rem;
  margin-bottom: 0.85rem;
}

.admin-side-card--info {
  background: #eef4ff;
  color: #1e3a6e;
}

.admin-side-card__badge {
  margin-bottom: 0.55rem;
}

.admin-side-card__body {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.4;
  color: inherit;
}

.admin-side-card__actions {
  margin-top: 0.75rem;
}

.admin-side-card__title {
  margin: 0 0 0.35rem;
  font-size: 0.9375rem;
  font-weight: 700;
}

/* Sticky save bar for edit forms — edge-to-edge within main content */
.admin-sticky-actions {
  position: sticky;
  bottom: 0;
  z-index: 20;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  width: calc(100% + (2 * var(--admin-content-pad-x, 1.75rem)));
  max-width: none;
  box-sizing: border-box;
  margin: 1.5rem calc(-1 * var(--admin-content-pad-x, 1.75rem)) calc(-1 * var(--admin-content-pad-bottom, 2.5rem));
  padding: 0.85rem var(--admin-content-pad-x, 1.75rem);
  background: var(--admin-sidebar-bg);
  border-top: 1px solid var(--admin-border);
}

.admin-sticky-actions__status {
  font-size: 0.875rem;
  color: var(--admin-muted);
  font-weight: 500;
}

.admin-sticky-actions__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

/* Visibility toggle label — never use brand lime as text */
.admin-visibility-status {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--admin-muted);
}

.admin-visibility-status--visible {
  color: #1f6b3a;
}

.admin-visibility-status--hidden {
  color: var(--admin-muted);
}

.admin-shell .form-switch .form-check-input {
  width: 2.25rem;
  height: 1.15rem;
  margin-top: 0.1rem;
  background-color: #d1d5db;
  border-color: #d1d5db;
  box-shadow: none !important;
}

.admin-shell .form-switch .form-check-input:checked {
  background-color: var(--admin-blue) !important;
  border-color: var(--admin-blue) !important;
}

.admin-shell .form-switch .form-check-input:focus {
  box-shadow: 0 0 0 0.2rem rgba(44, 64, 171, 0.2) !important;
  border-color: var(--admin-blue) !important;
}

.admin-edit-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(14rem, 17rem);
  gap: 1.5rem;
  align-items: start;
  container-type: inline-size;
  container-name: admin-edit;
  overflow: visible;
}

.admin-edit-layout__main {
  min-width: 0;
  overflow: visible;
}

.admin-edit-layout__main .activity-form-container {
  overflow: visible;
}

.admin-edit-layout__aside {
  min-width: 0;
}

/* Break out of the main column so the bar spans layout + content padding */
.admin-edit-layout .admin-sticky-actions {
  width: calc(100cqw + 2 * var(--admin-content-pad-x, 1.75rem));
  margin-left: calc(-1 * var(--admin-content-pad-x, 1.75rem));
  margin-right: calc(-1 * var(--admin-content-pad-x, 1.75rem));
}

@media (max-width: 991.98px) {
  .admin-edit-layout {
    grid-template-columns: 1fr;
  }

  .admin-edit-layout .admin-sticky-actions {
    width: calc(100% + 2 * var(--admin-content-pad-x, 1rem));
  }
}

/* Recent bookings panel (overview) */
.admin-data-panel {
  border: 1px solid var(--admin-border);
  border-radius: var(--admin-radius) !important;
  background: #fff;
  overflow: hidden;
}

.admin-data-panel__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.95rem 1.1rem 0.35rem;
}

.admin-data-panel__toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  padding: 0.5rem 1.1rem 0.85rem;
  align-items: center;
}

.admin-data-panel .admin-table-wrap,
.admin-panel .admin-table-wrap {
  border: 0;
  border-radius: 0 !important;
  background: transparent;
}

.admin-table tbody tr:nth-child(even) {
  background: #fafaf8;
}

/* —— Feedback —— */
.admin-flash {
  border-radius: var(--admin-radius) !important;
  border: 1px solid var(--admin-border);
  padding: 0.75rem 1rem;
  margin-bottom: 1rem;
  font-size: 0.9rem;
}

.admin-flash--notice,
.admin-flash--success {
  background: #f0fdf4;
  border-color: #bbf7d0;
  color: #166534;
}

.admin-flash--alert,
.admin-flash--error {
  background: #fef2f2;
  border-color: #fecaca;
  color: #991b1b;
}

.admin-flash--info {
  background: #eff6ff;
  border-color: #bfdbfe;
  color: #1e40af;
}

.admin-flash--warning {
  background: #fffbeb;
  border-color: #fde68a;
  color: #92400e;
}

/* —— Nested create/edit field groups —— */
.admin-nested-panel {
  border: 1px solid var(--admin-border);
  border-radius: var(--admin-radius) !important;
  background: #fafaf8;
  margin-bottom: 1rem;
  overflow: visible !important;
}

.admin-nested-panel__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--admin-border);
}

.admin-nested-panel__title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--admin-ink);
}

.admin-nested-panel__toggle {
  flex: 1;
  text-align: left;
  background: none;
  border: 0;
  padding: 0;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

.admin-nested-panel__body {
  padding: 1rem;
}

.admin-cost-breakdown {
  border: 1px solid var(--admin-border);
  border-radius: var(--admin-radius) !important;
  background: #fff;
  padding: 1rem;
}

.admin-cost-breakdown__title {
  margin: 0 0 0.85rem;
  font-size: 0.875rem;
  font-weight: 700;
}

.admin-cost-breakdown__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
  text-align: center;
}

.admin-cost-breakdown__value {
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.2;
}

.admin-cost-breakdown__label {
  display: block;
  margin-top: 0.15rem;
  font-size: 0.75rem;
  color: var(--admin-muted);
}

@media (max-width: 767.98px) {
  .admin-cost-breakdown__grid {
    grid-template-columns: 1fr;
  }
}

.admin-form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: space-between;
  align-items: center;
  margin-top: 1.25rem;
}

.admin-form-actions__primary {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

.admin-form-actions__danger {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-left: auto;
}

/* Readable form column — do not stretch fields full-bleed */
.admin-form {
  max-width: 44rem;
  width: 100%;
}

.admin-form--wide {
  max-width: 56rem;
}

.admin-form__section {
  margin-bottom: 1.5rem;
}

.admin-form__section-title {
  margin: 0 0 0.75rem;
  font-size: 1rem;
  font-weight: 700;
  color: var(--admin-ink);
}

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

.admin-form-grid .admin-field--full {
  grid-column: 1 / -1;
}

.admin-panel__body {
  padding: 1rem 1.15rem;
}

.admin-pricing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
  gap: 0.65rem;
}

.admin-pricing-card {
  border: 1px solid var(--admin-border);
  border-radius: var(--admin-radius) !important;
  padding: 0.75rem 0.85rem;
  background: #fff;
}

.admin-pricing-card__name {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 700;
}

.admin-pricing-card__price {
  margin: 0.15rem 0 0;
  font-size: 1rem;
  font-weight: 700;
}

.admin-pricing-card__meta {
  margin: 0.35rem 0 0;
  font-size: 0.75rem;
  color: var(--admin-muted);
  line-height: 1.35;
}

.admin-shell .admin-panel,
.admin-shell .activity-form-container,
.admin-shell .dropdown,
.admin-shell .btn-group {
  overflow: visible !important;
}

.admin-empty {
  text-align: center;
  padding: 2rem 1rem;
  color: var(--admin-muted);
  border: 1px dashed var(--admin-border);
  border-radius: var(--admin-radius) !important;
}

.admin-empty__title {
  margin: 0 0 0.35rem;
  font-weight: 700;
  color: var(--admin-ink);
}

/* —— Event local tabs —— */
.admin-local-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem;
  font-size: 0.875rem;
  color: var(--admin-muted);
  border-bottom: 1px solid var(--admin-border);
  padding-bottom: 0;
  margin: 0 0 1.25rem;
}

.admin-local-tabs a {
  color: var(--admin-muted);
  text-decoration: none !important;
  padding: 0.5rem 0.15rem 0.65rem;
  border-bottom: 2px solid transparent;
  font-weight: 500;
}

.admin-local-tabs a:hover {
  color: var(--admin-ink);
}

.admin-local-tabs a.is-active {
  color: var(--admin-ink);
  font-weight: 700;
  border-bottom-color: var(--admin-ink);
}

.admin-local-tabs a:focus-visible {
  outline: 2px solid var(--admin-blue);
  outline-offset: 2px;
}

/* Soften legacy admin chrome when inside shell */
.admin-shell .btn-primary,
.admin-shell .btn-primary:hover,
.admin-shell .btn-primary:focus {
  background: var(--admin-lime) !important;
  color: var(--admin-ink) !important;
  border-color: #d4e07a !important;
  box-shadow: none !important;
}

.admin-shell .btn-outline-primary {
  color: var(--admin-blue) !important;
  border-color: var(--admin-border) !important;
  background: #fff !important;
}

.admin-shell .btn-outline-primary:hover {
  background: #f8fafc !important;
}

.admin-shell .page-header {
  background: transparent !important;
  color: inherit !important;
  padding: 0 0 1rem !important;
  margin: 0 0 1rem !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.admin-shell .page-header h1,
.admin-shell .page-header .opacity-75,
.admin-shell .page-header a,
.admin-shell .page-header .breadcrumb-item,
.admin-shell .page-header .breadcrumb-item a {
  color: var(--admin-ink) !important;
}

.admin-shell .page-header .opacity-75 {
  color: var(--admin-muted) !important;
  opacity: 1 !important;
}

.admin-shell .bracket-border::before,
.admin-shell .bracket-border::after {
  display: none !important;
}

.admin-shell .profile-highlight-card,
.admin-shell .card {
  border: 1px solid var(--admin-border) !important;
  border-radius: var(--admin-radius) !important;
  box-shadow: none !important;
  background: #fff !important;
}

.admin-shell .stats-overview-tile {
  background: var(--admin-metric-bg) !important;
  border-radius: var(--admin-radius) !important;
  color: var(--admin-ink) !important;
}

.admin-shell .stats-overview-tile h3,
.admin-shell .stats-overview-tile h6,
.admin-shell .stats-overview-tile .text-white,
.admin-shell .stats-overview-tile i {
  color: var(--admin-ink) !important;
}

.admin-topbar-user {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.admin-topbar-user .app-nav-avatar {
  width: 2rem;
  height: 2rem;
  font-size: 0.8rem;
}

.admin-scope-note {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.2rem 0.55rem;
  border-radius: 999px !important;
  background: #eef2ff;
  color: #3730a3;
}

.admin-scope-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.85rem;
  padding: 0.55rem 0.85rem;
  margin-bottom: 1rem;
  border: 1px solid #c7d2fe;
  border-radius: var(--admin-radius) !important;
  background: #eef2ff;
  color: #312e81;
  font-size: 0.8125rem;
  line-height: 1.4;
}

.admin-scope-banner strong {
  font-weight: 700;
}

/* Env banner sits above sticky nav — account for it when present */
body.admin-workspace:has(.admin-env-banner) > nav.navbar {
  top: 0;
}

/* —— Responsive —— */
@media (max-width: 991.98px) {
  .admin-sidebar {
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    transform: translateX(-105%);
    transition: transform 0.2s ease;
    box-shadow: none;
    z-index: 60;
  }

  .admin-sidebar.is-open {
    transform: translateX(0);
    box-shadow: 8px 0 24px rgba(0, 0, 0, 0.12);
  }

  .admin-sidebar__close {
    display: block;
  }

  .admin-sidebar-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    background: rgba(20, 20, 20, 0.4);
    z-index: 35;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
  }

  .admin-sidebar-backdrop.is-open {
    opacity: 1;
    pointer-events: auto;
  }

  body.admin-sidebar-open {
    overflow: hidden;
  }

  .admin-shell__content {
    --admin-content-pad-x: 1rem;
    --admin-content-pad-bottom: 2rem;
    padding: 1.15rem var(--admin-content-pad-x) var(--admin-content-pad-bottom);
  }

  .admin-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  .admin-form-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 575.98px) {
  .admin-metrics {
    grid-template-columns: 1fr;
  }

  .admin-upcoming {
    align-items: flex-start;
  }

  .admin-page-title {
    font-size: 1.5rem;
  }

  .admin-shell__content {
    --admin-content-pad-x: 0.85rem;
    --admin-content-pad-bottom: 2rem;
    padding: 1rem var(--admin-content-pad-x) var(--admin-content-pad-bottom);
  }
}

/* —— Event wizard —— */
.admin-event-wizard {
  padding-bottom: 0;
}

.admin-wizard-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-top: 1.5rem;
  padding-top: 1rem;
  border-top: 1px solid var(--admin-border);
}

.admin-wizard-actions__nav {
  min-width: 0;
}

.admin-wizard-actions__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-left: auto;
}

/* Wizard actions stay in document flow — never sticky/fixed */
.admin-event-wizard .admin-sticky-actions {
  position: static;
  width: 100%;
  margin: 1.5rem 0 0;
  padding: 1rem 0 0;
  background: transparent;
  border-top: 1px solid var(--admin-border);
  z-index: auto;
}

.admin-wizard-stepper {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1rem;
  margin-bottom: 1.35rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid var(--admin-border);
}

.admin-wizard-stepper__item {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  border: 0;
  background: transparent;
  color: var(--admin-muted);
  font-size: 0.9rem;
  font-weight: 500;
  padding: 0.25rem 0;
}

.admin-wizard-stepper__item.is-active {
  color: var(--admin-ink);
  font-weight: 700;
}

.admin-wizard-stepper__item.is-complete {
  color: var(--admin-blue);
}

.admin-wizard-stepper__index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 999px;
  border: 1.5px solid var(--admin-border);
  font-size: 0.8rem;
  font-weight: 700;
}

.admin-wizard-stepper__item.is-active .admin-wizard-stepper__index {
  background: var(--admin-selected);
  border-color: var(--admin-selected);
  color: var(--admin-selected-text);
}

.admin-wizard-stepper__item.is-complete .admin-wizard-stepper__index {
  background: var(--admin-blue);
  border-color: var(--admin-blue);
  color: #fff;
}

.admin-event-wizard__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(15rem, 18rem);
  gap: 1.5rem;
  align-items: start;
}

.admin-event-wizard__main {
  min-width: 0;
}

.admin-event-wizard__aside {
  position: sticky;
  top: calc(var(--admin-header-height) + 1rem);
}

.admin-event-summary {
  border: 1px solid var(--admin-border);
  border-radius: var(--admin-radius);
  background: #fff;
  padding: 1.1rem 1.15rem;
}

.admin-event-summary__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.65rem;
}

.admin-event-summary__eyebrow {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--admin-muted);
}

.admin-event-summary__title {
  margin: 0 0 0.35rem;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.25;
}

.admin-event-summary__desc {
  margin: 0 0 1rem;
  font-size: 0.875rem;
  color: var(--admin-muted);
}

.admin-event-summary__meta {
  list-style: none;
  margin: 0 0 1rem;
  padding: 0;
  display: grid;
  gap: 0.55rem;
  font-size: 0.875rem;
}

.admin-event-summary__meta li {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
}

.admin-event-summary__meta i {
  color: var(--admin-muted);
  margin-top: 0.1rem;
}

.admin-event-summary__section {
  padding-top: 0.85rem;
  border-top: 1px solid var(--admin-border);
  margin-top: 0.85rem;
}

.admin-event-summary__section-label {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--admin-muted);
  margin-bottom: 0.35rem;
}

.admin-event-summary__ticket {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  font-size: 0.875rem;
  margin-bottom: 0.25rem;
}

.admin-event-summary__published {
  margin-top: 1rem;
  padding-top: 0.85rem;
  border-top: 1px solid var(--admin-border);
}

.admin-cover-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 1rem;
}

.admin-cover-upload {
  border: 1px dashed var(--admin-border);
  border-radius: var(--admin-radius);
  background: #fafaf8;
  padding: 0.75rem;
}

.admin-cover-upload__placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  color: var(--admin-muted);
  font-size: 0.8rem;
  min-height: 7rem;
}

.admin-cover-upload--square .admin-cover-upload__placeholder,
.admin-cover-upload--square .admin-cover-upload__preview {
  aspect-ratio: 1 / 1;
  width: 100%;
  max-width: 10rem;
  object-fit: cover;
  border-radius: 6px;
}

.admin-cover-upload--landscape .admin-cover-upload__placeholder,
.admin-cover-upload--landscape .admin-cover-upload__preview {
  aspect-ratio: 16 / 9;
  width: 100%;
  object-fit: cover;
  border-radius: 6px;
}

.admin-advanced-toggle {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border: 1px solid var(--admin-border);
  border-radius: var(--admin-radius);
  background: #fff;
  padding: 0.75rem 0.9rem;
  text-align: left;
}

.admin-advanced-toggle strong {
  display: block;
  font-size: 0.9rem;
}

.admin-fee-payer__options,
.admin-visibility-options {
  display: grid;
  gap: 0.65rem;
}

.admin-fee-payer__option,
.admin-visibility-option {
  display: flex;
  gap: 0.65rem;
  align-items: flex-start;
  border: 1px solid var(--admin-border);
  border-radius: var(--admin-radius);
  padding: 0.75rem 0.9rem;
  margin: 0;
  cursor: pointer;
}

.admin-fee-payer__option:has(input:checked),
.admin-visibility-option:has(input:checked) {
  border-color: #9db0e8;
  background: #f5f8ff;
}

.admin-date-summary {
  border: 1px solid var(--admin-border);
  border-radius: var(--admin-radius);
  padding: 0.75rem 0.9rem;
  background: #fafaf8;
}

.admin-date-summary__title {
  font-size: 0.8rem;
  font-weight: 700;
  margin-bottom: 0.45rem;
}

.admin-date-summary__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.35rem;
}

.admin-date-summary__list li {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  font-size: 0.875rem;
}

.admin-venue-card {
  border: 1px solid var(--admin-border);
  border-radius: var(--admin-radius);
  padding: 0.75rem 0.9rem;
  background: #f8fafc;
}

@media (max-width: 991.98px) {
  .admin-event-wizard__layout {
    grid-template-columns: 1fr;
  }

  .admin-event-wizard__aside {
    position: static;
    order: -1;
  }

  .admin-event-summary {
    padding: 0.85rem 1rem;
  }

  .admin-event-summary__desc,
  .admin-event-summary__section {
    display: none;
  }

  .admin-cover-grid {
    grid-template-columns: 1fr;
  }
}
/* Signed-in app nav: org switcher + user menu */

.app-nav-tools {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  flex-wrap: wrap;
}

.app-nav-divider {
  display: none;
  width: 1px;
  height: 1.35rem;
  background: #d4d4d4;
  flex-shrink: 0;
}

@media (min-width: 992px) {
  .app-nav-divider {
    display: block;
  }
}

/* Organization switcher — bordered pill */
.app-nav-org {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  max-width: 12rem;
  padding: 0.4rem 0.7rem 0.4rem 0.85rem;
  border: 1.5px solid #d4d4d4;
  border-radius: 10px;
  background: #fff;
  color: #141414 !important;
  font-weight: 600;
  font-size: 0.95rem;
  line-height: 1.2;
  text-decoration: none !important;
  white-space: nowrap;
  box-shadow: none !important;
}

.app-nav-org:hover,
.app-nav-org:focus,
.app-nav-org.show {
  border-color: #141414;
  color: #141414 !important;
  background: #fff;
}

.app-nav-org-name {
  overflow: hidden;
  text-overflow: ellipsis;
}

.app-nav-org::after,
.app-nav-user::after {
  display: none !important; /* replace Bootstrap caret */
}

.app-nav-chevron {
  flex-shrink: 0;
  font-size: 0.7rem;
  opacity: 0.7;
  line-height: 1;
}

/* User menu — avatar + name */
.app-nav-user {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.2rem 0.15rem;
  color: #141414 !important;
  font-weight: 600;
  font-size: 0.95rem;
  line-height: 1.2;
  text-decoration: none !important;
  white-space: nowrap;
  box-shadow: none !important;
  border: none !important;
  background: transparent !important;
}

.app-nav-user:hover,
.app-nav-user:focus,
.app-nav-user.show {
  color: #141414 !important;
  opacity: 0.85;
}

.app-nav-avatar {
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50% !important; /* override global square reset in custom.css.scss */
  background: #c9dbff;
  color: #141414;
  font-weight: 700;
  font-size: 0.85rem;
  letter-spacing: 0;
  line-height: 1;
}

.app-nav-user-name {
  max-width: 9rem;
  overflow: hidden;
  text-overflow: ellipsis;
}

.app-nav-dropdown {
  border: 1.5px solid #e5e5e5 !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(20, 20, 20, 0.08) !important;
  padding: 0.4rem 0 !important;
  min-width: 12rem;
  margin-top: 0.4rem !important;
}

.app-nav-dropdown .dropdown-item {
  font-size: 0.92rem;
  font-weight: 500;
  color: #141414;
  padding: 0.55rem 1rem;
}

.app-nav-dropdown .dropdown-item:hover,
.app-nav-dropdown .dropdown-item:focus {
  background: #f7f4ec;
  color: #141414;
}

.app-nav-dropdown .dropdown-item-text {
  padding: 0.55rem 1rem;
  font-size: 0.92rem;
}

.app-nav-dropdown .dropdown-divider {
  margin: 0.35rem 0;
  border-color: #ececec;
}

/* Keep "My bookings" aligned with tools on large screens */
.navbar-nav.app-nav-end {
  gap: 0.85rem;
}

.navbar-nav.app-nav-end > .nav-item > .nav-link {
  font-weight: 500;
  color: #141414 !important;
}

@media (max-width: 991.98px) {
  .app-nav-tools {
    width: 100%;
    padding-top: 0.5rem;
    flex-direction: column;
    align-items: stretch;
    gap: 0.65rem;
  }

  .app-nav-org,
  .app-nav-user {
    width: 100%;
    justify-content: space-between;
    max-width: none;
  }

  .app-nav-user {
    padding: 0.4rem 0;
  }
}
/* Auth (sign in) — matches booking-access / marketing look */

body.auth-flow {
  --mkt-sky: #c9dbff;
  --mkt-lavender: #d8d2f0;
  --mkt-mint: #e1ef96;
  --mkt-cream: #f7f4ec;
  --mkt-lime: #e1ef96;
  --mkt-forest: #0d3d38;
  --mkt-ink: #141414;
  --mkt-muted: #3a3a3a;
  --mkt-blue: #2c40ab;
  --mkt-font: "Galano Grotesque", system-ui, sans-serif;
  background: var(--mkt-cream) !important;
}

body.auth-flow main {
  padding: 0 !important;
  max-width: none !important;
  overflow-x: clip;
}

body.auth-flow .marketing-nav {
  background: #fff !important;
  border-bottom: none !important;
  padding: 0.85rem 0 !important;
}

body.auth-flow .marketing-nav .container {
  max-width: 1120px;
}

body.auth-flow .marketing-nav .nav-link {
  color: var(--mkt-ink) !important;
  font-weight: 500 !important;
  padding: 0.5rem 0.85rem !important;
}

body.auth-flow .marketing-nav .nav-link.auth-nav-active {
  font-weight: 600 !important;
  text-decoration: none !important;
  box-shadow: inset 0 -3px 0 0 var(--mkt-lime);
}

body.auth-flow a.marketing-btn-lime,
body.auth-flow .marketing-btn-lime,
body.auth-flow .nav-link.marketing-btn-lime {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.15rem;
  background: var(--mkt-lime) !important;
  color: var(--mkt-ink) !important;
  border-radius: 999px !important;
  padding: 0.6rem 1.25rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border: none !important;
  white-space: nowrap;
  box-shadow: none !important;
  transition: transform 0.15s ease, filter 0.15s ease;
}

body.auth-flow a.marketing-btn-lime:hover,
body.auth-flow .marketing-btn-lime:hover {
  filter: brightness(0.96);
  transform: translateY(-1px);
  color: var(--mkt-ink) !important;
}

.auth-page {
  font-family: var(--mkt-font);
  color: var(--mkt-ink);
  min-height: calc(100vh - 5rem);
  display: flex;
  flex-direction: column;
}

.auth-wrap {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 1.25rem;
  width: 100%;
}

/* Full-width account form (no left copy column) */
.auth-wrap--form {
  max-width: 720px;
}

.auth-page:has(.auth-wrap--form) .auth-main {
  align-items: flex-start;
}

.auth-form-header {
  margin-bottom: 1.5rem;
}

.auth-title--form {
  font-size: clamp(1.85rem, 3.5vw, 2.4rem);
  margin-bottom: 0.5rem;
}

.auth-lead--form {
  margin-bottom: 0;
  max-width: 36rem;
}

.auth-panel--wide {
  width: 100%;
  max-width: none;
}

.auth-ticket--account {
  --tear-from-bottom: 6.1rem;
}

.auth-main {
  flex: 1;
  display: flex;
  align-items: center;
  padding: 2.75rem 0 3.5rem;
}

.auth-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem 3rem;
  align-items: center;
}

.auth-eyebrow {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mkt-ink);
  margin: 0 0 1rem;
}

.auth-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: clamp(2.2rem, 4.5vw, 3.2rem);
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--mkt-ink) !important;
  margin: 0 0 0.85rem;
}

.auth-lead {
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--mkt-muted);
  margin: 0 0 1.75rem;
}

.auth-illo {
  width: min(380px, 92%);
  margin: 0.25rem 0 1.75rem;
  animation: auth-illo-in 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.auth-illo img {
  display: block;
  width: 100%;
  height: auto;
}

/* Tall theater facade for beta waitlist (transparent PNG) */
.auth-illo--theater {
  width: min(320px, 85%);
  margin-top: 0.75rem;
  margin-left: auto;
  margin-right: auto;
}

.auth-illo--theater img {
  display: block;
  width: 100%;
  height: auto;
  background: transparent;
  margin: 0 auto;
}

@keyframes auth-illo-in {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.96);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.auth-side-prompt {
  margin: 0 0 0.35rem;
  font-weight: 700;
  font-size: 1rem;
  color: var(--mkt-ink);
}

.auth-side-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-weight: 700;
  color: var(--mkt-blue) !important;
  text-decoration: none;
}

.auth-side-link:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.auth-n-arrow,
.n-arrow {
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
}

.auth-panel {
  background: var(--mkt-sky);
  border-radius: 28px !important;
  padding: 2rem 1.65rem;
  box-shadow: none !important;
  animation: auth-panel-in 0.65s cubic-bezier(0.22, 1, 0.36, 1) 0.08s both;
}

@keyframes auth-panel-in {
  from {
    opacity: 0;
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.auth-ticket {
  --notch: 14px;
  /* Breathing room around the perforated tear — never let copy sit on the dashes */
  --tear-gap-above: 1.25rem;
  --tear-gap-below: 1.65rem;
  /* stub: button + join row + ticket bottom padding */
  --tear-from-bottom: 9.2rem;
  position: relative;
  background: #fff;
  border: 2.5px solid var(--mkt-ink) !important;
  border-radius: 18px !important;
  padding: 1.75rem 1.5rem 1.35rem;
  box-shadow: none !important;
  -webkit-mask-image:
    radial-gradient(circle var(--notch) at 0% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%),
    radial-gradient(circle var(--notch) at 100% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%);
  -webkit-mask-position: left, right;
  -webkit-mask-size: 51.5% 100%;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-composite: source-over;
  mask-image:
    radial-gradient(circle var(--notch) at 0% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%),
    radial-gradient(circle var(--notch) at 100% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%);
  mask-position: left, right;
  mask-size: 51.5% 100%;
  mask-repeat: no-repeat;
  mask-composite: add;
}

.auth-ticket::after {
  content: "";
  position: absolute;
  left: 1.25rem;
  right: 1.25rem;
  bottom: var(--tear-from-bottom);
  border-top: 1.5px dashed rgba(20, 20, 20, 0.28);
  pointer-events: none;
}

.auth-form-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: 1.55rem;
  letter-spacing: -0.02em;
  color: var(--mkt-ink) !important;
  margin: 0 0 0.4rem;
}

.auth-form-desc {
  font-size: 0.95rem;
  line-height: 1.5;
  color: #6b7280;
  margin: 0 0 var(--tear-gap-above);
}

/* Confirmation / single-CTA stubs (no join row) — retarget the tear */
.auth-ticket--sent {
  --tear-from-bottom: 6.1rem;
}

.auth-ticket--sent > .auth-form-desc {
  margin-bottom: var(--tear-gap-above);
}

.auth-alert {
  border-radius: 12px !important;
  margin-bottom: 1rem;
  font-size: 0.92rem;
}

.auth-field {
  margin-bottom: 1rem;
}

.auth-field-hint {
  margin: 0.4rem 0 0;
  font-size: 0.85rem;
  color: #6b7280;
}

.auth-choice-group {
  border: 0;
  padding: 0;
  margin: 0 0 1rem;
  min-width: 0;
}

.auth-choice-group > legend.auth-label {
  float: left;
  width: 100%;
  padding: 0;
  margin-bottom: 0.35rem;
}

.auth-choice-group::after {
  content: "";
  display: table;
  clear: both;
}

.auth-choice-group > .auth-field-hint {
  margin: 0 0 0.75rem;
}

.auth-choices {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.auth-choice {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0;
  padding: 0.65rem 0.85rem;
  background: #fff;
  border: 1.5px solid #d4d4d4;
  border-radius: 10px;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.auth-choice:has(.auth-choice-input:checked) {
  border-color: var(--mkt-ink);
  background: #f7f8fc;
}

.auth-choice:hover {
  border-color: #a8a8a8;
}

.auth-choice-input {
  width: 1.05rem;
  height: 1.05rem;
  margin: 0;
  accent-color: var(--mkt-ink);
  flex-shrink: 0;
}

.auth-choice-text {
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--mkt-ink);
}

/* Field / section immediately above the stub (forms without .auth-row) */
.auth-ticket .auth-field:has(+ .auth-stub),
.auth-ticket .auth-section:has(+ .auth-stub),
.auth-ticket .auth-callout:has(+ .auth-stub) {
  margin-bottom: var(--tear-gap-above);
}

.auth-label {
  display: block;
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--mkt-ink);
  margin-bottom: 0.4rem;
}

.auth-input {
  display: block;
  width: 100%;
  font-family: var(--mkt-font) !important;
  font-size: 1rem;
  color: var(--mkt-ink);
  background: #fff !important;
  border: 1.5px solid #d4d4d4 !important;
  border-radius: 10px !important;
  padding: 0.7rem 0.9rem !important;
  box-shadow: none !important;
  transition: border-color 0.15s ease;
}

textarea.auth-input {
  min-height: 5.5rem;
  resize: vertical;
}

select.auth-input,
select.auth-select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23141414' d='M1.4.6 6 5.2 10.6.6 12 2 6 8 0 2z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.9rem center;
  background-size: 12px 8px;
  padding-right: 2.5rem !important;
  cursor: pointer;
}

.auth-input::placeholder {
  color: #9ca3af;
}

.auth-input:focus {
  outline: none;
  border-color: var(--mkt-ink) !important;
  box-shadow: none !important;
}

.auth-password-wrap {
  position: relative;
}

.auth-password-wrap .auth-input {
  padding-right: 2.75rem !important;
}

.auth-password-toggle {
  position: absolute;
  right: 0.65rem;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none !important;
  padding: 0.25rem;
  color: var(--mkt-muted);
  cursor: pointer;
  line-height: 1;
  box-shadow: none !important;
}

.auth-password-toggle:hover {
  color: var(--mkt-ink);
}

.auth-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin: 0.15rem 0 var(--tear-gap-above);
}

.auth-check {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.9rem;
  color: var(--mkt-muted);
  margin: 0;
  cursor: pointer;
}

.auth-check input {
  width: 1rem;
  height: 1rem;
  accent-color: var(--mkt-ink);
  cursor: pointer;
}

.auth-text-link,
button.auth-text-link {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--mkt-blue) !important;
  text-decoration: none;
  background: none;
  border: none !important;
  padding: 0;
  box-shadow: none !important;
  cursor: pointer;
}

.auth-text-link:hover,
button.auth-text-link:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.auth-stub {
  padding-top: var(--tear-gap-below);
}

body.auth-flow .auth-submit,
body.auth-flow a.auth-submit,
body.auth-flow button.auth-submit {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.4rem;
  width: 100%;
  margin: 0;
  background: var(--mkt-lime) !important;
  color: var(--mkt-ink) !important;
  border: none !important;
  border-radius: 999px !important;
  padding: 0.85rem 1.35rem !important;
  font-family: var(--mkt-font) !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  box-shadow: none !important;
  cursor: pointer;
  transition: transform 0.15s ease, filter 0.15s ease;
}

body.auth-flow .auth-submit:hover,
body.auth-flow a.auth-submit:hover,
body.auth-flow button.auth-submit:hover {
  filter: brightness(0.96);
  transform: translateY(-1px);
  color: var(--mkt-ink) !important;
}

.auth-join {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  margin-top: 1.15rem;
  color: var(--mkt-muted);
  font-size: 0.92rem;
}

.auth-join::before,
.auth-join::after {
  content: "";
  flex: 1;
  border-top: 1px solid rgba(20, 20, 20, 0.18);
}

.auth-join-link {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  white-space: nowrap;
  color: var(--mkt-ink);
  font-weight: 500;
  text-decoration: none;
}

.auth-join-link strong {
  font-weight: 700;
  color: var(--mkt-ink);
}

.auth-join-link:hover {
  color: var(--mkt-blue);
}

.auth-join-link:hover strong {
  color: var(--mkt-blue);
}

.auth-back {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: 1.25rem;
  font-weight: 600;
  color: var(--mkt-ink);
  text-decoration: none;
  transition: opacity 0.15s ease;
}

.auth-back:hover {
  color: var(--mkt-ink);
  opacity: 0.7;
}

.auth-invite {
  margin: 0 0 1rem;
  padding: 0.85rem 1rem;
  background: #eef3ff;
  border-radius: 12px !important;
  font-size: 0.9rem;
  color: var(--mkt-muted);
  line-height: 1.4;
}

.auth-invite strong {
  color: var(--mkt-ink);
}

/* Account settings / longer auth forms */
.auth-section {
  margin: 1.35rem 0 0;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(20, 20, 20, 0.12);
}

.auth-section:first-of-type {
  margin-top: 0.35rem;
  padding-top: 0;
  border-top: none;
}

.auth-section-title {
  font-family: var(--mkt-font) !important;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mkt-ink);
  margin: 0 0 0.85rem;
}

.auth-static {
  font-size: 1rem;
  font-weight: 600;
  color: var(--mkt-ink);
  line-height: 1.4;
}

.auth-static a {
  color: var(--mkt-blue);
  font-weight: 600;
  text-decoration: none;
}

.auth-static a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.auth-callout {
  margin: 0 0 1rem;
  padding: 0.85rem 1rem;
  background: #eef3ff;
  border-radius: 12px !important;
  font-size: 0.9rem;
  color: var(--mkt-muted);
  line-height: 1.45;
}

.auth-callout--ok {
  background: #e8f5e9;
  color: var(--mkt-forest);
}

.auth-callout--warn {
  background: #fff6e5;
  color: #7a4e00;
}

.auth-callout--danger {
  background: #fdecea;
  color: #8a1f11;
}

.auth-callout strong {
  color: inherit;
}

.auth-code-block {
  margin-top: 0.65rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.9rem;
  letter-spacing: 0.04em;
}

.auth-code-block code {
  display: block;
  padding: 0.2rem 0;
}

.auth-email-swap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  margin: 0 0 1rem;
}

.auth-email-swap-item {
  padding: 0.85rem 1rem;
  background: #f7f4ec;
  border-radius: 12px !important;
}

.auth-email-swap-label {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #6b7280;
  margin-bottom: 0.35rem;
}

.auth-email-swap-value {
  font-weight: 700;
  color: var(--mkt-ink);
  word-break: break-word;
}

.auth-email-swap-value--new {
  color: var(--mkt-blue);
}

.auth-option {
  display: block;
  width: 100%;
  text-align: left;
  margin: 0 0 0.65rem;
  padding: 1rem 1.1rem;
  background: #fff;
  border: 1.5px solid #d4d4d4 !important;
  border-radius: 14px !important;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
  box-shadow: none !important;
}

.auth-option:hover {
  border-color: var(--mkt-ink) !important;
}

.auth-option.is-selected,
.auth-option.selected {
  border-color: var(--mkt-ink) !important;
  background: #f7f4ec;
}

.auth-option-title {
  display: block;
  font-weight: 700;
  color: var(--mkt-ink);
  margin-bottom: 0.15rem;
}

.auth-option-desc {
  display: block;
  font-size: 0.88rem;
  color: #6b7280;
  line-height: 1.4;
}

.auth-option-badge {
  display: inline-block;
  margin-top: 0.45rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--mkt-ink);
  background: var(--mkt-lime);
  border-radius: 999px;
  padding: 0.2rem 0.55rem;
}

.auth-qr {
  display: flex;
  justify-content: center;
  margin: 0 0 1rem;
}

.auth-qr-frame {
  padding: 0.85rem;
  background: #f7f4ec;
  border-radius: 14px !important;
}

.auth-actions-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-top: 0.85rem;
}

body.auth-flow .auth-submit--ghost,
body.auth-flow a.auth-submit--ghost,
body.auth-flow button.auth-submit--ghost {
  background: transparent !important;
  color: var(--mkt-ink) !important;
  border: 1.5px solid var(--mkt-ink) !important;
}

body.auth-flow .auth-submit--ghost:hover,
body.auth-flow a.auth-submit--ghost:hover,
body.auth-flow button.auth-submit--ghost:hover {
  background: rgba(20, 20, 20, 0.04) !important;
  filter: none;
  transform: translateY(-1px);
  color: var(--mkt-ink) !important;
}

body.auth-flow .auth-submit--danger,
body.auth-flow a.auth-submit--danger,
body.auth-flow button.auth-submit--danger {
  background: #fdecea !important;
  color: #8a1f11 !important;
}

body.auth-flow .auth-submit--danger:hover,
body.auth-flow a.auth-submit--danger:hover,
body.auth-flow button.auth-submit--danger:hover {
  filter: brightness(0.97);
  color: #8a1f11 !important;
}

/* Stub with primary + secondary / dual actions */
.auth-ticket--dual {
  --tear-from-bottom: 10.4rem;
}

.auth-stub-stack {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

@media (max-width: 560px) {
  .auth-email-swap {
    grid-template-columns: 1fr;
  }
}

.auth-footer {
  background: var(--mkt-forest) !important;
  color: #fff;
  padding: 2rem 0;
  margin-top: auto;
}

.auth-footer-inner {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}

.auth-footer-links {
  display: flex;
  gap: 0.5rem 1.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.auth-footer-links a {
  color: #fff !important;
  text-decoration: none;
  font-weight: 500;
}

.auth-footer-links a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (max-width: 900px) {
  .auth-main {
    padding: 2rem 0 3rem;
  }

  .auth-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .auth-copy {
    text-align: center;
  }

  .auth-lead {
    margin-left: auto;
    margin-right: auto;
  }

  .auth-illo {
    margin-left: auto;
    margin-right: auto;
  }

  .auth-panel {
    padding: 1.5rem 1.15rem;
    border-radius: 22px !important;
  }

  .auth-ticket {
    --notch: 11px;
    --tear-from-bottom: 9rem;
    padding: 1.4rem 1.15rem 1.2rem;
  }
}

@media (max-width: 420px) {
  .auth-ticket {
    --notch: 0px;
    -webkit-mask-image: none;
    mask-image: none;
  }

  .auth-ticket::after {
    display: none;
  }
}
/* Find-your-bookings / booking access — matches marketing look
   Use !important on radius/shadow to beat global square-design resets */

body.booking-access {
  --mkt-sky: #c9dbff;
  --mkt-lavender: #d8d2f0;
  --mkt-mint: #e1ef96;
  --mkt-cream: #f7f4ec;
  --mkt-lime: #e1ef96;
  --mkt-forest: #0d3d38;
  --mkt-ink: #141414;
  --mkt-muted: #3a3a3a;
  --mkt-blue: #2c40ab;
  --mkt-font: "Galano Grotesque", system-ui, sans-serif;
  background: var(--mkt-cream) !important;
}

body.booking-access main {
  padding: 0 !important;
  max-width: none !important;
  overflow-x: clip;
}

body.booking-access .marketing-nav {
  background: #fff !important;
  border-bottom: none !important;
  padding: 0.85rem 0 !important;
}

body.booking-access .marketing-nav .container {
  max-width: 1120px;
}

body.booking-access .marketing-nav .nav-link {
  color: var(--mkt-ink) !important;
  font-weight: 500 !important;
  padding: 0.5rem 0.85rem !important;
}

body.booking-access .marketing-nav .nav-link.ba-nav-active {
  font-weight: 600 !important;
  text-decoration: none !important;
  box-shadow: inset 0 -3px 0 0 var(--mkt-lime);
}

body.booking-access a.marketing-btn-lime,
body.booking-access .marketing-btn-lime,
body.booking-access .nav-link.marketing-btn-lime {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.15rem;
  background: var(--mkt-lime) !important;
  color: var(--mkt-ink) !important;
  border-radius: 999px !important;
  padding: 0.6rem 1.25rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border: none !important;
  white-space: nowrap;
  box-shadow: none !important;
  transition: transform 0.15s ease, filter 0.15s ease;
}

body.booking-access a.marketing-btn-lime:hover,
body.booking-access .marketing-btn-lime:hover,
body.booking-access .nav-link.marketing-btn-lime:hover {
  filter: brightness(0.96);
  transform: translateY(-1px);
  color: var(--mkt-ink) !important;
}

/* —— Page shell —— */
.ba-page {
  font-family: var(--mkt-font);
  color: var(--mkt-ink);
  min-height: calc(100vh - 5rem);
  display: flex;
  flex-direction: column;
}

.ba-wrap {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 1.25rem;
  width: 100%;
}

.ba-main {
  flex: 1;
  display: flex;
  align-items: center;
  padding: 3.5rem 0 4rem;
}

.ba-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem 3rem;
  align-items: center;
}

/* —— Left copy + illustration —— */
.ba-eyebrow {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mkt-ink);
  margin: 0 0 1rem;
}

.ba-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: clamp(2.4rem, 4.8vw, 3.4rem);
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--mkt-ink) !important;
  margin: 0 0 1rem;
}

.ba-lead {
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--mkt-muted);
  margin: 0 0 2.25rem;
  max-width: 28rem;
}

.ba-illo {
  position: relative;
  width: min(320px, 92%);
  margin: 0.5rem auto 0;
  animation: ba-illo-in 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.ba-illo-img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 4px;
  object-fit: cover;
}

@keyframes ba-illo-in {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.96);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* —— Right form panel —— */
.ba-panel {
  background: var(--mkt-sky);
  border-radius: 28px !important;
  padding: 2.25rem 1.75rem;
  box-shadow: none !important;
  animation: ba-panel-in 0.65s cubic-bezier(0.22, 1, 0.36, 1) 0.08s both;
}

@keyframes ba-panel-in {
  from {
    opacity: 0;
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.ba-form-ticket {
  --notch: 14px;
  /* Breathing room around the perforated tear */
  --tear-gap-above: 1.25rem;
  --tear-gap-below: 1.75rem;
  /* Stub zone: gap-below + email/button/hint (+ ticket bottom padding) */
  --tear-from-bottom: 15.1rem;
  position: relative;
  background: #fff;
  border: 2.5px solid var(--mkt-ink) !important;
  border-radius: 18px !important;
  padding: 1.75rem 1.5rem 1.35rem;
  box-shadow: none !important;
  -webkit-mask-image:
    radial-gradient(circle var(--notch) at 0% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%),
    radial-gradient(circle var(--notch) at 100% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%);
  -webkit-mask-position: left, right;
  -webkit-mask-size: 51.5% 100%;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-composite: source-over;
  mask-image:
    radial-gradient(circle var(--notch) at 0% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%),
    radial-gradient(circle var(--notch) at 100% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%);
  mask-position: left, right;
  mask-size: 51.5% 100%;
  mask-repeat: no-repeat;
  mask-composite: add;
}

/* Space above tear: last block before the stub */
.ba-form-ticket > .ba-form-desc,
.ba-form-ticket > .ba-event-chip {
  margin-bottom: var(--tear-gap-above);
}

/* Sent confirmation: stub = two CTAs + hint */
.ba-form-ticket--sent {
  --tear-from-bottom: 12.5rem;
}

/* Manage / verify: same stub height as find */
.ba-form-ticket--manage,
.ba-form-ticket--verify {
  --tear-from-bottom: 15.1rem;
}

.ba-event-chip {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin: 1.15rem 0 0;
  padding: 0.85rem 1rem;
  background: #f3f4f6;
  border-radius: 12px !important;
  box-shadow: none !important;
}

.ba-event-chip-icon {
  flex-shrink: 0;
  width: 1.35rem;
  height: 1.35rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--mkt-ink);
  font-size: 1.05rem;
  margin-top: 0.1rem;
}

.ba-event-chip-text {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 0;
  font-size: 0.95rem;
  line-height: 1.35;
  color: var(--mkt-muted);
}

.ba-event-chip-text strong {
  font-weight: 700;
  color: var(--mkt-ink);
}

.ba-dest {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0 0 0.15rem;
  font-size: 0.95rem;
  color: var(--mkt-muted);
}

.ba-dest strong {
  color: var(--mkt-ink);
  font-weight: 700;
}

.ba-dest-icon {
  flex-shrink: 0;
  color: var(--mkt-ink);
  font-size: 1.05rem;
  line-height: 1;
}

.ba-input--readonly {
  background: #f3f4f6 !important;
  color: var(--mkt-muted) !important;
  cursor: default;
}

.ba-input--code {
  text-align: center;
  letter-spacing: 0.28em;
  font-weight: 600;
  font-size: 1.2rem !important;
}

.ba-inline-form {
  display: inline;
  margin: 0;
  padding: 0;
}

.ba-text-btn {
  display: inline;
  background: none !important;
  border: none !important;
  padding: 0 !important;
  margin: 0;
  font: inherit;
  font-weight: 600;
  color: var(--mkt-ink) !important;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
  box-shadow: none !important;
}

.ba-text-btn:hover {
  opacity: 0.75;
}

.ba-form-ticket::after {
  content: "";
  position: absolute;
  left: 1.25rem;
  right: 1.25rem;
  bottom: var(--tear-from-bottom);
  border-top: 1.5px dashed rgba(20, 20, 20, 0.28);
  pointer-events: none;
}

.ba-form-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: 1.55rem;
  letter-spacing: -0.02em;
  color: var(--mkt-ink) !important;
  margin: 0 0 0.55rem;
}

.ba-form-desc {
  font-size: 0.95rem;
  line-height: 1.5;
  color: #6b7280;
  margin: 0;
}

.ba-form-stub {
  padding-top: var(--tear-gap-below, 1.75rem);
}

.ba-label {
  display: block;
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--mkt-ink);
  margin-bottom: 0.4rem;
}

.ba-input {
  display: block;
  width: 100%;
  font-family: var(--mkt-font) !important;
  font-size: 1rem;
  color: var(--mkt-ink);
  background: #fff !important;
  border: 1.5px solid #d4d4d4 !important;
  border-radius: 10px !important;
  padding: 0.7rem 0.9rem !important;
  box-shadow: none !important;
  transition: border-color 0.15s ease;
}

.ba-input::placeholder {
  color: #9ca3af;
}

.ba-input:focus {
  outline: none;
  border-color: var(--mkt-ink) !important;
  box-shadow: none !important;
}

.ba-n-arrow {
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
}

.ba-submit {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.35rem;
  width: 100%;
  margin-top: 1.1rem;
  background: var(--mkt-lime) !important;
  color: var(--mkt-ink) !important;
  border: none !important;
  border-radius: 999px !important;
  padding: 0.85rem 1.35rem !important;
  font-family: var(--mkt-font) !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  box-shadow: none !important;
  cursor: pointer;
  transition: transform 0.15s ease, filter 0.15s ease;
}

.ba-submit:hover {
  filter: brightness(0.96);
  transform: translateY(-1px);
  color: var(--mkt-ink) !important;
}

.ba-submit:active {
  transform: translateY(0);
}

.ba-hint {
  text-align: center;
  font-size: 0.88rem;
  color: #6b7280;
  margin: 0.9rem 0 0;
}

.ba-alert {
  border-radius: 12px !important;
  margin-bottom: 1rem;
  font-size: 0.92rem;
}

.ba-back {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: 1.25rem;
  font-weight: 600;
  color: var(--mkt-ink);
  text-decoration: none;
  transition: opacity 0.15s ease;
}

.ba-back:hover {
  color: var(--mkt-ink);
  opacity: 0.7;
}

/* —— Sent confirmation —— */
.ba-sent {
  max-width: 420px;
  margin: 0 auto;
  text-align: center;
}

.ba-sent-icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 1.25rem;
  border-radius: 50% !important;
  background: var(--mkt-lime);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  color: var(--mkt-ink);
  box-shadow: none !important;
  animation: ba-illo-in 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.ba-sent .ba-form-title {
  font-size: 1.65rem;
}

.ba-sent-actions {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.ba-sent-actions .ba-submit {
  margin-top: 0;
}

.ba-btn-ghost {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100%;
  background: transparent !important;
  color: var(--mkt-ink) !important;
  border: 1.5px solid var(--mkt-ink) !important;
  border-radius: 999px !important;
  padding: 0.75rem 1.25rem !important;
  font-family: var(--mkt-font) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: background 0.15s ease, transform 0.15s ease;
}

.ba-btn-ghost:hover {
  background: rgba(20, 20, 20, 0.04) !important;
  color: var(--mkt-ink) !important;
  transform: translateY(-1px);
}

/* —— Footer —— */
.ba-footer {
  background: var(--mkt-forest) !important;
  color: #fff;
  padding: 2rem 0;
  margin-top: auto;
}

.ba-footer-inner {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}

.ba-footer-links {
  display: flex;
  gap: 0.5rem 1.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.ba-footer-links a {
  color: #fff !important;
  text-decoration: none;
  font-weight: 500;
}

.ba-footer-links a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (max-width: 900px) {
  .ba-main {
    padding: 2rem 0 3rem;
  }

  .ba-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .ba-copy {
    text-align: center;
  }

  .ba-lead {
    margin-left: auto;
    margin-right: auto;
  }

  .ba-illo {
    margin: 0 auto 0.5rem;
  }

  .ba-panel {
    padding: 1.5rem 1.15rem;
    border-radius: 22px !important;
  }

  .ba-form-ticket {
    --notch: 11px;
    --tear-gap-above: 1.1rem;
    --tear-gap-below: 1.55rem;
    --tear-from-bottom: 14.8rem;
    padding: 1.4rem 1.15rem 1.2rem;
  }

  .ba-form-ticket--sent {
    --tear-from-bottom: 12.15rem;
  }

  .ba-form-ticket--manage,
  .ba-form-ticket--verify {
    --tear-from-bottom: 14.8rem;
  }
}

@media (max-width: 420px) {
  .ba-form-ticket {
    --notch: 0px;
    -webkit-mask-image: none;
    mask-image: none;
  }

  .ba-form-ticket::after {
    display: none;
  }
}

/* —— Booking details (access show) —— */
.bd-page {
  font-family: var(--mkt-font);
  color: var(--mkt-ink);
  min-height: calc(100vh - 5rem);
  display: flex;
  flex-direction: column;
}

.bd-wrap {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 1.25rem;
  width: 100%;
}

.bd-flash {
  background: var(--mkt-forest);
  color: #fff;
  padding: 0.85rem 0;
}

.bd-flash-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  font-weight: 600;
  font-size: 0.95rem;
}

.bd-hero {
  background: linear-gradient(180deg, #d9d4f0 0%, #e4e0f5 100%);
  padding: 2.35rem 0 2rem;
}

.bd-eyebrow {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mkt-blue);
  margin: 0 0 0.85rem;
}

.bd-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: clamp(2.1rem, 4.5vw, 2.85rem);
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--mkt-ink) !important;
  margin: 0 0 0.55rem;
}

.bd-lead {
  margin: 0;
  font-size: 1.05rem;
  color: var(--mkt-muted);
  line-height: 1.45;
}

.bd-body {
  flex: 1;
  padding: 1.75rem 0 2.75rem;
}

.bd-alert {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 1.25rem;
  padding: 1rem 1.15rem;
  background: #fff8e8;
  border: 1.5px solid rgba(180, 120, 20, 0.28) !important;
  border-radius: 14px !important;
}

.bd-alert-title {
  margin: 0 0 0.2rem;
  font-weight: 700;
  font-size: 0.98rem;
}

.bd-alert-text {
  margin: 0;
  font-size: 0.92rem;
  color: var(--mkt-muted);
  line-height: 1.4;
}

.bd-alert-link {
  font-weight: 700;
  color: var(--mkt-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
  white-space: nowrap;
}

.bd-alert-link:hover {
  color: var(--mkt-blue);
}

.bd-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, 0.75fr);
  gap: 1.5rem 1.75rem;
  align-items: start;
}

.bd-ticket {
  --notch: 11px;
  position: relative;
  background: transparent;
  border: none !important;
  border-radius: 0 !important;
  overflow: visible;
}

.bd-ticket-top {
  padding: 1.35rem;
  background: #fff;
  border: 2px solid var(--mkt-ink) !important;
  border-bottom: none !important;
  border-radius: 18px 18px 0 0 !important;
  overflow: hidden;
  -webkit-mask:
    radial-gradient(circle var(--notch) at 0% 100%, transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% 100%, transparent 98%, #000 100%) right;
  -webkit-mask-size: 51.5% 100%;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: left, right;
  mask:
    radial-gradient(circle var(--notch) at 0% 100%, transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% 100%, transparent 98%, #000 100%) right;
  mask-size: 51.5% 100%;
  mask-repeat: no-repeat;
  mask-position: left, right;
}

.bd-event {
  display: flex;
  gap: 1.15rem;
  align-items: flex-start;
}

.bd-thumb {
  width: 112px;
  height: 112px;
  border-radius: 12px !important;
  overflow: hidden;
  flex-shrink: 0;
  background: var(--mkt-forest);
}

.bd-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 0 !important;
}

.bd-event-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: 1.45rem;
  letter-spacing: -0.02em;
  margin: 0 0 0.2rem;
  color: var(--mkt-ink) !important;
  line-height: 1.2;
}

.bd-event-presenter {
  margin: 0 0 0.75rem;
  font-size: 0.98rem;
  color: var(--mkt-muted);
  line-height: 1.3;
}

.bd-meta {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.bd-meta li {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  font-size: 0.92rem;
  color: var(--mkt-ink);
  line-height: 1.35;
}

.bd-meta i {
  color: var(--mkt-muted);
  margin-top: 0.1rem;
  flex-shrink: 0;
}

.bd-meta-muted {
  color: var(--mkt-muted);
}

.bd-ticket-bottom {
  padding: 1.35rem 1.35rem 1.4rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  background: #fff;
  border: 2px solid var(--mkt-ink) !important;
  border-top: 1.5px dashed rgba(20, 20, 20, 0.45) !important;
  border-radius: 0 0 18px 18px !important;
  overflow: hidden;
  -webkit-mask:
    radial-gradient(circle var(--notch) at 0% 0%, transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% 0%, transparent 98%, #000 100%) right;
  -webkit-mask-size: 51.5% 100%;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: left, right;
  mask:
    radial-gradient(circle var(--notch) at 0% 0%, transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% 0%, transparent 98%, #000 100%) right;
  mask-size: 51.5% 100%;
  mask-repeat: no-repeat;
  mask-position: left, right;
}

.bd-code-label {
  margin: 0 0 0.75rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--mkt-muted);
}

.bd-code-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  max-width: 24rem;
  margin: 0 auto 0.7rem;
}

.bd-code {
  flex: 1;
  background: #e8edf5;
  border-radius: 12px !important;
  padding: 1rem 1.15rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 1.85rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: var(--mkt-ink);
  line-height: 1.15;
}

.bd-copy {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  background: none;
  border: none !important;
  border-radius: 0 !important;
  padding: 0.25rem 0;
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--mkt-ink);
  cursor: pointer;
  white-space: nowrap;
  box-shadow: none !important;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.bd-copy:hover {
  color: var(--mkt-blue);
  background: none;
}

.bd-code-hint {
  margin: 0 0 1.15rem;
  font-size: 0.88rem;
  color: #8a8680;
}

body.booking-access a.bd-btn-lime,
body.booking-access .bd-btn-lime {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.35rem;
  width: 100%;
  margin-top: 0.15rem;
  background: var(--mkt-lime) !important;
  color: var(--mkt-ink) !important;
  border-radius: 999px !important;
  padding: 0.85rem 1.15rem !important;
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: 0.98rem !important;
  text-decoration: none !important;
  border: none !important;
  box-shadow: none !important;
  cursor: pointer;
  transition: transform 0.15s ease, filter 0.15s ease;
}

body.booking-access a.bd-btn-lime:hover,
body.booking-access .bd-btn-lime:hover {
  filter: brightness(0.96);
  transform: translateY(-1px);
  color: var(--mkt-ink) !important;
}

.bd-manage-hint {
  margin: 0.75rem 0 0;
  font-size: 0.85rem;
  color: #8a8680;
  line-height: 1.4;
}

.bd-aside {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.bd-panel {
  background: #fff;
  border: 1.5px solid rgba(20, 20, 20, 0.1) !important;
  border-radius: 18px !important;
  padding: 1.2rem 1.25rem;
  box-shadow: none !important;
}

.bd-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
}

.bd-panel-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: 1.05rem;
  margin: 0;
  letter-spacing: -0.015em;
  color: var(--mkt-ink) !important;
}

.bd-panel > .bd-panel-title {
  margin-bottom: 0.85rem;
}

.bd-paid-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  background: #dff3c8;
  color: #1f4d32;
  font-size: 0.78rem;
  font-weight: 700;
  padding: 0.28rem 0.55rem 0.28rem 0.4rem;
  border-radius: 999px !important;
  line-height: 1;
}

.bd-paid-badge i {
  font-size: 0.95rem;
}

.bd-summary-lines {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  margin-bottom: 0.75rem;
  font-size: 0.92rem;
}

.bd-summary-line {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
}

.bd-summary-line--discount {
  color: #0d3d38;
}

.bd-summary-divider {
  border: none;
  border-top: 1px solid rgba(20, 20, 20, 0.12);
  margin: 0 0 0.85rem;
}

.bd-summary-total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.75rem;
  margin: 0.35rem 0 0;
  font-weight: 700;
}

.bd-summary-total strong {
  font-size: 1.25rem;
  letter-spacing: -0.02em;
}

.bd-booked-by {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

.bd-booked-by-icon {
  width: 40px;
  height: 40px;
  border-radius: 999px !important;
  background: #ebe6dc;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--mkt-ink);
  font-size: 1.2rem;
  flex-shrink: 0;
}

.bd-booked-by-name {
  margin: 0 0 0.1rem;
  font-weight: 700;
  font-size: 0.98rem;
}

.bd-booked-by-email {
  margin: 0;
  color: var(--mkt-muted);
  font-size: 0.9rem;
  word-break: break-word;
}

.bd-location {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 1.5rem;
  padding: 1.15rem 1.25rem;
  background: #fff;
  border: 1.5px solid rgba(20, 20, 20, 0.1) !important;
  border-radius: 18px !important;
}

.bd-location-left {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  min-width: 0;
}

.bd-location-icon {
  width: 40px;
  height: 40px;
  border-radius: 999px !important;
  background: #ebe6dc;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--mkt-ink);
  font-size: 1.15rem;
  flex-shrink: 0;
}

.bd-location-name {
  margin: 0 0 0.15rem;
  font-weight: 700;
  font-size: 0.98rem;
  color: var(--mkt-ink);
}

.bd-location-address {
  margin: 0;
  font-size: 0.9rem;
  color: var(--mkt-muted);
  line-height: 1.35;
}

.bd-location-link {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-weight: 700;
  color: var(--mkt-blue) !important;
  text-decoration: none;
  white-space: nowrap;
}

.bd-location-link:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.bd-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.75rem 1.75rem;
  margin-top: 2rem;
}

.bd-nav-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-weight: 600;
  color: var(--mkt-muted);
  text-decoration: none;
  font-size: 0.95rem;
}

.bd-nav-link:hover {
  color: var(--mkt-blue);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.bd-nav-link--primary {
  color: var(--mkt-blue) !important;
  font-weight: 700;
}

.bd-organiser {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 2rem;
  padding: 1.5rem 0 0.5rem;
  border-top: 1px solid rgba(20, 20, 20, 0.12);
}

.bd-organiser-left {
  display: flex;
  align-items: center;
  gap: 0.85rem;
}

.bd-organiser-avatar {
  width: 48px;
  height: 48px;
  border-radius: 999px !important;
  overflow: hidden;
  background: #fff;
  flex-shrink: 0;
  border: 2px solid rgba(20, 20, 20, 0.08) !important;
}

.bd-organiser-avatar img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  border-radius: 0 !important;
  padding: 4px;
  box-sizing: border-box;
}

.bd-organiser-avatar-fallback {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--mkt-forest);
  color: #fff;
  font-weight: 700;
  font-size: 1rem;
}

.bd-organiser-label {
  font-weight: 600;
  color: var(--mkt-ink);
  margin: 0;
}

.bd-organiser-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-weight: 600;
  color: var(--mkt-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.bd-organiser-link:hover {
  color: var(--mkt-blue);
}

.bd-n-arrow {
  display: inline-block;
  vertical-align: middle;
}

.bd-footer {
  background: var(--mkt-forest) !important;
  color: #fff;
  padding: 2rem 0;
  margin-top: auto;
}

.bd-footer-inner {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 1.25rem;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.5rem;
  flex-wrap: wrap;
}

.bd-footer-brand {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  max-width: 28rem;
}

.bd-footer-note,
.bd-footer-copy {
  margin: 0;
  font-size: 0.82rem;
  color: rgba(255, 255, 255, 0.78);
  line-height: 1.4;
}

.bd-footer-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.55rem;
  text-align: right;
}

.bd-footer-links {
  display: flex;
  gap: 0.5rem 1.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.bd-footer-links a {
  color: #fff !important;
  text-decoration: none;
  font-weight: 500;
}

.bd-footer-links a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (max-width: 900px) {
  .bd-grid {
    grid-template-columns: 1fr;
  }

  .bd-event {
    flex-direction: column;
  }

  .bd-thumb {
    width: 96px;
    height: 96px;
  }

  .bd-code-row {
    flex-wrap: wrap;
    max-width: none;
  }

  .bd-footer-right {
    align-items: flex-start;
    text-align: left;
  }

  .bd-location {
    align-items: flex-start;
  }

  .bd-organiser {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 540px) {
  .bd-hero {
    padding: 1.85rem 0 1.5rem;
  }

  .bd-ticket-top,
  .bd-ticket-bottom {
    padding-left: 1.1rem;
    padding-right: 1.1rem;
  }

  .bd-code {
    font-size: 1.55rem;
    letter-spacing: 0.1em;
  }
}

/* —— Booking management (show) —— */
.bm-page {
  font-family: var(--mkt-font);
  color: var(--mkt-ink);
  min-height: calc(100vh - 5rem);
  display: flex;
  flex-direction: column;
}

.bm-wrap {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 1.25rem;
  width: 100%;
}

.bm-flash {
  background: var(--mkt-forest);
  color: #fff;
  padding: 0.85rem 0;
}

.bm-flash--alert {
  background: #8b2e2e;
}

.bm-flash-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  font-weight: 600;
  font-size: 0.95rem;
}

.bm-body {
  flex: 1;
  padding: 1.75rem 0 3rem;
}

.bm-back {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-bottom: 1.5rem;
  font-weight: 600;
  color: var(--mkt-ink);
  text-decoration: none;
}

.bm-back:hover {
  color: var(--mkt-ink);
  opacity: 0.7;
}

.bm-hero {
  margin-bottom: 1.75rem;
}

.bm-eyebrow {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mkt-ink);
  margin: 0 0 0.75rem;
}

.bm-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: clamp(2rem, 4vw, 2.65rem);
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--mkt-ink) !important;
  margin: 0 0 0.55rem;
}

.bm-lead {
  margin: 0;
  font-size: 1.05rem;
  color: var(--mkt-muted);
  line-height: 1.45;
}

.bm-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.85fr);
  gap: 1.5rem 1.75rem;
  align-items: start;
}

.bm-panel {
  background: #fff;
  border: 1.5px solid rgba(20, 20, 20, 0.1) !important;
  border-radius: 18px !important;
  padding: 1.6rem 1.5rem 1.5rem;
  box-shadow: none !important;
}

.bm-panel-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: 1.25rem;
  letter-spacing: -0.02em;
  margin: 0 0 0.35rem;
  color: var(--mkt-ink) !important;
}

.bm-panel-desc {
  margin: 0 0 1.35rem;
  font-size: 0.95rem;
  color: #6b7280;
  line-height: 1.45;
}

.bm-field {
  margin-bottom: 1.1rem;
}

.bm-label {
  display: block;
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--mkt-ink);
  margin-bottom: 0.4rem;
}

.bm-input {
  display: block;
  width: 100%;
  font-family: var(--mkt-font) !important;
  font-size: 1rem;
  color: var(--mkt-ink);
  background: #fff !important;
  border: 1.5px solid #d4d4d4 !important;
  border-radius: 10px !important;
  padding: 0.7rem 0.9rem !important;
  box-shadow: none !important;
}

.bm-input:focus {
  outline: none;
  border-color: var(--mkt-ink) !important;
  box-shadow: none !important;
}

.bm-hint {
  margin: 0.45rem 0 0;
  font-size: 0.85rem;
  color: #8a8680;
  line-height: 1.4;
}

.bm-field .iti {
  width: 100%;
  display: block;
}

.bm-field .iti__flag-container {
  z-index: 2;
}

.bm-field .iti__selected-flag {
  background: #f3f4f6 !important;
  border-radius: 10px 0 0 10px !important;
  padding: 0 0.55rem 0 0.65rem;
}

.bm-field .iti__selected-flag:hover,
.bm-field .iti__selected-flag:focus {
  background: #ebecef !important;
}

.bm-field .iti__selected-dial-code {
  color: var(--mkt-ink);
  font-weight: 600;
  font-size: 0.95rem;
}

.bm-field .iti input.bm-input,
.bm-field .iti input[type="tel"] {
  width: 100% !important;
  border-radius: 10px !important;
}

.bm-field .iti.iti--separate-dial-code input.bm-input,
.bm-field .iti.iti--separate-dial-code input[type="tel"] {
  padding-left: 5.75rem !important;
}

.bm-field .iti__country-list {
  border: 1.5px solid #d4d4d4 !important;
  border-radius: 12px !important;
  box-shadow: 0 10px 28px rgba(20, 20, 20, 0.12) !important;
  z-index: 20;
}

body.booking-access .bm-submit,
body.booking-access button.bm-submit {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.35rem;
  width: 100%;
  margin-top: 0.5rem;
  background: var(--mkt-lime) !important;
  color: var(--mkt-ink) !important;
  border: none !important;
  border-radius: 999px !important;
  padding: 0.85rem 1.25rem !important;
  font-family: var(--mkt-font) !important;
  font-size: 1.02rem !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  box-shadow: none !important;
  cursor: pointer;
  transition: transform 0.15s ease, filter 0.15s ease;
}

body.booking-access .bm-submit:hover {
  filter: brightness(0.96);
  transform: translateY(-1px);
  color: var(--mkt-ink) !important;
}

.bm-aside {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.bm-ticket-shell {
  background: var(--mkt-sky);
  border-radius: 22px !important;
  padding: 1.15rem;
}

.bm-ticket {
  --notch: 11px;
  background: transparent;
}

.bm-ticket-top {
  padding: 1.2rem 1.2rem 1.15rem;
  background: #fff;
  border: 2px solid var(--mkt-ink) !important;
  border-bottom: none !important;
  border-radius: 16px 16px 0 0 !important;
  overflow: hidden;
  -webkit-mask:
    radial-gradient(circle var(--notch) at 0% 100%, transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% 100%, transparent 98%, #000 100%) right;
  -webkit-mask-size: 51.5% 100%;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: left, right;
  mask:
    radial-gradient(circle var(--notch) at 0% 100%, transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% 100%, transparent 98%, #000 100%) right;
  mask-size: 51.5% 100%;
  mask-repeat: no-repeat;
  mask-position: left, right;
}

.bm-ticket-eyebrow {
  margin: 0 0 0.55rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mkt-muted);
}

.bm-ticket-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: 1.35rem;
  letter-spacing: -0.02em;
  margin: 0 0 0.85rem;
  color: var(--mkt-ink) !important;
  line-height: 1.2;
}

.bm-ticket-meta {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.bm-ticket-meta li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.92rem;
  color: var(--mkt-ink);
}

.bm-ticket-meta i {
  color: var(--mkt-muted);
  flex-shrink: 0;
}

.bm-ticket-divider {
  border: none;
  border-top: 1px solid rgba(20, 20, 20, 0.12);
  margin: 0.95rem 0 0.85rem;
}

.bm-ticket-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.bm-ticket-tickets {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--mkt-ink);
}

.bm-ticket-tickets i {
  color: var(--mkt-muted);
}

.bm-ticket-status {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.88rem;
  color: var(--mkt-muted);
}

.bm-status-badge {
  display: inline-flex;
  align-items: center;
  background: #ebe6dc;
  color: var(--mkt-ink);
  font-size: 0.78rem;
  font-weight: 700;
  padding: 0.28rem 0.55rem;
  border-radius: 999px !important;
  line-height: 1;
}

.bm-status-badge--paid {
  background: #dff3c8;
  color: #1f4d32;
}

.bm-ticket-bottom {
  padding: 1.15rem 1.2rem 1.2rem;
  background: #fff;
  border: 2px solid var(--mkt-ink) !important;
  border-top: 1.5px dashed rgba(20, 20, 20, 0.45) !important;
  border-radius: 0 0 16px 16px !important;
  overflow: hidden;
  -webkit-mask:
    radial-gradient(circle var(--notch) at 0% 0%, transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% 0%, transparent 98%, #000 100%) right;
  -webkit-mask-size: 51.5% 100%;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: left, right;
  mask:
    radial-gradient(circle var(--notch) at 0% 0%, transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% 0%, transparent 98%, #000 100%) right;
  mask-size: 51.5% 100%;
  mask-repeat: no-repeat;
  mask-position: left, right;
}

.bm-code-label {
  margin: 0 0 0.55rem;
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--mkt-muted);
}

.bm-code-row {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}

.bm-code {
  flex: 1;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 1.55rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--mkt-ink);
  line-height: 1.15;
}

.bm-copy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  background: none;
  border: none !important;
  border-radius: 8px !important;
  color: var(--mkt-muted);
  cursor: pointer;
  box-shadow: none !important;
}

.bm-copy:hover {
  color: var(--mkt-ink);
  background: rgba(20, 20, 20, 0.05);
}

.bm-help {
  margin: 0.15rem 0 0;
  text-align: center;
  font-size: 0.9rem;
  color: var(--mkt-muted);
}

.bm-help-link {
  font-weight: 700;
  color: var(--mkt-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.bm-help-link:hover {
  color: var(--mkt-blue);
}

.bm-footer {
  background: var(--mkt-forest) !important;
  color: #fff;
  padding: 1.75rem 0;
  margin-top: auto;
}

.bm-footer-inner {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 1.25rem;
  display: flex;
  align-items: center;
  gap: 1rem;
}

.bm-footer-sep {
  width: 1px;
  height: 1.35rem;
  background: rgba(255, 255, 255, 0.35);
}

.bm-footer-tagline {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.9);
}

@media (max-width: 900px) {
  .bm-grid {
    grid-template-columns: 1fr;
  }

  .bm-aside {
    order: -1;
  }
}

@media (max-width: 540px) {
  .bm-panel,
  .bm-ticket-shell {
    padding-left: 1.1rem;
    padding-right: 1.1rem;
  }

  .bm-ticket-top,
  .bm-ticket-bottom {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .bm-code {
    font-size: 1.35rem;
  }

  .bm-footer-inner {
    flex-wrap: wrap;
  }
}
/* Checkout flow — matches event/marketing look
   Use !important on radius to beat global square-design resets */

body.checkout-flow {
  --mkt-sky: #c9dbff;
  --mkt-lavender: #d8d2f0;
  --mkt-mint: #e1ef96;
  --mkt-cream: #f7f4ec;
  --mkt-lime: #e1ef96;
  --mkt-forest: #0d3d38;
  --mkt-ink: #141414;
  --mkt-muted: #3a3a3a;
  --mkt-blue: #2c40ab;
  --mkt-font: "Galano Grotesque", system-ui, sans-serif;
  background: var(--mkt-cream) !important;
}

body.checkout-flow main {
  padding: 0 !important;
  max-width: none !important;
}

body.checkout-flow .marketing-nav {
  background: #fff !important;
  border-bottom: none !important;
  padding: 0.85rem 0 !important;
}

body.checkout-flow .marketing-nav .container {
  max-width: 1120px;
}

body.checkout-flow .marketing-nav .nav-link {
  color: var(--mkt-ink) !important;
  font-weight: 500 !important;
}

.chk-page {
  font-family: var(--mkt-font);
  color: var(--mkt-ink);
  padding-bottom: 0;
}

.chk-wrap {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 1.25rem;
}

/* —— Event banner —— */
.chk-banner {
  background: var(--mkt-sky);
  padding: 1.1rem 0 1.25rem;
}

.chk-banner-inner {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.chk-banner-thumb {
  width: 64px;
  height: 64px;
  border-radius: 12px !important;
  overflow: hidden;
  flex-shrink: 0;
  background: var(--mkt-forest);
}

.chk-banner-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 0 !important;
}

.chk-banner-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: 1.35rem;
  margin: 0 0 0.2rem;
  letter-spacing: -0.02em;
  color: var(--mkt-ink) !important;
}

.chk-banner-meta {
  font-size: 0.9rem;
  color: var(--mkt-muted);
  margin: 0 0 0.35rem;
}

.chk-banner-back {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--mkt-ink);
  text-decoration: none;
}

.chk-banner-back:hover {
  color: var(--mkt-blue);
}

/* —— Progress —— */
.chk-progress {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 1.5rem 0 0.5rem;
  flex-wrap: wrap;
}

.chk-progress-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  min-width: 4.5rem;
}

.chk-progress-dot {
  width: 28px;
  height: 28px;
  border-radius: 999px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.78rem;
  font-weight: 700;
  background: #e5e2da;
  color: #8a8680;
  border: none !important;
  box-shadow: none !important;
  cursor: pointer;
}

.chk-progress-dot.active {
  background: var(--mkt-ink) !important;
  color: #fff !important;
}

.chk-progress-dot.completed {
  background: #2c40ab !important;
  color: #fff !important;
}

.chk-progress-dot.completed::after {
  content: "✓";
  font-size: 0.85rem;
}

.chk-progress-label {
  font-size: 0.78rem;
  font-weight: 500;
  color: #8a8680;
  text-align: center;
}

.chk-progress-item:has(.chk-progress-dot.active) .chk-progress-label {
  color: var(--mkt-ink);
  font-weight: 700;
}

.chk-progress-connector {
  width: 36px;
  height: 1px;
  background: rgba(20, 20, 20, 0.18);
  margin: 0 0.35rem 1.1rem;
  flex-shrink: 0;
}

/* —— Layout —— */
.chk-body {
  padding: 1.75rem 0 3rem;
}

.chk-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.85fr);
  gap: 2rem 2.5rem;
  align-items: start;
}

.chk-main-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: clamp(1.6rem, 3vw, 2rem);
  letter-spacing: -0.02em;
  margin: 0 0 0.35rem;
  color: var(--mkt-ink) !important;
}

.chk-main-lead {
  color: var(--mkt-muted);
  margin: 0 0 1.35rem;
  font-size: 1rem;
}

.chk-panel {
  background: #fff;
  border: 1.5px solid rgba(20, 20, 20, 0.1) !important;
  border-radius: 18px !important;
  padding: 1.35rem 1.4rem;
  box-shadow: none !important;
  overflow: visible;
}

.chk-panel + .chk-panel,
.chk-discount {
  margin-top: 1rem;
}

/* —— Ticket rows —— */
.chk-ticket-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 0;
}

.chk-ticket-row + .chk-ticket-row {
  border-top: 1px solid rgba(20, 20, 20, 0.08);
}

.chk-ticket-name {
  font-weight: 700;
  font-size: 1.05rem;
  margin: 0 0 0.15rem;
}

.chk-ticket-desc {
  color: var(--mkt-muted);
  font-size: 0.88rem;
  margin: 0 0 0.25rem;
}

.chk-ticket-price {
  font-size: 0.9rem;
  color: var(--mkt-muted);
}

.chk-ticket-price strong {
  color: var(--mkt-ink);
  font-weight: 700;
}

.chk-ticket-avail {
  font-size: 0.8rem;
  color: #8a8680;
  margin-top: 0.25rem;
}

.chk-qty {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  flex-shrink: 0;
}

.chk-qty .quantity-btn {
  width: 36px;
  height: 36px;
  border-radius: 999px !important;
  border: none !important;
  background: #ebe6dc !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: none !important;
  padding: 0 !important;
}

.chk-qty .quantity-btn.increase-btn {
  background: var(--mkt-sky) !important;
}

.chk-qty .quantity-input {
  width: 48px !important;
  text-align: center;
  border: 1.5px solid rgba(20, 20, 20, 0.15) !important;
  border-radius: 10px !important;
  font-weight: 700;
  font-size: 1rem;
  padding: 0.35rem 0.15rem !important;
  box-shadow: none !important;
  -moz-appearance: textfield;
}

.chk-qty .quantity-input::-webkit-outer-spin-button,
.chk-qty .quantity-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.chk-qty .minus-symbol,
.chk-qty .plus-symbol {
  width: 12px;
  height: 2px;
  background: var(--mkt-ink);
  position: relative;
}

.chk-qty .plus-symbol::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--mkt-ink);
  transform: rotate(90deg);
}

/* —— Discount accordion —— */
.chk-discount summary {
  list-style: none;
  cursor: pointer;
  font-weight: 600;
  color: var(--mkt-ink);
  padding: 0.85rem 0;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.chk-discount summary::-webkit-details-marker {
  display: none;
}

.chk-discount summary::before {
  content: "▸";
  font-size: 0.85rem;
  transition: transform 0.15s ease;
}

.chk-discount[open] summary::before {
  transform: rotate(90deg);
}

.chk-discount-body {
  padding-bottom: 0.5rem;
}

.chk-discount-row {
  display: flex;
  gap: 0.5rem;
  margin-top: 0.35rem;
}

.chk-discount-row input {
  flex: 1;
  border: 1.5px solid rgba(20, 20, 20, 0.15) !important;
  border-radius: 10px !important;
  padding: 0.55rem 0.75rem;
  box-shadow: none !important;
}

.chk-discount-row .btn {
  border-radius: 999px !important;
  font-weight: 600 !important;
  padding: 0.55rem 1rem !important;
  background: var(--mkt-ink) !important;
  color: #fff !important;
  border: none !important;
}

/* —— Form fields —— */
.chk-field {
  margin-bottom: 1.15rem;
}

.chk-field label {
  display: block;
  font-weight: 600;
  font-size: 0.9rem;
  margin-bottom: 0.4rem;
}

.chk-field .form-control {
  border: 1.5px solid rgba(20, 20, 20, 0.15) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  font-size: 1rem;
  width: 100%;
}

/* Direct inputs only — leave intl-tel-input to manage its own left padding */
.chk-field > .form-control,
.chk-field > input.form-control {
  padding: 0.7rem 0.85rem !important;
}

.chk-field .form-control:focus {
  border-color: var(--mkt-blue) !important;
  box-shadow: 0 0 0 3px rgba(44, 64, 171, 0.15) !important;
}

.chk-field .form-text {
  font-size: 0.82rem;
  color: #8a8680;
  margin-top: 0.35rem;
}

/* —— Feedback: banners + inline —— */
.chk-msg {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 0.9rem 1rem;
  border-radius: 12px;
  border: 1.5px solid transparent;
  margin-bottom: 1rem;
  font-size: 0.95rem;
  line-height: 1.45;
}

.chk-msg__icon {
  flex-shrink: 0;
  font-size: 1.15rem;
  line-height: 1.3;
  margin-top: 0.05rem;
}

.chk-msg__body {
  min-width: 0;
  flex: 1;
}

.chk-msg__title {
  margin: 0 0 0.15rem;
  font-weight: 700;
  font-size: 0.98rem;
}

.chk-msg__text {
  margin: 0;
  font-weight: 400;
}

.chk-msg__link {
  display: inline-block;
  margin-top: 0.45rem;
  font-weight: 600;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  text-decoration: underline;
  font-size: inherit;
  font-family: inherit;
  color: inherit;
}

.chk-msg__link:hover {
  opacity: 0.85;
}

.chk-msg:focus {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

.chk-msg--error {
  background: #f8ecec;
  border-color: #e5c4c4;
  color: #7a2e2e;
}

.chk-msg--warning {
  background: #f7f0e3;
  border-color: #e4d4b5;
  color: #5c4318;
}

.chk-msg--success {
  background: #e8f1e6;
  border-color: #c5d9c0;
  color: #1f4d32;
}

.chk-msg--info {
  background: #e8edf8;
  border-color: #c5d0e8;
  color: #1e2f7a;
}

.chk-inline-msg {
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
  margin-top: 0.55rem;
  font-size: 0.88rem;
  line-height: 1.4;
  font-weight: 500;
}

.chk-inline-msg__icon {
  flex-shrink: 0;
  font-size: 0.95rem;
  line-height: 1.35;
}

.chk-inline-msg__text {
  min-width: 0;
}

.chk-inline-msg--error {
  color: #7a2e2e;
}

.chk-inline-msg--warning {
  color: #5c4318;
}

.chk-inline-msg--success {
  color: #1f4d32;
}

.chk-inline-msg--info {
  color: #1e2f7a;
}

.chk-field .form-control.is-invalid,
.chk-field .iti input.form-control.is-invalid,
.chk-field input.form-control.is-invalid {
  border-color: #c47878 !important;
  box-shadow: none !important;
}

.chk-field .form-control.is-invalid:focus,
.chk-field .iti input.form-control.is-invalid:focus {
  border-color: #a84848 !important;
  box-shadow: 0 0 0 3px rgba(122, 46, 46, 0.12) !important;
}

/* Hide Bootstrap’s default invalid-feedback; we use .chk-inline-msg */
.chk-page .invalid-feedback {
  display: none !important;
}

.chk-ticket-error {
  margin-top: 0.85rem;
  padding-top: 0.15rem;
}

.chk-discount-status .chk-inline-msg,
.chk-discount-status .chk-msg {
  margin-top: 0.65rem;
  margin-bottom: 0;
}

/* intl-tel-input — full-width, room for flag + dial code */
.chk-field {
  overflow: visible;
}

.chk-field .iti {
  width: 100%;
  display: block;
  position: relative;
  overflow: visible;
}

.chk-field .iti__flag-container {
  z-index: 2;
}

.chk-field .iti__selected-flag {
  padding: 0 10px 0 12px;
  border-radius: 12px 0 0 12px;
  background: transparent;
}

.chk-field .iti__selected-flag:hover,
.chk-field .iti__selected-flag:focus {
  background: rgba(20, 20, 20, 0.04);
}

.chk-field .iti__selected-dial-code {
  margin-left: 6px;
  font-weight: 500;
  color: var(--mkt-ink);
  font-size: 0.95rem;
}

.chk-field .iti__arrow {
  border-top-color: var(--mkt-ink);
  opacity: 0.55;
}

.chk-field .iti input.form-control,
.chk-field .iti input[type="tel"] {
  width: 100% !important;
  /* Beat global .form-control { padding: … !important } so the flag isn’t covered */
  padding-top: 0.7rem !important;
  padding-bottom: 0.7rem !important;
  padding-right: 0.85rem !important;
  padding-left: 52px !important;
}

.chk-field .iti.iti--separate-dial-code input.form-control,
.chk-field .iti.iti--separate-dial-code input[type="tel"] {
  /* Room for flag + “+31” (intl-tel-input can’t win against global !important) */
  padding-left: 96px !important;
}

.chk-field .iti.iti--separate-dial-code .iti__selected-flag {
  background: rgba(20, 20, 20, 0.03);
  border-right: 1.5px solid rgba(20, 20, 20, 0.12);
}

/* List lives inside the flag container — width:100% was only as wide as “+31” */
.chk-field .iti__country-list {
  z-index: 30 !important;
  position: absolute !important;
  left: 0;
  right: auto;
  width: max-content;
  min-width: 280px;
  max-width: min(360px, calc(100vw - 2rem));
  border-radius: 12px;
  border: 1.5px solid rgba(20, 20, 20, 0.15);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  max-height: 240px;
  overflow-y: auto;
  white-space: nowrap;
  background: #fff;
}

.chk-field .iti__country {
  padding: 0.5rem 0.85rem;
}

.chk-field .iti__country-name,
.chk-field .iti__dial-code {
  white-space: nowrap;
}

/* —— Payment rows —— */
.chk-pay-row {
  display: block;
  margin-bottom: 0.65rem;
  cursor: pointer;
}

.chk-pay-card {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.95rem 1rem;
  background: #fff;
  border: 1.5px solid rgba(20, 20, 20, 0.12) !important;
  border-radius: 14px !important;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.chk-pay-row:has(input:checked) .chk-pay-card,
.chk-pay-card.is-selected,
.chk-pay-card.selected {
  background: #eef2ff !important;
  border-color: #2c40ab !important;
}

.chk-pay-radio {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.chk-pay-dot {
  width: 18px;
  height: 18px;
  border-radius: 999px !important;
  border: 2px solid rgba(20, 20, 20, 0.35);
  flex-shrink: 0;
  position: relative;
}

.chk-pay-row:has(input:checked) .chk-pay-dot,
.chk-pay-card.is-selected .chk-pay-dot {
  border-color: #2c40ab;
}

.chk-pay-row:has(input:checked) .chk-pay-dot::after,
.chk-pay-card.is-selected .chk-pay-dot::after {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 999px;
  background: #2c40ab;
}

.chk-pay-icon {
  font-size: 1.25rem;
  color: var(--mkt-ink);
}

.chk-pay-label {
  flex: 1;
  font-weight: 600;
  font-size: 0.95rem;
}

.chk-pay-fee {
  font-weight: 400;
  color: var(--mkt-muted);
  font-size: 0.88rem;
}

.chk-pay-total {
  font-weight: 700;
  white-space: nowrap;
}

.chk-details-chip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  background: #ebe6dc;
  border-radius: 14px !important;
  padding: 0.85rem 1rem;
  margin-top: 1.25rem;
  font-size: 0.9rem;
}

.chk-details-chip strong {
  display: block;
}

.chk-details-chip button,
.chk-details-chip .chk-edit-link {
  background: none;
  border: none;
  font-weight: 600;
  text-decoration: underline;
  cursor: pointer;
  color: var(--mkt-ink);
  padding: 0;
}

/* —— Ticket summary sidebar —— */
.chk-summary {
  --notch: 11px;
  --tear-from-bottom: 7.6rem;
  position: sticky;
  top: 1.25rem;
  background: #fff;
  border: 2.5px solid var(--mkt-ink) !important;
  border-radius: 18px !important;
  padding: 1.35rem 1.25rem 1.1rem;
  overflow: hidden;
  -webkit-mask:
    radial-gradient(circle var(--notch) at 0% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%) right;
  -webkit-mask-size: 51.5% 100%;
  -webkit-mask-repeat: no-repeat;
  mask:
    radial-gradient(circle var(--notch) at 0% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%) right;
  mask-size: 51.5% 100%;
  mask-repeat: no-repeat;
}

.chk-summary-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: 1.25rem;
  margin: 0 0 0.85rem;
  letter-spacing: -0.02em;
}

.chk-summary-event {
  font-weight: 700;
  margin: 0 0 0.2rem;
}

.chk-summary-meta {
  font-size: 0.85rem;
  color: var(--mkt-muted);
  margin: 0 0 0.95rem;
  line-height: 1.4;
}

.chk-summary-divider {
  border: none;
  border-top: 1px solid rgba(20, 20, 20, 0.12);
  margin: 0 0 0.85rem;
}

.chk-summary-lines {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  margin-bottom: 0.75rem;
  font-size: 0.92rem;
}

.chk-summary-line {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
}

.chk-summary-note {
  font-size: 0.8rem;
  color: #8a8680;
  margin: 0 0 0.85rem;
  display: flex;
  align-items: flex-start;
  gap: 0.35rem;
}

.chk-summary-tear {
  position: absolute;
  left: 1.25rem;
  right: 1.25rem;
  bottom: var(--tear-from-bottom);
  height: 0;
  border-top: 1.5px dashed rgba(20, 20, 20, 0.35);
  pointer-events: none;
}

.chk-summary-total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.75rem;
  margin: 1.15rem 0 0.95rem;
  font-weight: 700;
}

.chk-summary-total strong {
  font-size: 1.45rem;
  letter-spacing: -0.02em;
}

body.checkout-flow .chk-btn-lime,
body.checkout-flow a.chk-btn-lime,
body.checkout-flow button.chk-btn-lime {
  align-items: center !important;
  justify-content: center !important;
  gap: 0.35rem;
  width: 100%;
  background: var(--mkt-lime) !important;
  color: var(--mkt-ink) !important;
  border-radius: 999px !important;
  padding: 0.85rem 1.15rem !important;
  font-weight: 700 !important;
  font-size: 0.98rem !important;
  text-decoration: none !important;
  border: none !important;
  box-shadow: none !important;
  cursor: pointer;
}

body.checkout-flow button.chk-btn-lime {
  display: inline-flex;
}

body.checkout-flow button.chk-btn-lime[style*="display: none"],
body.checkout-flow button.chk-btn-lime[hidden] {
  display: none !important;
}

body.checkout-flow .chk-btn-lime:hover {
  filter: brightness(0.96);
  color: var(--mkt-ink) !important;
}

body.checkout-flow .chk-btn-lime:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.chk-back-link {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  margin-top: 1.25rem;
  font-weight: 600;
  color: var(--mkt-ink);
  text-decoration: none;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  font-size: 0.92rem;
}

.chk-back-link:hover {
  color: var(--mkt-blue);
}

.chk-terms {
  text-align: right;
  font-size: 0.8rem;
  color: #8a8680;
  margin: 1.5rem 0 0;
}

.chk-terms a {
  color: inherit;
  text-decoration: underline;
}

.chk-footer {
  background: var(--mkt-forest) !important;
  color: #fff;
  padding: 2rem 0;
  margin-top: 2rem;
}

.chk-footer-inner {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}

.chk-footer-links {
  display: flex;
  gap: 0.5rem 1.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.chk-footer-links a {
  color: #fff !important;
  text-decoration: none;
  font-weight: 500;
}

.chk-footer-links a:hover {
  text-decoration: underline;
}

.chk-n-arrow {
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
}

.ticket-validation-error,
.payment-validation-error {
  border-radius: 12px !important;
}

.step-content {
  display: none;
}

@media (max-width: 900px) {
  .chk-grid {
    grid-template-columns: 1fr;
  }

  .chk-summary {
    position: static;
    order: 2;
  }

  .chk-main {
    order: 1;
  }

  .chk-summary {
    --tear-from-bottom: 7.4rem;
  }

  .chk-progress-connector {
    width: 20px;
  }

  .chk-banner-inner {
    align-items: flex-start;
  }
}

/* —— Booking confirmation —— */
.chk-success-hero {
  background: linear-gradient(180deg, #d9d4f0 0%, #e4e0f5 100%);
  padding: 2.5rem 0 2rem;
  text-align: center;
}

.chk-success-hero-inner {
  max-width: 36rem;
  margin: 0 auto;
}

.chk-success-check {
  width: 64px;
  height: 64px;
  margin: 0 auto 1.1rem;
  border-radius: 999px !important;
  background: var(--mkt-forest);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.chk-success-check i {
  font-size: 2.35rem;
  line-height: 1;
  display: block;
  margin-top: 0.08em; /* optical center for bi-check-lg */
}

.chk-success-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: clamp(1.85rem, 4vw, 2.35rem);
  letter-spacing: -0.03em;
  margin: 0 0 0.45rem;
  color: var(--mkt-ink) !important;
}

.chk-success-lead {
  margin: 0;
  font-size: 1.05rem;
  color: var(--mkt-muted);
  line-height: 1.45;
}

.chk-success-lead strong {
  color: var(--mkt-ink);
  font-weight: 700;
}

.chk-success .chk-progress {
  padding-top: 1.75rem;
}

.chk-success .chk-progress-label {
  color: var(--mkt-ink);
  font-weight: 600;
}

.chk-success-body {
  padding-top: 1.25rem;
  padding-bottom: 2.5rem;
}

.chk-success-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, 0.75fr);
  gap: 1.5rem 1.75rem;
  align-items: start;
}

.chk-confirm-ticket {
  --notch: 11px;
  position: relative;
  background: transparent;
  border: none !important;
  border-radius: 0 !important;
  overflow: visible;
}

.chk-confirm-ticket-top {
  padding: 1.35rem 1.35rem 1.35rem;
  background: #fff;
  border: 2px solid var(--mkt-ink) !important;
  border-bottom: none !important;
  border-radius: 18px 18px 0 0 !important;
  overflow: hidden;
  -webkit-mask:
    radial-gradient(circle var(--notch) at 0% 100%, transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% 100%, transparent 98%, #000 100%) right;
  -webkit-mask-size: 51.5% 100%;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: left, right;
  mask:
    radial-gradient(circle var(--notch) at 0% 100%, transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% 100%, transparent 98%, #000 100%) right;
  mask-size: 51.5% 100%;
  mask-repeat: no-repeat;
  mask-position: left, right;
}

.chk-confirm-event {
  display: flex;
  gap: 1.15rem;
  align-items: flex-start;
}

.chk-confirm-thumb {
  width: 112px;
  height: 112px;
  border-radius: 12px !important;
  overflow: hidden;
  flex-shrink: 0;
  background: var(--mkt-forest);
}

.chk-confirm-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 0 !important;
}

.chk-confirm-event-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: 1.45rem;
  letter-spacing: -0.02em;
  margin: 0 0 0.75rem;
  color: var(--mkt-ink) !important;
  line-height: 1.2;
}

.chk-confirm-meta {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.chk-organiser {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 2rem;
  padding: 1.5rem 0 0.5rem;
  border-top: 1px solid rgba(20, 20, 20, 0.12);
}

.chk-organiser-left {
  display: flex;
  align-items: center;
  gap: 0.85rem;
}

.chk-organiser-avatar {
  width: 48px;
  height: 48px;
  border-radius: 999px !important;
  overflow: hidden;
  background: #fff;
  flex-shrink: 0;
  border: 2px solid rgba(20, 20, 20, 0.08) !important;
}

.chk-organiser-avatar img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  border-radius: 0 !important;
  padding: 4px;
  box-sizing: border-box;
}

.chk-organiser-avatar-fallback {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--mkt-forest);
  color: #fff;
  font-weight: 700;
  font-size: 1rem;
}

.chk-organiser-label {
  font-weight: 600;
  color: var(--mkt-ink);
  margin: 0;
}

.chk-organiser-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-weight: 600;
  color: var(--mkt-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.chk-organiser-link:hover {
  color: var(--mkt-blue);
}

.chk-confirm-meta li {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  font-size: 0.92rem;
  color: var(--mkt-ink);
  line-height: 1.35;
}

.chk-confirm-meta i {
  color: var(--mkt-muted);
  margin-top: 0.1rem;
  flex-shrink: 0;
}

.chk-confirm-tear {
  display: none; /* perforation is the join between top/bottom halves */
}

.chk-confirm-ticket-bottom {
  padding: 1.35rem 1.35rem 1.4rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  background: #fff;
  border: 2px solid var(--mkt-ink) !important;
  border-top: 1.5px dashed rgba(20, 20, 20, 0.45) !important;
  border-radius: 0 0 18px 18px !important;
  overflow: hidden;
  -webkit-mask:
    radial-gradient(circle var(--notch) at 0% 0%, transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% 0%, transparent 98%, #000 100%) right;
  -webkit-mask-size: 51.5% 100%;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: left, right;
  mask:
    radial-gradient(circle var(--notch) at 0% 0%, transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% 0%, transparent 98%, #000 100%) right;
  mask-size: 51.5% 100%;
  mask-repeat: no-repeat;
  mask-position: left, right;
}

.chk-confirm-code-label {
  margin: 0 0 0.75rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--mkt-muted);
}

.chk-confirm-code-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  max-width: 24rem;
  margin: 0 auto 0.7rem;
}

.chk-confirm-code {
  flex: 1;
  background: #e8edf5;
  border-radius: 12px !important;
  padding: 1rem 1.15rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 1.85rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: var(--mkt-ink);
  line-height: 1.15;
}

.chk-confirm-copy {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  background: none;
  border: none !important;
  border-radius: 0 !important;
  padding: 0.25rem 0;
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--mkt-ink);
  cursor: pointer;
  white-space: nowrap;
  box-shadow: none !important;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.chk-confirm-copy:hover {
  color: var(--mkt-blue);
  background: none;
}

.chk-confirm-code-hint {
  margin: 0 0 1.15rem;
  font-size: 0.88rem;
  color: #8a8680;
}

body.checkout-flow a.chk-confirm-manage,
body.checkout-flow .chk-confirm-manage {
  display: inline-flex !important;
  margin-top: 0.15rem;
}

.chk-confirm-manage-hint {
  margin: 0.75rem 0 0;
  font-size: 0.85rem;
  color: #8a8680;
}

.chk-success-aside {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.chk-success-panel {
  padding: 1.2rem 1.25rem;
}

.chk-success-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
}

.chk-success-panel-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: 1.05rem;
  margin: 0;
  letter-spacing: -0.015em;
  color: var(--mkt-ink) !important;
}

.chk-success-panel > .chk-success-panel-title {
  margin-bottom: 0.85rem;
}

.chk-paid-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  background: #dff3c8;
  color: #1f4d32;
  font-size: 0.78rem;
  font-weight: 700;
  padding: 0.28rem 0.55rem 0.28rem 0.4rem;
  border-radius: 999px !important;
  line-height: 1;
}

.chk-paid-badge i {
  font-size: 0.95rem;
}

.chk-summary-line--discount {
  color: #0d3d38;
}

.chk-success-total {
  margin: 0.35rem 0 0;
}

.chk-booked-by {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

.chk-booked-by-icon {
  width: 40px;
  height: 40px;
  border-radius: 999px !important;
  background: #ebe6dc;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--mkt-ink);
  font-size: 1.2rem;
  flex-shrink: 0;
}

.chk-booked-by-name {
  margin: 0 0 0.1rem;
  font-weight: 700;
  font-size: 0.98rem;
}

.chk-booked-by-email {
  margin: 0;
  color: var(--mkt-muted);
  font-size: 0.9rem;
  word-break: break-word;
}

.chk-success-email {
  display: flex;
  align-items: flex-start;
  gap: 0.9rem;
  margin-top: 1.75rem;
  padding: 1.1rem 1.25rem;
  background: #e4ecfb;
  border-radius: 14px !important;
}

.chk-success-email-icon {
  width: 40px;
  height: 40px;
  border-radius: 999px !important;
  border: 1.5px solid var(--mkt-blue);
  color: var(--mkt-blue);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 1.1rem;
  background: #fff;
}

.chk-success-email-title {
  margin: 0 0 0.15rem;
  font-weight: 700;
  font-size: 0.98rem;
  color: var(--mkt-ink);
}

.chk-success-email-text {
  margin: 0;
  font-size: 0.92rem;
  color: var(--mkt-muted);
  line-height: 1.4;
}

.chk-success-nav {
  margin-top: 2rem;
  text-align: center;
}

.chk-success-nav-primary {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-weight: 700;
  color: var(--mkt-blue) !important;
  text-decoration: none;
  font-size: 1rem;
  margin-bottom: 0.85rem;
}

.chk-success-nav-primary:hover {
  text-decoration: underline;
}

.chk-success-nav-secondary {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.55rem 0.75rem;
  font-size: 0.92rem;
}

.chk-success-nav-secondary a {
  color: var(--mkt-muted);
  text-decoration: none;
  font-weight: 500;
}

.chk-success-nav-secondary a:hover {
  color: var(--mkt-blue);
  text-decoration: underline;
}

.chk-success-nav-sep {
  color: #c5c1b8;
}

.chk-footer-brand {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  max-width: 28rem;
}

.chk-footer-note,
.chk-footer-copy {
  margin: 0;
  font-size: 0.82rem;
  color: rgba(255, 255, 255, 0.78);
  line-height: 1.4;
}

.chk-footer-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.55rem;
  text-align: right;
}

.chk-success .chk-footer {
  margin-top: 0;
}

body.checkout-flow a.chk-btn-lime {
  display: inline-flex !important;
}

@media (max-width: 900px) {
  .chk-success-grid {
    grid-template-columns: 1fr;
  }

  .chk-confirm-event {
    flex-direction: column;
  }

  .chk-confirm-thumb {
    width: 96px;
    height: 96px;
  }

  .chk-confirm-code-row {
    flex-wrap: wrap;
    max-width: none;
  }

  .chk-footer-right {
    align-items: flex-start;
    text-align: left;
  }
}

@media (max-width: 540px) {
  .chk-success-hero {
    padding: 2rem 0 1.5rem;
  }

  .chk-confirm-ticket-top,
  .chk-confirm-ticket-bottom {
    padding-left: 1.1rem;
    padding-right: 1.1rem;
  }

  .chk-confirm-code {
    font-size: 1.55rem;
    letter-spacing: 0.1em;
  }

  .chk-organiser {
    flex-direction: column;
    align-items: flex-start;
  }
}
@charset "UTF-8";
/* line 1, app/assets/stylesheets/custom.css.scss */
.upcoming-events-section {
  background-color: #01393a;
  padding: 20px 0;
}

/* line 6, app/assets/stylesheets/custom.css.scss */
.upcoming-events-container {
  padding: 28px;
  padding-bottom: 20px;
}

/* line 11, app/assets/stylesheets/custom.css.scss */
.upcoming-events-heading {
  color: #ffffff !important;
}

/* line 15, app/assets/stylesheets/custom.css.scss */
.upcoming-event-card {
  background-color: #e2ddc5 !important;
  border: none !important;
}

/* line 20, app/assets/stylesheets/custom.css.scss */
.upcoming-event-card,
.upcoming-event-card * {
  background-color: #e2ddc5 !important;
}

/* line 25, app/assets/stylesheets/custom.css.scss */
.upcoming-event-card-body,
.upcoming-event-card-image,
.upcoming-event-card-placeholder {
  background-color: #e2ddc5 !important;
}

/* line 31, app/assets/stylesheets/custom.css.scss */
.upcoming-event-card-image {
  height: 240px;
  object-fit: cover;
  padding: 30px 30px 10px 30px;
}

/* line 37, app/assets/stylesheets/custom.css.scss */
.upcoming-event-card-placeholder {
  height: 240px;
  padding: 30px 30px 10px 30px;
}

/* line 42, app/assets/stylesheets/custom.css.scss */
.upcoming-event-card-placeholder-icon {
  font-size: 3rem;
}

/* line 46, app/assets/stylesheets/custom.css.scss */
.upcoming-event-title {
  font-size: 1.1rem;
  line-height: 1.3;
}

/* line 50, app/assets/stylesheets/custom.css.scss */
.invitation-next-steps {
  padding-top: 28px;
  padding-left: 28px;
  padding-right: 28px;
}

/* Galano Grotesque – Regular 400 (Base Cut - Single-Story 'a') */
@font-face {
  font-family: "Galano Grotesque";
  src: url(https://staging.ntrada.io/assets/galano-grotesque/galano-grotesque-regular-b4d308f92f702bc3e5b837843aa5c70f3b3a5a72b290dc848555a16d900938f6.otf) format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Galano Grotesque – Bold 700 */
@font-face {
  font-family: "Galano Grotesque";
  src: url(https://staging.ntrada.io/assets/galano-grotesque/galano-grotesque-bold-0ffaf3ab6a2be97a52a214b0ddfeff21aa630b9bc633716a0225c195514efc3b.otf) format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Galano Grotesque – Light 300 */
@font-face {
  font-family: "Galano Grotesque";
  src: url(https://staging.ntrada.io/assets/galano-grotesque/galano-grotesque-light-a929d97af2c717577eb23f23569615015fc5c87640274a5a34a06ddb44143ee0.otf) format("opentype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

/* Galano Grotesque – Medium 500 */
@font-face {
  font-family: "Galano Grotesque";
  src: url(https://staging.ntrada.io/assets/galano-grotesque/galano-grotesque-medium-4b8e7d4ff67714e36602a42eadbb71212856ef5cccc4c6ba680a68e94776e1e8.otf) format("opentype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* Galano Grotesque – Semi Bold 600 */
@font-face {
  font-family: "Galano Grotesque";
  src: url(https://staging.ntrada.io/assets/galano-grotesque/galano-grotesque-semibold-0100752058ff5fb6e529ae419f7474588717ed7afe1bb8a75ff50b1dc7a2483b.otf) format("opentype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* CSS Variables for Bootstrap Overrides */
/* line 105, app/assets/stylesheets/custom.css.scss */
:root {
  --font-primary: Galano Grotesque, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif;
  --font-display: Galano Grotesque, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif;
  --bs-body-font-family: "Galano Grotesque", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  /* Primary Brand Colors */
  --color-dark-blue: #4aa3df;
  --color-light-blue: #ABC3FF;
  --color-coral: #f97316;
  --color-off-white: #fffded;
  --color-card-bg-light: #f9f9f9;
  --color-warm-gray: #f8f9fa;
  --color-text-dark: #333;
  --color-text-muted: #6c757d;
  --color-charcoal: #282627;
  --color-red: #C34725;
  /* Bootstrap Overrides */
  --bs-primary: #2c40ab !important;
  --bs-primary-rgb: 44, 64, 171 !important;
  --bs-link-color: #2c40ab !important;
  --bs-link-hover-color: darken($color-button-primary, 20%) !important;
  /* Additional Brand Colors */
  --color-success: #e1ef96;
  --color-info: #4aa3df;
  --color-warning: #ffd43b;
  --color-danger: #ff6b6b;
}

/* Ensure proper font weights for navigation */
/* line 136, app/assets/stylesheets/custom.css.scss */
.navbar-brand {
  font-family: "Galano Grotesque", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 400 !important;
  /* Regular weight for navbar brand */
}

/* line 141, app/assets/stylesheets/custom.css.scss */
.navbar-nav .nav-link {
  font-family: "Galano Grotesque", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 400 !important;
  /* Regular weight for nav links */
}

/* line 146, app/assets/stylesheets/custom.css.scss */
.fw-bold {
  font-weight: 700 !important;
  /* Ensure Bold class uses Bold weight */
}

/* Global Typography Overrides */
/* line 151, app/assets/stylesheets/custom.css.scss */
html {
  --bs-font-sans-serif: Galano Grotesque, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif !important;
  --bs-body-font-family: Galano Grotesque, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif !important;
  --bs-primary: #2c40ab !important;
  --bs-primary-rgb: 44, 64, 171 !important;
  --bs-link-color: #2c40ab !important;
  --bs-link-hover-color: darken($color-button-primary, 20%) !important;
  letter-spacing: 0.025em;
}

/* line 161, app/assets/stylesheets/custom.css.scss */
html * {
  font-family: "Galano Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}

/* Force override on specific Bootstrap elements */
/* line 166, app/assets/stylesheets/custom.css.scss */
body, .navbar, .btn, .form-control, .card, .alert, .modal, .dropdown-menu {
  font-family: "Galano Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}

/* Simple Background */
/* line 171, app/assets/stylesheets/custom.css.scss */
.geometric-pattern {
  background-color: #fffded;
}

/* Base Styles */
/* line 176, app/assets/stylesheets/custom.css.scss */
body {
  font-family: "Galano Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 400;
  line-height: 1.6;
  color: #333 !important;
  background-color: #e3ddc5 !important;
  letter-spacing: 0.025em;
}

/* line 185, app/assets/stylesheets/custom.css.scss */
.container {
  max-width: 1200px;
}

/* line 189, app/assets/stylesheets/custom.css.scss */
h1, h2, h3, h4, h5, h6 {
  font-family: "Galano Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 700;
  letter-spacing: -0.025em;
  color: #333 !important;
}

/* Modern Email-Inspired Navigation */
/* line 197, app/assets/stylesheets/custom.css.scss */
.navbar {
  background-color: #ffffff !important;
  color: #000000 !important;
  font-family: "Galano Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 500;
  box-shadow: none !important;
  padding: 1rem 0 !important;
  align-items: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* Home Page Specific Styles */
/* line 209, app/assets/stylesheets/custom.css.scss */
.cta-container {
  background: #fefefe !important;
  padding: 0 0 3rem 0 !important;
  margin: 0 !important;
  width: 100vw !important;
  margin-left: calc(-50vw + 50%) !important;
  margin-right: calc(-50vw + 50%) !important;
}

/* line 218, app/assets/stylesheets/custom.css.scss */
.cta-content h3,
.cta-content p {
  color: #000000 !important;
}

/* line 223, app/assets/stylesheets/custom.css.scss */
.feature-card h5,
.feature-card p {
  color: #000000 !important;
}

/* line 228, app/assets/stylesheets/custom.css.scss */
.feature-card .text-muted {
  color: #000000 !important;
}

/* line 232, app/assets/stylesheets/custom.css.scss */
.feature-icon i {
  color: #ffffff !important;
}

/* line 236, app/assets/stylesheets/custom.css.scss */
.feature-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 60px !important;
  height: 60px !important;
  margin: 0 auto !important;
}

/* line 245, app/assets/stylesheets/custom.css.scss */
.feature-icon i {
  color: #ffffff !important;
  font-size: 1.5rem !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* line 253, app/assets/stylesheets/custom.css.scss */
.gradient-line {
  height: 4px !important;
  background: #2c40ab !important;
  width: 100% !important;
  margin: 0 !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Ensure gradient line thickness is consistent on mobile */
@media (max-width: 768px) {
  /* line 265, app/assets/stylesheets/custom.css.scss */
  .gradient-line {
    height: 4px !important;
  }
}

/* Mobile Card Spacing - 20px margin between cards */
@media (max-width: 768px) {
  /* line 272, app/assets/stylesheets/custom.css.scss */
  .row.g-2 > * {
    margin-bottom: 20px !important;
  }
  /* line 276, app/assets/stylesheets/custom.css.scss */
  .row.g-2 > *:last-child {
    margin-bottom: 0 !important;
  }
}

/* Fix Create Event button height and alignment */
/* line 282, app/assets/stylesheets/custom.css.scss */
.cta-form .btn {
  height: 38px !important;
  padding: 0.375rem 1rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 1 !important;
  min-width: 0 !important;
  line-height: 1.5 !important;
  font-size: 1rem !important;
}

/* line 294, app/assets/stylesheets/custom.css.scss */
.cta-form .form-group {
  display: flex !important;
  flex-direction: column !important;
}

/* line 299, app/assets/stylesheets/custom.css.scss */
.cta-form .form-row {
  align-items: end !important;
}

/* line 303, app/assets/stylesheets/custom.css.scss */
.navbar-dark .navbar-nav .nav-link,
.navbar-light .navbar-nav .nav-link {
  color: #000000 !important;
  font-weight: 500;
  letter-spacing: 0.01em;
  transition: all 0.2s ease;
  border-radius: 0px;
  margin: 0 0.25rem;
  padding: 0.5rem 1rem;
  display: flex;
  align-items: center;
  line-height: 1;
  border-radius: 0px !important;
  margin: 0 2px !important;
  transition: all 0.2s ease !important;
}

/* line 315, app/assets/stylesheets/custom.css.scss */
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:hover {
  color: #2c40ab !important;
  background-color: rgba(255, 255, 255, 0.15) !important;
}

/* line 320, app/assets/stylesheets/custom.css.scss */
.navbar-dark .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .nav-link.active {
  background-color: #2c40ab !important;
  color: white !important;
  font-weight: 600 !important;
}

/* line 327, app/assets/stylesheets/custom.css.scss */
.navbar-dark .navbar-brand,
.navbar-light .navbar-brand {
  color: #000000 !important;
}

/* line 332, app/assets/stylesheets/custom.css.scss */
.navbar-brand {
  font-family: "Galano Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 900;
  font-size: 2.5rem !important;
  letter-spacing: -0.02em;
  transition: none !important;
  text-decoration: none;
  padding: 0.5rem 0;
  color: #333 !important;
  display: flex;
  align-items: center;
  line-height: 1;
}

/* line 345, app/assets/stylesheets/custom.css.scss */
.navbar-brand:hover {
  text-decoration: none;
  transform: none !important;
}

/* line 350, app/assets/stylesheets/custom.css.scss */
.navbar-brand img {
  transition: none !important;
}

/* line 353, app/assets/stylesheets/custom.css.scss */
.navbar-brand img:hover {
  transform: none !important;
}

/* line 359, app/assets/stylesheets/custom.css.scss */
.navbar-dark .navbar-brand,
.navbar-light .navbar-brand {
  color: #000000 !important;
  display: flex;
  align-items: center;
  line-height: 1;
}

/* line 366, app/assets/stylesheets/custom.css.scss */
.navbar-dark .navbar-brand:hover,
.navbar-light .navbar-brand:hover {
  color: white !important;
  text-decoration: none;
}

/* line 372, app/assets/stylesheets/custom.css.scss */
.navbar-brand i {
  font-size: 2.75rem;
  margin-right: 1rem;
  transition: all 0.3s ease;
  color: #ABC3FF !important;
  text-shadow: 0 2px 4px rgba(171, 195, 255, 0.3);
}

/* line 379, app/assets/stylesheets/custom.css.scss */
.navbar-brand i:hover {
  color: #ABC3FF !important;
}

/* line 384, app/assets/stylesheets/custom.css.scss */
.nav-link {
  font-weight: 500;
  letter-spacing: 0.01em;
  transition: all 0.2s ease;
  border-radius: 0px;
  margin: 0 0.25rem;
}

/* line 387, app/assets/stylesheets/custom.css.scss */
.nav-link:hover {
  background-color: rgba(44, 64, 171, 0.1);
  color: #2c40ab !important;
}

/* Modern Card Enhancements */
/* line 394, app/assets/stylesheets/custom.css.scss */
.card {
  border: none !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
  border-radius: 0px !important;
  background: #fffded !important;
  transition: all 0.3s ease;
  border-radius: 0px !important;
}

/* line 42, app/assets/stylesheets/_mixins.scss */
.card:hover {
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
}

/* line 399, app/assets/stylesheets/custom.css.scss */
.card-header {
  font-family: "Galano Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 600;
  background: #f8f9fa !important;
  border-bottom: 1px solid #e2e8f0 !important;
  border-radius: 0px 0px 0 0 !important;
  padding: 1.5rem !important;
}

/* Organization Page Heading with Bracket Border */
/* line 404, app/assets/stylesheets/custom.css.scss */
.organization-page-heading {
  background-color: #abc3ff !important;
  border: none !important;
  border-radius: 0px !important;
  box-shadow: none !important;
  position: relative;
}

/* line 412, app/assets/stylesheets/custom.css.scss */
.organization-page-heading::before {
  content: "";
  position: absolute;
  top: 20px;
  left: 20px;
  width: calc(100% - 40px);
  height: calc(100% - 40px);
  pointer-events: none;
  z-index: 10;
  background: linear-gradient(#000000, #000000) top/100% 6px no-repeat, linear-gradient(#000000, #000000) bottom/100% 6px no-repeat, linear-gradient(#000000, #000000) left top/6px 50px no-repeat, linear-gradient(#000000, #000000) left bottom/6px 50px no-repeat, linear-gradient(#000000, #000000) right top/6px 50px no-repeat, linear-gradient(#000000, #000000) right bottom/6px 50px no-repeat;
}

/* Organization profile text colors */
/* line 437, app/assets/stylesheets/custom.css.scss */
.organization-page-heading h1,
.organization-page-heading h2,
.organization-page-heading h3,
.organization-page-heading h4,
.organization-page-heading h5,
.organization-page-heading h6,
.organization-page-heading p,
.organization-page-heading span,
.organization-page-heading a,
.organization-page-heading .text-muted,
.organization-page-heading .fw-normal,
.organization-page-heading .fw-bold,
.organization-page-heading small,
.organization-page-heading strong {
  color: #000000 !important;
}

/* line 454, app/assets/stylesheets/custom.css.scss */
.organization-page-heading i {
  color: #000000 !important;
}

/* line 458, app/assets/stylesheets/custom.css.scss */
.organization-page-heading .btn {
  background-color: #ffffff !important;
  color: #000000 !important;
  border-color: #000000 !important;
}

/* line 464, app/assets/stylesheets/custom.css.scss */
.organization-page-heading .btn:hover {
  background-color: #f8f9fa !important;
  color: #000000 !important;
  border-color: #000000 !important;
}

/* Organization profile child elements background */
/* line 471, app/assets/stylesheets/custom.css.scss */
.organization-page-heading .card-body,
.organization-page-heading .row,
.organization-page-heading .col,
.organization-page-heading .col-md-3,
.organization-page-heading .col-md-9,
.organization-page-heading .d-flex,
.organization-page-heading .position-relative,
.organization-page-heading .d-inline-block,
.organization-page-heading .flex-grow-1 {
  background-color: #abc3ff !important;
}

/* Activity Card Button Override */
/* line 484, app/assets/stylesheets/custom.css.scss */
.btn-success {
  background-color: #e3ddc5 !important;
  background-image: none !important;
  color: #000000 !important;
}

/* line 490, app/assets/stylesheets/custom.css.scss */
.btn-success:hover {
  background-color: #e3ddc5 !important;
  background-image: none !important;
  color: #01393a !important;
}

/* line 496, app/assets/stylesheets/custom.css.scss */
.btn-success:active,
.btn-success.active {
  background-color: #e3ddc5 !important;
  background-image: none !important;
  color: #01393a !important;
}

/* line 502, app/assets/stylesheets/custom.css.scss */
.nav-pills .nav-link.active {
  background-color: #2c40ab !important;
  color: white !important;
}

/* Admin Navigation */
/* line 510, app/assets/stylesheets/custom.css.scss */
.admin-nav .nav-pills .nav-link {
  font-family: "Galano Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 500;
  color: #333;
  border-radius: 0px;
  padding: 0.75rem 1.5rem;
  transition: all 0.3s ease;
}

/* line 518, app/assets/stylesheets/custom.css.scss */
.admin-nav .nav-pills .nav-link:hover {
  background-color: rgba(44, 64, 171, 0.1);
  color: #2c40ab;
}

/* line 523, app/assets/stylesheets/custom.css.scss */
.admin-nav .nav-pills .nav-link.active {
  background-color: #2c40ab;
  color: white;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Impersonation Banner */
/* line 533, app/assets/stylesheets/custom.css.scss */
.impersonation-banner {
  position: sticky;
  top: 0;
  z-index: 1030;
  border-radius: 0;
  border-top: none;
  border-left: none;
  border-right: none;
}

/* line 542, app/assets/stylesheets/custom.css.scss */
.impersonation-banner .alert {
  margin-bottom: 0;
}

/* line 546, app/assets/stylesheets/custom.css.scss */
.impersonation-banner .btn-outline-danger {
  border-color: var(--color-red) !important;
  color: var(--color-red) !important;
}

/* line 550, app/assets/stylesheets/custom.css.scss */
.impersonation-banner .btn-outline-danger:hover {
  background-color: var(--color-red) !important;
  border-color: var(--color-red) !important;
  color: white !important;
}

/* Modern Button Enhancements */
/* line 559, app/assets/stylesheets/custom.css.scss */
.btn {
  font-family: "Galano Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 500;
  border-radius: 0px !important;
  padding: 0.75rem 1.5rem !important;
  transition: all 0.3s ease;
  border: none !important;
  position: relative;
  overflow: hidden;
}

/* line 562, app/assets/stylesheets/custom.css.scss */
.btn::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.2);
  transition: left 0.5s;
}

/* line 573, app/assets/stylesheets/custom.css.scss */
.btn:hover::before {
  left: 100%;
}

/* line 578, app/assets/stylesheets/custom.css.scss */
.btn-primary {
  background: #2c40ab !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3) !important;
  color: white !important;
  border: 2px solid #4aa3df !important;
}

/* line 27, app/assets/stylesheets/_mixins.scss */
.btn-primary:hover {
  background: #223182 !important;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4) !important;
  color: white !important;
}

/* line 582, app/assets/stylesheets/custom.css.scss */
.btn-primary:hover {
  border-color: #0f172a !important;
}

/* line 587, app/assets/stylesheets/custom.css.scss */
.btn-success {
  background-color: #e1ef96 !important;
  background-image: none !important;
  border: 2px solid #e1ef96 !important;
}

/* line 592, app/assets/stylesheets/custom.css.scss */
.btn-success:hover {
  background-color: #d4e86a !important;
  background-image: none !important;
  border-color: #d4e86a !important;
}

/* line 599, app/assets/stylesheets/custom.css.scss */
.btn-info {
  background: #4aa3df !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3) !important;
  color: white !important;
  border: 2px solid #4aa3df !important;
}

/* line 27, app/assets/stylesheets/_mixins.scss */
.btn-info:hover {
  background: #258cd1 !important;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4) !important;
  color: white !important;
}

/* line 603, app/assets/stylesheets/custom.css.scss */
.btn-info:hover {
  border-color: #155e75 !important;
}

/* line 608, app/assets/stylesheets/custom.css.scss */
.btn-warning {
  background: #ffd43b !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3) !important;
  color: white !important;
  border: 2px solid #ffd43b !important;
}

/* line 27, app/assets/stylesheets/_mixins.scss */
.btn-warning:hover {
  background: #ffc908 !important;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4) !important;
  color: white !important;
}

/* line 612, app/assets/stylesheets/custom.css.scss */
.btn-warning:hover {
  border-color: #92400e !important;
}

/* Outline Button Enhancements */
/* line 618, app/assets/stylesheets/custom.css.scss */
.btn-outline-primary {
  border: 2px solid #4aa3df !important;
  color: #4aa3df !important;
  background: transparent !important;
}

/* line 623, app/assets/stylesheets/custom.css.scss */
.btn-outline-primary:hover {
  background: #4aa3df !important;
  color: white !important;
  border-color: #4aa3df !important;
}

/* line 630, app/assets/stylesheets/custom.css.scss */
.btn-outline-success {
  border: 2px solid #e1ef96 !important;
  color: #e1ef96 !important;
  background: transparent !important;
}

/* line 635, app/assets/stylesheets/custom.css.scss */
.btn-outline-success:hover {
  background: #e1ef96 !important;
  color: white !important;
  border-color: #e1ef96 !important;
}

/* line 642, app/assets/stylesheets/custom.css.scss */
.btn-outline-info {
  border: 2px solid #4aa3df !important;
  color: #4aa3df !important;
  background: transparent !important;
}

/* line 647, app/assets/stylesheets/custom.css.scss */
.btn-outline-info:hover {
  background: #4aa3df !important;
  color: white !important;
  border-color: #4aa3df !important;
}

/* line 654, app/assets/stylesheets/custom.css.scss */
.btn-outline-warning {
  border: 2px solid #ffd43b !important;
  color: #ffd43b !important;
  background: transparent !important;
}

/* line 659, app/assets/stylesheets/custom.css.scss */
.btn-outline-warning:hover {
  background: #ffd43b !important;
  color: white !important;
  border-color: #ffd43b !important;
}

/* line 666, app/assets/stylesheets/custom.css.scss */
.btn-outline-danger {
  border: 2px solid var(--color-red) !important;
  color: var(--color-red) !important;
  background: transparent !important;
}

/* line 671, app/assets/stylesheets/custom.css.scss */
.btn-outline-danger:hover {
  background: var(--color-red) !important;
  color: white !important;
  border-color: var(--color-red) !important;
}

/* line 678, app/assets/stylesheets/custom.css.scss */
.btn-outline-secondary {
  border: 2px solid #6c757d !important;
  color: #6c757d !important;
  background: transparent !important;
}

/* line 683, app/assets/stylesheets/custom.css.scss */
.btn-outline-secondary:hover {
  background: #6c757d !important;
  color: white !important;
  border-color: #6c757d !important;
}

/* Table Enhancements */
/* line 691, app/assets/stylesheets/custom.css.scss */
.table {
  font-family: "Galano Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  border-radius: 0px;
  overflow: hidden;
}

/* line 697, app/assets/stylesheets/custom.css.scss */
.table thead th {
  font-family: "Galano Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 600;
  background: #f8f9fa !important;
  border-bottom: 2px solid #e2e8f0 !important;
  color: #333 !important;
  padding: 1rem !important;
}

/* line 706, app/assets/stylesheets/custom.css.scss */
.table tbody tr {
  transition: all 0.2s ease;
}

/* line 709, app/assets/stylesheets/custom.css.scss */
.table tbody tr:hover {
  background-color: rgba(74, 163, 223, 0.02) !important;
  transform: scale(1.01);
}

/* Badge Enhancements */
/* line 716, app/assets/stylesheets/custom.css.scss */
.badge {
  font-family: "Galano Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 500;
  border-radius: 0px !important;
  padding: 0.5rem 0.75rem !important;
  font-size: 0.875rem !important;
}

/* line 720, app/assets/stylesheets/custom.css.scss */
.badge.bg-primary {
  background: #2c40ab !important;
  color: white !important;
}

/* line 724, app/assets/stylesheets/custom.css.scss */
.badge.bg-success {
  background: #e1ef96 !important;
  color: white !important;
}

/* line 728, app/assets/stylesheets/custom.css.scss */
.badge.bg-info {
  background: #4aa3df !important;
  color: white !important;
  color: white !important;
}

/* line 733, app/assets/stylesheets/custom.css.scss */
.badge.bg-info i {
  color: white !important;
}

/* line 737, app/assets/stylesheets/custom.css.scss */
.badge.bg-warning {
  background: #ffd43b !important;
  color: white !important;
}

/* line 741, app/assets/stylesheets/custom.css.scss */
.badge.bg-danger {
  background: #DC3545 !important;
  color: white !important;
  color: white !important;
}

/* line 746, app/assets/stylesheets/custom.css.scss */
.badge.bg-danger i {
  color: white !important;
}

/* Form Enhancements */
/* line 751, app/assets/stylesheets/custom.css.scss */
.form-control, .form-select {
  font-family: "Galano Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  border-radius: 0px !important;
  border: 2px solid #e2e8f0 !important;
  transition: all 0.3s ease;
  padding: 0.75rem 1rem !important;
  background-color: #fffded !important;
}

/* line 65, app/assets/stylesheets/_mixins.scss */
.form-control:focus, .form-select:focus {
  border-color: #4aa3df !important;
  box-shadow: 0 0 0 0.25rem rgba(26, 54, 93, 0.1) !important;
  background-color: white !important;
}

/* line 755, app/assets/stylesheets/custom.css.scss */
.form-label {
  font-family: "Galano Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 600;
  color: #333 !important;
  margin-bottom: 0.5rem;
}

/* Alert Enhancements */
/* line 763, app/assets/stylesheets/custom.css.scss */
.alert {
  border: none !important;
  border-radius: 0px !important;
  font-family: "Galano Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  padding: 1rem 1.5rem !important;
}

/* line 767, app/assets/stylesheets/custom.css.scss */
.alert-success {
  background: rgba(225, 239, 150, 0.1) !important;
  color: #e1ef96 !important;
  border-left: 4px solid #e1ef96 !important;
}

/* line 771, app/assets/stylesheets/custom.css.scss */
.alert-danger {
  background: rgba(255, 107, 107, 0.1) !important;
  color: #ff6b6b !important;
  border-left: 4px solid #ff6b6b !important;
}

/* line 775, app/assets/stylesheets/custom.css.scss */
.alert-info {
  background: rgba(74, 163, 223, 0.1) !important;
  color: #4aa3df !important;
  border-left: 4px solid #4aa3df !important;
}

/* Dropdown Enhancements */
/* line 780, app/assets/stylesheets/custom.css.scss */
.dropdown-menu {
  border: none !important;
  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1) !important;
  border-radius: 0px !important;
  background: #fffded !important;
}

/* line 787, app/assets/stylesheets/custom.css.scss */
.dropdown-item {
  font-family: "Galano Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 500;
  padding: 0.75rem 1rem;
  transition: all 0.2s ease;
}

/* line 793, app/assets/stylesheets/custom.css.scss */
.dropdown-item:hover {
  background-color: rgba(74, 163, 223, 0.05) !important;
  color: #4aa3df !important;
}

/* Modern Email-Inspired Cards */
/* line 800, app/assets/stylesheets/custom.css.scss */
.card {
  background: transparent !important;
  border: 1px solid #dee2e6 !important;
  border-radius: 0px !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
  transition: all 0.3s ease;
}

/* line 807, app/assets/stylesheets/custom.css.scss */
.card:hover {
  box-shadow: none !important;
  border-color: #4aa3df !important;
}

/* Statistics Cards with Gradients */
/* line 814, app/assets/stylesheets/custom.css.scss */
.card.bg-primary, .card.bg-success, .card.bg-info, .card.bg-warning {
  border: none !important;
  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1) !important;
  border-radius: 0px !important;
  overflow: hidden;
  position: relative;
  border-left: 4px solid;
}

/* line 823, app/assets/stylesheets/custom.css.scss */
.card.bg-primary {
  background: #2c40ab !important;
  color: white !important;
  border-left-color: #258cd1 !important;
}

/* line 829, app/assets/stylesheets/custom.css.scss */
.card.bg-success {
  background: #e1ef96 !important;
  color: white !important;
  border-left-color: #d4e86a !important;
}

/* line 835, app/assets/stylesheets/custom.css.scss */
.card.bg-info {
  background: #4aa3df !important;
  color: white !important;
  border-left-color: #258cd1 !important;
}

/* line 841, app/assets/stylesheets/custom.css.scss */
.card.bg-warning {
  background: #ffd43b !important;
  color: white !important;
  border-left-color: #ffc908 !important;
}

/* Page Headers */
/* line 848, app/assets/stylesheets/custom.css.scss */
h1 {
  font-size: 2.5rem;
  margin-bottom: 1.5rem;
  color: #333 !important;
}

/* line 854, app/assets/stylesheets/custom.css.scss */
h2 {
  font-size: 2rem;
  margin-bottom: 1.25rem;
  color: #333 !important;
}

/* line 860, app/assets/stylesheets/custom.css.scss */
h3 {
  font-size: 1.75rem;
  margin-bottom: 1rem;
  color: #333 !important;
}

/* Modern Breadcrumb */
/* line 867, app/assets/stylesheets/custom.css.scss */
.breadcrumb {
  background: #f8f9fa !important;
  border-radius: 0px !important;
  padding: 1rem 1.5rem !important;
  margin-bottom: 2rem !important;
}

/* line 873, app/assets/stylesheets/custom.css.scss */
.breadcrumb-item + .breadcrumb-item::before {
  color: #6c757d !important;
}

/* Breadcrumb with custom background */
/* line 879, app/assets/stylesheets/custom.css.scss */
.breadcrumb-custom-bg {
  background-color: #abc3ff !important;
  padding: 1rem 0 !important;
}

/* line 883, app/assets/stylesheets/custom.css.scss */
.breadcrumb-custom-bg .breadcrumb {
  background: transparent !important;
  margin-bottom: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* line 892, app/assets/stylesheets/custom.css.scss */
.breadcrumb-custom-bg .breadcrumb-item {
  color: inherit;
  letter-spacing: 0.01em !important;
  /* Slight letter spacing for better readability */
  display: flex !important;
  align-items: center !important;
}

/* line 898, app/assets/stylesheets/custom.css.scss */
.breadcrumb-custom-bg .breadcrumb-item a {
  color: inherit;
  text-decoration: none;
  display: inline-block;
  letter-spacing: 0.01em !important;
}

/* line 904, app/assets/stylesheets/custom.css.scss */
.breadcrumb-custom-bg .breadcrumb-item a:hover {
  color: #1256ff;
  text-decoration: underline;
}

/* line 910, app/assets/stylesheets/custom.css.scss */
.breadcrumb-custom-bg .breadcrumb-item.active {
  padding: 0.25rem 0.5rem !important;
  letter-spacing: 0.01em !important;
}

/* Non-retina screen optimizations for breadcrumbs */
@media screen and (-webkit-max-device-pixel-ratio: 1) {
  /* line 920, app/assets/stylesheets/custom.css.scss */
  .breadcrumb-custom-bg .breadcrumb-item {
    letter-spacing: 0.02em !important;
    /* More letter spacing for non-retina */
    display: flex !important;
    align-items: center !important;
  }
  /* line 925, app/assets/stylesheets/custom.css.scss */
  .breadcrumb-custom-bg .breadcrumb-item a {
    letter-spacing: 0.02em !important;
    font-weight: 500 !important;
    /* Slightly bolder for better visibility */
  }
  /* line 930, app/assets/stylesheets/custom.css.scss */
  .breadcrumb-custom-bg .breadcrumb-item.active {
    padding: 0.375rem 0.625rem !important;
    letter-spacing: 0.02em !important;
    font-weight: 500 !important;
  }
}

/* Activity Card Specific Styles */
/* line 940, app/assets/stylesheets/custom.css.scss */
.activity-card {
  background: #fffded !important;
  border: 1px solid #e2e8f0 !important;
}

/* line 945, app/assets/stylesheets/custom.css.scss */
.occurrence-item {
  background: #f8f9fa !important;
  border-radius: 0px !important;
  padding: 1.5rem !important;
  margin-bottom: 1rem !important;
  border: 1px solid #e2e8f0 !important;
  transition: all 0.3s ease;
}

/* line 953, app/assets/stylesheets/custom.css.scss */
.occurrence-item:hover {
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
  border-color: #ABC3FF !important;
}

/* line 959, app/assets/stylesheets/custom.css.scss */
.stats-number {
  font-size: 2rem;
  font-weight: 700;
  font-family: "Galano Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}

/* line 965, app/assets/stylesheets/custom.css.scss */
.stats-label {
  font-size: 0.875rem;
  color: #6c757d !important;
  font-weight: 500;
}

/* Booking Card Specific Styles */
/* line 972, app/assets/stylesheets/custom.css.scss */
.booking-card {
  background: #fffded !important;
  border: 1px solid #e2e8f0 !important;
  transition: all 0.3s ease;
}

/* line 977, app/assets/stylesheets/custom.css.scss */
.booking-card:hover {
  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1) !important;
  border-color: #ABC3FF !important;
}

/* line 982, app/assets/stylesheets/custom.css.scss */
.booking-card.confirmed {
  border-left: 4px solid #e1ef96 !important;
}

/* line 986, app/assets/stylesheets/custom.css.scss */
.booking-card.pending {
  border-left: 4px solid #ffd43b !important;
}

/* Modern Email-Inspired Headers */
/* line 992, app/assets/stylesheets/custom.css.scss */
.header-gradient {
  background: #2c40ab !important;
  color: white !important;
  padding: 30px !important;
  text-align: center;
  border-radius: 0px 0px 0px 0px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15);
  position: relative;
  overflow: hidden;
}

/* line 1002, app/assets/stylesheets/custom.css.scss */
.header-gradient h1, .header-gradient h2, .header-gradient h3, .header-gradient p, .header-gradient .lead {
  color: white !important;
  margin: 0;
}

/* line 1007, app/assets/stylesheets/custom.css.scss */
.header-gradient h1 {
  font-size: 1.75rem;
  font-weight: 700;
}

/* line 1012, app/assets/stylesheets/custom.css.scss */
.header-gradient p {
  margin: 10px 0 0 0;
  opacity: 0.9;
  font-size: 1rem;
}

/* Page Headers with Email-Style Design */
/* line 1020, app/assets/stylesheets/custom.css.scss */
.page-header {
  background: #2c40ab !important;
  color: white !important;
  padding: 30px 40px !important;
  margin-bottom: 30px !important;
  border-radius: 0px !important;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15) !important;
}

/* line 1028, app/assets/stylesheets/custom.css.scss */
.page-header h1, .page-header h2, .page-header h3 {
  color: white !important;
  margin-bottom: 10px;
}

/* line 1033, app/assets/stylesheets/custom.css.scss */
.page-header .breadcrumb {
  background: rgba(255, 255, 255, 0.1) !important;
  border-radius: 0px !important;
  padding: 12px 16px !important;
  margin-top: 15px !important;
}

/* line 1040, app/assets/stylesheets/custom.css.scss */
.page-header .breadcrumb-item {
  color: rgba(255, 255, 255, 0.9) !important;
}

/* line 1044, app/assets/stylesheets/custom.css.scss */
.page-header .breadcrumb-item.active {
  color: white !important;
}

/* Landing Page Styles */
/* line 1050, app/assets/stylesheets/custom.css.scss */
.hero-section {
  background: #2c40ab !important;
  color: white !important;
  position: relative;
  overflow: hidden;
}

/* line 1056, app/assets/stylesheets/custom.css.scss */
.hero-section .container {
  position: relative;
  z-index: 2;
}

/* line 1061, app/assets/stylesheets/custom.css.scss */
.hero-section h1, .hero-section h2, .hero-section h3, .hero-section p, .hero-section .lead {
  color: white !important;
}

/* line 1065, app/assets/stylesheets/custom.css.scss */
.hero-section .text-muted {
  color: rgba(255, 255, 255, 0.8) !important;
}

/* line 1069, app/assets/stylesheets/custom.css.scss */
.hero-section h1 .text-warning {
  color: #f97316 !important;
  font-weight: 900;
  letter-spacing: -0.02em !important;
}

/* line 1075, app/assets/stylesheets/custom.css.scss */
.hero-section .display-3 {
  letter-spacing: 0.02em;
  word-spacing: 0.1em;
}

/* line 1080, app/assets/stylesheets/custom.css.scss */
.hero-section .lead {
  letter-spacing: 0.01em;
  word-spacing: 0.05em;
}

/* Email-Style Content Sections */
/* line 1087, app/assets/stylesheets/custom.css.scss */
.content-section {
  background: #f8f9fa !important;
  padding: 30px !important;
  border-radius: 0px 0px 0px 0px !important;
  border: 1px solid #dee2e6 !important;
  margin-top: -10px !important;
}

/* line 1094, app/assets/stylesheets/custom.css.scss */
.content-section.standalone {
  border-radius: 0px !important;
  margin-top: 0 !important;
}

/* Email-Style Detail Boxes */
/* line 1101, app/assets/stylesheets/custom.css.scss */
.detail-box {
  background: white;
  border-left: 4px solid #4aa3df;
  padding: 20px;
  margin: 20px 0;
  border-radius: 0px !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* line 1109, app/assets/stylesheets/custom.css.scss */
.detail-box.success {
  border-left-color: #e1ef96;
  background: #e3f2fd;
}

/* line 1114, app/assets/stylesheets/custom.css.scss */
.detail-box.warning {
  border-left-color: #ffd43b;
  background: #fff9c4;
}

/* line 1119, app/assets/stylesheets/custom.css.scss */
.detail-box.danger {
  border-left-color: #ff6b6b;
  background: #ffebee;
}

/* Detail Rows like in Email Template */
/* line 1126, app/assets/stylesheets/custom.css.scss */
.detail-row {
  display: flex;
  justify-content: space-between;
  padding: 10px 0;
  border-bottom: 1px solid #dee2e6;
}

/* line 1132, app/assets/stylesheets/custom.css.scss */
.detail-row:last-child {
  border-bottom: none;
}

/* line 1137, app/assets/stylesheets/custom.css.scss */
.detail-label {
  color: #6c757d;
  font-weight: 500;
}

/* line 1142, app/assets/stylesheets/custom.css.scss */
.detail-value {
  font-weight: 600;
  color: #333;
}

/* Modern Note Boxes */
/* line 1148, app/assets/stylesheets/custom.css.scss */
.note-box {
  background: #e3f2fd;
  border-left: 4px solid #4aa3df;
  padding: 15px;
  margin: 20px 0;
  border-radius: 0px !important;
  font-size: 14px;
  line-height: 1.75;
}

/* line 1157, app/assets/stylesheets/custom.css.scss */
.note-box.success {
  background: #e8f5e8;
  border-left-color: #e1ef96;
}

/* line 1162, app/assets/stylesheets/custom.css.scss */
.note-box.warning {
  background: #fff8e1;
  border-left-color: #ffd43b;
}

/* line 1168, app/assets/stylesheets/custom.css.scss */
.cta-section .card {
  background: white !important;
  border-radius: 0px !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
  border: 1px solid #dee2e6 !important;
}

/* line 1175, app/assets/stylesheets/custom.css.scss */
.cta-section h3,
.cta-section h5,
.cta-section p {
  color: #333 !important;
}

/* line 1181, app/assets/stylesheets/custom.css.scss */
.feature-icon {
  width: 80px;
  height: 80px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #2c40ab !important;
  border-radius: 50%;
  color: white !important;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* Email-Style Modern Buttons */
/* line 1195, app/assets/stylesheets/custom.css.scss */
.btn {
  border-radius: 0px !important;
  padding: 10px 20px !important;
  font-weight: 500 !important;
  transition: all 0.2s ease !important;
}

/* line 1201, app/assets/stylesheets/custom.css.scss */
.btn.btn-primary {
  background: #2c40ab !important;
  border: none !important;
  color: #333 !important;
  box-shadow: none !important;
}

/* line 1207, app/assets/stylesheets/custom.css.scss */
.btn.btn-primary:hover {
  background: #223182 !important;
  box-shadow: none !important;
}

/* line 1213, app/assets/stylesheets/custom.css.scss */
.btn.btn-outline-primary {
  border: 1px solid #2c40ab !important;
  color: #2c40ab !important;
  box-shadow: none !important;
}

/* line 1218, app/assets/stylesheets/custom.css.scss */
.btn.btn-outline-primary:hover {
  background: #2c40ab !important;
  color: #333 !important;
  box-shadow: none !important;
}

/* line 1225, app/assets/stylesheets/custom.css.scss */
.btn.btn-success {
  background-color: #e1ef96 !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* line 1231, app/assets/stylesheets/custom.css.scss */
.btn.btn-success:hover {
  background-color: #d4e86a !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* line 1238, app/assets/stylesheets/custom.css.scss */
.btn.btn-warning {
  background: #ffd43b !important;
  border: none !important;
  color: #333 !important;
  box-shadow: none !important;
}

/* line 1244, app/assets/stylesheets/custom.css.scss */
.btn.btn-warning:hover {
  background: #ffc908 !important;
  color: #333 !important;
  box-shadow: none !important;
}

/* line 1251, app/assets/stylesheets/custom.css.scss */
.btn.btn-danger {
  background: var(--color-red) !important;
  border: none !important;
  box-shadow: none !important;
}

/* line 1256, app/assets/stylesheets/custom.css.scss */
.btn.btn-danger:hover {
  background: #98371d !important;
  box-shadow: none !important;
}

/* Footer Enhancement */
/* line 1264, app/assets/stylesheets/custom.css.scss */
html {
  height: 100%;
}

/* line 1268, app/assets/stylesheets/custom.css.scss */
body {
  min-height: 100%;
  display: flex;
  flex-direction: column;
}

/* line 1274, app/assets/stylesheets/custom.css.scss */
main {
  flex: 1 0 auto;
}

/* line 1278, app/assets/stylesheets/custom.css.scss */
footer {
  background: #01393a !important;
  color: white !important;
  margin-top: 0 !important;
  font-size: 0.85rem !important;
  flex-shrink: 0;
}

/* Global Square Design - Remove all border radius */
/* line 1287, app/assets/stylesheets/custom.css.scss */
*, *::before, *::after {
  border-radius: 0px !important;
  box-shadow: none !important;
}

/* Specific div border radius removal */
/* line 1293, app/assets/stylesheets/custom.css.scss */
div, div::before, div::after {
  border-radius: 0px !important;
}

/* Override common div classes with border radius */
/* line 1298, app/assets/stylesheets/custom.css.scss */
.container, .row, .col, .col-1, .col-2, .col-3, .col-4, .col-5, .col-6,
.col-7, .col-8, .col-9, .col-10, .col-11, .col-12,
.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6,
.col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12,
.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6,
.col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12,
.col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6,
.col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
  border-radius: 0px !important;
}

/* Bracket Border Effect */
/* line 1310, app/assets/stylesheets/custom.css.scss */
.bracket-border {
  position: relative;
}

/* line 1314, app/assets/stylesheets/custom.css.scss */
.bracket-border::before {
  content: "";
  position: absolute;
  top: var(--bracket-padding, 20px);
  left: var(--bracket-padding, 20px);
  width: calc(100% - (var(--bracket-padding, 20px) * 2));
  height: calc(100% - (var(--bracket-padding, 20px) * 2));
  pointer-events: none;
  z-index: 10;
  --bracket-color: #000000 !important;
  background: linear-gradient(var(--bracket-color), var(--bracket-color)) top/100% 6px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) bottom/100% 6px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) left top/6px 50px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) left bottom/6px 50px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) right top/6px 50px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) right bottom/6px 50px no-repeat;
}

/* Profile Highlight Card */
/* line 1342, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card {
  background-color: #f9f9f9 !important;
  border: none !important;
  border-radius: 0px !important;
  box-shadow: none !important;
}

/* line 1349, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card-body {
  background-color: #ffffff !important;
  margin: 0 !important;
  padding: 30px 30px 30px 30px !important;
}

/* Ensure all children inherit white background */
/* line 1356, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card *,
.profile-highlight-card-body * {
  background-color: inherit !important;
}

/* Profile highlight card child elements background */
/* line 1362, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .row,
.profile-highlight-card .col,
.profile-highlight-card .col-md-6,
.profile-highlight-card .d-flex:not(.stats-overview-tile),
.profile-highlight-card .flex-column,
.profile-highlight-card .bg-light,
.profile-highlight-card .card-body,
.profile-highlight-card .profile-highlight-card-body,
.profile-highlight-card .pl-30,
.profile-highlight-card .mb-3,
.profile-highlight-card .mt-auto,
.profile-highlight-card .d-flex.flex-column,
.profile-highlight-card .d-flex.align-items-center:not(.stats-overview-tile),
.profile-highlight-card .d-flex.align-items-center.mb-1:not(.stats-overview-tile) {
  background-color: #f9f9f9 !important;
}

/* List group item padding */
/* line 1380, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .list-group-item {
  padding: 10px 1rem !important;
}

/* Stats overview tiles within profile highlight cards */
/* line 1385, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .stats-overview-tile {
  display: flex;
  align-items: center;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-decoration: none !important;
  color: #ffffff !important;
  background-color: transparent !important;
}

/* line 1395, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .stats-overview-tile .stats-overview-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* line 1401, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .stats-overview-tile .stats-overview-icon i {
  color: #ffffff !important;
}

/* line 1405, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .stats-overview-tile h6,
.profile-highlight-card .stats-overview-tile h3 {
  color: #ffffff !important;
}

/* line 1410, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .stats-overview-total {
  background-color: #2c40ab !important;
}

/* line 1414, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .stats-overview-pending {
  background-color: #ffd43b !important;
}

/* line 1418, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .stats-overview-accepted {
  background-color: #e1ef96 !important;
}

/* line 1422, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .stats-overview-declined {
  background-color: #c34725 !important;
}

/* line 1426, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .stats-overview-dark {
  background-color: #115e37 !important;
}

/* line 1430, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .card-header.profile-highlight-card-body {
  padding: 0 !important;
  border-bottom: none !important;
}

/* line 1435, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .card-header.profile-highlight-card-body h5 {
  padding: 30px 30px 0 30px !important;
}

/* Add top padding to card-header in booking access page to prevent text from touching bracket border */
/* line 1440, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .card-header.profile-highlight-card-body.pt-4 {
  padding-top: 28px !important;
}

/* line 1444, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .card-header.profile-highlight-card-body h4 {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Override profile-highlight-card background for light blue section - MUST be after the above rule */
/* line 1450, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card.light-blue-section .d-flex,
.profile-highlight-card.light-blue-section .mb-3,
.profile-highlight-card.light-blue-section .row,
.profile-highlight-card.light-blue-section .col,
.profile-highlight-card.light-blue-section .col-md-6,
.profile-highlight-card.light-blue-section .flex-column,
.profile-highlight-card.light-blue-section .card-body,
.profile-highlight-card.light-blue-section .profile-highlight-card-body,
.profile-highlight-card.light-blue-section .pl-30,
.profile-highlight-card.light-blue-section .mt-auto,
.profile-highlight-card.light-blue-section .d-flex.flex-column,
.profile-highlight-card.light-blue-section .d-flex.align-items-center,
.profile-highlight-card.light-blue-section .d-flex.align-items-center.mb-1 {
  background-color: #abc3ff !important;
}

/* Next Event section - more specific targeting */
/* line 1467, app/assets/stylesheets/custom.css.scss */
.row.mb-4:has(.profile-highlight-card) .col-12 {
  background-color: transparent !important;
}

/* Fallback for browsers that don't support :has() - only target rows that contain profile-highlight-card */
/* line 1472, app/assets/stylesheets/custom.css.scss */
.row.mb-4 .profile-highlight-card {
  background-color: #f9f9f9 !important;
}

/* line 1476, app/assets/stylesheets/custom.css.scss */
.pl-30 {
  padding-left: 30px !important;
}

@media (max-width: 767.98px) {
  /* line 1480, app/assets/stylesheets/custom.css.scss */
  .pb-28-mobile {
    padding-bottom: 28px !important;
  }
}

/* line 1486, app/assets/stylesheets/custom.css.scss */
.px-28-custom {
  padding: 28px !important;
}

/* line 1490, app/assets/stylesheets/custom.css.scss */
.px-20 {
  padding: 20px !important;
}

/* line 1494, app/assets/stylesheets/custom.css.scss */
.pt-20 {
  padding-top: 20px !important;
}

/* line 1498, app/assets/stylesheets/custom.css.scss */
.pt-20 {
  padding-bottom: 20px !important;
}

/* line 1502, app/assets/stylesheets/custom.css.scss */
.pl-20 {
  padding-left: 20px !important;
}

/* line 1506, app/assets/stylesheets/custom.css.scss */
.pr-20 {
  padding-right: 20px !important;
}

/* Text colors for profile highlight card */
/* line 1513, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .text-dark,
.profile-highlight-card .card-title a,
.profile-highlight-card h3,
.profile-highlight-card h4,
.profile-highlight-card h5,
.profile-highlight-card h6 {
  color: #000 !important;
}

/* line 1522, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .text-muted {
  color: rgba(0, 0, 0, 0.7) !important;
}

/* line 1526, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .text-primary {
  color: #2c40ab !important;
}

/* Profile highlight card button styling - default black */
/* line 1531, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .btn-primary {
  background-color: #000 !important;
  color: #e3ddc5 !important;
  border-color: #000 !important;
}

/* line 1537, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .btn-primary:hover {
  background-color: #333 !important;
  color: #e3ddc5 !important;
  border-color: #333 !important;
}

/* Next Event section button styling - green success */
/* line 1544, app/assets/stylesheets/custom.css.scss */
.row.mb-4:has(.profile-highlight-card) .btn-primary {
  background-color: #e1ef96 !important;
  color: #000000 !important;
  border-color: #e1ef96 !important;
}

/* line 1550, app/assets/stylesheets/custom.css.scss */
.row.mb-4:has(.profile-highlight-card) .btn-primary:hover {
  background-color: #d4e86a !important;
  color: #000000 !important;
  border-color: #d4e86a !important;
}

/* Fallback for browsers that don't support :has() */
/* line 1557, app/assets/stylesheets/custom.css.scss */
.row.mb-4 .profile-highlight-card .btn-primary {
  background-color: #e1ef96 !important;
  color: #000000 !important;
  border-color: #e1ef96 !important;
}

/* line 1563, app/assets/stylesheets/custom.css.scss */
.row.mb-4 .profile-highlight-card .btn-primary:hover {
  background-color: #d4e86a !important;
  color: #000000 !important;
  border-color: #d4e86a !important;
}

/* Fix date and icon colors for profile highlight card */
/* line 1570, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .fw-medium {
  color: #000 !important;
}

/* line 1574, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .bi-calendar-event,
.profile-highlight-card .bi-clock,
.profile-highlight-card .bi-building,
.profile-highlight-card .bi-geo-alt {
  color: #000 !important;
}

/* Activity Cards */
/* line 1582, app/assets/stylesheets/custom.css.scss */
.card {
  background-color: var(--card-bg, #f9f9f9) !important;
  border: none !important;
  border-radius: 0px !important;
  box-shadow: none !important;
  padding: 20px !important;
}

/* Card body content should have beige background */
/* line 1591, app/assets/stylesheets/custom.css.scss */
.card-body {
  background-color: var(--card-body-bg, #e3ddc5) !important;
  margin: 0 !important;
}

/* Text colors for beige background */
/* line 1597, app/assets/stylesheets/custom.css.scss */
.card-body .text-dark,
.card-body .card-title a,
.card-body h5,
.card-body h6 {
  color: #000 !important;
}

/* line 1604, app/assets/stylesheets/custom.css.scss */
.card-body .text-muted {
  color: rgba(0, 0, 0, 0.7) !important;
}

/* line 1608, app/assets/stylesheets/custom.css.scss */
.card-body .text-primary {
  color: #2c40ab !important;
}

/* View Details button should match border color */
/* line 1613, app/assets/stylesheets/custom.css.scss */
.card-body .btn-primary {
  background-color: #000 !important;
  color: #e3ddc5 !important;
  border-color: #000 !important;
}

/* line 1619, app/assets/stylesheets/custom.css.scss */
.card-body .btn-primary:hover {
  background-color: #333 !important;
  color: #e3ddc5 !important;
  border-color: #333 !important;
}

/* Fix date and icon colors */
/* line 1626, app/assets/stylesheets/custom.css.scss */
.card-body .fw-medium {
  color: #000 !important;
}

/* line 1630, app/assets/stylesheets/custom.css.scss */
.card-body .bi-calendar-event,
.card-body .bi-clock,
.card-body .bi-building,
.card-body .bi-geo-alt {
  color: #000 !important;
}

/* Ensure upcoming activities titles are white */
/* line 1638, app/assets/stylesheets/custom.css.scss */
.py-5 h2,
.py-5 h4 {
  color: #ffffff !important;
}

/* Ensure organization page titles are white */
/* line 1644, app/assets/stylesheets/custom.css.scss */
div[style*="background-color: #01393a"] h2,
div[style*="background-color: #01393a"] h4 {
  color: #ffffff !important;
}

/* line 1649, app/assets/stylesheets/custom.css.scss */
.bracket-border.card {
  box-shadow: none !important;
}

/* Override any Bootstrap card shadows */
/* line 1654, app/assets/stylesheets/custom.css.scss */
.card.bracket-border,
.bracket-border.card {
  box-shadow: none !important;
  --bs-card-box-shadow: none !important;
}

/* Text color overrides */
/* line 1661, app/assets/stylesheets/custom.css.scss */
.text-primary {
  color: #2c40ab !important;
}

/* line 1662, app/assets/stylesheets/custom.css.scss */
.text-success {
  color: #e1ef96 !important;
}

/* line 1663, app/assets/stylesheets/custom.css.scss */
.text-info {
  color: #4aa3df !important;
}

/* line 1664, app/assets/stylesheets/custom.css.scss */
.text-warning {
  color: #ffd43b !important;
}

/* line 1665, app/assets/stylesheets/custom.css.scss */
.text-danger {
  color: #ff6b6b !important;
}

/* line 1666, app/assets/stylesheets/custom.css.scss */
.text-purple {
  color: #6f42c1 !important;
}

/* Background color overrides */
/* line 1669, app/assets/stylesheets/custom.css.scss */
.bg-primary {
  background: #2c40ab !important;
}

/* line 1670, app/assets/stylesheets/custom.css.scss */
.bg-success {
  background: #e1ef96 !important;
}

/* line 1671, app/assets/stylesheets/custom.css.scss */
.bg-info {
  background: #4aa3df !important;
}

/* line 1672, app/assets/stylesheets/custom.css.scss */
.bg-warning {
  background: #ffd43b !important;
}

/* line 1673, app/assets/stylesheets/custom.css.scss */
.bg-purple {
  background: #6f42c1 !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  /* line 1677, app/assets/stylesheets/custom.css.scss */
  .navbar-brand {
    font-size: 2.75rem !important;
  }
  /* line 1680, app/assets/stylesheets/custom.css.scss */
  .navbar-brand i {
    font-size: 3rem;
  }
  /* line 1685, app/assets/stylesheets/custom.css.scss */
  h1 {
    font-size: 2rem;
  }
  /* line 1686, app/assets/stylesheets/custom.css.scss */
  h2 {
    font-size: 1.75rem;
  }
  /* line 1687, app/assets/stylesheets/custom.css.scss */
  h3 {
    font-size: 1.5rem;
  }
  /* line 1689, app/assets/stylesheets/custom.css.scss */
  .card {
    border-radius: 0px !important;
  }
  /* line 1690, app/assets/stylesheets/custom.css.scss */
  .btn {
    border-radius: 0px !important;
    padding: 0.5rem 1rem !important;
  }
}

/* Select2 Custom Styling */
/* line 1697, app/assets/stylesheets/custom.css.scss */
.select2-container--bootstrap-5 .select2-selection {
  border: 1px solid #dee2e6;
  border-radius: 0.375rem;
  min-height: 38px;
  padding: 0.375rem 0.75rem;
  background-color: #fff;
}

/* line 1705, app/assets/stylesheets/custom.css.scss */
.select2-container--bootstrap-5 .select2-selection--single {
  display: flex;
  align-items: center;
}

/* line 1710, app/assets/stylesheets/custom.css.scss */
.select2-container--bootstrap-5 .select2-selection__rendered {
  color: #212529;
  padding: 0;
  line-height: 1.5;
}

/* line 1716, app/assets/stylesheets/custom.css.scss */
.select2-container--bootstrap-5 .select2-selection__placeholder {
  color: #6c757d;
}

/* line 1720, app/assets/stylesheets/custom.css.scss */
.select2-container--bootstrap-5 .select2-selection__arrow {
  height: 36px;
  right: 8px;
}

/* line 1725, app/assets/stylesheets/custom.css.scss */
.select2-container--bootstrap-5 .select2-dropdown {
  border: 1px solid #dee2e6;
  border-radius: 0.375rem;
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

/* line 1731, app/assets/stylesheets/custom.css.scss */
.select2-container--bootstrap-5 .select2-search--dropdown .select2-search__field {
  border: 1px solid #dee2e6;
  border-radius: 0.375rem;
  padding: 0.375rem 0.75rem;
}

/* Copy exact bracket border style from blue-section class */
/* line 1738, app/assets/stylesheets/custom.css.scss */
.card.bracket-border::before {
  content: "";
  position: absolute;
  top: 20px;
  left: 20px;
  width: calc(100% - 40px);
  height: calc(100% - 40px);
  pointer-events: none;
  z-index: 10;
  --bracket-color: #000000 !important;
  background: linear-gradient(var(--bracket-color), var(--bracket-color)) top/100% 6px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) bottom/100% 6px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) left top/6px 50px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) left bottom/6px 50px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) right top/6px 50px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) right bottom/6px 50px no-repeat;
}

/* Force override for any conflicting bracket styles */
/* line 1766, app/assets/stylesheets/custom.css.scss */
.bracket-border.card::before {
  --bracket-color: #000000;
  background: linear-gradient(var(--bracket-color), var(--bracket-color)) top/100% 6px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) bottom/100% 6px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) left top/6px 50px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) left bottom/6px 50px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) right top/6px 50px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) right bottom/6px 50px no-repeat;
}

/* Additional override to ensure exact match */
/* line 1780, app/assets/stylesheets/custom.css.scss */
div.card.bracket-border::before {
  --bracket-color: #000000;
  background: linear-gradient(var(--bracket-color), var(--bracket-color)) top/100% 6px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) bottom/100% 6px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) left top/6px 50px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) left bottom/6px 50px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) right top/6px 50px no-repeat, linear-gradient(var(--bracket-color), var(--bracket-color)) right bottom/6px 50px no-repeat;
}

/* Activity Cards Dynamic Styling using CSS Custom Properties */
/* line 1794, app/assets/stylesheets/custom.css.scss */
.activity-card-random {
  --card-bg-color: #e3ddc5;
  --card-text-color: #000000;
  --bracket-color: #000000 !important;
  background-color: var(--card-bg-color) !important;
}

/* line 1802, app/assets/stylesheets/custom.css.scss */
.activity-card-random.bracket-border::before {
  --bracket-color: #000000;
}

/* line 1806, app/assets/stylesheets/custom.css.scss */
.card.bracket-border.activity-card-random::before {
  --bracket-color: #000000;
}

/* line 1810, app/assets/stylesheets/custom.css.scss */
div.card.bracket-border.activity-card-random::before {
  --bracket-color: #000000;
}

/* White bracket borders for activity cards with white brackets */
/* line 1815, app/assets/stylesheets/custom.css.scss */
.activity-card-random.bracket-border[style*="--bracket-color: #ffffff"]::before,
.card.bracket-border.activity-card-random[style*="--bracket-color: #ffffff"]::before,
div.card.bracket-border.activity-card-random[style*="--bracket-color: #ffffff"]::before {
  background: linear-gradient(#ffffff, #ffffff) top/100% 6px no-repeat, linear-gradient(#ffffff, #ffffff) bottom/100% 6px no-repeat, linear-gradient(#ffffff, #ffffff) left top/6px 50px no-repeat, linear-gradient(#ffffff, #ffffff) left bottom/6px 50px no-repeat, linear-gradient(#ffffff, #ffffff) right top/6px 50px no-repeat, linear-gradient(#ffffff, #ffffff) right bottom/6px 50px no-repeat !important;
}

/* Force 6px thickness for ALL bracket borders - highest specificity */
/* line 1828, app/assets/stylesheets/custom.css.scss */
.bracket-border::before,
.card.bracket-border::before,
div.card.bracket-border::before,
.activity-card-random.bracket-border::before,
.card.bracket-border.activity-card-random::before,
div.card.bracket-border.activity-card-random::before {
  background: linear-gradient(var(--bracket-color, #000000), var(--bracket-color, #000000)) top/100% 6px no-repeat, linear-gradient(var(--bracket-color, #000000), var(--bracket-color, #000000)) bottom/100% 6px no-repeat, linear-gradient(var(--bracket-color, #000000), var(--bracket-color, #000000)) left top/6px 50px no-repeat, linear-gradient(var(--bracket-color, #000000), var(--bracket-color, #000000)) left bottom/6px 50px no-repeat, linear-gradient(var(--bracket-color, #000000), var(--bracket-color, #000000)) right top/6px 50px no-repeat, linear-gradient(var(--bracket-color, #000000), var(--bracket-color, #000000)) right bottom/6px 50px no-repeat !important;
}

/* Blue Section with Bracket Border */
/* line 1844, app/assets/stylesheets/custom.css.scss */
.blue-section {
  background-color: #abc3ff;
  padding: 20px;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  position: relative;
}

/* line 1853, app/assets/stylesheets/custom.css.scss */
.blue-section::before {
  content: "";
  position: absolute;
  top: 20px;
  left: 20px;
  width: calc(100% - 40px);
  height: calc(100% - 40px);
  pointer-events: none;
  z-index: 10;
  background: linear-gradient(#000000, #000000) top/100% 6px no-repeat, linear-gradient(#000000, #000000) bottom/100% 6px no-repeat, linear-gradient(#000000, #000000) left top/6px 50px no-repeat, linear-gradient(#000000, #000000) left bottom/6px 50px no-repeat, linear-gradient(#000000, #000000) right top/6px 50px no-repeat, linear-gradient(#000000, #000000) right bottom/6px 50px no-repeat;
}

/* line 1877, app/assets/stylesheets/custom.css.scss */
.blue-content {
  position: relative;
  z-index: 20;
  color: #000000;
  text-align: left;
}

/* line 1884, app/assets/stylesheets/custom.css.scss */
.blue-content h2,
.blue-content h3 {
  color: #000000 !important;
}

/* line 1889, app/assets/stylesheets/custom.css.scss */
.blue-content p,
.blue-content .lead {
  color: #000000 !important;
}

/* Ensure all text in blue section is black */
/* line 1895, app/assets/stylesheets/custom.css.scss */
.blue-section * {
  color: #000000 !important;
}

/* Blue section button styling */
/* line 1900, app/assets/stylesheets/custom.css.scss */
.blue-button-container {
  margin-top: 20px;
}

/* line 1904, app/assets/stylesheets/custom.css.scss */
.blue-button-container p {
  color: #000000 !important;
  font-size: 1rem;
}

/* line 1909, app/assets/stylesheets/custom.css.scss */
.btn-green {
  background-color: #e1ef96 !important;
  border-color: #e1ef96 !important;
  color: #000000 !important;
}

/* line 1915, app/assets/stylesheets/custom.css.scss */
.btn-green:hover {
  background-color: #d4e67a !important;
  border-color: #d4e67a !important;
  color: #000000 !important;
}

/* Ensure mobile tickets CTA is visibly light green */
/* line 1922, app/assets/stylesheets/custom.css.scss */
.tickets-link-mobile {
  background-color: #e1ef96 !important;
  border-color: #e1ef96 !important;
  color: #000000 !important;
}

/* line 1928, app/assets/stylesheets/custom.css.scss */
.tickets-link-mobile:hover,
.tickets-link-mobile:focus {
  background-color: #d4e67a !important;
  border-color: #d4e67a !important;
  color: #000000 !important;
}

/* Extra specificity to beat any .btn defaults */
/* line 1936, app/assets/stylesheets/custom.css.scss */
a.btn.tickets-link-mobile {
  background-color: #e1ef96 !important;
  border-color: #e1ef96 !important;
  color: #000000 !important;
}

/* line 1942, app/assets/stylesheets/custom.css.scss */
a.btn.tickets-link-mobile:hover,
a.btn.tickets-link-mobile:focus {
  background-color: #d4e67a !important;
  border-color: #d4e67a !important;
  color: #000000 !important;
}

/* Defend against parent profile-highlight-card backgrounds */
/* line 1950, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .tickets-link-mobile,
.profile-highlight-card a.tickets-link-mobile,
.profile-highlight-card .btn-green.tickets-link-mobile,
.profile-highlight-card a.btn-green.tickets-link-mobile {
  background-color: #e1ef96 !important;
  border-color: #e1ef96 !important;
  color: #000000 !important;
}

/* line 1959, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card .tickets-link-mobile:hover,
.profile-highlight-card .tickets-link-mobile:focus,
.profile-highlight-card a.tickets-link-mobile:hover,
.profile-highlight-card a.tickets-link-mobile:focus,
.profile-highlight-card .btn-green.tickets-link-mobile:hover,
.profile-highlight-card .btn-green.tickets-link-mobile:focus,
.profile-highlight-card a.btn-green.tickets-link-mobile:hover,
.profile-highlight-card a.btn-green.tickets-link-mobile:focus {
  background-color: #d4e67a !important;
  border-color: #d4e67a !important;
  color: #000000 !important;
}

/* Even higher specificity to beat broad .profile-highlight-card .d-flex background rules */
/* line 1973, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card a.btn.btn-green.tickets-link-mobile.d-flex {
  background-color: #e1ef96 !important;
  border-color: #e1ef96 !important;
  color: #000000 !important;
}

/* line 1979, app/assets/stylesheets/custom.css.scss */
.profile-highlight-card a.btn.btn-green.tickets-link-mobile.d-flex:hover,
.profile-highlight-card a.btn.btn-green.tickets-link-mobile.d-flex:focus {
  background-color: #d4e67a !important;
  border-color: #d4e67a !important;
  color: #000000 !important;
}

/* Container margin fixes */
/* line 1987, app/assets/stylesheets/custom.css.scss */
.container.mt-4 {
  margin-top: 0 !important;
}

/* Remove top margin from containers on booking pages */
/* line 1992, app/assets/stylesheets/custom.css.scss */
.bookings-new .container,
.bookings-show .container {
  margin-top: 0 !important;
}

/* line 1996, app/assets/stylesheets/custom.css.scss */
#flash-messages {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* line 2001, app/assets/stylesheets/custom.css.scss */
#flash-messages .alert {
  margin-bottom: 1rem !important;
}

/* line 2005, app/assets/stylesheets/custom.css.scss */
#flash-messages .alert:last-child {
  margin-bottom: 0 !important;
}

/* line 2008, app/assets/stylesheets/custom.css.scss */
.discount-orange-section {
  background-color: #FB702C !important;
}

/* line 2012, app/assets/stylesheets/custom.css.scss */
.discount-orange-section * {
  background-color: #FB702C !important;
}

/* line 2016, app/assets/stylesheets/custom.css.scss */
.discount-orange-section .card-body,
.discount-orange-section .row,
.discount-orange-section .col,
.discount-orange-section .col-md-6,
.discount-orange-section .d-flex,
.discount-orange-section .form-control,
.discount-orange-section .btn {
  background-color: #FB702C !important;
}

/* line 2026, app/assets/stylesheets/custom.css.scss */
.discount-orange-section .form-control {
  background-color: #ffffff !important;
  color: #000000 !important;
}

/* line 2031, app/assets/stylesheets/custom.css.scss */
.discount-orange-section .btn-outline-light {
  background-color: transparent !important;
  border-color: #ffffff !important;
  color: #ffffff !important;
}

/* line 2037, app/assets/stylesheets/custom.css.scss */
.discount-orange-section .btn-outline-light:hover {
  background-color: #ffffff !important;
  color: #FB702C !important;
}

/* line 2041, app/assets/stylesheets/custom.css.scss */
.card.border-0.h-100.bracket-border.activity-card-random::before,
div.card.border-0.h-100.bracket-border.activity-card-random::before {
  background: linear-gradient(var(--bracket-color, #000000), var(--bracket-color, #000000)) top/100% 6px no-repeat, linear-gradient(var(--bracket-color, #000000), var(--bracket-color, #000000)) bottom/100% 6px no-repeat, linear-gradient(var(--bracket-color, #000000), var(--bracket-color, #000000)) left top/6px 50px no-repeat, linear-gradient(var(--bracket-color, #000000), var(--bracket-color, #000000)) left bottom/6px 50px no-repeat, linear-gradient(var(--bracket-color, #000000), var(--bracket-color, #000000)) right top/6px 50px no-repeat, linear-gradient(var(--bracket-color, #000000), var(--bracket-color, #000000)) right bottom/6px 50px no-repeat !important;
}

/* line 2052, app/assets/stylesheets/custom.css.scss */
.activity-card-random .card-body {
  background-color: var(--card-bg-color) !important;
}

/* line 2056, app/assets/stylesheets/custom.css.scss */
.activity-card-random .card-title a,
.activity-card-random .card-body .text-dark,
.activity-card-random .card-body h4,
.activity-card-random .card-body h5,
.activity-card-random .card-body h6 {
  color: var(--card-text-color) !important;
}

/* line 2064, app/assets/stylesheets/custom.css.scss */
.activity-card-random .card-body .text-muted,
.activity-card-random .card-body small,
.activity-card-random .card-body .fw-medium {
  color: var(--card-text-color) !important;
}

/* line 2070, app/assets/stylesheets/custom.css.scss */
.activity-card-random .card-body i,
.activity-card-random .card-body .bi-calendar-event,
.activity-card-random .card-body .bi-clock,
.activity-card-random .card-body .bi-building,
.activity-card-random .card-body .bi-geo-alt {
  color: var(--card-text-color) !important;
}

/* line 2078, app/assets/stylesheets/custom.css.scss */
.activity-card-random .btn {
  background-color: #ffffff !important;
  color: #000000 !important;
  background-image: none !important;
  border-color: #000000 !important;
}

/* line 2085, app/assets/stylesheets/custom.css.scss */
.activity-card-random .btn:hover {
  background-color: #f8f9fa !important;
  color: #000000 !important;
  background-image: none !important;
  border-color: #000000 !important;
}

/* line 2092, app/assets/stylesheets/custom.css.scss */
.select2-container--bootstrap-5 .select2-results__option {
  padding: 0.375rem 0.75rem;
}

/* line 2096, app/assets/stylesheets/custom.css.scss */
.select2-container--bootstrap-5 .select2-results__option--highlighted[aria-selected] {
  background-color: var(--color-dark-blue);
  color: white;
}

/* line 2101, app/assets/stylesheets/custom.css.scss */
.select2-container--bootstrap-5 .select2-selection--single .select2-selection__clear {
  color: #6c757d;
  margin-right: 20px;
  font-weight: bold;
}

/* Sticky Sidebar for Activity Forms */
/* line 2108, app/assets/stylesheets/custom.css.scss */
.sticky-sidebar {
  position: sticky !important;
  top: 30px !important;
  margin-bottom: 30px !important;
  will-change: transform;
  transform: translateZ(0);
  /* Creates a new stacking context */
}

/* Global Card Header Corner Rounding Fix */
/* line 2117, app/assets/stylesheets/custom.css.scss */
.card-header {
  border-top-left-radius: inherit !important;
  border-top-right-radius: inherit !important;
}

/* line 2122, app/assets/stylesheets/custom.css.scss */
.card-header.bg-light {
  background-color: #f8f9fa !important;
}

/* line 2126, app/assets/stylesheets/custom.css.scss */
.card-header.bg-primary {
  background-color: var(--color-primary) !important;
  color: white !important;
}

/* line 2131, app/assets/stylesheets/custom.css.scss */
.card-header.bg-secondary {
  background-color: var(--color-secondary) !important;
  color: white !important;
}

/* Ensure all cards have consistent border radius and overflow */
/* line 2137, app/assets/stylesheets/custom.css.scss */
.card {
  border-radius: 0px !important;
  overflow: hidden !important;
}

/* Ensure nested forms stay within card constraints */
/* line 2143, app/assets/stylesheets/custom.css.scss */
.select2-container--bootstrap-5 .select2-selection--single .select2-selection__clear:hover {
  color: var(--color-danger);
}

/* Square input field for custom short URL */
/* line 2148, app/assets/stylesheets/custom.css.scss */
.square-input {
  border-radius: 0 !important;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

/* Custom bg-white with f9f9f9 background */
/* line 2157, app/assets/stylesheets/custom.css.scss */
.bg-white {
  background-color: #f9f9f9 !important;
}

/* Ensure bg-primary cards and all children have primary background */
/* line 2162, app/assets/stylesheets/custom.css.scss */
.card.bg-primary,
.card.bg-primary * {
  background-color: var(--bs-primary) !important;
  background-image: none !important;
}

/* White bracket border for primary cards */
/* line 2169, app/assets/stylesheets/custom.css.scss */
.card.bg-primary.bracket-border::before {
  --bracket-color: #ffffff !important;
}

/* Additional white bracket border rule for primary cards */
/* line 2174, app/assets/stylesheets/custom.css.scss */
.card.bg-primary.bracket-border::before {
  background: linear-gradient(#ffffff, #ffffff) top/100% 6px no-repeat, linear-gradient(#ffffff, #ffffff) bottom/100% 6px no-repeat, linear-gradient(#ffffff, #ffffff) left top/6px 50px no-repeat, linear-gradient(#ffffff, #ffffff) left bottom/6px 50px no-repeat, linear-gradient(#ffffff, #ffffff) right top/6px 50px no-repeat, linear-gradient(#ffffff, #ffffff) right bottom/6px 50px no-repeat !important;
}

/* Override button backgrounds in primary cards */
/* line 2185, app/assets/stylesheets/custom.css.scss */
.card.bg-primary .btn-light {
  background-color: #ffffff !important;
  color: #000000 !important;
  border-color: #ffffff !important;
}

/* Make all text and icons white in primary cards */
/* line 2192, app/assets/stylesheets/custom.css.scss */
.card.bg-primary h1,
.card.bg-primary h2,
.card.bg-primary h3,
.card.bg-primary h4,
.card.bg-primary h5,
.card.bg-primary h6,
.card.bg-primary p,
.card.bg-primary span,
.card.bg-primary strong,
.card.bg-primary i,
.card.bg-primary .card-title {
  color: #ffffff !important;
}

/* Light Blue Section - Works like blue-section */
/* line 2207, app/assets/stylesheets/custom.css.scss */
.light-blue-section {
  background-color: #abc3ff !important;
  position: relative;
  --bs-body-bg: #abc3ff !important;
}

/* Light blue section - force background color */
/* line 2214, app/assets/stylesheets/custom.css.scss */
.light-blue-section .row,
.light-blue-section .col-6,
.light-blue-section .col-12 {
  background-color: #abc3ff !important;
}

/* line 2220, app/assets/stylesheets/custom.css.scss */
.light-blue-section.row,
.light-blue-section .col-6,
.light-blue-section .col-12 {
  background-color: #abc3ff !important;
}

/* Ensure flexbox children in light blue section have correct background */
/* line 2227, app/assets/stylesheets/custom.css.scss */
.light-blue-section .mb-3,
.light-blue-section .d-flex,
.light-blue-section > div {
  background-color: #abc3ff !important;
}

/* Ensure text is black on light blue background */
/* line 2234, app/assets/stylesheets/custom.css.scss */
.light-blue-section,
.light-blue-section small,
.light-blue-section strong,
.light-blue-section .text-muted {
  color: #000000 !important;
}

/* --------------------------------------------------
   Invitations Experience
-------------------------------------------------- */
/* line 2244, app/assets/stylesheets/custom.css.scss */
.invitation-page {
  background: #e2ddc5;
  min-height: 100vh;
}

/* line 2249, app/assets/stylesheets/custom.css.scss */
.invitation-hero {
  position: relative;
  padding: 4.5rem 0 5.5rem;
  background: #01393a;
  overflow: hidden;
}

/* line 2256, app/assets/stylesheets/custom.css.scss */
.invitation-hero::after {
  display: none;
}

/* line 2260, app/assets/stylesheets/custom.css.scss */
.invitation-hero-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.45rem 1rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.16);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* line 2272, app/assets/stylesheets/custom.css.scss */
.invitation-hero-title {
  font-size: clamp(2.25rem, 4vw, 3rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #ffffff !important;
}

/* line 2279, app/assets/stylesheets/custom.css.scss */
.invitation-hero-text {
  font-size: 1.05rem;
  max-width: 38rem;
  opacity: 0.9;
  color: rgba(255, 255, 255, 0.92) !important;
}

/* line 2286, app/assets/stylesheets/custom.css.scss */
.invitation-meta-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.65rem 1rem;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.18);
  font-weight: 500;
  letter-spacing: 0.01em;
  color: #ffffff !important;
}

/* line 2298, app/assets/stylesheets/custom.css.scss */
.invitation-summary-card {
  position: relative;
  padding: 2.25rem 2rem;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.24);
  backdrop-filter: blur(14px);
  color: #ffffff;
}

/* line 2308, app/assets/stylesheets/custom.css.scss */
.invitation-summary-item + .invitation-summary-item {
  margin-top: 1.25rem;
}

/* line 2312, app/assets/stylesheets/custom.css.scss */
.invitation-summary-item .label {
  display: block;
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  opacity: 0.7;
  margin-bottom: 0.4rem;
}

/* line 2321, app/assets/stylesheets/custom.css.scss */
.invitation-summary-item .value {
  font-weight: 600;
  font-size: 1.05rem;
  word-break: break-word;
}

/* line 2327, app/assets/stylesheets/custom.css.scss */
.invitation-body {
  margin-top: -80px;
  padding-bottom: 4rem;
  padding-top: 4rem;
  background-color: transparent;
}

/* line 2334, app/assets/stylesheets/custom.css.scss */
.invitation-card {
  margin-bottom: 3rem;
  border: none;
  box-shadow: 0 24px 60px rgba(1, 57, 58, 0.12);
}

/* line 2340, app/assets/stylesheets/custom.css.scss */
.invitation-card .invitation-card-body {
  padding: 20px;
  background: #ffffff;
  border-radius: 22px;
}

/* line 2346, app/assets/stylesheets/custom.css.scss */
.invitation-status {
  display: flex;
  gap: 1.5rem;
  padding: 1.75rem;
  border-radius: 20px;
  border: 1px solid transparent;
  position: relative;
  overflow: hidden;
}

/* line 2356, app/assets/stylesheets/custom.css.scss */
.invitation-status::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0.1;
  pointer-events: none;
}

/* line 2364, app/assets/stylesheets/custom.css.scss */
.invitation-status-icon {
  position: relative;
  min-width: 64px;
  height: 64px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  font-size: 1.75rem;
  background: rgba(255, 255, 255, 0.22);
  color: inherit;
}

/* line 2376, app/assets/stylesheets/custom.css.scss */
.invitation-status-content {
  position: relative;
  flex: 1 1 auto;
}

/* line 2381, app/assets/stylesheets/custom.css.scss */
.invitation-status-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.25rem;
}

/* line 2388, app/assets/stylesheets/custom.css.scss */
.invitation-status-success {
  background: linear-gradient(135deg, rgba(1, 152, 117, 0.16), rgba(1, 57, 58, 0.12));
  color: #01393a;
  border-color: rgba(1, 152, 117, 0.35);
}

/* line 2394, app/assets/stylesheets/custom.css.scss */
.invitation-status-success::before {
  background: radial-gradient(circle at top left, rgba(1, 152, 117, 0.5), transparent 60%);
}

/* line 2398, app/assets/stylesheets/custom.css.scss */
.invitation-status-warning {
  background: linear-gradient(135deg, rgba(255, 193, 7, 0.18), rgba(255, 159, 67, 0.18));
  color: #5f3b00;
  border-color: rgba(255, 193, 7, 0.4);
}

/* line 2404, app/assets/stylesheets/custom.css.scss */
.invitation-status-warning::before {
  background: radial-gradient(circle at top right, rgba(255, 193, 7, 0.45), transparent 60%);
}

/* line 2408, app/assets/stylesheets/custom.css.scss */
.invitation-status-info {
  background: linear-gradient(135deg, rgba(0, 123, 255, 0.12), rgba(1, 57, 180, 0.12));
  color: #0c326f;
  border-color: rgba(0, 123, 255, 0.35);
}

/* line 2414, app/assets/stylesheets/custom.css.scss */
.invitation-status-info::before {
  background: radial-gradient(circle at top right, rgba(0, 123, 255, 0.35), transparent 60%);
}

/* line 2418, app/assets/stylesheets/custom.css.scss */
.invitation-status-danger {
  background: linear-gradient(135deg, rgba(220, 53, 69, 0.1), rgba(220, 53, 69, 0.22));
  color: #7a1120;
  border-color: rgba(220, 53, 69, 0.35);
}

/* line 2424, app/assets/stylesheets/custom.css.scss */
.invitation-status-danger::before {
  background: radial-gradient(circle at top left, rgba(220, 53, 69, 0.45), transparent 60%);
}

/* line 2428, app/assets/stylesheets/custom.css.scss */
.invitation-status ul {
  margin-bottom: 0;
  padding-left: 1.2rem;
}

/* line 2433, app/assets/stylesheets/custom.css.scss */
.invitation-details .invitation-detail-tile {
  padding: 1.5rem;
  border-radius: 18px;
  background: #ffffff;
  border: 1px solid rgba(1, 57, 58, 0.08);
}

/* line 2440, app/assets/stylesheets/custom.css.scss */
.invitation-details .label {
  display: block;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: rgba(1, 57, 58, 0.55);
  margin-bottom: 0.35rem;
}

/* line 2449, app/assets/stylesheets/custom.css.scss */
.invitation-details .value {
  font-weight: 600;
  color: #01393a;
  word-break: break-word;
  font-size: 1rem;
}

/* line 2456, app/assets/stylesheets/custom.css.scss */
.invitation-divider {
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(1, 57, 58, 0.25), transparent);
}

/* line 2462, app/assets/stylesheets/custom.css.scss */
.invitation-action-card {
  height: 100%;
  padding: 2.25rem 2rem;
  border-radius: 18px;
  border: 1px solid rgba(1, 57, 58, 0.08);
  background: #ffffff;
  box-shadow: 0 10px 25px rgba(1, 57, 58, 0.06);
  display: flex;
  flex-direction: column;
}

/* line 2473, app/assets/stylesheets/custom.css.scss */
.invitation-action-card .btn {
  margin-top: auto;
}

/* line 2477, app/assets/stylesheets/custom.css.scss */
.invitation-action-card .icon {
  width: 54px;
  height: 54px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(1, 57, 58, 0.08);
  color: #01393a;
  font-size: 1.4rem;
  margin-bottom: 1.5rem;
}

/* line 2489, app/assets/stylesheets/custom.css.scss */
.invitation-note {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 1.5rem;
  border-radius: 14px;
  background: rgba(1, 57, 58, 0.08);
  color: #01393a;
  font-weight: 500;
}

@media (max-width: 991.98px) {
  /* line 2501, app/assets/stylesheets/custom.css.scss */
  .invitation-body {
    margin-top: -40px;
  }
  /* line 2505, app/assets/stylesheets/custom.css.scss */
  .invitation-card .invitation-card-body {
    padding: 2.25rem;
  }
  /* line 2509, app/assets/stylesheets/custom.css.scss */
  .invitation-status {
    flex-direction: column;
    text-align: left;
  }
  /* line 2514, app/assets/stylesheets/custom.css.scss */
  .invitation-status-icon {
    margin-bottom: 0.5rem;
  }
}

@media (max-width: 575.98px) {
  /* line 2520, app/assets/stylesheets/custom.css.scss */
  .invitation-card .invitation-card-body {
    padding: 1.75rem;
  }
  /* line 2524, app/assets/stylesheets/custom.css.scss */
  .invitation-summary-card {
    padding: 1.75rem 1.5rem;
  }
  /* line 2528, app/assets/stylesheets/custom.css.scss */
  .invitation-meta-badge {
    width: 100%;
    justify-content: center;
  }
  /* line 2533, app/assets/stylesheets/custom.css.scss */
  .invitation-status-actions {
    flex-direction: column;
    align-items: stretch;
  }
}

/* Payment method card styling (used for 2FA method selection too) */
/* line 2540, app/assets/stylesheets/custom.css.scss */
.payment-method-label {
  display: block;
  margin-bottom: 1rem;
}

/* line 2545, app/assets/stylesheets/custom.css.scss */
.payment-method-card {
  cursor: pointer;
  transition: all 0.2s ease;
  border: 2px solid #282627 !important;
  margin-bottom: 0;
  background-color: #F9F9F9 !important;
}

/* line 2553, app/assets/stylesheets/custom.css.scss */
.payment-method-card:hover {
  border-color: #ABC3FF !important;
}

/* line 2557, app/assets/stylesheets/custom.css.scss */
.payment-method-card.selected {
  border-color: #ABC3FF !important;
  background-color: #f8f9ff !important;
}

/* line 2562, app/assets/stylesheets/custom.css.scss */
.payment-method-card input[type="radio"]:checked + label {
  border-color: #007bff;
}

/* line 2566, app/assets/stylesheets/custom.css.scss */
.payment-method-card .payment-method-radio {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* line 2572, app/assets/stylesheets/custom.css.scss */
a.payment-method-card {
  color: inherit !important;
}
/* Public event page — matches marketing look
   Must use !important on radius/shadow to beat global square-design reset */

body.event-public {
  background: #f7f4ec !important;
  --mkt-sky: #c9dbff;
  --mkt-lavender: #d8d2f0;
  --mkt-mint: #e1ef96;
  --mkt-cream: #f7f4ec;
  --mkt-lime: #e1ef96;
  --mkt-forest: #0d3d38;
  --mkt-ink: #141414;
  --mkt-muted: #3a3a3a;
  --mkt-blue: #2c40ab;
  --mkt-radius: 18px;
  --mkt-font: "Galano Grotesque", system-ui, sans-serif;
}

body.event-public main {
  padding: 0 !important;
  max-width: none !important;
  overflow-x: clip;
}

body.event-public main.container,
body.event-public .container-fluid {
  max-width: none;
}

body.event-public .marketing-nav {
  background: #fff !important;
  border-bottom: none !important;
  padding: 0.85rem 0 !important;
}

body.event-public .marketing-nav .container {
  max-width: 1120px;
}

body.event-public .marketing-nav .nav-link {
  color: var(--mkt-ink) !important;
  font-weight: 500 !important;
  padding: 0.5rem 0.85rem !important;
}

body.event-public .alert {
  margin: 0;
  border-radius: 0 !important;
}

/* —— Page shell —— */
.evt-page {
  font-family: var(--mkt-font);
  color: var(--mkt-ink);
  padding-bottom: 0;
}

.evt-wrap {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 1.25rem;
}

/* Sky band behind back link + hero (matches mockup) */
.evt-top {
  background: var(--mkt-sky);
  padding: 0 0 2.75rem;
}

.evt-body {
  padding-top: 2.5rem;
}

.evt-back {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin: 1.25rem 0 1.1rem;
  color: var(--mkt-ink);
  font-weight: 600;
  font-size: 0.95rem;
  text-decoration: none;
}

.evt-back:hover {
  color: var(--mkt-blue);
}

/* —— Hero cover —— */
.evt-hero {
  margin-bottom: 0;
}

.evt-hero-frame {
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 22px !important;
  overflow: hidden;
  background: var(--mkt-forest);
  box-shadow: none !important;
}

.evt-hero-frame img {
  width: 100%;
  height: 100%;
  object-fit: contain; /* image is 16:9; contain avoids crop if box ratio drifts */
  display: block;
  border-radius: 0 !important;
  cursor: pointer;
}

.evt-hero-placeholder {
  width: 100%;
  height: 100%;
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.75);
  font-weight: 700;
  font-size: 1.5rem;
  text-align: center;
  padding: 2rem;
}

/* —— Main grid —— */
.evt-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.85fr);
  gap: 2.75rem 3rem;
  align-items: start;
  margin-bottom: 3.5rem;
}

.evt-eyebrow {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mkt-ink);
  margin: 0 0 0.75rem;
}

.evt-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: clamp(2.2rem, 4.5vw, 3.2rem);
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--mkt-ink) !important;
  margin: 0 0 0.65rem;
}

.evt-tagline {
  font-size: 1.1rem;
  line-height: 1.45;
  color: var(--mkt-muted);
  margin: 0 0 1.1rem;
  max-width: 34rem;
}

.evt-pill {
  display: inline-flex !important;
  align-items: center;
  border: 1.5px solid rgba(20, 20, 20, 0.55) !important;
  border-radius: 999px !important;
  padding: 0.35rem 0.85rem;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--mkt-ink) !important;
  background: transparent !important;
  box-shadow: none !important;
  margin-bottom: 2rem;
}

.evt-about-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: 1.15rem;
  margin: 0 0 0.75rem;
  color: var(--mkt-ink) !important;
}

.evt-about-body {
  font-size: 1rem;
  line-height: 1.65;
  color: var(--mkt-muted);
  max-width: 36rem;
}

.evt-about-body p {
  margin: 0 0 0.85rem;
}

.evt-about-body p:last-child {
  margin-bottom: 0;
}

.evt-admin {
  margin-top: 1.5rem;
}

/* —— Booking ticket —— */
.evt-ticket {
  --notch: 11px;
  --pad-x: 1.35rem;
  /* Distance from ticket bottom to tear center (= stub / button zone) */
  --tear-from-bottom: 5.15rem;
  position: sticky;
  top: 1.25rem;
  background: #fff;
  border: 2.5px solid var(--mkt-ink) !important;
  border-radius: 18px !important;
  padding: 1.5rem var(--pad-x) 1.15rem;
  box-shadow: none !important;
  overflow: hidden;
  /* Punch real semicircle cutouts — survives global border-radius: 0 resets */
  -webkit-mask:
    radial-gradient(circle var(--notch) at 0% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%) right;
  -webkit-mask-size: 51.5% 100%;
  -webkit-mask-repeat: no-repeat;
  mask:
    radial-gradient(circle var(--notch) at 0% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%) right;
  mask-size: 51.5% 100%;
  mask-repeat: no-repeat;
}

.evt-ticket-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: 1.35rem;
  letter-spacing: -0.02em;
  margin: 0 0 1.25rem;
  color: var(--mkt-ink) !important;
}

.evt-ticket-rows {
  display: flex;
  flex-direction: column;
  gap: 1.05rem;
  margin-bottom: 0;
}

.evt-ticket-row {
  display: grid;
  grid-template-columns: 1.4rem 1fr;
  gap: 0.75rem;
  align-items: start;
}

.evt-ticket-row i {
  font-size: 1.05rem;
  line-height: 1.35;
  color: var(--mkt-ink);
}

.evt-ticket-row strong {
  display: block;
  font-size: 0.98rem;
  font-weight: 700;
  color: var(--mkt-ink);
  line-height: 1.3;
}

.evt-ticket-row span {
  display: block;
  font-size: 0.9rem;
  color: var(--mkt-muted);
  margin-top: 0.15rem;
}

/* Dashed tear line locked to the same Y as the mask notches */
.evt-ticket-tear {
  position: absolute;
  left: var(--pad-x);
  right: var(--pad-x);
  bottom: var(--tear-from-bottom);
  height: 0;
  margin: 0;
  border-top: 1.5px dashed rgba(20, 20, 20, 0.35);
  pointer-events: none;
}

.evt-ticket-tear::before,
.evt-ticket-tear::after {
  content: none;
  display: none;
}

.evt-ticket-footer {
  margin-top: 1.45rem;
  padding-top: 1.15rem;
}

body.event-public a.evt-btn-lime,
body.event-public .evt-btn-lime {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.35rem;
  width: 100%;
  background: var(--mkt-lime) !important;
  color: var(--mkt-ink) !important;
  border-radius: 999px !important;
  padding: 0.85rem 1.25rem !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
  text-decoration: none !important;
  border: none !important;
  box-shadow: none !important;
  transition: transform 0.15s ease, filter 0.15s ease;
}

body.event-public a.evt-btn-lime:hover,
body.event-public .evt-btn-lime:hover {
  filter: brightness(0.96);
  transform: translateY(-1px);
  color: var(--mkt-ink) !important;
}

.evt-ticket-status {
  display: block;
  text-align: center;
  font-weight: 600;
  padding: 0.75rem;
  border-radius: 999px !important;
  background: #eee;
  color: var(--mkt-muted);
}

.evt-ticket-more {
  display: block;
  text-align: center;
  margin-top: 0.85rem;
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--mkt-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.evt-ticket-more:hover {
  color: var(--mkt-blue);
}

.evt-n-arrow {
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
}

/* —— Location —— */
.evt-location {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: 2rem;
  align-items: center;
  padding: 2.5rem 0 2.75rem;
  border-top: 1px solid rgba(20, 20, 20, 0.12);
  margin-bottom: 0.5rem;
}

.evt-location-title {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: clamp(1.35rem, 2.5vw, 1.75rem);
  letter-spacing: -0.02em;
  margin: 0 0 0.85rem;
  color: var(--mkt-ink) !important;
  line-height: 1.2;
}

.evt-location-city {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-weight: 600;
  margin-bottom: 0.85rem;
  color: var(--mkt-ink);
}

.evt-location-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-weight: 600;
  color: var(--mkt-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.evt-location-link:hover {
  color: var(--mkt-blue);
}

.evt-map {
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 16px !important;
  overflow: hidden;
  background: #e8e4da;
  border: 1px solid rgba(20, 20, 20, 0.08) !important;
}

.evt-map iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

.evt-map-fallback {
  width: 100%;
  height: 100%;
  min-height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--mkt-muted);
  font-weight: 600;
}

/* —— Organiser —— */
.evt-organiser {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  padding: 1.5rem 0 2.75rem;
  border-top: 1px solid rgba(20, 20, 20, 0.12);
}

.evt-organiser-left {
  display: flex;
  align-items: center;
  gap: 0.85rem;
}

.evt-organiser-avatar {
  width: 48px;
  height: 48px;
  border-radius: 999px !important;
  overflow: hidden;
  background: #fff;
  flex-shrink: 0;
  border: 2px solid rgba(20, 20, 20, 0.08) !important;
}

.evt-organiser-avatar img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  border-radius: 0 !important;
  padding: 4px;
  box-sizing: border-box;
}

.evt-organiser-avatar-fallback {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--mkt-forest);
  color: #fff;
  font-weight: 700;
  font-size: 1rem;
}

.evt-organiser-label {
  font-weight: 600;
  color: var(--mkt-ink);
  margin: 0;
}

.evt-organiser-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-weight: 600;
  color: var(--mkt-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.evt-organiser-link:hover {
  color: var(--mkt-blue);
}

/* —— Footer —— */
.evt-footer {
  background: var(--mkt-forest) !important;
  color: #fff;
  padding: 2.25rem 0;
}

.evt-footer-inner {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  flex-wrap: wrap;
}

.evt-footer-tagline {
  margin: 0.55rem 0 0;
  font-size: 0.92rem;
  opacity: 0.9;
}

.evt-footer-links {
  display: flex;
  gap: 1.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.evt-footer-links a {
  color: #fff !important;
  text-decoration: none;
  font-weight: 500;
}

.evt-footer-links a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* —— Modal —— */
body.event-public .modal-fullscreen-content {
  height: 100vh;
}

body.event-public .modal-header-overlay,
body.event-public .modal-footer-overlay {
  background: rgba(0, 0, 0, 0.5);
}

body.event-public .modal-image-contain {
  object-fit: contain;
}

/* —— Responsive —— */
@media (max-width: 900px) {
  .evt-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .evt-ticket {
    position: static;
  }

  .evt-location {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }
}

@media (max-width: 600px) {
  .evt-wrap {
    padding: 0 1rem;
  }

  .evt-hero {
    margin-bottom: 1.75rem;
  }

  .evt-title {
    font-size: clamp(1.85rem, 8vw, 2.4rem);
  }

  .evt-organiser {
    flex-direction: column;
    align-items: flex-start;
  }
}
/* Marketing homepage — closed beta look
   Must use !important on radius/shadow to beat global square-design reset in custom.css.scss */

:root {
  --mkt-sky: #c9dbff;
  --mkt-lavender: #d8d2f0;
  --mkt-mint: #e1ef96;
  --mkt-cream: #f7f4ec;
  --mkt-lime: #e1ef96;
  --mkt-forest: #0d3d38;
  --mkt-ink: #141414;
  --mkt-muted: #3a3a3a;
  --mkt-blue: #2c40ab;
  --mkt-radius: 18px;
  --mkt-font: "Galano Grotesque", system-ui, sans-serif;
}

body.marketing-home {
  background: #fff !important;
}

body.marketing-home main {
  padding: 0 !important;
  max-width: none !important;
  overflow-x: clip;
}

body.marketing-home main.container,
body.marketing-home .container-fluid {
  max-width: none;
}

/* —— Nav —— */
body.marketing-home .marketing-nav {
  background: #fff !important;
  border-bottom: none !important;
  padding: 0.85rem 0 !important;
}

body.marketing-home .marketing-nav .container {
  max-width: 1120px;
}

body.marketing-home .marketing-nav .nav-link {
  color: var(--mkt-ink) !important;
  font-weight: 500 !important;
  padding: 0.5rem 0.85rem !important;
}

body.marketing-home .navbar-brand {
  gap: 0.65rem;
}

.mkt-n-arrow {
  display: inline-block;
  margin-left: 0.45rem;
  vertical-align: middle;
  flex-shrink: 0;
}

.mkt-link-with-arrow {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  text-decoration: none !important;
}

.mkt-link-with-arrow .mkt-n-arrow {
  margin-left: 0;
}

body.marketing-home a.marketing-btn-lime,
body.marketing-home .marketing-btn-lime,
body.marketing-home .nav-link.marketing-btn-lime,
body.marketing-home .navbar-nav .nav-link.marketing-btn-lime {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.15rem;
  background: var(--mkt-lime) !important;
  color: var(--mkt-ink) !important;
  border-radius: 999px !important;
  padding: 0.6rem 1.25rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border: none !important;
  white-space: nowrap;
  box-shadow: none !important;
  transition: transform 0.15s ease, filter 0.15s ease;
}

body.marketing-home a.marketing-btn-lime:hover,
body.marketing-home .marketing-btn-lime:hover,
body.marketing-home .nav-link.marketing-btn-lime:hover {
  filter: brightness(0.96);
  transform: translateY(-1px);
  color: var(--mkt-ink) !important;
}

body.marketing-home a.marketing-btn-forest,
body.marketing-home .marketing-btn-forest {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.35rem;
  background: var(--mkt-forest) !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 0.7rem 1.25rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border: none !important;
  box-shadow: none !important;
  transition: transform 0.15s ease, filter 0.15s ease;
}

body.marketing-home a.marketing-btn-forest:hover,
body.marketing-home .marketing-btn-forest:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
  color: #fff !important;
}

.marketing-link {
  color: var(--mkt-ink);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.marketing-link:hover {
  color: var(--mkt-blue);
}

/* —— Sections —— */
.mkt-section {
  width: 100%;
  padding: 4.75rem 0;
}

.mkt-section--sky { background: var(--mkt-sky); }
.mkt-section--lavender { background: var(--mkt-lavender); }
.mkt-section--mint { background: var(--mkt-mint); }
.mkt-section--cream { background: var(--mkt-cream); }
.mkt-section--white { background: #fff; }

.mkt-wrap {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 1.25rem;
}

.mkt-eyebrow {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--mkt-ink);
  margin-bottom: 1.1rem;
  max-width: 34rem;
  line-height: 1.45;
  text-transform: uppercase;
}

.mkt-display {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: clamp(2.6rem, 5.5vw, 3.85rem);
  line-height: 1.02;
  color: var(--mkt-ink) !important;
  margin-bottom: 1rem;
  letter-spacing: -0.03em;
}

.mkt-display br {
  display: block;
  content: "";
}

.mkt-lead {
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--mkt-muted);
  max-width: 32rem;
  margin-bottom: 1.75rem;
}

/* —— Hero —— */
.mkt-section--sky {
  overflow: visible;
}

.mkt-section--sky .mkt-wrap {
  overflow: visible;
}

.mkt-hero-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 1.5rem 2rem;
  align-items: center;
  overflow: visible;
}

.mkt-hero-cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.1rem;
}

.mkt-hero-art {
  position: relative;
  min-height: 440px;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  padding: 0 0 0.25rem 0;
  overflow: visible;
}

.mkt-hero-building {
  width: min(90%, 420px);
  height: auto;
  opacity: 0.95;
  position: relative;
  z-index: 1;
  margin-left: -0.5rem;
}

/* Position wrapper lower-right so the venue art stays mostly visible */
.mkt-ticket-wrap {
  position: absolute;
  right: -6%;
  bottom: -2%;
  width: min(200px, 44%);
  z-index: 2;
  transform: rotate(8deg);
  filter: drop-shadow(0 16px 28px rgba(20, 20, 20, 0.14));
  overflow: visible;
  padding-top: 28px; /* room for the spark strokes above the card */
  margin-top: -28px;
}

/* Three radiating strokes above the ticket's top-right corner */
.mkt-ticket-spark {
  position: absolute;
  top: -28px;
  right: -12px;
  width: 40px;
  height: 32px;
  color: var(--mkt-ink);
  pointer-events: none;
  z-index: 3;
  overflow: visible;
}

/* Hero ticket — stub notches; spark lives on the wrapper */
.mkt-ticket {
  --notch: 11px;
  --pad-x: 0.55rem;
  --tear-from-bottom: 2.85rem;
  position: relative;
  width: 100%;
  background: #fff;
  border: 2.5px solid var(--mkt-ink) !important;
  border-radius: 14px !important;
  padding: 0.55rem var(--pad-x) 0.65rem;
  box-shadow: none !important;
  overflow: hidden;
  -webkit-mask:
    radial-gradient(circle var(--notch) at 0% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%) right;
  -webkit-mask-size: 51.5% 100%;
  -webkit-mask-repeat: no-repeat;
  mask:
    radial-gradient(circle var(--notch) at 0% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% calc(100% - var(--tear-from-bottom)), transparent 98%, #000 100%) right;
  mask-size: 51.5% 100%;
  mask-repeat: no-repeat;
}

.mkt-ticket-img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 8px !important;
  background: #9fb6ff;
  display: block;
  border: none !important;
}

.mkt-ticket-title {
  font-family: var(--mkt-font) !important;
  font-size: 0.95rem;
  font-weight: 700 !important;
  margin: 0.65rem 0 0;
  color: var(--mkt-ink) !important;
  line-height: 1.15;
  letter-spacing: -0.01em;
}

/* Dashed tear locked to the same Y as the mask notches */
.mkt-ticket-tear {
  position: absolute;
  left: var(--pad-x);
  right: var(--pad-x);
  bottom: var(--tear-from-bottom);
  height: 0;
  margin: 0;
  border-top: 1.5px dashed rgba(20, 20, 20, 0.28);
  pointer-events: none;
}

.mkt-ticket-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem;
  margin-top: 0.85rem;
  padding-top: 0.55rem;
}

.mkt-ticket-price {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: 1rem;
  color: var(--mkt-ink) !important;
  white-space: nowrap;
}

body.marketing-home .mkt-ticket a.marketing-btn-forest,
body.marketing-home .mkt-ticket .marketing-btn-forest {
  padding: 0.38rem 0.7rem !important;
  font-size: 0.72rem !important;
  border-radius: 999px !important;
  flex-shrink: 0;
}

.mkt-ticket .mkt-n-arrow {
  width: 12px;
  height: 12px;
}

/* —— Coming up —— */
.mkt-section-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.mkt-section-head--coming {
  justify-content: flex-start;
  align-items: baseline;
  gap: 0.85rem;
  margin-bottom: 1.75rem;
}

.mkt-section-head h2 {
  font-family: var(--mkt-font) !important;
  font-size: clamp(1.9rem, 3vw, 2.4rem);
  font-weight: 700 !important;
  margin: 0;
  color: var(--mkt-ink) !important;
  letter-spacing: -0.02em;
}

.mkt-coming-count {
  font-family: var(--mkt-font) !important;
  font-size: 1rem;
  font-weight: 500;
  color: #6b7280;
  letter-spacing: -0.01em;
}

.mkt-coming-list {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

/* Horizontal event ticket — vertical perforation between art + details */
.mkt-up-ticket {
  --notch: 14px;
  --tear-x: 58%;
  --tear-gap: 1.15rem;
  --stub-pad-y: 1.05rem;
  position: relative;
  display: grid;
  grid-template-columns: var(--tear-x) 1fr;
  align-items: stretch;
  min-height: 280px;
  background: #fff;
  border: 1.5px solid var(--mkt-ink) !important;
  border-radius: 20px !important;
  overflow: hidden;
  box-shadow: none !important;
  /* Full-size masks intersect so only the top/bottom notch circles are cut out */
  -webkit-mask-image:
    radial-gradient(circle var(--notch) at var(--tear-x) 0%, transparent 98%, #000 100%),
    radial-gradient(circle var(--notch) at var(--tear-x) 100%, transparent 98%, #000 100%);
  -webkit-mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-composite: source-in;
  mask-image:
    radial-gradient(circle var(--notch) at var(--tear-x) 0%, transparent 98%, #000 100%),
    radial-gradient(circle var(--notch) at var(--tear-x) 100%, transparent 98%, #000 100%);
  mask-size: 100% 100%;
  mask-repeat: no-repeat;
  mask-composite: intersect;
}

.mkt-up-ticket-art {
  position: relative;
  min-height: 0;
  background: var(--mkt-forest);
  overflow: hidden;
}

.mkt-up-ticket-art img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  position: absolute;
  inset: 0;
  border-radius: 0 !important;
}

.mkt-up-ticket-placeholder {
  width: 100%;
  height: 100%;
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.75);
  padding: 2rem;
  text-align: center;
  font-family: var(--mkt-font) !important;
  font-size: 1.35rem;
  font-weight: 700 !important;
}

/* Vertical dashed tear aligned with top/bottom notches */
.mkt-up-ticket-tear {
  position: absolute;
  top: calc(var(--notch) + 4px);
  bottom: calc(var(--notch) + 4px);
  left: var(--tear-x);
  width: 0;
  margin: 0;
  border-left: 1.5px dashed rgba(20, 20, 20, 0.28);
  transform: translateX(-50%);
  pointer-events: none;
  z-index: 2;
}

.mkt-up-ticket-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: none !important;
  box-shadow: none !important;
}

.mkt-up-ticket-main {
  flex: 1;
  padding: 1.35rem 1.5rem var(--tear-gap);
  display: flex;
  flex-direction: column;
}

.mkt-up-ticket-type {
  display: block;
  font-family: var(--mkt-font) !important;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mkt-ink);
  margin-bottom: 0.55rem;
}

.mkt-up-ticket-title {
  font-family: var(--mkt-font) !important;
  font-size: clamp(1.45rem, 2.4vw, 1.85rem);
  font-weight: 700 !important;
  margin: 0 0 0.35rem;
  color: var(--mkt-ink) !important;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

.mkt-up-ticket-desc {
  margin: 0 0 1rem;
  color: #6b7280;
  font-size: 0.95rem;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.mkt-up-ticket-meta {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.mkt-up-ticket-meta li {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  color: var(--mkt-ink);
  font-size: 0.92rem;
  line-height: 1.35;
}

.mkt-up-ticket-meta i {
  margin-top: 0.12rem;
  font-size: 0.95rem;
  color: var(--mkt-ink);
  flex-shrink: 0;
}

.mkt-up-ticket-stub {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 1.5rem;
  padding: var(--stub-pad-y) 0;
  border-top: 1.5px dashed rgba(20, 20, 20, 0.22);
}

.mkt-up-ticket-price {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
}

.mkt-up-ticket-price-label {
  font-size: 0.75rem;
  font-weight: 500;
  color: #6b7280;
  line-height: 1.2;
}

.mkt-up-ticket-price-value {
  font-family: var(--mkt-font) !important;
  font-size: clamp(1.25rem, 2vw, 1.55rem);
  font-weight: 700 !important;
  color: var(--mkt-ink) !important;
  letter-spacing: -0.02em;
  line-height: 1.15;
}

.mkt-up-ticket-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.4rem;
  flex-shrink: 0;
}

body.marketing-home .mkt-up-ticket .marketing-btn-forest {
  padding: 0.55rem 1.1rem !important;
  font-size: 0.88rem !important;
}

.mkt-up-ticket .mkt-n-arrow {
  width: 13px;
  height: 13px;
}

.mkt-up-ticket-details {
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--mkt-ink);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.mkt-up-ticket-details:hover {
  color: var(--mkt-blue);
}

/* —— How it works —— */
#how-it-works.mkt-section {
  padding: 5.5rem 0 5rem;
}

.mkt-how-title {
  font-size: clamp(2.2rem, 4.2vw, 3rem) !important;
  line-height: 1.05 !important;
  margin: 0 0 3.5rem !important;
  white-space: nowrap;
}

.mkt-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
}

.mkt-step {
  padding: 0 1.75rem;
}

.mkt-step:first-child {
  padding-left: 0;
}

.mkt-step:last-child {
  padding-right: 0;
}

.mkt-step + .mkt-step {
  border-left: 1px solid rgba(20, 20, 20, 0.12);
}

.mkt-step-top {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  margin-bottom: 1.15rem;
}

.mkt-step-num {
  color: var(--mkt-blue) !important;
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: 1.35rem;
  letter-spacing: 0.02em;
  line-height: 1;
  margin: 0;
}

.mkt-step-icon {
  width: 48px;
  height: 48px;
  margin: 0;
  color: var(--mkt-ink);
  display: block;
  overflow: visible;
  flex-shrink: 0;
}

/* Let SVG shapes keep their rx/ry — global square reset flattens icons */
body.marketing-home svg,
body.marketing-home svg * {
  border-radius: unset !important;
}

.mkt-step h3 {
  font-family: var(--mkt-font) !important;
  font-size: 1.3rem;
  font-weight: 700 !important;
  margin: 0 0 0.5rem;
  color: var(--mkt-ink) !important;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.mkt-step p {
  color: var(--mkt-ink);
  font-size: 0.98rem;
  line-height: 1.5;
  margin: 0;
  max-width: 26ch;
  opacity: 0.85;
}

/* —— Dashboard tease —— */
.mkt-dash-grid {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 2.5rem;
  align-items: center;
}

.mkt-dashboard {
  background: #fff;
  border-radius: 18px !important;
  box-shadow: 0 20px 50px rgba(20, 20, 20, 0.12) !important;
  overflow: hidden;
  border: 1.5px solid rgba(0,0,0,0.08) !important;
}

.mkt-dashboard-chrome {
  background: #f3f1ea;
  padding: 0.55rem 0.85rem;
  display: flex;
  gap: 0.35rem;
  align-items: center;
}

.mkt-dashboard-chrome span {
  width: 9px;
  height: 9px;
  border-radius: 50% !important;
  background: #cfc8b8;
  box-shadow: none !important;
}

.mkt-dashboard-body {
  display: grid;
  grid-template-columns: 56px 1fr;
  min-height: 280px;
}

.mkt-dashboard-side {
  background: #f7f4ec;
  border-right: 1px solid #ebe6da;
  padding: 1rem 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  align-items: center;
}

.mkt-dashboard-side i {
  color: #6b7280;
  font-size: 1.05rem;
}

.mkt-dashboard-main {
  padding: 1rem 1.1rem 1.2rem;
}

.mkt-dashboard-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 700;
  margin-bottom: 0.75rem;
}

.mkt-status {
  background: #d8f5d0 !important;
  color: #1f6b3a !important;
  font-size: 0.7rem;
  font-weight: 700;
  border-radius: 999px !important;
  padding: 0.15rem 0.5rem;
  box-shadow: none !important;
}

.mkt-dashboard-tabs {
  display: flex;
  gap: 0.85rem;
  font-size: 0.78rem;
  color: #6b7280;
  border-bottom: 1px solid #eee;
  padding-bottom: 0.55rem;
  margin-bottom: 0.85rem;
}

.mkt-dashboard-tabs strong {
  color: var(--mkt-ink);
  border-bottom: 2px solid var(--mkt-ink);
  padding-bottom: 0.5rem;
}

.mkt-stat-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.65rem;
  margin-bottom: 0.85rem;
}

.mkt-stat {
  background: #f7f4ec;
  border-radius: 12px !important;
  padding: 0.7rem 0.8rem;
  box-shadow: none !important;
}

.mkt-stat strong {
  display: block;
  font-size: 1.15rem;
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
}

.mkt-stat span {
  font-size: 0.75rem;
  color: #6b7280;
}

.mkt-table {
  width: 100%;
  font-size: 0.72rem;
  border-collapse: collapse;
}

.mkt-table th {
  text-align: left;
  color: #6b7280;
  font-weight: 600;
  padding: 0.35rem 0;
}

.mkt-table td {
  padding: 0.4rem 0;
  border-top: 1px solid #f0eee8;
}

.mkt-confirmed {
  background: #d8f5d0 !important;
  color: #1f6b3a !important;
  border-radius: 999px !important;
  padding: 0.12rem 0.45rem;
  font-weight: 700;
  font-size: 0.68rem;
  box-shadow: none !important;
}

/* —— Footer CTA —— */
.mkt-footer-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.85fr 1fr;
  gap: 2rem;
  align-items: center;
}

.mkt-ticket-stack {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  height: 150px;
}

.mkt-ticket-illo {
  --notch: 12px;
  position: absolute;
  width: 168px;
  height: 92px;
  background: #fff;
  border: 2.5px solid var(--mkt-ink) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  -webkit-mask:
    radial-gradient(circle var(--notch) at 0% 50%, transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% 50%, transparent 98%, #000 100%) right;
  -webkit-mask-size: 51.5% 100%;
  -webkit-mask-repeat: no-repeat;
  mask:
    radial-gradient(circle var(--notch) at 0% 50%, transparent 98%, #000 100%) left,
    radial-gradient(circle var(--notch) at 100% 50%, transparent 98%, #000 100%) right;
  mask-size: 51.5% 100%;
  mask-repeat: no-repeat;
}

.mkt-ticket-illo--back {
  transform: translate(-10px, -8px) rotate(-9deg);
  z-index: 1;
}

.mkt-ticket-illo--front {
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translate(8px, 6px) rotate(5deg);
  z-index: 2;
}

.mkt-ticket-illo-perf {
  position: absolute;
  left: 28%;
  top: 10px;
  bottom: 10px;
  border-left: 2px dashed rgba(20, 20, 20, 0.35);
}

.mkt-ticket-illo-n {
  width: 44px;
  height: auto;
  position: relative;
  z-index: 1;
  margin-left: 12%;
}

.mkt-checklist {
  list-style: none;
  padding: 0;
  margin: 0;
}

.mkt-checklist li {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin-bottom: 0.65rem;
  font-weight: 500;
}

.mkt-check {
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 50% !important;
  background: #9fb6ff !important;
  color: var(--mkt-blue) !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 700;
  flex-shrink: 0;
  box-shadow: none !important;
}

.mkt-legal {
  margin-top: 2.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(0,0,0,0.08);
  font-size: 0.8rem;
  color: #6b7280;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}

@media (max-width: 900px) {
  .mkt-hero-grid,
  .mkt-steps,
  .mkt-dash-grid,
  .mkt-footer-grid {
    grid-template-columns: 1fr;
  }

  .mkt-up-ticket {
    --notch: 12px;
    --tear-gap: 1rem;
    --stub-pad-y: 0.9rem;
    container-type: inline-size;
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
    /* Side notches at the art / body join (16:9 art height) */
    -webkit-mask-image:
      radial-gradient(circle var(--notch) at 0% calc(100cqw * 9 / 16), transparent 98%, #000 100%),
      radial-gradient(circle var(--notch) at 100% calc(100cqw * 9 / 16), transparent 98%, #000 100%);
    -webkit-mask-size: 100% 100%;
    -webkit-mask-composite: source-in;
    mask-image:
      radial-gradient(circle var(--notch) at 0% calc(100cqw * 9 / 16), transparent 98%, #000 100%),
      radial-gradient(circle var(--notch) at 100% calc(100cqw * 9 / 16), transparent 98%, #000 100%);
    mask-size: 100% 100%;
    mask-composite: intersect;
  }

  .mkt-up-ticket-art {
    aspect-ratio: 16 / 9;
    border-radius: 18px 18px 0 0;
  }

  .mkt-up-ticket-tear {
    top: calc(100cqw * 9 / 16);
    bottom: auto;
    left: calc(var(--notch) + 4px);
    right: calc(var(--notch) + 4px);
    width: auto;
    height: 0;
    border-left: none;
    border-top: 1.5px dashed rgba(20, 20, 20, 0.28);
    transform: translateY(-50%);
  }

  .mkt-up-ticket-main {
    padding: 1.15rem 1.25rem var(--tear-gap);
  }

  .mkt-up-ticket-stub {
    margin: 0 1.25rem;
    flex-wrap: wrap;
  }

  .mkt-up-ticket-actions {
    align-items: flex-end;
  }

  .mkt-step {
    padding: 1.5rem 0 !important;
  }

  .mkt-step + .mkt-step {
    border-left: none;
    border-top: 1px solid rgba(20, 20, 20, 0.12);
  }

  .mkt-hero-art {
    min-height: 320px;
    order: -1;
    justify-content: center;
    padding: 0 0.5rem 1.5rem;
  }

  .mkt-hero-building {
    width: min(80%, 300px);
    margin-left: 0;
  }

  .mkt-ticket-wrap {
    right: 0;
    bottom: 0;
    width: min(170px, 48%);
  }
}

/* —— Public /activities explore —— */
body.marketing-home .marketing-nav .nav-link.mkt-nav-active {
  font-weight: 600 !important;
  text-decoration: none !important;
  box-shadow: inset 0 -3px 0 0 var(--mkt-lime);
}

.mkt-explore {
  padding-top: 0;
  padding-bottom: 5rem;
  min-height: 70vh;
}

.mkt-explore-hero {
  width: 100%;
  background: var(--mkt-sky);
  margin-bottom: 2rem;
  overflow: hidden;
  min-height: 240px;
}

.mkt-explore-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 1.5rem 2rem;
  align-items: center;
  padding-top: 2.25rem;
  padding-bottom: 2.25rem;
}

.mkt-explore-hero__copy {
  position: relative;
  z-index: 1;
  max-width: 28rem;
}

.mkt-explore-hero__copy .mkt-eyebrow {
  margin-bottom: 0.65rem;
}

.mkt-explore-hero__copy .mkt-display {
  margin-bottom: 0.65rem;
}

.mkt-explore-hero__copy .mkt-lead {
  margin-bottom: 0;
  max-width: 22rem;
}

.mkt-explore-hero__art {
  position: relative;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  min-height: 180px;
}

.mkt-explore-hero__tickets {
  width: min(100%, 380px);
  height: auto;
  display: block;
  transform: rotate(4deg);
  filter: drop-shadow(0 18px 28px rgba(20, 20, 20, 0.18));
}

.mkt-explore-filters {
  margin-bottom: 2rem;
}

@media (min-width: 768px) {
  .mkt-explore-filter-panel.d-none {
    display: block !important;
  }
}

.mkt-explore-filter-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 0.7rem 1rem;
  background: #fff;
  border: 2px solid var(--mkt-ink);
  border-radius: 999px !important;
  font-weight: 600;
  color: var(--mkt-ink);
}

.mkt-explore-form {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr auto;
  gap: 0.85rem 1rem;
  align-items: end;
}

.mkt-explore-field label {
  display: block;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 0.4rem;
  color: var(--mkt-ink);
}

.mkt-explore-search {
  position: relative;
}

.mkt-explore-search i {
  position: absolute;
  left: 1rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--mkt-muted);
  pointer-events: none;
}

.mkt-explore-field input,
.mkt-explore-field select {
  width: 100%;
  border: 2px solid var(--mkt-ink) !important;
  border-radius: 12px !important;
  background: #fff !important;
  padding: 0.6rem 1rem !important;
  font-size: 0.95rem !important;
  color: var(--mkt-ink) !important;
  box-shadow: none !important;
}

.mkt-explore-search input {
  padding-left: 2.5rem !important;
}

.mkt-explore-field input:focus,
.mkt-explore-field select:focus {
  outline: none;
  border-color: var(--mkt-forest) !important;
}

.mkt-explore-filters .select2-container--bootstrap-5 .select2-selection {
  border: 2px solid var(--mkt-ink) !important;
  border-radius: 12px !important;
  min-height: 44px !important;
  padding: 0.25rem 0.5rem !important;
  background: #fff !important;
}

.mkt-explore-actions {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding-bottom: 0.1rem;
}

.mkt-explore-actions .marketing-btn-forest {
  white-space: nowrap;
  border-radius: 12px !important;
  padding: 0.65rem 1.2rem !important;
}

.mkt-explore-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem 1.5rem;
  margin-bottom: 1.5rem;
}

.mkt-explore-head h2 {
  font-family: var(--mkt-font) !important;
  font-size: clamp(1.25rem, 2.2vw, 1.55rem);
  font-weight: 700 !important;
  margin: 0;
  color: var(--mkt-ink) !important;
  letter-spacing: -0.02em;
}

.mkt-explore-head__meta {
  display: inline-block;
  margin-left: 0.35rem;
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--mkt-muted);
}

.mkt-explore-sort {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}

.mkt-explore-sort label {
  margin: 0;
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--mkt-muted);
  white-space: nowrap;
}

.mkt-explore-sort-select {
  border: 2px solid var(--mkt-ink) !important;
  border-radius: 10px !important;
  background: #fff !important;
  padding: 0.4rem 2rem 0.4rem 0.75rem !important;
  font-size: 0.9rem !important;
  font-weight: 600;
  color: var(--mkt-ink) !important;
  box-shadow: none !important;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23141414' d='M1.4 0.6L6 5.2 10.6 0.6 12 2 6 8 0 2z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 0.7rem center !important;
  background-size: 10px 7px !important;
}

.mkt-explore-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.75rem 1.5rem;
  align-items: stretch;
}

.mkt-explore-card {
  position: relative;
  transition: transform 0.2s ease;
  filter: drop-shadow(0 10px 18px rgba(20, 20, 20, 0.1));
  height: 100%;
}

.mkt-explore-card:hover {
  transform: translateY(-4px);
}

.mkt-explore-card__link {
  display: block;
  height: 100%;
  text-decoration: none !important;
  color: inherit !important;
}

.mkt-ticket--explore {
  --notch: 12px;
  --pad-x: 0.85rem;
  --tear-from-bottom: 3.85rem;
  --tear-gap-above: 1rem;
  --tear-gap-below: 0.7rem;
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 0.7rem var(--pad-x) 0.7rem;
  border-radius: 16px !important;
  border-width: 2px !important;
}

.mkt-ticket--explore .mkt-ticket-img {
  aspect-ratio: 16 / 9;
  border-radius: 10px !important;
  margin: 0;
  width: 100%;
  object-fit: cover;
}

.mkt-ticket-img--placeholder {
  display: flex !important;
  align-items: center;
  justify-content: center;
  background: #9fb6ff;
  color: var(--mkt-ink);
  font-family: var(--mkt-font);
  font-size: 2.25rem;
  font-weight: 700;
}

.mkt-ticket--explore .mkt-ticket-body {
  flex: 1 1 auto;
  padding-top: 0.85rem;
  margin-bottom: var(--tear-gap-above);
}

.mkt-ticket--explore .mkt-ticket-type {
  display: block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mkt-muted);
  margin-bottom: 0.35rem;
}

.mkt-ticket--explore .mkt-ticket-title {
  font-size: 1.15rem;
  margin: 0 0 0.65rem;
  line-height: 1.2;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
}

.mkt-ticket-meta {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.mkt-ticket-meta li {
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
  font-size: 0.82rem;
  line-height: 1.3;
  color: var(--mkt-muted);
}

.mkt-ticket-meta i {
  margin-top: 0.1rem;
  flex-shrink: 0;
  font-size: 0.85rem;
}

.mkt-ticket--explore .mkt-ticket-footer {
  margin-top: auto;
  padding-top: var(--tear-gap-below);
  min-height: 2.55rem;
  align-items: center;
}

.mkt-ticket-price-block {
  display: flex;
  flex-direction: column;
  gap: 0.05rem;
  min-width: 0;
}

.mkt-ticket-price-label {
  font-size: 0.68rem;
  font-weight: 500;
  color: var(--mkt-muted);
  line-height: 1;
}

.mkt-ticket--explore .mkt-ticket-price {
  font-size: 1.05rem;
  line-height: 1.15;
}

body.marketing-home .mkt-ticket--explore .marketing-btn-forest {
  padding: 0.45rem 0.85rem !important;
  font-size: 0.78rem !important;
  border-radius: 10px !important;
  pointer-events: none;
  gap: 0.25rem !important;
}

.mkt-explore-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 3.5rem 1rem;
  background: rgba(255, 255, 255, 0.55);
  border: 2px dashed rgba(20, 20, 20, 0.22);
  border-radius: 18px !important;
}

.mkt-explore-empty h3 {
  font-family: var(--mkt-font) !important;
  font-weight: 700 !important;
  font-size: 1.5rem;
  margin-bottom: 0.65rem;
  color: var(--mkt-ink) !important;
}

.mkt-explore-empty p {
  color: var(--mkt-muted);
  max-width: 28rem;
  margin: 0 auto 1.25rem;
}

.mkt-explore-more {
  display: flex;
  justify-content: center;
  margin-top: 2.5rem;
}

.mkt-explore-more-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.7rem 1.6rem;
  background: #fff;
  border: 2px solid var(--mkt-ink);
  border-radius: 999px !important;
  color: var(--mkt-ink) !important;
  font-weight: 600;
  text-decoration: none !important;
  transition: transform 0.15s ease, background 0.15s ease;
}

.mkt-explore-more-btn:hover {
  transform: translateY(-2px);
  background: var(--mkt-cream);
  color: var(--mkt-ink) !important;
}

@media (max-width: 991.98px) {
  .mkt-explore-hero {
    min-height: 0;
  }

  .mkt-explore-hero__inner {
    grid-template-columns: 1fr;
    padding-top: 1.75rem;
    padding-bottom: 1.75rem;
  }

  .mkt-explore-hero__art {
    justify-content: center;
    min-height: 0;
    order: -1;
  }

  .mkt-explore-hero__tickets {
    width: min(70%, 280px);
  }

  .mkt-explore-form {
    grid-template-columns: 1fr 1fr;
  }

  .mkt-explore-field--search {
    grid-column: 1 / -1;
  }

  .mkt-explore-actions {
    grid-column: 1 / -1;
    justify-content: flex-end;
  }

  .mkt-explore-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem 1.15rem;
  }
}

@media (max-width: 767.98px) {
  .mkt-explore {
    padding-bottom: 3.5rem;
  }

  .mkt-explore-hero__inner {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }

  .mkt-explore-form {
    grid-template-columns: 1fr;
  }

  .mkt-explore-field--search {
    grid-column: auto;
  }

  .mkt-explore-actions {
    justify-content: stretch;
  }

  .mkt-explore-actions .marketing-btn-forest {
    width: 100%;
  }

  .mkt-explore-head {
    flex-direction: column;
    align-items: flex-start;
  }

  .mkt-explore-grid {
    grid-template-columns: 1fr;
    max-width: 360px;
    margin: 0 auto;
  }

  .mkt-explore-card:hover {
    transform: translateY(-3px);
  }
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *










 */