/*
Theme Name: Vikarhuset
Author: Human Senze ApS
Description: Blok-tema til vikarhuset.dk – vikarformidling til det specialiserede socialområde. Bygget på Human Senze-designsystemet (Newsreader + Source Sans 3, petrol/grøn/paper).
Version: 0.1.10
Requires at least: 6.5
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: vikarhuset
*/

/* Finjusteringer ud over theme.json */

.vikar-logo { margin: 0; }
.vikar-logo img { height: 56px; width: auto; }

/* Split-hero: coveret skal fylde kolonnens fulde højde, så de to
   halvdele altid flugter, uanset hvor højt indholdet til højre bliver. */
.vikar-hero-cover {
	height: 100%;
}

.vikar-kicker {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 2.5px;
	text-transform: uppercase;
}

.vikar-label {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
}

.vikar-chip {
	display: inline-block;
	background: #ffffff;
	border: 1px solid #c7d6c9;
	border-radius: 999px;
	padding: 6px 14px;
	font-size: 13.5px;
	font-weight: 600;
	color: #1c4854;
}

.vikar-card {
	background: #f7f5f0;
	border: 1px solid #e4dfd5;
	border-radius: 10px;
}

.vikar-infoboks {
	background: #ffffff;
	border: 1px solid #e4dfd5;
	border-radius: 10px;
}

.vikar-telefonknap a {
	border-radius: 999px !important;
}

/* Header-navigationens links */
.vikar-header a {
	text-decoration: none;
	font-weight: 600;
}

/* Telefonknappens styling ejes af temaet, så blokken er editor-kanonisk */
.vikar-telefonknap .wp-block-button__link {
	font-size: 15px;
	font-weight: 700;
	padding: 11px 20px;
}

/* ---- Mobilmenu (WP's overlay-brudpunkt er 600 px) ---- */

/* Tre streger i burgeren i stedet for WP's to-stregs-ikon */
.wp-block-navigation__responsive-container-open svg {
	display: none;
}
.wp-block-navigation__responsive-container-open {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
}
.wp-block-navigation__responsive-container-open::before {
	content: "";
	display: block;
	width: 26px;
	height: 2px;
	border-radius: 1px;
	background: currentColor;
	box-shadow: 0 -8px 0 currentColor, 0 8px 0 currentColor;
}

@media (max-width: 599px) {
	/* Burgeren yderst i øverste højre hjørne (efter telefonknappen) */
	.vikar-header .wp-block-navigation {
		order: 10;
	}
	.vikar-header .wp-block-group {
		gap: 14px;
	}
	.vikar-logo img {
		height: 44px;
	}

	/* Overlay: mørkt lag med centreret, luftigt indhold.
	   Farverne ejes af blok-attrs (overlayBackgroundColor/overlayTextColor);
	   !important-fallback fordi core-overlayets egne regler ellers vinder. */
	.wp-block-navigation__responsive-container.is-menu-open {
		background-color: #14343d !important;
		color: #ffffff;
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0;
	}
	.wp-block-navigation__responsive-container.is-menu-open ul.wp-block-navigation__container {
		flex-direction: column;
		align-items: center;
		gap: 30px;
	}
	.wp-block-navigation__responsive-container.is-menu-open a.wp-block-navigation-item__content {
		color: #ffffff;
		font-family: Newsreader, Georgia, serif;
		font-size: 27px;
		font-weight: 500;
		text-align: center;
	}
	.wp-block-navigation__responsive-container-close {
		color: #ffffff;
	}
}

@media (max-width: 599px) and (prefers-reduced-motion: no-preference) {
	.wp-block-navigation__responsive-container.is-menu-open {
		animation: vikar-menu-ind 0.28s ease-out;
	}
}
@keyframes vikar-menu-ind {
	from { transform: translateX(100%); }
	to { transform: translateX(0); }
}