/**
 * Variant CSS: events--ticket-rows
 *
 * Events as ticket-stub rows. Each row is a framed "ticket": an accent date stub on
 * the left separated by a dashed perforation, the title + time/place in the middle,
 * and a price + "Kup bilet" CTA on the right. Two notch circles are punched on the
 * perforation line via radial-gradient backgrounds on the row, selling the ticket
 * metaphor. Text stays --ink; date, perforation and price take --accent; the CTA is
 * solid primary. Row reflows to a stacked card on mobile.
 */

body.aibt-universal .universal-events--ticket-rows {
	padding-block: calc(clamp(3rem, 7vw, 5rem) * var(--density, 1));
}

/* Intro. */
body.aibt-universal .universal-events--ticket-rows .universal-events__intro {
	margin-bottom: clamp(2rem, 4.5vw, 3rem);
}

body.aibt-universal .universal-events--ticket-rows .universal-events__kicker {
	font-family: var(--font-body) !important;
	font-size: var(--text-xs) !important;
	font-weight: 600 !important;
	letter-spacing: var(--tracking-widest) !important;
	text-transform: uppercase !important;
	color: var(--accent) !important;
	margin: 0 0 var(--space-sm) 0 !important;
}

body.aibt-universal .universal-events--ticket-rows .universal-events__headline {
	font-family: var(--font-display) !important;
	color: var(--ink) !important;
	margin: 0 0 var(--space-sm) 0 !important;
}

body.aibt-universal .universal-events--ticket-rows .universal-events__headline em {
	color: var(--accent) !important;
	font-style: italic;
}

body.aibt-universal .universal-events--ticket-rows .universal-events__deck {
	font-family: var(--font-body) !important;
	font-size: var(--text-base) !important;
	color: var(--ink) !important;
	opacity: 0.74;
	margin: 0 !important;
}

/* Ticket stack. */
body.aibt-universal .universal-events--ticket-rows .universal-events__tickets {
	display: flex !important;
	flex-direction: column;
	gap: clamp(0.9rem, 2.2vw, 1.3rem) !important;
}

/* The ticket row. Notch circles punched at the perforation seam (left=98px). */
body.aibt-universal .universal-events--ticket-rows .universal-events__ticket {
	gap: 0 !important;
	align-items: stretch !important;
	flex-wrap: nowrap !important;
	border-radius: var(--decor-radius, 14px);
	border: 1px solid color-mix(in srgb, var(--ink) 12%, transparent);
	background:
		radial-gradient(circle at 98px 0, var(--background, #fff) 7px, transparent 7px) top left / 100% 50% no-repeat,
		radial-gradient(circle at 98px 100%, var(--background, #fff) 7px, transparent 7px) bottom left / 100% 50% no-repeat;
	overflow: hidden;
	transition: border-color var(--duration-fast, 0.18s) var(--ease-default, ease);
}

body.aibt-universal .universal-events--ticket-rows .universal-events__ticket:hover {
	border-color: color-mix(in srgb, var(--accent) 40%, transparent);
}

/* Stub: accent date column with the dashed perforation as its right edge. */
body.aibt-universal .universal-events--ticket-rows .universal-events__stub {
	flex: 0 0 auto !important;
	width: 96px;
	display: flex !important;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: clamp(1rem, 2.4vw, 1.4rem) 0.5rem;
	background: color-mix(in srgb, var(--accent) 10%, transparent);
	border-right: 2px dashed color-mix(in srgb, var(--accent) 32%, transparent);
}

body.aibt-universal .universal-events--ticket-rows .universal-events__day {
	font-family: var(--font-display) !important;
	font-size: 2rem !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	color: var(--ink) !important;
	margin: 0 !important;
}

body.aibt-universal .universal-events--ticket-rows .universal-events__month {
	font-family: var(--font-body) !important;
	font-size: var(--text-xs) !important;
	font-weight: 700 !important;
	letter-spacing: var(--tracking-wide) !important;
	text-transform: uppercase !important;
	color: var(--accent) !important;
	margin: 0.15rem 0 0 0 !important;
}

/* Body. */
body.aibt-universal .universal-events--ticket-rows .universal-events__body {
	flex: 1 1 auto;
	min-width: 0;
	display: flex !important;
	flex-direction: column;
	justify-content: center;
	gap: 0.3rem;
	padding: clamp(1rem, 2.4vw, 1.4rem) clamp(1rem, 2.6vw, 1.6rem);
}

body.aibt-universal .universal-events--ticket-rows .universal-events__title {
	font-family: var(--font-display) !important;
	font-size: clamp(1.15rem, 2.2vw, 1.4rem) !important;
	font-weight: 600 !important;
	line-height: 1.22 !important;
	color: var(--ink) !important;
	margin: 0 !important;
}

body.aibt-universal .universal-events--ticket-rows .universal-events__meta {
	font-family: var(--font-body) !important;
	font-size: var(--text-xs) !important;
	font-weight: 600 !important;
	letter-spacing: var(--tracking-wide) !important;
	text-transform: uppercase !important;
	color: var(--accent) !important;
	margin: 0 !important;
}

/* Price + CTA column. */
body.aibt-universal .universal-events--ticket-rows .universal-events__priceblock {
	flex: 0 0 auto !important;
	display: flex !important;
	flex-direction: column;
	align-items: flex-end;
	justify-content: center;
	gap: 0.6rem;
	padding: clamp(1rem, 2.4vw, 1.4rem) clamp(1rem, 2.6vw, 1.6rem);
	text-align: right;
}

body.aibt-universal .universal-events--ticket-rows .universal-events__price {
	font-family: var(--font-display) !important;
	font-size: clamp(1.05rem, 2vw, 1.3rem) !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	color: var(--ink) !important;
	margin: 0 !important;
	white-space: nowrap;
}

body.aibt-universal .universal-events--ticket-rows .universal-events__cta-wrap {
	margin: 0 !important;
}

body.aibt-universal .universal-events--ticket-rows .universal-events__cta .wp-block-button__link {
	background: var(--cta-bg-primary, var(--accent)) !important;
	color: var(--cta-text-primary, var(--on-dark, #fff)) !important;
	font-family: var(--font-body) !important;
	font-weight: 600 !important;
	font-size: var(--text-sm) !important;
	padding: 0.6rem 1.3rem !important;
	border-radius: var(--decor-radius-pill, 999px) !important;
	border: none !important;
	white-space: nowrap;
	transition: background var(--duration-fast, 0.18s) var(--ease-default, ease);
}

body.aibt-universal .universal-events--ticket-rows .universal-events__cta .wp-block-button__link:hover {
	background: var(--accent-hover, var(--accent)) !important;
}

/* Keyboard focus ring (a11y). */
body.aibt-universal .universal-events--ticket-rows .universal-events__cta .wp-block-button__link:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
	border-radius: inherit;
}

/* A5: cap uppercase letter-spacing at phone width (header + meta). */
@media (max-width: 640px) {
	body.aibt-universal .universal-events--ticket-rows .universal-events__kicker,
	body.aibt-universal .universal-events--ticket-rows .universal-events__month,
	body.aibt-universal .universal-events--ticket-rows .universal-events__meta {
		letter-spacing: 0 !important;
	}
}

/* Mobile: collapse to a stacked card; perforation becomes a top seam. */
@media (max-width: 600px) {
	body.aibt-universal .universal-events--ticket-rows .universal-events__ticket {
		flex-wrap: wrap !important;
		/* Re-punch notches on the horizontal seam under the stub. */
		background:
			radial-gradient(circle at 0 84px, var(--background, #fff) 7px, transparent 7px) top left / 50% 100% no-repeat,
			radial-gradient(circle at 100% 84px, var(--background, #fff) 7px, transparent 7px) top right / 50% 100% no-repeat;
	}
	body.aibt-universal .universal-events--ticket-rows .universal-events__stub {
		flex-basis: 100% !important;
		width: 100%;
		flex-direction: row;
		gap: 0.5rem;
		align-items: baseline;
		justify-content: center;
		padding: 0.85rem 0.5rem;
		border-right: none;
		border-bottom: 2px dashed color-mix(in srgb, var(--accent) 32%, transparent);
	}
	body.aibt-universal .universal-events--ticket-rows .universal-events__day {
		font-size: 1.5rem !important;
	}
	body.aibt-universal .universal-events--ticket-rows .universal-events__month {
		margin: 0 !important;
	}
	body.aibt-universal .universal-events--ticket-rows .universal-events__body {
		flex-basis: 60% !important;
		align-items: flex-start;
	}
	body.aibt-universal .universal-events--ticket-rows .universal-events__priceblock {
		flex-basis: 40% !important;
		justify-content: center;
	}
}

@media (max-width: 420px) {
	body.aibt-universal .universal-events--ticket-rows .universal-events__body,
	body.aibt-universal .universal-events--ticket-rows .universal-events__priceblock {
		flex-basis: 100% !important;
		align-items: flex-start;
		text-align: left;
	}
	body.aibt-universal .universal-events--ticket-rows .universal-events__priceblock {
		padding-top: 0;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		width: 100%;
	}
	/* A5: cap letter-spacing on uppercase at narrow widths. */
	body.aibt-universal .universal-events--ticket-rows .universal-events__kicker,
	body.aibt-universal .universal-events--ticket-rows .universal-events__month,
	body.aibt-universal .universal-events--ticket-rows .universal-events__meta {
		letter-spacing: 0 !important;
	}
}