*,
*::before,
*::after { box-sizing: border-box; }

html, body { margin: 0; padding: 0; }

body {
  font-family: "Josefin Sans", sans-serif;
  background: #fbfbfb;
  color: #111;
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; }

.admin-pagination svg {display: none;}
.admin-auth-body { min-height: 100vh; background: #fbfbfb; }
.admin-auth-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px; }
.admin-auth-card, .admin-card, .stat-card { background: #fff; border-radius: 16px; box-shadow: 0 10px 30px rgba(0,0,0,0.08); border: 1px solid rgba(0,0,0,0.06); }
.admin-auth-card { width: 100%; max-width: 420px; padding: 24px; }
.admin-auth-title { margin: 0 0 6px; font-size: 22px; letter-spacing: 1px; text-transform: uppercase; }
.admin-auth-sub { margin: 0 0 18px; opacity: .75; }
.admin-shell { display: grid; grid-template-columns: 280px 1fr; min-height: 100vh; }
.admin-sidebar-backdrop { display: none; }
body.admin-sidebar-open { overflow: hidden; }
.admin-sidebar { background: #000; color: #fff; padding: 22px 18px; position: sticky; top: 0; height: fit-content; min-height: 100vh; display: flex; flex-direction: column; justify-content: space-between; }
.admin-brand { padding: 10px 10px 20px; border-bottom: 1px solid rgba(246,112,114,0.20); }
.admin-logo { font-size: 22px; font-weight: 700; color: #f67072; letter-spacing: 1px; text-transform: uppercase; }
.admin-sub { font-size: 12px; opacity: 0.75; margin-top: 6px; letter-spacing: 1px; text-transform: uppercase; }
.admin-nav { display: flex; flex-direction: column; gap: 8px; padding: 18px 10px; }
.admin-link { text-decoration: none; color: rgba(255,255,255,0.85); padding: 12px 12px; border-radius: 12px; letter-spacing: 1px; text-transform: uppercase; font-size: 13px; transition: background 0.2s ease, color 0.2s ease; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.admin-link:hover { background: rgba(255,255,255,0.06); color: #0da774; }
.admin-link.active { background: rgba(255,255,255,0.08); color: #fff; }
.admin-notify-badge { min-width: 20px; padding: 2px 6px; border-radius: 999px; background: #f67072; color: #fff; font-size: 12px; text-align: center; }
.admin-sidebar-footer { padding: 12px 10px; border-top: 1px solid rgba(246,112,114,0.20); }
.admin-user-name { font-weight: 700; letter-spacing: 0.5px; }
.admin-user-type { font-size: 12px; opacity: 0.7; text-transform: uppercase; letter-spacing: 1px; margin-top: 2px; }
.admin-logout { margin-top: 12px; width: 100%; padding: 12px; border: 1px solid rgba(255,255,255,0.18); background: transparent; color: #fff; border-radius: 12px; cursor: pointer; text-transform: uppercase; letter-spacing: 1px; font-family: inherit; }
.admin-logout:hover { border-color: #0da774; color: #0da774; }
.admin-main { min-width: 0; }
.admin-topbar { background: #fff; border-bottom: 1px solid rgba(0,0,0,0.06); padding: 14px 18px; display: flex; justify-content: space-between; align-items: center; }
.admin-topbar-right { display: flex; align-items: center; gap: 10px; }
.admin-burger { display: none; border: none; background: transparent; font-size: 24px; cursor: pointer; }
.admin-pill { padding: 8px 12px; border: 1px solid rgba(0,0,0,0.12); border-radius: 999px; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; }
.admin-content { padding: 22px 22px 90px; }
.admin-page-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 18px; }
.admin-h1 { margin: 0; font-size: 28px; letter-spacing: 1px; text-transform: uppercase; }
.admin-h2 { margin: 0; font-size: 16px; text-transform: uppercase; letter-spacing: 1px; }
.admin-muted { opacity: 0.75; margin-top: 6px; }
.admin-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.admin-actions-spaced { margin-top: 8px; }
.admin-btn { display: inline-flex; align-items: center; justify-content: center; padding: 12px 16px; border-radius: 12px; text-decoration: none; text-transform: uppercase; letter-spacing: 1px; font-size: 13px; cursor: pointer; border: 1px solid transparent; background: transparent; font-weight: 800; transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease; }
.admin-btn:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(0,0,0,0.08); }
.admin-btn-outline { border: 1px solid rgba(0,0,0,0.14); color: #111; background: #fff; }
.admin-btn-outline:hover { border-color: rgba(13,167,116,0.45); color: #0a7f58; }
.admin-btn-solid { background: #0da774; color: #fff; border-color: #0da774; }
.admin-btn-danger { border: 1px solid rgba(246,112,114,0.35); color: #f67072; background: #fff; }
.admin-btn-danger:hover { background: #fff3f3; border-color: rgba(246,112,114,0.65); }
.admin-btn-block { width: 100%; }
.admin-btn-sm { padding: 8px 12px; }
.admin-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 16px; }
.stat-card { padding: 16px; }
.stat-label { font-size: 12px; letter-spacing: 1px; text-transform: uppercase; opacity: 0.75; }
.stat-value { font-size: 28px; font-weight: 700; margin-top: 8px; }
.stat-sub { font-size: 12px; opacity: 0.7; margin-top: 4px; }
.admin-grid { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 14px; margin-top: 14px; }
.admin-grid-single { grid-template-columns: 1fr; }
.admin-card { padding: 16px; }
.admin-card-spaced { margin-top: 16px; }
.admin-card-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.admin-card-body, .admin-form-grid { display: grid; gap: 12px; }
.admin-form-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.admin-form-grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.admin-tag { font-size: 11px; padding: 6px 10px; border: 1px solid rgba(0,0,0,0.12); border-radius: 999px; text-transform: uppercase; letter-spacing: 1px; opacity: 0.7; }
.admin-row { display: block; width: 100%; padding: 12px; border-radius: 14px; text-decoration: none; color: inherit; border: 1px solid rgba(0,0,0,0.06); margin-top: 12px; background: #fff; }
.admin-row:hover { border-color: rgba(13,167,116,0.35); }
.admin-row-title { font-weight: 700; letter-spacing: 0.3px; font-size: 15px; }
.admin-row-sub { font-size: 13px; opacity: 0.7; margin-top: 4px; }
.activity { display: flex; gap: 10px; padding: 12px; border-radius: 14px; border: 1px solid rgba(0,0,0,0.06); margin-top: 12px; }
.activity-dot { width: 10px; height: 10px; border-radius: 999px; background: #f67072; margin-top: 4px; }
.activity-title { font-weight: 700; }
.activity-sub { font-size: 13px; opacity: 0.7; margin-top: 2px; }
.admin-label { display: block; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; opacity: .75; margin-bottom: 6px; }
.admin-input, .admin-select, .admin-textarea { width: 100%; padding: 12px; border-radius: 12px; border: 1px solid rgba(0,0,0,0.12); outline: none; background: #fff; }
.admin-input:focus, .admin-select:focus, .admin-textarea:focus { border-color: rgba(13,167,116,0.45); box-shadow: 0 0 0 3px rgba(13,167,116,0.08); }
.admin-input[readonly] { background: #f6f6f6; color: #667085; cursor: not-allowed; }
.admin-select:disabled { background: #f6f6f6; color: #667085; cursor: not-allowed; }
.admin-textarea { min-height: 120px; resize: vertical; }
.admin-error, .admin-error-text { color: #f67072; font-size: 13px; margin-top: 4px; }
.admin-help-text, .admin-help { font-size: 13px; margin-top: 6px; opacity: .7; }
.admin-readonly { background: #f8f8f8; }
.admin-alert { padding: 12px 14px; border-radius: 12px; margin-bottom: 14px; white-space: pre-line; }
.admin-alert-success { background: #e9fff7; border: 1px solid rgba(13,167,116,0.35); }
.admin-alert-error { background: #fff3f3; border: 1px solid rgba(246,112,114,0.35); }
.admin-alert[data-dismissible-alert] { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.admin-alert-close { flex: 0 0 auto; border: 0; background: transparent; color: inherit; cursor: pointer; font-size: 22px; line-height: 1; padding: 0 2px; }
.admin-table-wrap { overflow-x: auto; }
.admin-table { width: 100%; border-collapse: collapse; }
.admin-table th, .admin-table td { padding: 12px; border-bottom: 1px solid rgba(0,0,0,0.06); text-align: left; vertical-align: top; }
.admin-table th { font-size: 12px; letter-spacing: 1px; text-transform: uppercase; opacity: 0.65; }
.admin-table-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.admin-empty { padding: 28px; text-align: center; opacity: 0.65; }
.admin-checkbox { display: flex; align-items: center; gap: 8px; }
.admin-filter-form { margin-top: 14px; align-items: end; }
.admin-inline-form { display: inline; }
.admin-badge { display: inline-flex; align-items: center; border-radius: 999px; padding: 4px 8px; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; background: #f4f4f5; }
.admin-badge-success { background: #e9fff7; color: #0a7f58; }
.admin-badge-muted { background: #f4f4f5; color: #667085; }
.admin-player-list { margin: 0; padding-left: 16px; }
.admin-player-list li { margin-bottom: 4px; }
.admin-nested-card { box-shadow: none; border-style: dashed; }
.admin-player-row { display: grid; grid-template-columns: 1.1fr 1fr 1fr .65fr; gap: 10px; align-items: end; padding: 12px 0; border-top: 1px solid rgba(0,0,0,0.06); }
.admin-player-row:first-of-type { border-top: 0; }
.booking-builder { display: block; }
.booking-builder-main { width: 100%; display: grid; gap: 16px; }
.booking-step-card { background: #fff; border: 1px solid rgba(0,0,0,0.06); border-radius: 18px; padding: 18px; box-shadow: 0 10px 30px rgba(0,0,0,0.06); }
.booking-step-head, .booking-step-head p, .booking-step-title, .booking-summary-card, .booking-table-help { display: none; }
.booking-table-groups { display: grid; gap: 14px; }
.booking-table-groups-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: start; }
.booking-table-groups-columns .booking-table-group { display: grid; grid-template-rows: auto 1fr; gap: 10px; padding: 14px; border: 1px solid rgba(0,0,0,0.08); border-radius: 16px; background: #fbfbfb; }
.booking-table-area { margin-bottom: 0; padding-bottom: 10px; border-bottom: 1px solid rgba(0,0,0,0.08); font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.booking-table-groups-columns .booking-table-options { display: grid; grid-template-columns: 1fr; gap: 8px; }
.booking-table-option { border: 1px solid rgba(0,0,0,0.12); background: #fff; border-radius: 14px; padding: 12px 14px; min-width: 0; width: 100%; cursor: pointer; text-align: left; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.booking-table-option strong { display: block; font-size: 16px; }
.booking-table-option span { display: none; }
.booking-table-option:hover { border-color: rgba(13,167,116,0.55); box-shadow: 0 8px 20px rgba(0,0,0,0.08); transform: translateY(-1px); }
.booking-table-option.is-selected { border-color: #0da774; background: #0da774; color: #fff; box-shadow: 0 10px 24px rgba(13,167,116,0.24); transform: translateY(-1px); }
.booking-table-option.is-booked, .booking-table-option:disabled { opacity: .34; cursor: not-allowed; background: #f3f4f6; color: #667085; border-color: rgba(0,0,0,0.08); box-shadow: none; transform: none; }
.booking-table-option.is-booked::after { content: 'Booked'; display: block; margin-top: 3px; font-size: 10px; font-weight: 700; color: #667085; text-transform: uppercase; letter-spacing: .04em; }
.booking-primary-player-card { display: grid; grid-template-columns: minmax(220px, 1.4fr) minmax(150px, .9fr) 86px minmax(145px, .85fr) minmax(125px, .7fr) 92px; gap: 10px; align-items: end; }
.booking-extra-player-row { display: grid; grid-template-columns: minmax(220px, 1.4fr) minmax(150px, .9fr) 86px minmax(145px, .85fr) minmax(125px, .7fr) 92px; gap: 10px; align-items: end; }
.booking-member-field { max-width: 86px; }
.booking-name-search-wrap { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 8px; align-items: center; min-width: 0; width: 100%; }
.booking-name-search-wrap.has-selected-player { grid-template-columns: minmax(0, 1fr); }
.booking-name-search-wrap .admin-input { min-width: 0; width: 100%; }
.booking-player-search-button,
.booking-player-edit-button,
.booking-player-clear-button { width: 42px; height: 42px; border-radius: 12px; background: #fff; cursor: pointer; font-size: 23px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; }
.booking-player-edit-button { border: 1px solid rgba(13,167,116,.35); color: #0da774; }
.booking-player-edit-button:hover { background: #f0fbf7; border-color: #0da774; }
.booking-player-search-button { border: 1px solid rgba(0,0,0,0.12); color: #111; }
.booking-player-search-button:hover { border-color: rgba(13,167,116,0.45); color: #0da774; }
.booking-player-search-button:disabled { opacity: .45; cursor: not-allowed; }
.booking-player-clear-button { border: 1px solid rgba(246,112,114,.55); color: #f67072; }
.booking-player-clear-button:hover { background: #fff3f3; border-color: #f67072; }
.booking-player-row-actions { display: flex; gap: 8px; align-items: center; align-self: end; }
.booking-player-clear-button[hidden], .booking-player-search-button[hidden], .booking-player-edit-button[hidden] { display: none; }
.booking-remove-player-button { width: 42px; height: 42px; border: 1px solid rgba(246,112,114,.55); border-radius: 12px; background: #fff; color: #f67072; cursor: pointer; font-size: 24px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; align-self: end; }
.booking-remove-player-button:hover { background: #fff3f3; border-color: #f67072; }
.booking-player-search-modal[hidden], .booking-player-edit-modal[hidden], .booking-cancel-modal[hidden] { display: none; }
.booking-player-search-modal, .booking-player-edit-modal, .booking-cancel-modal { position: fixed; inset: 0; z-index: 1100; display: flex; align-items: center; justify-content: center; padding: 18px; }
.booking-player-search-backdrop { position: absolute; inset: 0; background: rgba(17,24,39,.58); }
.booking-player-search-dialog { position: relative; width: min(680px, 100%); max-height: calc(100vh - 36px); overflow: hidden; background: #fff; border-radius: 20px; box-shadow: 0 24px 80px rgba(0,0,0,.24); padding: 20px; display: flex; flex-direction: column; gap: 14px; }
.booking-player-search-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.booking-player-search-head h2 { margin: 0; font-size: 22px; }
.booking-player-search-head p { margin: 5px 0 0; color: #667085; font-size: 13px; }
.booking-player-search-results { display: grid; gap: 8px; overflow-y: auto; max-height: 420px; padding-right: 2px; }
.booking-player-search-result { display: grid; grid-template-columns: minmax(0, 1fr) 42px; gap: 12px; align-items: center; padding: 12px; border: 1px solid rgba(0,0,0,0.08); border-radius: 14px; background: #fff; }
.booking-player-search-result strong { display: block; margin-bottom: 4px; }
.booking-player-search-result span { display: block; color: #667085; font-size: 13px; line-height: 1.35; }
.booking-player-add-button { width: 42px; height: 42px; border: 0; border-radius: 12px; background: #0da774; color: #fff; font-size: 24px; font-weight: 700; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.booking-player-search-empty { padding: 24px; text-align: center; color: #667085; border: 1px dashed rgba(0,0,0,0.12); border-radius: 14px; }
.booking-extra-players { display: block; margin-top: 14px; border-top: 1px solid rgba(0,0,0,0.08); }
.booking-extra-player-row[hidden] { display: none; }
.booking-extra-head { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.booking-extra-head h3 { margin: 0; font-size: 15px; }
.booking-add-player-wrap { margin-top: 14px; }
.booking-add-player-wrap[hidden] { display: none; }
.booking-form-actions { margin-top: 18px; justify-content: center; }
.booking-confirm-modal[hidden] { display: none; }
.booking-confirm-modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 18px; }
.booking-confirm-backdrop { position: absolute; inset: 0; background: rgba(17,24,39,.58); }
.booking-confirm-dialog { position: relative; width: min(560px, 100%); max-height: calc(100vh - 36px); overflow: auto; background: #fff; border-radius: 20px; box-shadow: 0 24px 80px rgba(0,0,0,.24); padding: 20px; }
.booking-confirm-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.booking-confirm-head h2 { margin: 0; font-size: 22px; }
.booking-confirm-close { width: 34px; height: 34px; border: 0; border-radius: 50%; background: #f3f4f6; cursor: pointer; font-size: 24px; line-height: 1; }
.booking-confirm-body dl { display: grid; gap: 0; margin: 0; border: 1px solid rgba(0,0,0,0.08); border-radius: 14px; overflow: hidden; }
.booking-confirm-body dl div { display: grid; grid-template-columns: 140px 1fr; gap: 14px; padding: 12px 14px; border-bottom: 1px solid rgba(0,0,0,0.06); }
.booking-confirm-body dl div[hidden] { display: none !important; }
.booking-confirm-body dl div:last-child { border-bottom: 0; }
.booking-confirm-body dt { color: #667085; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.booking-confirm-body dd { margin: 0; font-weight: 700; }
.booking-membership-mark, .booking-member-name { color: #D4AF37; }
.booking-cancel-message { margin: 0; color: #667085; }
.booking-confirm-actions { margin-top: 18px; justify-content: flex-end; }
.booking-modal-open { overflow: hidden; }
.booking-integer-input::-webkit-outer-spin-button,
.booking-integer-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.booking-integer-input { -moz-appearance: textfield; appearance: textfield; }
.bookings-page-head .admin-btn-strong { min-width: 150px; }
.bookings-filter-card, .bookings-list-card { border: 1px solid rgba(0,0,0,0.06); }
.bookings-filter-head, .bookings-list-head { display: flex; justify-content: space-between; gap: 14px; margin-bottom: 14px; }
.bookings-filter-head h2, .bookings-list-head h2 { margin: 0; font-size: 18px; }
.bookings-filter-head p, .bookings-list-head p { margin: 4px 0 0; color: #667085; font-size: 13px; }
.bookings-filter-grid { grid-template-columns: repeat(5, minmax(150px, 1fr)) auto; align-items: end; }
.bookings-filter-actions { display: flex; gap: 8px; align-items: center; }
.bookings-table th { white-space: nowrap; }
.bookings-table td { vertical-align: middle; }
.booking-date-cell, .booking-primary-name { font-weight: 800; }
.booking-time-cell, .booking-phone, .booking-players-cell { color: #667085; font-size: 13px; margin-top: 4px; }
.booking-table-chip { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; padding: 8px 10px; border-radius: 12px; font-weight: 800; letter-spacing: 2px; }
.booking-payment-badge { font-weight: 800; }
.bookings-row-actions { display: flex; gap: 8px; flex-wrap: nowrap; align-items: center; }
.bookings-new-icon { display: none; }
.bookings-filter-toggle { display: none; }
.booking-cancel-link { display: inline-flex; justify-content: center; padding: 12px 16px; border: 1px solid rgba(0,0,0,0.14); border-radius: 12px; background: #fff; color: #111; font-size: 13px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; cursor: pointer; }
.booking-cancel-link:hover { border-color: rgba(13,167,116,0.45); color: #0a7f58; }
.booking-form-actions-stacked { display: flex; justify-content: center; gap: 10px; margin-top: 18px; }
.booking-form-actions-stacked .admin-btn-solid { min-width: 220px; }
.ui-timepicker {text-align: left !important;}
.ui-timepicker-standard {font-family: inherit !important;}

.bookings-stats-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 14px; }
.bookings-stat-card { display: flex; flex-direction: column; gap: 8px; padding: 16px; background: #fff; border: 1px solid rgba(0,0,0,0.06); border-radius: 16px; box-shadow: 0 10px 30px rgba(0,0,0,0.06); }
.bookings-stat-card span { color: #667085; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.bookings-stat-card strong { font-size: 28px; line-height: 1; }
.bookings-status-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.bookings-status-tab { padding: 10px 14px; border: 1px solid rgba(0,0,0,0.1); border-radius: 999px; background: #fff; color: #667085; font-size: 12px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.bookings-status-tab.is-active, .bookings-status-tab:hover { border-color: #0da774; color: #0a7f58; background: #f0fbf7; }
.bookings-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; align-items: start; }
.booking-card { overflow: hidden; border: 1px solid rgba(0,0,0,0.08); border-radius: 16px; background: #fff; box-shadow: 0 8px 24px rgba(0,0,0,0.05); }
.booking-card.is-open { grid-column: span 1; }
.booking-card-summary { padding: 16px; }
.booking-card-topline { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.booking-card-number { color: #667085; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.booking-status-badge { display: inline-flex; align-items: center; padding: 5px 8px; border-radius: 999px; font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.booking-status-upcoming { background: #f3f4f6; color: #475467; }
.booking-status-ongoing { background: #e9fff7; color: #0a7f58; }
.booking-status-finished { background: #fff3f3; color: #c9474b; }
.booking-card-table-row { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: center; margin-top: 16px; }
.booking-card-table-code { min-width: 58px; padding: 11px 12px; border-radius: 14px; background: #f4f4f5; text-align: center; font-size: 24px; font-weight: 800; letter-spacing: .08em; }
.booking-card-primary { overflow: hidden; font-size: 18px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.booking-card-style { margin-top: 4px; color: #667085; font-size: 13px; }
.booking-card-meta { display: grid; gap: 6px; margin-top: 16px; color: #475467; font-size: 13px; }
.booking-card-meta span { display: block; }
.booking-card-toggle { width: 100%; margin-top: 16px; padding: 10px 12px; border: 1px solid rgba(13,167,116,.32); border-radius: 12px; background: #fff; color: #0a7f58; cursor: pointer; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.booking-card-toggle:hover { background: #f0fbf7; }
.booking-card-details[hidden] { display: none; }
.booking-card-details { padding: 16px; border-top: 1px solid rgba(0,0,0,0.06); background: #fbfbfb; }
.booking-card-detail-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin: 0; border: 1px solid rgba(0,0,0,0.06); border-radius: 12px; overflow: hidden; background: #fff; }
.booking-card-detail-list div { padding: 10px 12px; border-bottom: 1px solid rgba(0,0,0,0.06); }
.booking-card-detail-list div:nth-last-child(-n+2) { border-bottom: 0; }
.booking-card-detail-list dt { color: #667085; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.booking-card-detail-list dd { margin: 4px 0 0; font-weight: 800; }
.booking-card-collection { margin-top: 14px; }
.booking-card-collection h3 { margin: 0 0 8px; font-size: 14px; }
.booking-card-player-row { display: flex; justify-content: space-between; gap: 14px; padding: 10px 0; border-top: 1px solid rgba(0,0,0,0.06); }
.booking-card-player-row:first-of-type { border-top: 0; }
.booking-card-player-row > div:last-child { text-align: right; }
.booking-card-player-row strong, .booking-card-player-row span { display: block; }
.booking-card-player-row span { margin-top: 3px; color: #667085; font-size: 12px; }
.booking-card-notes { margin-top: 14px; padding: 12px; border-radius: 12px; background: #fff; border: 1px solid rgba(0,0,0,0.06); }
.booking-card-notes p { margin: 6px 0 0; color: #475467; font-size: 13px; line-height: 1.5; }
.booking-card-actions { display: flex; gap: 8px; margin-top: 14px; }
.bookings-empty-card { grid-column: 1 / -1; border: 1px dashed rgba(0,0,0,0.12); border-radius: 14px; background: #fff; }

@media (max-width: 1180px) {
  .admin-shell { grid-template-columns: 240px 1fr; }
  .admin-sidebar { padding: 18px 14px; }
  .admin-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-grid { grid-template-columns: 1fr; }
  .admin-form-grid-3, .booking-primary-player-card, .booking-extra-player-row, .booking-table-groups-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .booking-member-field { max-width: none; }
  .booking-remove-player-button { justify-self: start; }
  .bookings-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bookings-filter-actions { grid-column: 1 / -1; }
  .bookings-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 920px) {
  .admin-shell { display: block; min-height: 100vh; }
  .admin-main { width: 100%; }
  .admin-sidebar { position: fixed; inset: 0 auto 0 0; width: min(84vw, 320px); height: 100vh; min-height: 100vh; overflow-y: auto; z-index: 1001; transform: translateX(-105%); transition: transform .22s ease; box-shadow: 20px 0 50px rgba(0,0,0,.22); }
  .admin-sidebar.open { transform: translateX(0); }
  body.admin-sidebar-open .admin-sidebar-backdrop { display: block; position: fixed; inset: 0; z-index: 1000; background: rgba(0,0,0,.48); }
  .admin-topbar { position: sticky; top: 0; z-index: 900; padding: 12px 14px; }
  .admin-burger { display: inline-flex; align-items: center; justify-content: center; min-width: 42px; height: 42px; border-radius: 12px; border: 1px solid rgba(0,0,0,.08); background: #fff; }
  .admin-content { padding: 16px 14px 80px; }
  .admin-page-head, .admin-card-head, .bookings-filter-head, .bookings-list-head, .booking-extra-head { flex-direction: column; align-items: stretch; }
  .admin-page-head { gap: 12px; }
  .admin-h1 { font-size: 23px; line-height: 1.15; }
  .admin-actions { width: 100%; }
  .admin-actions .admin-btn, .admin-page-head .admin-btn { flex: 1 1 auto; }
  .admin-form-grid-2, .admin-form-grid-3, .admin-player-row, .booking-primary-player-card, .booking-extra-player-row, .booking-table-groups-columns { grid-template-columns: 1fr; }
  .booking-step-card, .admin-card, .stat-card { border-radius: 14px; padding: 14px; }
  .booking-table-groups-columns .booking-table-group { padding: 12px; }
  .booking-form-actions, .booking-confirm-actions { flex-direction: column-reverse; align-items: stretch; }
  .admin-table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .admin-table { min-width: 760px; }
  .bookings-table { min-width: 860px; }
  .bookings-row-actions { flex-wrap: wrap; }
  .admin-btn:hover { transform: none; }
}

@media (max-width: 640px) {
  .admin-auth-wrap { padding: 14px; }
  .admin-auth-card { padding: 20px; }
  .admin-content { padding: 14px 12px 72px; }
  .admin-topbar { padding: 10px 12px; }
  .admin-pill { max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .admin-h1 { font-size: 21px; }
  .admin-h2 { font-size: 15px; }
  .admin-muted, .admin-row-sub, .activity-sub, .bookings-filter-head p, .bookings-list-head p { font-size: 12px; }
  .admin-card{margin-top: 10px;}
  .admin-stats { grid-template-columns: 1fr; gap: 10px; }
  .stat-value { font-size: 24px; }
  .admin-card, .stat-card, .booking-step-card { padding: 12px; border-radius: 12px; }
  .admin-actions, .bookings-filter-actions, .bookings-row-actions { flex-direction: column; align-items: stretch; }
  .admin-btn { width: 100%; min-height: 44px; padding: 12px 14px; }
  .admin-input, .admin-select, .admin-textarea { min-height: 44px; padding: 11px 12px; }
  .booking-table-option { min-height: 44px; }
  .booking-extra-players { display: grid; gap: 12px; margin-top: 0px; border-top: 0; }
  .booking-extra-player-row { margin-top: 0; padding: 12px; border: 1px solid rgba(0,0,0,0.06); border-radius: 12px; background: #fff; box-shadow: 0 10px 30px rgba(0,0,0,0.06); }
  .booking-player-search-modal, .booking-player-edit-modal, .booking-cancel-modal { align-items: flex-end; padding: 10px; }
  .booking-player-search-dialog { width: 100%; max-height: calc(100vh - 20px); border-radius: 18px; padding: 16px; }
  .booking-player-search-result { grid-template-columns: minmax(0, 1fr) 44px; }
  .booking-confirm-modal { align-items: flex-end; padding: 10px; }
  .booking-confirm-dialog { width: 100%; max-height: calc(100vh - 20px); border-radius: 18px; padding: 16px; }
  .booking-confirm-head h2 { font-size: 19px; }
  .booking-confirm-body dl div { grid-template-columns: 1fr; gap: 4px; padding: 11px 12px; }
  .bookings-page-head { flex-direction: row; align-items: center; }
  .bookings-page-actions { width: auto; flex-direction: row; align-items: center; }
  .bookings-new-text { display: none; }
  .bookings-new-icon { width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; }
  .bookings-new-icon img { width: 20px; height: 20px; object-fit: contain; }
  .bookings-filter-mobile-collapsible { padding: 0; overflow: hidden; }
  .bookings-filter-toggle { width: 100%; padding: 16px; border: 0; background: #fff; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #111; font-weight: 800; font-size: 18px; text-align: left; }
  .bookings-filter-toggle-icon { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; background: #f4f4f5; font-size: 20px; line-height: 1; }
  .bookings-filter-toggle[aria-expanded="true"] .bookings-filter-toggle-icon { transform: rotate(45deg); }
  .bookings-filter-mobile-collapsible .bookings-filter-grid { display: none; padding: 0 16px 16px; grid-template-columns: 1fr; }
  .bookings-filter-mobile-collapsible .bookings-filter-grid.is-open { display: grid; }
  .booking-form-actions-stacked { flex-direction: column; align-items: stretch; }
  .booking-form-actions-stacked .admin-btn-solid { width: 100%; justify-content: center; }
  .booking-cancel-link { width: 100%; justify-content: center; padding: 4px 6px; border: 0; color: #667085; background: transparent; font-size: 13px; text-decoration: underline; text-underline-offset: 4px; }
  .booking-cancel-link:hover { color: #f67072; }
  .bookings-stats-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .bookings-stat-card { padding: 12px 8px; text-align: center; }
  .bookings-stat-card span { font-size: 9px; }
  .bookings-stat-card strong { font-size: 22px; }
  .bookings-status-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bookings-status-tab { text-align: center; }
  .bookings-card-grid { grid-template-columns: 1fr; }
  .booking-card-detail-list { grid-template-columns: 1fr; }
  .booking-card-detail-list div, .booking-card-detail-list div:nth-last-child(-n+2) { border-bottom: 1px solid rgba(0,0,0,0.06); }
  .booking-card-detail-list div:last-child { border-bottom: 0; }
  .booking-card-actions { flex-direction: column; }
}

@media (max-width: 420px) {
  .admin-sidebar { width: 88vw; }
  .admin-logo { font-size: 19px; }
  .admin-sub, .admin-link, .admin-pill, .admin-btn { letter-spacing: .06em; }
}