/* ============================================================
   SavoiaTV — Livestream Schedule ([savoiatv_schedule])
   ------------------------------------------------------------
   Mobile-first. Entries stack as cards on phones (no wide
   desktop table, no horizontal scrolling); on wider screens
   the date/time sits in a left column beside the details.
   Colours/spacing come from the child theme tokens in
   style.css; a few status accent colours are defined locally.
   ============================================================ */

.stv-schedule {
	--stv-status-scheduled: var(--stv-color-silver);
	--stv-status-live: #ff4d4d;
	--stv-status-completed: var(--stv-color-muted);
	--stv-status-cancelled: var(--stv-color-muted);
	color: var(--stv-color-text);
}

.stv-schedule__empty {
	margin: 0;
	padding: var(--stv-space-lg);
	text-align: center;
	color: var(--stv-color-muted);
	background-color: var(--stv-color-surface);
	border: 1px solid var(--stv-color-border);
	border-radius: var(--stv-radius);
}

.stv-schedule__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--stv-space-md);
}

/* ---------- Entry card (mobile-first: stacked) ---------- */
.stv-schedule__item {
	display: flex;
	flex-direction: column;
	gap: var(--stv-space-sm);
	padding: var(--stv-space-md);
	background-color: var(--stv-color-surface);
	border: 1px solid var(--stv-color-border);
	border-left: 3px solid var(--stv-color-border-strong);
	border-radius: var(--stv-radius);
}

.stv-schedule__item--live {
	border-left-color: var(--stv-status-live);
}

.stv-schedule__item--scheduled {
	border-left-color: var(--stv-color-blue);
}

.stv-schedule__item--cancelled {
	opacity: 0.75;
}

/* ---------- When (date / time) ---------- */
.stv-schedule__when {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.25rem 0.75rem;
}

.stv-schedule__date {
	font-weight: 700;
	color: var(--stv-color-heading);
}

.stv-schedule__time {
	color: var(--stv-color-silver);
	font-variant-numeric: tabular-nums;
}

.stv-schedule__date--tba {
	color: var(--stv-color-muted);
	font-weight: 600;
}

/* ---------- Main (status / program / destinations) ---------- */
.stv-schedule__main {
	display: flex;
	flex-direction: column;
	gap: var(--stv-space-sm);
	min-width: 0;
}

.stv-schedule__status {
	align-self: flex-start;
	padding: 0.15rem 0.6rem;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	border-radius: 999px;
	border: 1px solid currentColor;
	color: var(--stv-status-scheduled);
}

.stv-schedule__status--scheduled {
	color: var(--stv-color-blue);
}

.stv-schedule__status--live {
	color: #fff;
	background-color: var(--stv-status-live);
	border-color: var(--stv-status-live);
}

.stv-schedule__status--completed {
	color: var(--stv-status-completed);
}

.stv-schedule__status--cancelled {
	color: var(--stv-status-cancelled);
}

.stv-schedule__program {
	margin: 0;
	font-size: 1.15rem;
	line-height: 1.25;
	color: var(--stv-color-heading);
}

.stv-schedule__program a {
	color: inherit;
	text-decoration: none;
}

.stv-schedule__program a:hover,
.stv-schedule__program a:focus {
	color: var(--stv-color-blue-hover);
	text-decoration: underline;
}

.stv-schedule__item--cancelled .stv-schedule__program {
	text-decoration: line-through;
	text-decoration-color: var(--stv-color-muted);
}

.stv-schedule__within {
	margin: 0;
	font-size: 0.9rem;
	color: var(--stv-color-muted);
}

.stv-schedule__within a {
	color: var(--stv-color-silver);
	text-decoration: none;
}

.stv-schedule__within a:hover,
.stv-schedule__within a:focus {
	color: var(--stv-color-blue-hover);
	text-decoration: underline;
}

/* ---------- Destination buttons ---------- */
.stv-schedule__destinations {
	display: flex;
	flex-wrap: wrap;
	gap: var(--stv-space-sm);
	margin-top: 0.15rem;
}

.stv-schedule__dest {
	display: inline-flex;
	align-items: center;
	padding: 0.45rem 0.9rem;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--stv-color-silver);
	text-decoration: none;
	background-color: var(--stv-color-surface-2);
	border: 1px solid var(--stv-color-border);
	border-radius: var(--stv-radius-sm);
	transition: border-color 0.15s ease, color 0.15s ease, background-color 0.15s ease;
}

.stv-schedule__dest:hover,
.stv-schedule__dest:focus {
	color: var(--stv-color-blue-ink);
	background-color: var(--stv-color-blue);
	border-color: var(--stv-color-blue);
}

.stv-schedule__dest--plain {
	color: var(--stv-color-muted);
	background-color: transparent;
	cursor: default;
}

.stv-schedule__dest--replay {
	border-color: var(--stv-color-border-strong);
}

/* ============================================================
   Wider screens: date/time column beside the details.
   ============================================================ */
@media (min-width: 620px) {
	.stv-schedule__item {
		flex-direction: row;
		align-items: flex-start;
		gap: var(--stv-space-lg);
	}

	.stv-schedule__when {
		flex: 0 0 9.5rem;
		flex-direction: column;
		gap: 0.15rem;
	}

	.stv-schedule__main {
		flex: 1 1 auto;
	}
}

/* ============================================================
   Livestream Schedule PAGE wrapper (v0.3.1)
   ------------------------------------------------------------
   Scoped strictly to the Page that contains [savoiatv_schedule]
   (body.stv-schedule-page, added in PHP). No-sidebar/full-width
   is handled by the generate_sidebar_layout filter; here we let
   the established dark SavoiaTV background show through GP's
   content container so the page matches the custom templates.
   Only this page is affected — normal Pages/Posts are untouched.
   The schedule shortcode output and its mobile behaviour are
   unchanged.
   ============================================================ */
.stv-schedule-page #primary,
.stv-schedule-page .content-area,
.stv-schedule-page #main,
.stv-schedule-page .site-main,
.stv-schedule-page article,
.stv-schedule-page .inside-article,
.stv-schedule-page .entry-content,
.stv-schedule-page .entry-header,
.stv-schedule-page .page-header,
.stv-schedule-page .page-hero,
.stv-schedule-page .inside-page-hero {
	background: transparent !important;
	box-shadow: none !important;
	border: 0 !important;
}

/* Keep the schedule readable at full width without a hard cap that
   would fight GeneratePress's own content container width. */
.stv-schedule-page .stv-schedule {
	margin-left: auto;
	margin-right: auto;
}

/* ============================================================
   Grouped schedule (v0.5.6)
   ------------------------------------------------------------
   One dated block per calendar date, with all programs for that
   date listed inside it in chronological order. Compact rows;
   dark SavoiaTV surfaces with blue accents. Only exception
   statuses (Live/Cancelled/Rescheduled/…) show a badge — normal
   "Scheduled" items do not. The per-entry card styles above are
   retained for the homepage "Upcoming Programming" section.
   ============================================================ */
.stv-schedule--grouped {
	display: grid;
	gap: var(--stv-space-md);
}

.stv-sched-day {
	background-color: var(--stv-color-surface);
	border: 1px solid var(--stv-color-border);
	border-left: 3px solid var(--stv-color-blue);
	border-radius: var(--stv-radius);
	padding: var(--stv-space-md);
}

.stv-sched-day__heading {
	margin: 0 0 0.5rem;
	padding-bottom: 0.4rem;
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: var(--stv-color-heading);
	border-bottom: 1px solid var(--stv-color-border);
}

.stv-sched-day__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
}

/* ---------- Row (mobile-first: stacked, compact) ---------- */
.stv-sched-row {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.1rem 0.75rem;
	padding: 0.5rem 0;
}

.stv-sched-row + .stv-sched-row {
	border-top: 1px solid var(--stv-color-border);
}

.stv-sched-row__time {
	color: var(--stv-color-silver);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
	font-size: 0.9rem;
}

.stv-sched-row__program {
	color: var(--stv-color-heading);
	min-width: 0;
}

.stv-sched-row__program a {
	color: inherit;
	text-decoration: none;
}

.stv-sched-row__program a:hover,
.stv-sched-row__program a:focus {
	color: var(--stv-color-blue-hover);
	text-decoration: underline;
}

.stv-sched-row--cancelled .stv-sched-row__program {
	text-decoration: line-through;
	text-decoration-color: var(--stv-color-muted);
	color: var(--stv-color-muted);
}

.stv-sched-row__within {
	color: var(--stv-color-muted);
	font-size: 0.85em;
}

.stv-sched-row__within a {
	color: var(--stv-color-silver);
	text-decoration: none;
}

.stv-sched-row__within a:hover,
.stv-sched-row__within a:focus {
	color: var(--stv-color-blue-hover);
	text-decoration: underline;
}

/* ---------- Exception badge (no badge for "Scheduled") ---------- */
.stv-sched-row__badge {
	justify-self: start;
	align-self: center;
	padding: 0.1rem 0.55rem;
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	border-radius: 999px;
	border: 1px solid var(--stv-color-blue);
	color: var(--stv-color-blue);
	white-space: nowrap;
}

.stv-sched-row__badge--live {
	color: #fff;
	background-color: #ff4d4d;
	border-color: #ff4d4d;
}

.stv-sched-row__badge--cancelled,
.stv-sched-row__badge--canceled {
	color: var(--stv-color-muted);
	border-color: var(--stv-color-muted);
}

/* ---------- Optional compact watch links ---------- */
.stv-sched-row__links {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
}

.stv-sched-row__link {
	display: inline-flex;
	align-items: center;
	padding: 0.2rem 0.6rem;
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--stv-color-silver);
	text-decoration: none;
	background-color: var(--stv-color-surface-2);
	border: 1px solid var(--stv-color-border);
	border-radius: var(--stv-radius-sm);
}

.stv-sched-row__link:hover,
.stv-sched-row__link:focus {
	color: var(--stv-color-blue-ink);
	background-color: var(--stv-color-blue);
	border-color: var(--stv-color-blue);
}

/* ---------- Wider screens: time | program | badge/links ---------- */
@media (min-width: 620px) {
	.stv-sched-row {
		grid-template-columns: 10.5rem 1fr auto;
		align-items: baseline;
		gap: 0.25rem 0.9rem;
	}

	.stv-sched-row__links {
		grid-column: 2 / -1;
		margin-top: 0.15rem;
	}
}

/* ============================================================
   Weekly schedule navigation + heading (v0.5.8)
   ------------------------------------------------------------
   The full schedule paginates by broadcast week (Mon–Sun). The
   heading names the week; the nav (rendered above and below the
   day blocks) uses plain server-side links — no JavaScript.
   ============================================================ */
.stv-week-heading {
	margin: 0 0 var(--stv-space-md);
	font-size: 1.2rem;
	color: var(--stv-color-heading);
}

.stv-week-nav {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--stv-space-sm);
	margin: var(--stv-space-md) 0;
}

.stv-week-nav__link {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	min-height: 44px;
	padding: 0.5rem 0.95rem;
	color: var(--stv-color-silver);
	text-decoration: none;
	background-color: var(--stv-color-surface);
	border: 1px solid var(--stv-color-border);
	border-radius: var(--stv-radius-sm);
	transition: border-color 0.15s ease, color 0.15s ease, background-color 0.15s ease;
}

.stv-week-nav__link:hover,
.stv-week-nav__link:focus {
	color: var(--stv-color-blue-ink);
	background-color: var(--stv-color-blue);
	border-color: var(--stv-color-blue);
}

.stv-week-nav__this {
	color: var(--stv-color-heading);
}

@media (max-width: 600px) {
	.stv-week-nav {
		justify-content: center;
	}

	.stv-week-nav__link {
		flex: 1 1 auto;
		justify-content: center;
	}
}