/* Event Details block (also used on venue/organizer pages). Inherits the theme. */
.ew-details {
	--ew-line: color-mix(in srgb, currentColor 16%, transparent);
	--ew-soft: color-mix(in srgb, currentColor 6%, transparent);
	--ew-muted: color-mix(in srgb, currentColor 68%, transparent);
	--ew-radius: 8px;
	--ew-accent: var(--wp--preset--color--primary, var(--wp--preset--color--contrast, #1d2327));
	--ew-on-accent: var(--wp--preset--color--base, #fff);
	margin-block: 1.5rem;
}

.ew-notice { margin: 0 0 1.25rem; padding: .75rem 1rem; border: 1px solid var(--ew-line); border-radius: var(--ew-radius); background: var(--ew-soft); font-weight: 600; }
.ew-notice.is-cancelled,
.ew-notice.is-postponed { border-inline-start: 4px solid #d92d20; }
.ew-notice.is-rescheduled,
.ew-notice.is-moved-online { border-inline-start: 4px solid #dc6803; }

.ew-details .ew-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 1.25rem 2rem; margin: 0; padding: 1.25rem 0; border-block: 1px solid var(--ew-line); }
.ew-details .ew-fact dt { margin: 0 0 .3rem; padding: 0; font-size: .75em; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ew-muted); }
.ew-details .ew-fact dd { margin: 0; padding: 0; }
.ew-repeat,
.ew-address,
.ew-contact,
.ew-map-link,
.ew-organizer,
.ew-venue-name { display: block; }
.ew-repeat,
.ew-address { color: var(--ew-muted); font-size: .95em; }
.ew-venue-name,
.ew-organizer > a:first-child { font-weight: 600; }
.ew-organizer + .ew-organizer { margin-top: .6rem; }
.ew-contact,
.ew-map-link { font-size: .95em; }

.ew-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.25rem; }
.ew-button {
	display: inline-flex; align-items: center; gap: .4em; padding: .55em 1.1em;
	border: 1px solid currentColor; border-radius: var(--ew-radius);
	color: inherit; text-decoration: none; font-weight: 600; font-size: .95em; line-height: 1.3; cursor: pointer;
}
.ew-button:hover { background: var(--ew-soft); }

.ew-atc { position: relative; }
.ew-atc > summary { list-style: none; }
.ew-atc > summary::-webkit-details-marker { display: none; }
.ew-atc > summary::after { content: ""; width: .45em; height: .45em; margin-inline-start: .2em; border: solid currentColor; border-width: 0 2px 2px 0; transform: translateY(-20%) rotate(45deg); }
.ew-atc[open] > summary::after { transform: translateY(20%) rotate(-135deg); }
.ew-atc ul {
	position: absolute; z-index: 20; inset-inline-start: 0; top: calc(100% + .35rem); min-width: 17rem;
	margin: 0; padding: .35rem; list-style: none; border: 1px solid var(--ew-line); border-radius: var(--ew-radius);
	background: var(--wp--preset--color--base, Canvas); color: var(--wp--preset--color--contrast, CanvasText);
	box-shadow: 0 12px 32px -12px rgba(0, 0, 0, .25);
}
.ew-atc li a { display: block; white-space: nowrap; padding: .5rem .7rem; border-radius: 6px; color: inherit; text-decoration: none; font-size: .95em; }
.ew-atc li a:hover,
.ew-atc li a:focus-visible { background: var(--ew-soft); }

.ew-section-title { margin: 2rem 0 .5rem; font-size: 1.1em; }
.ew-other-dates ul,
.ew-upcoming ul { margin: 0; padding: 0; list-style: none; }
.ew-other-dates li,
.ew-upcoming li { padding: .5rem 0; border-bottom: 1px solid var(--ew-line); }
.ew-upcoming .ew-when { display: block; color: var(--ew-muted); font-size: .9em; }
.ew-details .ew-empty { color: var(--ew-muted); }

/* Tickets and RSVP --------------------------------------------------------- */
.ew-details .ew-sr {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.ew-tickets { margin-top: 2rem; scroll-margin-top: 6rem; }
.ew-ticket-types { margin: 0 0 1rem; padding: 0; list-style: none; border: 1px solid var(--ew-line); border-radius: var(--ew-radius); }
.ew-ticket-type { display: grid; grid-template-columns: 1fr auto auto; gap: .75rem 1rem; align-items: center; padding: .9rem 1rem; }
.ew-ticket-type + .ew-ticket-type { border-top: 1px solid var(--ew-line); }
.ew-ticket-type.is-sold-out .ew-ticket-info,
.ew-ticket-type.is-sold-out .ew-ticket-price { opacity: .6; }
.ew-ticket-type.is-sold-out .ew-ticket-left { opacity: 1; }
.ew-ticket-name { display: block; font-weight: 600; }
.ew-ticket-desc { display: block; font-size: .9em; color: var(--ew-muted); }
.ew-ticket-price { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.ew-ticket-left { display: block; font-size: .78em; font-weight: 500; color: var(--ew-muted); }
.ew-ticket-left.is-out { color: #b42318; }
.ew-ticket-type select,
.ew-ticket-buyer input {
	box-sizing: border-box; height: 2.6rem; padding: 0 .75rem; margin: 0;
	border: 1px solid var(--ew-line); border-radius: var(--ew-radius);
	background: transparent; color: inherit; font: inherit;
}
.ew-ticket-type select { min-width: 4.5rem; }
.ew-ticket-type select option { color: initial; }
.ew-ticket-buyer { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: .75rem 1rem; }
.ew-ticket-buyer p { margin: 0; }
.ew-ticket-buyer label { display: block; margin-bottom: .3rem; font-size: .85em; font-weight: 600; }
.ew-ticket-buyer input { width: 100%; }
.ew-ticket-type select:focus-visible,
.ew-ticket-buyer input:focus-visible { outline: 2px solid currentColor; outline-offset: 1px; }
.ew-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ew-ticket-submit { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; margin: 1.25rem 0 0; }
.ew-button-primary { border-color: var(--ew-accent); background: var(--ew-accent); color: var(--ew-on-accent); }
.ew-button-primary:hover { background: color-mix(in srgb, var(--ew-accent) 86%, #000); }
.ew-button-primary:focus-visible { outline: 2px solid var(--ew-accent); outline-offset: 2px; }
.ew-ticket-note { font-size: .88em; color: var(--ew-muted); }
.ew-ticket-note.is-test { margin: 1rem 0 0; padding: .6rem .8rem; border-radius: var(--ew-radius); background: #fffaeb; border: 1px solid #fedf89; color: #93370d; }
.ew-ticket-error { margin: 0 0 1rem; padding: .75rem 1rem; border-radius: var(--ew-radius); border: 1px solid #fecdca; background: #fef3f2; color: #b42318; font-weight: 600; }
.ew-booking-test { display: inline-block; margin-inline-start: .5rem; padding: .1rem .5rem; border-radius: 999px; border: 1px solid #fedf89; background: #fffaeb; color: #93370d; font-size: .8em; font-weight: 600; vertical-align: middle; }
.ew-ticket-closed { margin: 0; padding: .9rem 1rem; border: 1px dashed var(--ew-line); border-radius: var(--ew-radius); color: var(--ew-muted); }
.ew-booking { margin: 0 0 1.25rem; padding: 1rem 1.1rem; border-radius: var(--ew-radius); border: 1px solid var(--ew-line); background: var(--ew-soft); }
/* Fixed light tints need a fixed dark text colour, or dark themes get white on near-white. */
.ew-booking.is-ok { border-color: #abefc6; background: #ecfdf3; color: #101828; }
.ew-booking.is-wait { border-color: #fedf89; background: #fffaeb; color: #101828; }
.ew-booking p { margin: 0 0 .5rem; }
.ew-booking-title { font-weight: 700; font-size: 1.05em; }
.ew-booking-codes { margin: .75rem 0 0; padding: 0; list-style: none; display: grid; gap: .4rem; }
.ew-booking-codes li { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem .7rem; border-radius: 6px; background: rgba(255, 255, 255, .7); }
.ew-booking-codes code { font-size: 1em; letter-spacing: .1em; font-weight: 700; }
.ew-booking-total { margin-top: .75rem !important; font-weight: 600; }
@media (max-width: 480px) {
	.ew-ticket-type { grid-template-columns: 1fr auto; }
	.ew-ticket-type select { grid-column: 2; }
	.ew-ticket-price { text-align: left; }
}
