/*
Theme Name: Tervis Child
Theme URI: https://www.tervis.ee
Description: Child theme for Eesti Tervisedenduse Ühing (ETÜ) — built on Twenty Twenty-Five.
Author: ETÜ
Template: twentytwentyfive
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: tervis-child
Tags: block-theme
*/

/* Award year label: keep it from collapsing in flex rows */
.award-year {
	min-width: 2.5rem;
}

/* WP core's .has-border-color incorrectly sets text color to border gray on the container.
   Targeting children directly beats inherited color without needing !important. */
.has-border-color h1,
.has-border-color h2,
.has-border-color h3,
.has-border-color h4,
.has-border-color h5,
.has-border-color h6,
.has-border-color .wp-block-heading,
.has-border-color p:not(.has-text-color) {
	color: var(--wp--preset--color--contrast);
}

/* Hero: force white text and links over the dark red background */
.tervis-hero,
.tervis-hero p,
.tervis-hero h1,
.tervis-hero h2,
.tervis-hero h3,
.tervis-hero .wp-block-post-excerpt,
.tervis-hero .wp-block-post-excerpt p {
	color: #ffffff !important;
}

.tervis-hero a:not(.wp-block-button__link),
.tervis-hero .wp-block-post-title a {
	color: #ffffff !important;
	text-decoration: none;
}

.tervis-hero a:not(.wp-block-button__link):hover,
.tervis-hero .wp-block-post-title a:hover {
	text-decoration: underline;
}

/* Hero button: keep white bg, dark red text */
.tervis-hero .wp-block-button__link {
	background-color: #ffffff !important;
	color: #a50000 !important;
}

.tervis-hero .wp-block-button__link:hover {
	background-color: rgba(255, 255, 255, 0.88) !important;
	color: #a50000 !important;
}

/* Remove flow-layout gap before footer template part */
footer.wp-block-template-part {
	margin-block-start: 0 !important;
}

/* Header nav: vertical padding on each link */
header .wp-block-navigation-item__content {
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
}

/* Footer nav: remove default list padding and bullets */
.footer-nav {
	list-style: none;
	padding-left: 0;
}

.footer-nav li {
	margin-top: 0.5rem;
}

.footer-nav a:hover {
	color: var(--wp--preset--color--primary) !important;
	text-decoration: none;
}

/* ── News cards (horizontal list layout) ────────────────── */

/* Hover: title colour shift is handled by block elements attr.
   Add a subtle background wash on the row. */
.news-card-h {
	transition: background-color 0.15s ease;
}

.news-card-h:hover {
	background-color: #FAF7F4;
}

/* Remove the bottom border from the last card */
.wp-block-post-template > li:last-child .news-card-h {
	border-bottom: none !important;
}

/* Image column: fill its height, no extra space below the img */
.news-card-h__image .wp-block-post-featured-image {
	height: 100%;
}

.news-card-h__image .wp-block-post-featured-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* No-image fallback: red left accent bar */
.news-card-h__image .wp-block-post-featured-image:not(:has(img)) {
	background-color: var(--wp--preset--color--primary-soft);
	border-radius: 6px;
	min-height: 160px;
	position: relative;
}

.news-card-h__image .wp-block-post-featured-image:not(:has(img))::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 4px;
	background-color: var(--wp--preset--color--primary);
	border-radius: 6px 0 0 6px;
}

/* ── Homepage news grid (vertical cards) ────────────────── */

.news-card {
	transition: box-shadow 0.2s ease, transform 0.2s ease;
	overflow: hidden;
	min-width: 0;
	width: 100%;
}

.news-card .wp-block-post-featured-image,
.news-card .wp-block-post-featured-image img {
	width: 100%;
	max-width: 100%;
	display: block;
}

.news-card:hover {
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.09);
	transform: translateY(-2px);
}

/* No-image fallback: coloured top stripe */
.news-card .wp-block-post-featured-image:not(:has(img)) {
	height: 6px;
	background-color: var(--wp--preset--color--primary);
}

/* ── Mobile nav overlay ─────────────────────────────────── */

/*
 * Scope ALL overlay styles to .is-menu-open so nothing bleeds onto desktop.
 * Use position:fixed instead of min-height so the overlay fills the viewport
 * without adding height to any desktop element.
 */

/* Full-screen red sheet */
.wp-block-navigation__responsive-container.is-menu-open {
	position: fixed !important;
	inset: 0 !important;
	z-index: 100000 !important;
	overflow-y: auto !important;
	background-color: #A50000 !important;
}

/* Inner wrappers inherit the red */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	background-color: #A50000 !important;
}

/* Nav list: vertical, left-aligned */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	flex-direction: column !important;
	align-items: flex-start !important;
	justify-content: flex-start !important;
	padding: 1.5rem 2rem !important;
	gap: 0 !important;
}

/* Each item: full width with a subtle divider */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	width: 100% !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
}

/* Link text */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	color: #ffffff !important;
	padding: 1rem 0 !important;
	width: 100% !important;
	font-size: 1.125rem !important;
	letter-spacing: 0.06em !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover {
	color: rgba(255, 255, 255, 0.75) !important;
	text-decoration: none !important;
}

/* Close (×) button */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	color: #ffffff !important;
	padding: 1.25rem 1.5rem !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close svg {
	fill: #ffffff !important;
	stroke: #ffffff !important;
	width: 28px !important;
	height: 28px !important;
}

/* Hamburger button: white against the red header (always visible, no guard needed) */
.wp-block-navigation__responsive-container-open {
	color: #ffffff !important;
}
.wp-block-navigation__responsive-container-open svg {
	fill: #ffffff !important;
	stroke: #ffffff !important;
}

/* ── Mobile ─────────────────────────────────────────────── */
@media (max-width: 599px) {

	/* Hero: hide the decorative image column so text takes full width */
	.tervis-hero .wp-block-columns > .wp-block-column:last-child {
		display: none;
	}

	/* Hero: give the text column more breathing room */
	.tervis-hero .wp-block-columns > .wp-block-column:first-child {
		flex-basis: 100% !important;
	}

	.tervis-hero {
		padding-top: 2.5rem !important;
		padding-bottom: 2.5rem !important;
	}

	/* Award strip: stack year rows tightly on small screens */
	.award-strip-row {
		flex-direction: column !important;
		gap: 0.25rem !important;
	}

	/* Ensure page-header title doesn't overflow */
	.wp-block-post-title {
		font-size: clamp(1.5rem, 6vw, 2.5rem) !important;
		word-break: break-word;
	}
}

@media (max-width: 782px) {
	/* Header: tighten horizontal padding on tablet/mobile */
	header.wp-block-group.alignfull {
		padding-left: 1.25rem !important;
		padding-right: 1.25rem !important;
	}

	/* Footer: tighten padding */
	footer.wp-block-template-part .wp-block-group.alignfull {
		padding-left: 1.25rem !important;
		padding-right: 1.25rem !important;
	}
}