@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap');

:root {
  --brand-primary: #AB164C;
  --brand-secondary: #45061F;
  --brand-primary-rgb: 171, 22, 76;
  --brand-secondary-rgb: 69, 6, 31;
  --burgundy: var(--brand-primary);
  --burgundy-dark: var(--brand-secondary);
  --ui-font: 'Open Sans', Arial, sans-serif;
  --ui-font-light: 300;
  --ui-font-regular: 400;
  --ui-font-medium: 500;
  --ui-font-semibold: 600;
  --ui-font-bold: 700;
  --admin-choice-size: 14px;
  --admin-control-gap: 10px;
  --admin-control-inline-min-height: 44px;
  --admin-control-inline-padding-y: 10px;
  --admin-control-inline-padding-x: 12px;
  --admin-control-inline-radius: 8px;
  --admin-control-card-padding-y: 12px;
  --admin-control-card-padding-x: 14px;
  --admin-control-card-radius: 10px;
  --admin-control-active-bg: rgba(var(--brand-primary-rgb), 0.04);
  --admin-dropdown-item-padding-y: 7px;
  --admin-dropdown-item-padding-x: 10px;
  --admin-dropdown-item-radius: 8px;
  --admin-alert-radius: 10px;
  --admin-alert-padding-y: 14px;
  --admin-alert-padding-x: 18px;
  --admin-alert-gap: 12px;
  --admin-badge-radius: 999px;
  --admin-badge-padding-y: 3px;
  --admin-badge-padding-x: 9px;
  --admin-badge-font-size: 11px;
  --admin-btn-radius: 8px;
  --admin-btn-padding-y: 8px;
  --admin-btn-padding-x: 14px;
  --admin-icon-btn-size: 32px;
  --admin-notice-radius: 8px;
  --admin-notice-padding-y: 10px;
  --admin-notice-padding-x: 14px;
  --admin-page-max: 1400px;
  --admin-motion-fast: 0.18s;
  --admin-motion: 0.28s;
  --admin-ease: cubic-bezier(.2,.8,.2,1);
}

html, body {
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--ui-font);
}

body,
button,
input,
select,
textarea {
  font-family: var(--ui-font);
}

h1, h2, h3, h4, h5, h6,
.btn,
.card h2,
.card h3,
.section-label,
.tab-btn,
.nav-item,
.badge,
.field-lbl {
  font-family: var(--ui-font);
}

input, select, textarea, button {
  font-size: 14px;
}

input:not([type="checkbox"]):not([type="radio"]), select, textarea {
  min-height: 44px;
}

.btn {
  min-height: 44px;
}

.admin-toast-stack {
  position: fixed;
  z-index: 10000;
  top: 76px;
  right: 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: min(420px, calc(100vw - 32px));
  pointer-events: none;
}

.admin-toast-stack .alert {
  position: relative;
  margin: 0 !important;
  padding: 14px 46px 14px 16px !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 44px rgba(var(--brand-secondary-rgb), .18);
  background: #fff !important;
  pointer-events: auto;
  animation: adminToastIn .22s var(--admin-ease) both;
}

.admin-toast-stack .alert.success {
  border: 1px solid rgba(26,130,96,.22) !important;
  color: var(--success, #1a8260) !important;
}

.admin-toast-stack .alert.error {
  border: 1px solid rgba(196,20,58,.22) !important;
  color: var(--error, #c4143a) !important;
}

.admin-toast-close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 28px;
  height: 28px;
  min-height: 28px;
  border: 0;
  border-radius: 999px;
  background: rgba(var(--brand-secondary-rgb), .06);
  color: #7f7380;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
}

.admin-toast-close:hover {
  background: rgba(var(--brand-primary-rgb), .10);
  color: var(--burgundy);
}

.admin-toast-stack .alert.is-hiding {
  animation: adminToastOut .18s var(--admin-ease) both;
}

@keyframes adminToastIn {
  from { opacity: 0; transform: translateY(-8px) scale(.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes adminToastOut {
  from { opacity: 1; transform: translateY(0) scale(1); }
  to { opacity: 0; transform: translateY(-8px) scale(.98); }
}

@media (max-width: 768px) {
  .admin-toast-stack {
    top: 66px;
    right: 12px;
    left: 12px;
    width: auto;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .card,
  .stat-card,
  .pay-card,
  .event-card,
  .settings-nav,
  .main-filter,
  .adv-filter,
  .report-card,
  .modal,
  .notice,
  .alert,
  .btn,
  .btn-primary,
  .btn-outline,
  .btn-danger,
  .btn-link,
  .empty-action,
  .create-event-btn,
  .pp-btn,
  .pp-form button,
  button,
  a[class*="btn"],
  label[class*="btn"],
  .tab-btn,
  .nav-item,
  .log-tab,
  .filter-chip,
  .subtab,
  .type-chip,
  .ch-btn,
  .when-mode-btn,
  .reg-scope-btn,
  .adv-dd-btn,
  .adv-reset-btn,
  .filter-reset,
  .att-add-btn,
  .image-upload,
  .admin-header a,
  .admin-header button {
    transition:
      transform var(--admin-motion-fast) var(--admin-ease),
      box-shadow var(--admin-motion-fast) var(--admin-ease),
      border-color var(--admin-motion-fast) var(--admin-ease),
      background-color var(--admin-motion-fast) var(--admin-ease),
      color var(--admin-motion-fast) var(--admin-ease),
      opacity var(--admin-motion-fast) var(--admin-ease);
    will-change: transform;
  }

  .btn:hover,
  .btn-primary:hover,
  .btn-outline:hover,
  .btn-danger:hover,
  .tab-btn:hover,
  .nav-item:hover,
  .log-tab:hover,
  .btn-link:hover,
  .empty-action:hover,
  .create-event-btn:hover,
  .pp-btn:hover,
  .pp-form button:hover,
  button:hover,
  a[class*="btn"]:hover,
  label[class*="btn"]:hover,
  .filter-chip:hover,
  .subtab:hover,
  .type-chip:hover,
  .ch-btn:hover,
  .when-mode-btn:hover,
  .reg-scope-btn:hover,
  .adv-dd-btn:hover,
  .adv-reset-btn:hover,
  .filter-reset:hover,
  .att-add-btn:hover,
  .image-upload:hover,
  .admin-header a:hover,
  .admin-header button:hover {
    transform: translateY(-3px) scale(1.01);
    box-shadow: 0 12px 26px rgba(var(--brand-secondary-rgb), .14);
  }

  .btn:active,
  .btn-primary:active,
  .btn-outline:active,
  .btn-danger:active,
  .tab-btn:active,
  .nav-item:active,
  .log-tab:active,
  .btn-link:active,
  .empty-action:active,
  .create-event-btn:active,
  .pp-btn:active,
  .pp-form button:active,
  button:active,
  a[class*="btn"]:active,
  label[class*="btn"]:active,
  .filter-chip:active,
  .subtab:active,
  .type-chip:active,
  .ch-btn:active,
  .when-mode-btn:active,
  .reg-scope-btn:active,
  .adv-dd-btn:active,
  .adv-reset-btn:active,
  .filter-reset:active,
  .att-add-btn:active,
  .image-upload:active,
  .admin-header a:active,
  .admin-header button:active {
    transform: translateY(0) scale(.98);
    box-shadow: 0 4px 12px rgba(var(--brand-secondary-rgb), .10);
  }

  .container > .card,
  .wrap,
  .container > .stats-grid,
  .container > .stat-grid,
  .container > .filter-card,
  .container > .table-wrap,
  .container > .results-info,
  .container > .pager,
  .container > .log-tabs {
    animation: adminFadeIn var(--admin-motion) var(--admin-ease) both;
  }

  @keyframes adminFadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
  }
}

@media (prefers-reduced-motion: reduce) {
  .card,
  .stat-card,
  .pay-card,
  .event-card,
  .settings-nav,
  .main-filter,
  .adv-filter,
  .report-card,
  .modal,
  .notice,
  .alert,
  .btn,
  .btn-primary,
  .btn-outline,
  .btn-danger,
  .btn-link,
  button,
  a[class*="btn"],
  label[class*="btn"],
  .tab-btn,
  .nav-item,
  .log-tab,
  .filter-chip,
  .subtab,
  .type-chip,
  .ch-btn,
  .when-mode-btn,
  .reg-scope-btn,
  .adv-dd-btn,
  .adv-reset-btn,
  .filter-reset,
  .att-add-btn,
  .image-upload,
  .admin-header a,
  .admin-header button {
    transition: none !important;
  }
}

.ui-spoiler {
  margin-top: 16px;
  border: 1px solid var(--border, #e4dde0);
  border-radius: 12px;
  background: #fff;
}

.ui-spoiler > summary {
  list-style: none;
  cursor: pointer;
  padding: 14px 16px;
  font-weight: var(--ui-font-semibold);
  color: var(--burgundy-dark, #45061F);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.ui-spoiler > summary::-webkit-details-marker {
  display: none;
}

.ui-spoiler-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(138,122,128,.14);
  color: var(--muted, #8a7a80);
  font-size: 12px;
  font-weight: var(--ui-font-semibold);
}

.ui-muted {
  color: var(--muted, #8a7a80);
}

.notice-box {
  padding: var(--admin-notice-padding-y) var(--admin-notice-padding-x);
  border-radius: var(--admin-notice-radius);
  font-size: 13px;
  line-height: 1.6;
}

.notice-box.notice-soft {
  background: var(--cream, #f8f2ef);
}

.notice-box.notice-warn {
  background: linear-gradient(135deg, rgba(201,122,26,.08), rgba(166,102,21,.05));
  border-left: 4px solid #c97a1a;
}

.notice-box.notice-burgundy {
  background: linear-gradient(135deg, rgba(var(--brand-primary-rgb), .08), rgba(201,169,106,.1));
  border-left: 4px solid var(--burgundy, #AB164C);
}

.notice-box.notice-info {
  background: linear-gradient(135deg, rgba(201,169,106,.10), rgba(var(--brand-primary-rgb), .05));
  border-left: 3px solid var(--gold, #c9a96a);
}

.notice-box.notice-viewer,
.alert.notice-viewer {
  background: #fff8e1;
  border-left: 3px solid #f39c12;
}

.notice-box.notice-success,
.alert.notice-success {
  background: #e8f5e9;
  border-left: 3px solid #4caf50;
}

.notice-box.notice-error,
.alert.notice-error {
  background: #ffebee;
  border-left: 3px solid #e53935;
}

.notice-link-muted {
  margin-left: auto;
  font-size: 12px;
  color: var(--muted, #8a7a80);
  text-decoration: underline;
}

.icon-btn-square {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--admin-icon-btn-size);
  height: var(--admin-icon-btn-size);
  border-radius: var(--admin-btn-radius);
  padding: 0;
}

.btn-outline-danger-xs {
  font-size: 11px;
  padding: 6px 12px;
  color: var(--error, #c62828);
  border-color: var(--error, #c62828);
}

.alert-compact {
  padding: var(--admin-notice-padding-y) var(--admin-notice-padding-x);
  font-size: 13px;
}

.ui-muted-sm {
  font-size: 11px;
  color: var(--muted, #8a7a80);
}

.ui-hint-compact {
  font-size: 11px;
  color: var(--muted, #8a7a80);
}

.ui-soft-box {
  margin-top: 14px;
  padding: 12px;
  background: var(--cream, #f8f2ef);
  border-radius: var(--admin-notice-radius);
}

.ui-flex-between {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.ui-flex-between-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.ui-form-reset {
  margin: 0;
}

.ui-disabled-fieldset {
  border: none;
  padding: 0;
  margin: 0;
}

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

.ui-heading-subtitle {
  font-size: 13px;
  color: var(--muted, #8a7a80);
  font-weight: 400;
}

.ui-section-gap-18 {
  margin-top: 18px;
}

.ui-caption-muted {
  color: var(--muted, #8a7a80);
  font-size: 11px;
}

.ui-caption-muted-xs {
  color: var(--muted, #8a7a80);
  font-size: 10px;
  font-weight: 400;
  margin-top: 2px;
}

.ui-text-success {
  color: var(--success, #2e7d32);
}

.ui-text-warning {
  color: var(--warning, #c97a1a);
}

.ui-text-error {
  color: var(--error, #c62828);
}

.ui-text-soft {
  color: var(--text-soft, #6f5962);
}

.ui-cell-ellipsis {
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-cell-message {
  max-width: 280px;
  color: var(--muted, #8a7a80);
  font-size: 12px;
  line-height: 1.45;
  white-space: normal;
  word-break: break-word;
}

.ui-cell-message-ellipsis {
  max-width: 280px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted, #8a7a80);
}

.bcast-result-summary {
  width: 100%;
}

.bcast-error-details {
  margin-top: 14px;
  background: rgba(196,20,58,.06);
  border-radius: 8px;
  padding: 10px 14px;
}

.bcast-error-summary {
  cursor: pointer;
  color: var(--error, #c62828);
  font-weight: 600;
}

.bcast-error-log {
  margin-top: 10px;
  font-size: 12px;
  line-height: 1.6;
  font-family: monospace;
}

.bcast-error-row {
  padding: 4px 0;
  border-bottom: 1px solid rgba(196,20,58,.1);
}

.bcast-preview-switcher {
  background: linear-gradient(135deg, rgba(201,169,106,.12), rgba(var(--brand-primary-rgb), .06));
  border: 1px solid rgba(201,169,106,.3);
  border-radius: 10px;
  padding: 12px 16px;
  margin: 10px 0 18px;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.bcast-preview-switcher-title {
  color: var(--burgundy-dark, #45061F);
  font-size: 13px;
}

.bcast-preview-switcher-select {
  flex: 1;
  min-width: 200px;
  padding: var(--admin-btn-padding-y) var(--admin-control-inline-padding-x);
  border-radius: var(--admin-btn-radius);
  border: 1px solid var(--border, #e4dde0);
  background: #fff;
  font-size: 13px;
}

.public-primary-btn {
  background: linear-gradient(135deg, var(--burgundy-top, var(--brand-primary, #AB164C)) 0%, var(--burgundy-bot, var(--brand-secondary, #45061F)) 100%);
  border-color: var(--burgundy-top, var(--brand-primary, #AB164C));
  color: #fff;
  box-shadow: 0 4px 14px rgba(var(--brand-primary-rgb), 0.35);
}

.public-primary-btn:hover {
  background: linear-gradient(135deg, var(--burgundy-bot, var(--brand-secondary, #45061F)) 0%, var(--burgundy-dark, var(--brand-secondary, #45061F)) 100%);
  box-shadow: 0 6px 18px rgba(var(--brand-secondary-rgb), 0.45);
}

.public-primary-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}

.modal-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(45,33,40,0.55);
  backdrop-filter: blur(4px);
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.modal-overlay.show {
  display: flex;
}

.modal-card {
  background: #fff;
  border-radius: 14px;
  max-width: 680px;
  width: 100%;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 24px 60px rgba(var(--brand-secondary-rgb), 0.35);
}

.modal-card.modal-wide {
  max-width: 760px;
}

.modal-head {
  padding: 18px 22px;
  border-bottom: 1px solid var(--border, #e4dde0);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-shrink: 0;
}

.modal-head h2,
.modal-head h3 {
  font-family: 'Open Sans', sans-serif;
  font-weight: 600;
  font-size: 16px;
  color: var(--burgundy-dark, var(--brand-secondary, #45061F));
  text-transform: uppercase;
  letter-spacing: .8px;
  margin: 0;
}

.modal-close {
  background: transparent;
  border: none;
  cursor: pointer;
  font-size: 22px;
  color: var(--muted, #8a7a80);
  padding: 4px 12px;
  text-decoration: none;
  line-height: 1;
}

.modal-close:hover {
  color: var(--burgundy, var(--brand-primary, #AB164C));
}

.modal-body {
  padding: 22px;
  overflow: auto;
  flex: 1 1 auto;
  min-height: 0;
}

.modal-foot {
  padding: 14px 22px;
  border-top: 1px solid var(--border, #e4dde0);
  display: flex;
  gap: 10px;
  align-items: center;
  flex-shrink: 0;
}

@supports (height: 100dvh) {
  .modal-card {
    max-height: 90dvh;
  }
}

@media (max-width: 640px) {
  .modal-overlay {
    align-items: stretch;
    padding: 10px;
  }

  .modal-card {
    max-height: calc(100vh - 20px);
    border-radius: 14px;
  }

  @supports (height: 100dvh) {
    .modal-card {
      max-height: calc(100dvh - 20px);
    }
  }

  .modal-head {
    padding: 14px 16px;
  }

  .modal-body {
    padding: 16px;
  }

  .modal-foot {
    padding: 12px 16px;
    flex-wrap: wrap;
  }

  .modal-foot .modal-spacer {
    display: none;
  }

  .modal-foot > button,
  .modal-foot > .btn,
  .modal-foot > a {
    flex: 1 1 150px;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .modal-card {
    animation: modalIn .25s;
  }

  @keyframes modalIn {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
  }
}