/* ── Audience Booking ────────────────────────────────────────────── */
:root {
	--aud-pink:   #ff006e;
	--aud-green:  #00ff88;
	--aud-bg:     #0d0d1a;
	--aud-card:   #12122a;
	--aud-border: #1e1e3f;
	--aud-text:   #f0f0f0;
	--aud-muted:  #777;
}

.gsm-aud {
	background:    var(--aud-bg);
	color:         var(--aud-text);
	border-radius: 12px;
	overflow:      hidden;
	font-family:   'Arial', sans-serif;
}

/* ── Header ──────────────────────────────────────────────────────── */
.gsm-aud__header {
	background: linear-gradient(135deg, #1a0a2e, #0a0a1a);
	padding:    32px 28px 24px;
	border-bottom: 2px solid var(--aud-pink);
}
.gsm-aud__title {
	font-size:      28px;
	font-weight:    800;
	letter-spacing: 3px;
	margin:         0 0 10px;
	background:     linear-gradient(135deg, #fff 40%, var(--aud-pink));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}
.gsm-aud__meta { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 10px; }
.gsm-aud__meta-item { display: flex; align-items: center; gap: 6px; color: var(--aud-muted); font-size: 13px; }
.gsm-aud__subtitle { color: var(--aud-muted); font-size: 14px; margin: 0; }

/* ── Venue layout (image left, booking right) ────────────────────── */
.gsm-aud--venue { padding: 0; }

.gsm-aud-venue {
	display:    grid;
	grid-template-columns: 1fr 1fr;
	align-items: stretch;
}

.gsm-aud-venue__media {
	position:        relative;
	background:      #06060f;
	overflow:        hidden;
	display:         flex;
	align-items:     center;
	justify-content: center;
}
.gsm-aud-venue__media img {
	width:      100%;
	height:     100%;
	max-height: 100%;
	object-fit: contain;   /* show the whole image, no zoom/crop */
	display:    block;
}
.gsm-aud-venue__noimg {
	width:       100%;
	height:      100%;
	min-height:  360px;
	display:     flex;
	align-items: center;
	justify-content: center;
	background:  linear-gradient(135deg, #12122a, #06060f);
}

.gsm-aud-venue__info {
	padding:        44px 40px;
	display:        flex;
	flex-direction: column;
	justify-content: center;
	background:     linear-gradient(135deg, #1a0a2e 0%, #0d0d1a 100%);
}
.gsm-aud-venue__tag {
	display:        inline-block;
	align-self:     flex-start;
	font-size:      11px;
	font-weight:    800;
	letter-spacing: 3px;
	color:          var(--aud-pink);
	border:         1px solid var(--aud-pink);
	border-radius:  20px;
	padding:        4px 14px;
	margin-bottom:  18px;
}
.gsm-aud-venue__name {
	font-size:      34px;
	font-weight:    900;
	line-height:    1.15;
	margin:         0 0 16px;
	color:          #fff;
}
.gsm-aud-venue__meta { display: flex; flex-wrap: wrap; gap: 18px; margin-bottom: 18px; }
.gsm-aud-venue__meta-item { display: flex; align-items: center; gap: 7px; color: var(--aud-muted); font-size: 14px; }
.gsm-aud-venue__desc { color: #b0b0c0; font-size: 14px; line-height: 1.7; margin: 0 0 24px; width: 100%; max-width: 100%; }
.gsm-aud-venue__desc p { margin: 0 0 10px; color: #b0b0c0; font-size: 14px; line-height: 1.7; }
.gsm-aud-venue__desc p:last-child { margin-bottom: 0; }
.gsm-aud-venue__desc strong, .gsm-aud-venue__desc b { color: #fff; font-weight: 700; }
.gsm-aud-venue__desc ul, .gsm-aud-venue__desc ol { margin: 0 0 10px; padding-left: 20px; }
.gsm-aud-venue__desc li { margin-bottom: 4px; }
.gsm-aud-venue__desc a { color: var(--aud-pink); text-decoration: underline; }

.gsm-aud-venue__cta {
	margin-top:  auto;
	padding-top: 24px;
	border-top:  1px solid var(--aud-border);
}
.gsm-aud-venue__cta-label { display: block; font-size: 12px; text-transform: uppercase; letter-spacing: 2px; color: var(--aud-muted); margin-bottom: 14px; }
.gsm-aud-venue__cats { display: flex; flex-direction: column; gap: 10px; }

.gsm-aud-cat-opt {
	display:         flex;
	align-items:     center;
	justify-content: space-between;
	gap:             14px;
	background:      rgba(255,255,255,.04);
	border:          1px solid var(--aud-border);
	border-radius:   10px;
	padding:         12px 16px;
	transition:      border-color .2s, background .2s;
}
.gsm-aud-cat-opt:hover { border-color: var(--aud-pink); background: rgba(255,0,110,.06); }
.gsm-aud-cat-opt__info { display: flex; flex-direction: column; gap: 2px; }
.gsm-aud-cat-opt__name  { font-size: 15px; font-weight: 700; color: #fff; }
.gsm-aud-cat-opt__price { font-size: 20px; font-weight: 900; color: var(--aud-green); line-height: 1.1; }

.gsm-aud-cat-opt__actions { display: flex; align-items: center; gap: 12px; }

.gsm-aud-qty {
	display:       inline-flex !important;
	align-items:   center !important;
	flex:          0 0 auto !important;
	width:         auto !important;
	background:    rgba(0,0,0,.3);
	border:        1px solid var(--aud-border);
	border-radius: 8px;
	overflow:      hidden;
}
.gsm-aud-qty__btn {
	width:       34px !important;
	min-width:   34px !important;
	max-width:   34px !important;
	height:      38px !important;
	flex:        0 0 auto !important;
	background:  transparent;
	border:      none !important;
	color:       #fff;
	font-size:   18px;
	font-weight: 700;
	cursor:      pointer;
	line-height: 1;
	padding:     0 !important;
	transition:  background .15s;
}
.gsm-aud-qty__btn:hover { background: rgba(255,0,110,.25); }
.gsm-aud-qty__val {
	width:        42px !important;
	min-width:    42px !important;
	max-width:    42px !important;
	height:       38px !important;
	flex:         0 0 auto !important;
	background:   transparent !important;
	border:       none !important;
	border-left:  1px solid var(--aud-border) !important;
	border-right: 1px solid var(--aud-border) !important;
	border-radius: 0 !important;
	box-shadow:   none !important;
	color:        #fff !important;
	font-size:    15px;
	font-weight:  700;
	text-align:   center !important;
	outline:      none;
	padding:      0 !important;
	margin:       0 !important;
	-moz-appearance: textfield;
}
.gsm-aud-qty__val:focus { box-shadow: none !important; outline: none !important; }

.gsm-aud-cat-opt__btn {
	display:         inline-flex;
	align-items:     center;
	gap:             8px;
	background:      linear-gradient(135deg, var(--aud-pink), #c0005c);
	color:           #fff;
	border:          none;
	border-radius:   8px;
	font-size:       14px;
	font-weight:     800;
	padding:         11px 22px;
	cursor:          pointer;
	white-space:     nowrap;
	transition:      transform .15s, box-shadow .15s;
}
.gsm-aud-cat-opt__btn:hover { transform: translateY(-1px); box-shadow: 0 8px 22px rgba(255,0,110,.4); }

@media (max-width: 520px) {
	.gsm-aud-cat-opt { flex-wrap: wrap; }
	.gsm-aud-cat-opt__actions { width: 100%; justify-content: space-between; }
}
.gsm-aud-venue__unavailable { color: var(--aud-muted); font-size: 14px; margin: 0; }

@media (max-width: 720px) {
	.gsm-aud-venue { grid-template-columns: 1fr; }
	/* Show the full image on mobile (no cropping from the bottom) */
	.gsm-aud-venue__media { min-height: 0; }
	.gsm-aud-venue__media img { height: auto; max-height: none; object-fit: contain; }
	.gsm-aud-venue__noimg { min-height: 200px; }
	.gsm-aud-venue__info { padding: 28px 22px; }
	.gsm-aud-venue__name { font-size: 26px; }
}

/* ── Vendor table list (legacy, unused in venue mode) ────────────── */
.gsm-aud__list { padding: 22px 28px; display: flex; flex-direction: column; gap: 12px; }

.gsm-aud__empty { text-align: center; padding: 50px 20px; }
.gsm-aud__empty svg { display: block; margin: 0 auto 14px; opacity: .6; }
.gsm-aud__empty p { color: var(--aud-text); font-size: 16px; font-weight: 700; margin: 0 0 6px; }
.gsm-aud__empty span { color: var(--aud-muted); font-size: 13px; }

.gsm-aud-card {
	display:       flex;
	align-items:   center;
	gap:           18px;
	background:    var(--aud-card);
	border:        1px solid var(--aud-border);
	border-left:   4px solid var(--cat-color, var(--aud-pink));
	border-radius: 10px;
	padding:       16px 20px;
	transition:    border-color .2s, transform .15s;
}
.gsm-aud-card:hover { transform: translateY(-1px); border-color: var(--cat-color, var(--aud-pink)); }

.gsm-aud-card__left {
	display:        flex;
	flex-direction: column;
	align-items:    center;
	gap:            4px;
	min-width:      64px;
}
.gsm-aud-card__tablenum {
	font-size:   30px;
	font-weight: 900;
	color:       #fff;
	line-height: 1;
}
.gsm-aud-card__hash { font-size: 16px; color: var(--cat-color, var(--aud-pink)); vertical-align: top; }
.gsm-aud-card__cat {
	font-size:      10px;
	font-weight:    700;
	letter-spacing: 1px;
	text-transform: uppercase;
	color:          var(--cat-color, var(--aud-pink));
	padding:        2px 8px;
	border:         1px solid var(--cat-color, var(--aud-pink));
	border-radius:  10px;
}

.gsm-aud-card__mid { flex: 1; min-width: 0; }
.gsm-aud-card__vendor {
	display:     flex;
	align-items: center;
	gap:         6px;
	font-size:   15px;
	font-weight: 700;
	color:       var(--aud-text);
	margin-bottom: 4px;
}
.gsm-aud-card__vendor svg { color: var(--aud-muted); flex-shrink: 0; }
.gsm-aud-card__sold { font-size: 12px; color: var(--aud-muted); }

.gsm-aud-card__right {
	display:        flex;
	flex-direction: column;
	align-items:    flex-end;
	gap:            8px;
	flex-shrink:    0;
}
.gsm-aud-card__price { font-size: 22px; font-weight: 900; color: var(--aud-green); line-height: 1; }
.gsm-aud-card__btn {
	background:    linear-gradient(135deg, var(--aud-pink), #c0005c);
	color:         #fff;
	border:        none;
	border-radius: 8px;
	font-size:     13px;
	font-weight:   700;
	padding:       9px 18px;
	cursor:        pointer;
	transition:    transform .15s, box-shadow .15s;
	white-space:   nowrap;
}
.gsm-aud-card__btn:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(255,0,110,.4); }
.gsm-aud-card__btn--disabled { background: #2a2a3a; color: #666; cursor: not-allowed; }
.gsm-aud-card__btn--disabled:hover { transform: none; box-shadow: none; }

/* ── Floor Plan ──────────────────────────────────────────────────── */
.gsm-aud__floorplan { padding: 20px 28px 0; }
.gsm-aud__floorplan-img { max-width: 100%; border-radius: 8px; border: 1px solid var(--aud-border); }

/* ── Tables ──────────────────────────────────────────────────────── */
.gsm-aud__tables { padding: 24px 28px; }
.gsm-aud__notice { color: var(--aud-muted); }

.gsm-aud__category { margin-bottom: 28px; }
.gsm-aud__cat-header {
	display:     flex;
	align-items: center;
	gap:         10px;
	margin-bottom: 14px;
}
.gsm-aud__cat-dot {
	width:        12px;
	height:       12px;
	border-radius: 50%;
	background:   var(--cat-color, var(--aud-pink));
	box-shadow:   0 0 10px var(--cat-color, var(--aud-pink));
	flex-shrink:  0;
}
.gsm-aud__cat-name {
	font-size:      13px;
	font-weight:    700;
	letter-spacing: 2px;
	margin:         0;
}
.gsm-aud__cat-price {
	margin-left: auto;
	color:       var(--cat-color, var(--aud-pink));
	font-size:   13px;
	font-weight: 600;
}

.gsm-aud__grid {
	display:               grid;
	grid-template-columns: repeat(auto-fill, minmax(52px, 1fr));
	gap:                   8px;
}

.gsm-aud__table {
	position:      relative;
	display:       flex;
	align-items:   center;
	justify-content: center;
	width:         52px;
	height:        52px;
	border-radius: 8px;
	border:        2px solid var(--cat-color, var(--aud-pink));
	background:    rgba(0,0,0,.3);
	color:         var(--aud-text);
	font-size:     14px;
	font-weight:   700;
	cursor:        pointer;
	transition:    all .2s ease;
	user-select:   none;
}
.gsm-aud__table:hover {
	background:  var(--cat-color, var(--aud-pink));
	color:       #000;
	transform:   scale(1.15);
	box-shadow:  0 0 20px var(--cat-color, var(--aud-pink));
	z-index:     1;
}
.gsm-aud__table--selected {
	background:  var(--cat-color, var(--aud-pink)) !important;
	color:       #000 !important;
	transform:   scale(1.1);
	box-shadow:  0 0 20px var(--cat-color, var(--aud-pink)), 0 0 40px rgba(0,255,136,.4);
	border-color: var(--aud-green) !important;
}
.gsm-aud__table--selected::after {
	content:    '✓';
	position:   absolute;
	top: -5px; right: -5px;
	background: var(--aud-green);
	color:      #000;
	width:      16px; height: 16px;
	border-radius: 50%;
	font-size:  10px;
	display:    flex;
	align-items: center;
	justify-content: center;
}
.gsm-aud__table--booked {
	background:     rgba(255,255,255,.07) !important;
	border-color:   rgba(255,255,255,.15) !important;
	color:          rgba(255,255,255,.3) !important;
	cursor:         not-allowed;
	pointer-events: none;
}
.gsm-aud__table-num { position: relative; z-index: 1; }
.gsm-aud__table-x {
	position:        absolute;
	inset:           0;
	display:         flex;
	align-items:     center;
	justify-content: center;
	font-size:       16px;
	color:           rgba(255,80,80,.6);
	font-weight:     700;
}
.gsm-aud__table--booked .gsm-aud__table-num { opacity: .35; }

/* ── Legend ──────────────────────────────────────────────────────── */
.gsm-aud__legend {
	display:     flex;
	flex-wrap:   wrap;
	align-items: center;
	gap:         14px;
	padding:     16px 28px;
	background:  var(--aud-card);
	border-top:  1px solid var(--aud-border);
}
.gsm-aud__legend-label { font-size: 11px; font-weight: 700; letter-spacing: 2px; color: var(--aud-muted); text-transform: uppercase; }
.gsm-aud__legend-item  { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; }
.gsm-aud__legend-dot   { width: 10px; height: 10px; border-radius: 50%; background: var(--cat-color, var(--aud-pink)); box-shadow: 0 0 6px var(--cat-color, var(--aud-pink)); }
.gsm-aud__legend-dot--selected { background: var(--aud-green); box-shadow: 0 0 6px var(--aud-green); --cat-color: var(--aud-green); }
.gsm-aud__legend-dot--booked   { background: rgba(255,80,80,.5); box-shadow: none; --cat-color: rgba(255,80,80,.5); }

/* ── Modal ───────────────────────────────────────────────────────── */
body.gsm-aud-no-scroll { overflow: hidden; }

.gsm-aud-modal { position: fixed; inset: 0; z-index: 99999; display: flex; align-items: center; justify-content: center; padding: 16px; }
.gsm-aud-modal[hidden] { display: none; }

.gsm-aud-modal__backdrop {
	position: absolute;
	inset:    0;
	background: rgba(0,0,0,.8);
	backdrop-filter: blur(4px);
}

.gsm-aud-modal__box {
	position:      relative;
	background:    linear-gradient(180deg, #1a0a2e 0%, #0d0d1a 100%);
	border:        1px solid var(--aud-pink);
	border-radius: 16px;
	width:         100%;
	max-width:     460px;
	max-height:    90vh;
	overflow-y:    auto;
	padding:       0 0 24px;
}

.gsm-aud-modal__header {
	display:     flex;
	align-items: center;
	padding:     20px 24px 16px;
	border-bottom: 1px solid var(--aud-border);
}
.gsm-aud-modal__title {
	font-size:      18px;
	font-weight:    800;
	letter-spacing: 2px;
	color:          var(--aud-pink);
	margin:         0;
}
.gsm-aud-modal__close {
	margin-left:  auto;
	background:   none;
	border:       none;
	color:        var(--aud-muted);
	font-size:    22px;
	cursor:       pointer;
	line-height:  1;
	padding:      0 4px;
	transition:   color .2s;
}
.gsm-aud-modal__close:hover { color: var(--aud-pink); }

.gsm-aud-modal__ticket-info {
	display:         flex;
	justify-content: space-between;
	align-items:     center;
	padding:         12px 24px;
	background:      rgba(255,0,110,.08);
	border-bottom:   1px solid var(--aud-border);
}
.gsm-aud-modal__table-num { font-size: 16px; color: var(--aud-text); }
.gsm-aud-modal__price      { font-size: 20px; font-weight: 800; color: var(--aud-green); }

/* ── Step indicator ──────────────────────────────────────────────── */
.gsm-aud-steps {
	display:         flex;
	align-items:     center;
	justify-content: center;
	gap:             0;
	padding:         16px 24px;
}
.gsm-aud-step-dot {
	display:        flex;
	flex-direction: column;
	align-items:    center;
	gap:            4px;
}
.gsm-aud-step-dot span {
	width:         30px;
	height:        30px;
	border-radius: 50%;
	background:    rgba(255,255,255,.1);
	border:        2px solid var(--aud-border);
	display:       flex;
	align-items:   center;
	justify-content: center;
	font-size:     13px;
	font-weight:   700;
	color:         var(--aud-muted);
	transition:    all .3s;
}
.gsm-aud-step-dot label { font-size: 11px; color: var(--aud-muted); white-space: nowrap; }
.gsm-aud-step-dot--active span {
	background:  var(--aud-pink);
	border-color: var(--aud-pink);
	color:       #fff;
	box-shadow:  0 0 16px rgba(255,0,110,.5);
}
.gsm-aud-step-dot--active label { color: var(--aud-text); }
.gsm-aud-step-line { flex: 1; height: 2px; background: var(--aud-border); margin: 0 10px 18px; max-width: 60px; }

/* ── Form ────────────────────────────────────────────────────────── */
.gsm-aud-form-step { padding: 0 24px; }

.gsm-aud-form-group { margin-bottom: 16px; }
.gsm-aud-form-group label {
	display:       block;
	font-size:     12px;
	font-weight:   700;
	letter-spacing: 1px;
	text-transform: uppercase;
	color:         var(--aud-muted);
	margin-bottom: 8px;
}
.gsm-aud-form-group input {
	width:         100%;
	padding:       12px 14px;
	background:    rgba(255,255,255,.06);
	border:        1px solid rgba(255,255,255,.15);
	border-radius: 8px;
	color:         var(--aud-text);
	font-size:     15px;
	outline:       none;
	transition:    border-color .2s;
	box-sizing:    border-box;
}
.gsm-aud-form-group input::placeholder { color: #555; }
.gsm-aud-form-group input:focus { border-color: var(--aud-pink); background: rgba(255,0,110,.05); }

.gsm-aud-terms {
	display:     flex;
	align-items: flex-start;
	gap:         9px;
	margin:      4px 0 14px;
	font-size:   13px;
	color:       var(--aud-muted);
	line-height: 1.5;
	cursor:      pointer;
}
.gsm-aud-terms input[type="checkbox"] {
	width:       17px !important;
	height:      17px !important;
	min-width:   17px;
	margin:      1px 0 0 !important;
	accent-color: var(--aud-pink);
	cursor:      pointer;
	flex:        0 0 auto;
}
.gsm-aud-terms a { color: var(--aud-pink); text-decoration: underline; }

.gsm-aud-form-error {
	color:       #ff6666;
	font-size:   13px;
	margin:      -8px 0 12px;
	padding:     8px 12px;
	background:  rgba(255,80,80,.08);
	border-radius: 6px;
	border-left: 3px solid #ff4444;
}
.gsm-aud-form-error[hidden] { display: none; }

/* ── Summary ─────────────────────────────────────────────────────── */
.gsm-aud-summary {
	background:    var(--aud-card);
	border-radius: 8px;
	padding:       14px;
	margin-bottom: 18px;
}
.gsm-aud-summary__row {
	display:         flex;
	justify-content: space-between;
	align-items:     center;
	padding:         6px 0;
	font-size:       14px;
	border-bottom:   1px solid var(--aud-border);
}
.gsm-aud-summary__row:last-child { border-bottom: none; }
.gsm-aud-summary__row span { color: var(--aud-muted); }
.gsm-aud-summary__row strong { color: var(--aud-text); }

/* ── Stripe element ──────────────────────────────────────────────── */
.gsm-aud-stripe-element {
	padding:       12px 14px;
	background:    rgba(255,255,255,.06);
	border:        1px solid rgba(255,255,255,.15);
	border-radius: 8px;
	transition:    border-color .2s;
	min-height:    42px;
}
.gsm-aud-stripe-element.StripeElement--focus { border-color: var(--aud-pink); }

/* ── Buttons ─────────────────────────────────────────────────────── */
.gsm-aud-btn-primary {
	display:         flex;
	align-items:     center;
	justify-content: center;
	gap:             8px;
	width:           100%;
	padding:         14px;
	background:      linear-gradient(135deg, var(--aud-pink), #c0005c);
	color:           #fff;
	border:          none;
	border-radius:   8px;
	font-size:       16px;
	font-weight:     700;
	cursor:          pointer;
	transition:      all .2s;
	margin-top:      8px;
}
.gsm-aud-btn-primary:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 6px 24px rgba(255,0,110,.4); }
.gsm-aud-btn-primary:disabled { opacity: .6; cursor: not-allowed; transform: none; }

.gsm-aud-btn-back {
	background:  none;
	border:      none;
	color:       var(--aud-muted);
	font-size:   13px;
	cursor:      pointer;
	padding:     10px 0 0;
	display:     block;
	width:       100%;
	text-align:  center;
	transition:  color .2s;
}
.gsm-aud-btn-back:hover { color: var(--aud-text); }

.gsm-aud-secure {
	display:     flex;
	align-items: center;
	justify-content: center;
	gap:         5px;
	color:       var(--aud-muted);
	font-size:   11px;
	margin:      8px 0 4px;
}

/* ── Success ─────────────────────────────────────────────────────── */
.gsm-aud-success {
	padding:    24px;
	text-align: center;
}
.gsm-aud-success[hidden] { display: none; }
.gsm-aud-success__icon {
	width:         64px;
	height:        64px;
	background:    rgba(0,255,136,.15);
	border:        2px solid var(--aud-green);
	border-radius: 50%;
	display:       flex;
	align-items:   center;
	justify-content: center;
	font-size:     28px;
	color:         var(--aud-green);
	margin:        0 auto 16px;
}
.gsm-aud-success h4 { font-size: 22px; font-weight: 800; color: var(--aud-green); margin: 0 0 10px; }
.gsm-aud-success p  { color: var(--aud-muted); font-size: 14px; line-height: 1.6; margin: 0; }

/* ── Responsive ──────────────────────────────────────────────────── */
@media (max-width: 480px) {
	.gsm-aud__header  { padding: 20px 16px; }
	.gsm-aud__list    { padding: 16px; }
	.gsm-aud__title   { font-size: 22px; }
	.gsm-aud-card     { flex-wrap: wrap; gap: 12px; padding: 14px 16px; }
	.gsm-aud-card__mid { flex: 1 1 100%; order: 3; }
	.gsm-aud-card__right { align-items: flex-end; }
	.gsm-aud-modal__box { border-radius: 12px 12px 0 0; position: fixed; bottom: 0; left: 0; right: 0; max-width: 100%; max-height: 85vh; margin: 0; }
	.gsm-aud-modal    { align-items: flex-end; padding: 0; }
}
