/**
 * core/table – "Fuze table (stacks on mobile)" style: .is-style-fuze-hours
 *
 * Desktop: purple header, rounded corners, lilac zebra rows, bold day column.
 * Below 782px each row becomes a card; cells show their column name from data-label
 * (added by inc/table.php). Today's row (.is-today) is marked by assets/js/hours.js.
 * The current season's column (Term Time or Holiday Hours, from FuZe → Settings) is marked by
 * inc/table.php: .has-active-season on the table, .is-active-season on the column, .is-active-sub
 * on its evening column. Desktop: a "Now" pill in the header and a pale lime strip down the column;
 * phones: that line (and its evening line) comes first in each day card, tinted and in bold.
 */
.wp-block-table.is-style-fuze-hours {
	--fuze-table-radius: var(--wp--custom--radius--lg, 24px);
	margin-block: 0;
	overflow: visible;
	font-size: var(--wp--preset--font-size--medium);
}

.wp-block-table.is-style-fuze-hours table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	border: 0;
	border-radius: var(--fuze-table-radius);
	background: var(--wp--preset--color--white);
	box-shadow: 0 0 0 2px var(--wp--preset--color--purple-tint), var(--wp--preset--shadow--soft);
	overflow: hidden;
	color: var(--wp--preset--color--body);
}

.wp-block-table.is-style-fuze-hours :where(th, td) {
	border: 0;
	padding: 0.95rem 1.1rem;
	text-align: start;
	vertical-align: middle;
	line-height: 1.35;
	overflow-wrap: anywhere;
}

.wp-block-table.is-style-fuze-hours thead {
	border: 0;
}

.wp-block-table.is-style-fuze-hours thead th {
	background: var(--wp--preset--color--purple);
	color: var(--wp--preset--color--white);
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 600;
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.2;
	padding-block: 1.1rem;
	overflow-wrap: normal;
}

/* Evening-session columns (.is-sub, added by inc/table.php from the header text) read as the lighter partner of the column before. */
.wp-block-table.is-style-fuze-hours thead th.is-sub {
	background: color-mix(in srgb, var(--wp--preset--color--purple) 82%, var(--wp--preset--color--indigo));
	font-weight: 500;
}

.wp-block-table.is-style-fuze-hours tbody tr:nth-child(even) > * {
	background: var(--wp--preset--color--purple-tint);
}

.wp-block-table.is-style-fuze-hours tbody > tr > :first-child {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 600;
	color: var(--wp--preset--color--heading);
	white-space: nowrap;
}

.wp-block-table.is-style-fuze-hours td {
	font-variant-numeric: tabular-nums;
	font-weight: 600;
	color: var(--wp--preset--color--heading);
}

/* A single time range such as "11am – 3.30pm" stays on one line (.is-range from inc/table.php). */
.wp-block-table.is-style-fuze-hours td.is-range {
	white-space: nowrap;
	overflow-wrap: normal;
}

/* Narrow desktop table: columns size to their content (times stay whole, long headers wrap). */
@media (min-width: 782px) and (max-width: 1023.98px) {
	.wp-block-table.is-style-fuze-hours table {
		table-layout: auto;
	}
}

/* Just above the phone layout the "Today" pill widens the day column: slimmer cell padding keeps
 * the evening times on one line. */
@media (min-width: 782px) and (max-width: 899.98px) {
	.wp-block-table.is-style-fuze-hours :where(th, td) {
		padding-inline: 0.7rem;
	}
}

.wp-block-table.is-style-fuze-hours td.is-sub {
	font-weight: 500;
	color: var(--wp--preset--color--body);
}

.wp-block-table.is-style-fuze-hours tbody tr:last-child > * {
	border-bottom: 0;
}

/* CLOSED pill (never split inside the word) */
.wp-block-table.is-style-fuze-hours .fuze-closed {
	display: inline-block;
	white-space: nowrap;
	overflow-wrap: normal;
	padding: 0.2em 0.75em;
	border-radius: var(--wp--custom--radius--pill, 999px);
	background: var(--wp--preset--color--cream);
	color: var(--wp--preset--color--pink-ink);
	box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--wp--preset--color--pink-ink) 35%, transparent);
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 600;
	font-size: 0.8em;
	letter-spacing: 0.08em;
	line-height: 1.4;
}

/* Today */
.wp-block-table.is-style-fuze-hours tbody tr.is-today > * {
	background: color-mix(in srgb, var(--wp--preset--color--yellow) 38%, var(--wp--preset--color--white));
}

.wp-block-table.is-style-fuze-hours tbody tr.is-today > :first-child {
	box-shadow: inset 6px 0 0 var(--wp--preset--color--pink);
}

.wp-block-table.is-style-fuze-hours tbody tr.is-today > :first-child::after {
	content: "Today";
	display: inline-block;
	margin-inline-start: 0.5em;
	padding: 0.15em 0.6em;
	border-radius: var(--wp--custom--radius--pill, 999px);
	background: var(--wp--preset--color--pink-strong);
	color: var(--wp--preset--color--white);
	font-family: var(--wp--preset--font-family--heading);
	font-size: 0.7em;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	vertical-align: 0.15em;
}

/* Current season */
.wp-block-table.is-style-fuze-hours .fuze-season-now {
	display: inline-block;
	margin-inline-start: 0.45em;
	padding: 0.2em 0.65em;
	border-radius: var(--wp--custom--radius--pill, 999px);
	background: var(--wp--preset--color--lime-soft);
	color: var(--wp--preset--color--navy);
	font-size: 0.62em;
	font-weight: 600;
	letter-spacing: 0.06em;
	line-height: 1.25;
	text-transform: uppercase;
	vertical-align: 0.2em;
	white-space: nowrap;
}

.wp-block-table.is-style-fuze-hours td.is-active-season {
	font-weight: 700;
}

/* Desktop: a pale lime strip down the column (today's band still runs across it). */
@media (min-width: 782px) {
	.wp-block-table.is-style-fuze-hours thead th.is-active-season {
		box-shadow: inset 0 -4px 0 var(--wp--preset--color--lime-soft);
	}

	.wp-block-table.is-style-fuze-hours tbody td.is-active-season {
		background-color: color-mix(in srgb, var(--wp--preset--color--lime) 10%, var(--wp--preset--color--white));
	}

	.wp-block-table.is-style-fuze-hours tbody tr.is-today > td.is-active-season {
		background-color: color-mix(in srgb, var(--wp--preset--color--yellow) 38%, var(--wp--preset--color--white));
	}
}

.wp-block-table.is-style-fuze-hours figcaption,
.wp-block-table.is-style-fuze-hours .wp-element-caption {
	margin-top: 1rem;
	text-align: center;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--body);
}

/* ---------------------------------------------------------------- *
 * Phones & small tablets: each row becomes a card.
 * ---------------------------------------------------------------- */
@media (max-width: 781.98px) {
	.wp-block-table.is-style-fuze-hours table,
	.wp-block-table.is-style-fuze-hours tbody,
	.wp-block-table.is-style-fuze-hours tr,
	.wp-block-table.is-style-fuze-hours th,
	.wp-block-table.is-style-fuze-hours td {
		display: block;
		width: auto;
	}

	.wp-block-table.is-style-fuze-hours table {
		background: transparent;
		box-shadow: none;
		border-radius: 0;
		overflow: visible;
		table-layout: auto;
	}

	/* Column headers stay available to screen readers via data-label and the <th scope="col">. */
	.wp-block-table.is-style-fuze-hours thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip-path: inset(50%);
		white-space: nowrap;
	}

	.wp-block-table.is-style-fuze-hours tbody {
		display: grid;
		gap: 0.9rem;
	}

	@media (min-width: 560px) {
		.wp-block-table.is-style-fuze-hours tbody {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}

		/* An odd last card (Sunday) spans the row instead of leaving an empty cell beside it. */
		.wp-block-table.is-style-fuze-hours tbody > tr:last-child:nth-child(odd) {
			grid-column: 1 / -1;
		}
	}

	.wp-block-table.is-style-fuze-hours tbody tr {
		border-radius: var(--wp--custom--radius--md, 14px);
		background: var(--wp--preset--color--white);
		box-shadow: 0 0 0 2px var(--wp--preset--color--purple-tint), var(--wp--preset--shadow--soft);
		overflow: hidden;
	}

	.wp-block-table.is-style-fuze-hours tbody tr:nth-child(even) > *,
	.wp-block-table.is-style-fuze-hours tbody tr > * {
		background: transparent;
	}

	.wp-block-table.is-style-fuze-hours tbody tr > :first-child {
		padding: 0.7rem 1rem;
		background: var(--wp--preset--color--purple);
		color: var(--wp--preset--color--white);
		font-size: var(--wp--preset--font-size--large);
		line-height: 1.2;
	}

	.wp-block-table.is-style-fuze-hours td {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		gap: 0.15rem 1rem;
		padding: 0.55rem 1rem;
		border-top: 1px solid var(--wp--preset--color--purple-tint);
		text-align: end;
	}

	.wp-block-table.is-style-fuze-hours td[data-label]::before {
		content: attr(data-label);
		font-family: var(--wp--preset--font-family--heading);
		font-weight: 600;
		color: var(--wp--preset--color--purple);
		text-align: start;
	}

	/* Evening sessions tuck under their main row. */
	.wp-block-table.is-style-fuze-hours td.is-sub {
		border-top: 0;
		padding-top: 0;
		font-size: var(--wp--preset--font-size--small);
	}

	.wp-block-table.is-style-fuze-hours td.is-sub[data-label]::before {
		font-family: var(--wp--preset--font-family--body);
		font-weight: 600;
		color: var(--wp--preset--color--body);
		padding-inline-start: 0.9rem;
		background: linear-gradient(var(--wp--preset--color--lime), var(--wp--preset--color--lime)) left center / 0.45rem 2px no-repeat;
	}

	.wp-block-table.is-style-fuze-hours td:last-child {
		padding-bottom: 0.8rem;
	}

	.wp-block-table.is-style-fuze-hours tbody tr.is-today {
		box-shadow: 0 0 0 3px var(--wp--preset--color--pink), var(--wp--preset--shadow--lift);
	}

	.wp-block-table.is-style-fuze-hours tbody tr.is-today > * {
		background: color-mix(in srgb, var(--wp--preset--color--yellow) 30%, var(--wp--preset--color--white));
	}

	.wp-block-table.is-style-fuze-hours tbody tr.is-today > :first-child {
		background: var(--wp--preset--color--pink-strong);
		box-shadow: none;
	}

	.wp-block-table.is-style-fuze-hours tbody tr.is-today > :first-child::after {
		background: var(--wp--preset--color--yellow);
		color: var(--wp--preset--color--navy);
	}

	/* Current season: its line (and its evening line) comes first in each day card, in bold. */
	.wp-block-table.is-style-fuze-hours table.has-active-season tbody tr {
		display: flex;
		flex-direction: column;
		padding-bottom: 0.25rem; /* The closing space, wherever the last line has moved to. */
	}

	.wp-block-table.is-style-fuze-hours table.has-active-season tbody tr.is-today {
		background: color-mix(in srgb, var(--wp--preset--color--yellow) 30%, var(--wp--preset--color--white));
	}

	.wp-block-table.is-style-fuze-hours table.has-active-season tbody tr > :first-child {
		order: -3;
	}

	/* A faint lime tint layered over the white card (today's card gets a sunshine band, below). */
	.wp-block-table.is-style-fuze-hours table.has-active-season td.is-active-season {
		order: -2;
		font-weight: 800;
		box-shadow: inset 0 0 0 100vmax color-mix(in srgb, var(--wp--preset--color--lime) 13%, transparent);
	}

	.wp-block-table.is-style-fuze-hours table.has-active-season td.is-active-sub {
		order: -1;
		box-shadow: inset 0 0 0 100vmax color-mix(in srgb, var(--wp--preset--color--lime) 13%, transparent);
	}

	/* On today's (yellow) card a lime tint turns olive: a deeper sunshine band instead. */
	.wp-block-table.is-style-fuze-hours table.has-active-season tr.is-today td:is(.is-active-season, .is-active-sub) {
		box-shadow: inset 0 0 0 100vmax color-mix(in srgb, var(--wp--preset--color--yellow) 40%, transparent);
	}

	.wp-block-table.is-style-fuze-hours table.has-active-season td:last-child {
		padding-bottom: 0.55rem;
	}

	.wp-block-table.is-style-fuze-hours td.is-active-season[data-label]::before {
		font-weight: 700;
		color: var(--wp--preset--color--heading);
	}
}