/* Salmon Site Specific Styles */

/* Import fonts (Google Fonts: Bodoni Moda + Montserrat, Local: Avenir + Sabon) */
@import url('./fonts.css');

/* Salmon Variables */
:root {
	--salmon-primary: #d63384;
	--salmon-text: #2d1b2d;
	--salmon-meta: #8b5a6b;
	--salmon-bg: #fff8fa;
	--salmon-bullets: #facec6;
	--salmon-navigation: #4c4d55;
	--salmon-general: #003b4c;
}

/* Responsive Events Grid Limits */
.events-grid[data-event-type='responsive-events'] .event-card-wrapper {
	transition: opacity 0.3s ease;
}

.events-grid[data-event-type='responsive-events'] .event-card-wrapper[style*='display: none'] {
	display: none !important;
}

/* Hero Image Error Handling */
.hero-image-wrapper .hero-image {
	opacity: 0;
	transition: opacity 0.3s ease;
}

.hero-image-wrapper .hero-image[src$='default-image.jpg'] {
	background: var(--salmon-bg);
}

/* Base Typography */
.site-salmon body {
	color: var(--salmon-text);
}

.site-salmon .page-content .description {
	color: black;
}

.site-salmon .custom-modules-area .modularity-mod-text h2,
.site-salmon .post-content .post-title,
.site-salmon .content-excerpt,
.site-salmon .post-excerpt {
	font-family: 'Sabon', serif;
}

.site-salmon h1 {
	font-family: 'Avenir', sans-serif;
}

.site-salmon .text-module-content,
.site-salmon .entry-content,
.site-salmon .post-meta,
.site-salmon .no-posts-message,
.site-salmon .home h1.title,
.site-salmon h2.posts-section-title {
	font-family: 'Avenir', sans-serif;
	font-weight: 800;
}

.site-salmon .empty-block {
	display: none;
}

@media (min-width: 1360px) {
	.site-salmon .posts-count-2 .post-card {
		display: flex;
		align-items: stretch;
	}

	.posts-count-2 .post-image,
	.posts-count-2 .post-image-placeholder {
		flex: 0 0 50%;
		height: 100%;
	}
}
.site-salmon .description p {
	margin-top: clamp(1rem, calc(0.86rem + 0.71vw), 1.5rem) !important;
	font-size: clamp(1rem, calc(0.96rem + 0.18vw), 1.13rem);
	line-height: 28px;
}

.site-salmon .description h4 {
	font-size: clamp(1.2rem, calc(1.03rem + 0.86vw), 1.8rem);
	margin-top: clamp(1rem, calc(0.86rem + 0.71vw), 1.5rem) !important;
}

.site-salmon .page-content #post-40 .title,
.site-salmon .page-content #post-40 .description,
.site-salmon .page-content #post-38 .title,
.site-salmon .page-content #post-38 .description {
	text-align: left !important;
}

@media (min-width: 768px) {
	.site-salmon .description p,
	.site-salmon .description h2,
	.site-salmon .description h3,
	.site-salmon .description h4,
	.site-salmon .description ul,
	.site-salmon .page-content #post-40 .title,
	.site-salmon .page-content #post-38 .title {
		width: 96%;
		margin: 0 auto;
		max-width: none !important;
	}
}

.site-salmon .description ul {
	padding-left: 40px;
	margin-top: clamp(1rem, calc(0.86rem + 0.71vw), 1.5rem);
	margin-bottom: clamp(1rem, calc(0.86rem + 0.71vw), 1.5rem);
	list-style: disc;
}

.site-salmon .description em {
	font-style: italic;
}

.site-salmon .description p:first-child {
	width: 100%;
}
/* .site-salmon h1.title,
.site-salmon h2.posts-section-title {
	letter-spacing: -2px;
} */

/* Colors */
.site-salmon .posts-section-title,
.site-salmon .home h1.title,
.site-salmon .module-content h2,
.site-salmon .custom-modules-area .modularity-mod-text h2 {
	color: var(--salmon-general);
}

.site-salmon .posts-section-title {
	font-size: clamp(2rem, calc(1.57rem + 2.14vw), 3.5rem);
	font-size: clamp(1.5rem, calc(0.79rem + 3.57vw), 3rem);
}

.site-salmon .post-title a {
	color: var(--salmon-primary);
}

.site-salmon .content-excerpt {
	color: var(--salmon-text);
}

.site-salmon .post-meta {
	color: var(--salmon-meta);
}

.site-salmon .no-posts-message {
	color: var(--salmon-meta);
}

.logo-placeholder {
	display: none;
}

/* CTA Header Button - Hidden for Salmon */
.site-salmon .cta-header {
	display: none;
}

.site-salmon .cta-kommun-btn {
	background-color: var(--salmon-general);
	color: white;
	border-radius: 4px;
	transition: background-color 0.2s ease;
	text-decoration: none;
}

.site-salmon .cta-kommun-btn:hover {
	background-color: #002a35;
}

.site-salmon .cta-kommun-btn span {
	font-family: 'Montserrat', sans-serif;
}

.site-salmon .cta-kommun-btn img {
	filter: brightness(0) invert(1);
}

/* Header Navigation */
.site-salmon .header-menu {
	list-style: none;
	margin: 0;
	padding: 0;
}

.site-salmon .header-menu li {
	position: relative;
}

.site-salmon .header-menu a {
	color: var(--salmon-navigation);
	text-decoration: none;
	font-weight: 600;
	padding: 8px 0;
	transition: color 0.2s ease;
}
/* Menu Bullets/Separators - Round dots */
.site-salmon .header-menu li:not(:first-child)::before {
	--size: 6px;
	background: var(--salmon-bullets);
	border-radius: 100%;
	content: '';
	display: block;
	height: var(--size);
	width: var(--size);
	position: absolute;
	left: -20px;
	top: 50%;
	transform: translateY(-50%);
}

/* Mobile Navigation */
.site-salmon .mobile-navigation {
	background-color: white;
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
	padding: 1rem;
	min-width: 200px;
}

.site-salmon header {
	margin-top: 0.8rem;
	margin-bottom: 0.5rem;
}

/* Mobile Menu Toggle Button */
.site-salmon .mobile-menu-toggle {
	font-family: 'Montserrat', sans-serif;
}

.site-salmon .mobile-menu-toggle span {
	color: var(--salmon-primary);
}

.site-salmon .mobile-menu-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.site-salmon .mobile-menu-list a {
	display: block;
	padding: 12px 0;
	color: #4c4d55;
	text-decoration: none;
	transition: color 0.2s ease;
}

.site-salmon .mobile-menu-list a:hover {
	color: var(--salmon-text);
}

/* Active Navigation Item - Desktop only (lg+) */
@media (min-width: 1024px) {
	.site-salmon .header-menu .current-menu-item > a,
	.site-salmon .header-menu .current-menu-parent > a,
	.site-salmon .header-menu .current-page-ancestor > a,
	.site-salmon .header-menu .current_page_item > a,
	.site-salmon .header-menu .current_page_parent > a {
		border-bottom: 2px solid #facec6;
		color: #003b4c;
	}

	.site-salmon .header-menu a:hover {
		color: #003b4c;
	}
}

.page-content .description {
	font-family: 'Sabon', serif;
	color: #454545;
	font-size: 18px;
}

.page-content .description a {
	color: #003b4c;
	text-decoration: underline;
}

.page-content .description {
	text-align: center;
}

.page-child .description {
	text-align: left;
}

.page-child .description:after {
	width: 0;
}

.page-id-3 .page-content .description {
	font-size: clamp(1.13rem, calc(1.02rem + 0.54vw), 1.4rem);
}

.post-title .child-post-title,
.post-excerpt .child-post-excerpt {
	font-family: 'Sabon', serif;
	color: black;
}

.post-card .child-post-card {
	background-color: #e0f2fe;
}
.bg-footer {
	background-color: #facec6;
}

.footer-menu a {
	color: #003b4c; /* text-gray-300 */
	text-decoration: none;

	line-height: 1.25rem;
	transition: color 0.2s ease-in-out;
}

.footer-content,
#footer-legal-menu,
.about-link {
	color: #003b4c; /* text-gray-300 */
}

.about-link img {
	filter: invert(15%) sepia(56%) saturate(2463%) hue-rotate(166deg) brightness(94%) contrast(101%);
}

.footer-element {
	border-color: rgba(0, 59, 76, 0.1);
}

/* Menu Shortcuts - Salmon specific colors */
.site-salmon .simple-shortcuts-icon[data-icon='fishing-fish'] {
	background-color: #027b80 !important;
}

.site-salmon .simple-shortcuts-icon[data-icon='fish'] {
	background-color: #3873b9 !important;
}

.site-salmon .simple-shortcuts-icon[data-icon='search-fish'] {
	background-color: #f4a08e !important;
}

.simple-shortcuts-wrapper {
	padding-top: 0;
}

/* Footer Menu Icons - Salmon site */
.site-salmon .footer-menu a::before {
	content: '';
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-right: 8px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	vertical-align: middle;
	flex-shrink: 0;
	filter: brightness(0) saturate(100%) invert(15%) sepia(56%) saturate(2463%) hue-rotate(166deg) brightness(94%)
		contrast(101%);
}

/* Icon mapping based on data-icon attribute */
.site-salmon .footer-menu a[data-icon='calendar']::before {
	background-image: url('../images/calendar.svg') !important;
}

.site-salmon .footer-menu a[data-icon='book-information']::before {
	background-image: url('../images/book-information.svg') !important;
}

.site-salmon .footer-menu a[data-icon='fishing-fish']::before {
	background-image: url('../images/fishing-fish.svg') !important;
}

.site-salmon .footer-menu a[data-icon='fish']::before {
	background-image: url('../images/fish.svg') !important;
}

.site-salmon .footer-menu a[data-icon='search-fish']::before {
	background-image: url('../images/search-fish.svg') !important;
}

.site-salmon .footer-menu a[data-icon='facebook']::before {
	background-image: url('../images/facebook.svg') !important;
}

.site-salmon .footer-menu a[data-icon='instagram']::before {
	background-image: url('../images/instagram.svg') !important;
}

/* Flexbox layout for proper icon alignment */
.site-salmon .footer-menu a {
	display: flex;
	align-items: center;
}

.site-salmon .post-card button.read-more-button {
	background-color: #facec6;
	color: #003b4c;
	font-size: 14px;
}

.site-salmon .posts-teaser-view h3 {
	font-family: 'Avenir', sans-serif !important;
	font-weight: 800;
	color: #003b4c;
}

.site-salmon .title {
	margin-top: clamp(1.5rem, calc(0.93rem + 2.86vw), 3.5rem);
}

.site-salmon .page-content h2 {
	font-family: 'Avenir', sans-serif;
	margin-top: clamp(2rem, calc(1.14rem + 4.29vw), 5rem);
	font-size: clamp(2rem, calc(1.71rem + 1.43vw), 3rem);
	line-height: 120%;
}

.site-salmon .page-content h3 {
	font-family: 'Avenir', sans-serif;
	margin-top: clamp(2rem, calc(1.14rem + 4.29vw), 5rem);
	font-size: clamp(1.5rem, calc(1.21rem + 1.43vw), 2.5rem);
	line-height: 120%;
}

/* ========================================
   Salmon Site - Focus Styles Override
   ======================================== */

.site-salmon {
	--focus-color: #027b80; /* Salmon teal color for focus */
}

/* Skip link with Salmon brand colors */
.site-salmon .skip-link {
	background-color: var(--focus-color);
	color: #fff;
}

.site-salmon .skip-link:focus {
	outline-color: #003b4c;
	background-color: #003b4c;
	color: #fff;
}

/* Navigation focus with Salmon colors */
.site-salmon .header-menu a:focus,
.site-salmon .mobile-menu-list a:focus,
.site-salmon .footer-menu a:focus {
	outline-color: var(--focus-color);
	background-color: rgba(2, 123, 128, 0.1);
}

/* Buttons focus */
.site-salmon button:focus,
.site-salmon .btn:focus {
	outline-color: var(--focus-color);
	box-shadow: 0 0 0 4px rgba(2, 123, 128, 0.2);
}

/* Form inputs focus */
.site-salmon input:focus,
.site-salmon textarea:focus,
.site-salmon select:focus {
	outline-color: var(--focus-color);
	border-color: var(--focus-color);
}

.home.site-salmon h1.title {
	font-weight: 800;
	color: #003b4c;
}

.site-salmon .description {
	font-size: 16px;
	max-width: none !important;
}

.home.site-salmon .page-content .description:after {
	width: 0;
}

.home.site-salmon .posts-teaser-view h3.post-title {
	font-size: clamp(1.4rem, calc(0.71rem + 1.43vw), 2rem);
}

.home.site-salmon .posts-teaser-view .post-excerpt {
	line-height: 24px;
}

.home.site-salmon .posts-grid .post-card h3.post-title {
	font-size: 32px;
}

.home.site-salmon .posts-grid .post-card .post-excerpt {
	font-size: 15px;
}

.site-salmon .description {
	line-height: 1.88;
}

body.site-salmon {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}
body.site-salmon main {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

/* Generic Heading Styles - Standard sizes */
/* Only applies to headings within page-content */
.site-salmon .page-content {
	max-width: 950px;
	margin-left: auto;
	margin-right: auto;
}

.site-salmon .page-content h1,
.site-salmon .page-content h2,
.site-salmon .page-content h3 {
	font-family: 'BodoniStd', serif;
	color: #000000;
	font-weight: 400;
	line-height: 1.2;
	margin-bottom: 0;
}

.site-salmon .page-content h1 {
	font-size: 2.5rem; /* 40px */
	margin-top: 2em;
}

@media (min-width: 1024px) {
	.site-salmon .page-content h1 {
		font-size: 3.5rem; /* 56px */
	}
}

.site-salmon .page-content h2 {
	font-size: 2rem; /* 32px */
	margin-top: 3.5em;
}

.site-salmon .page-content h3 {
	font-size: 1.5rem; /* 24px */
	margin-top: 3.5em;
}

/* List styles within page-content (excluding shortcuts nav) */
.site-salmon .page-content .normal ul,
.site-salmon .page-content .normal ol {
	margin: 1.5em 0;
	padding-left: 2em;
	line-height: 1.8;
}

.site-salmon .page-content .normal li,
.site-salmon .page-content .normal li {
	margin-bottom: 0.5em;
	font-family: 'Montserrat', sans-serif;
}

.site-salmon .page-content .normal ul {
	list-style-type: disc;
}

.site-salmon .page-content .normal ol {
	list-style-type: decimal;
}

/* Paragraph spacing - paragraph after paragraph */
.site-salmon .page-content p + p {
	margin-top: 1.5em;
}

/* Content after the "more" marker - tighter width and smaller font on laptop */
@media (min-width: 1024px) {
	.site-salmon .page-content :has([id^="more-"]) ~ p {
		max-width: 85%;
		font-size: 0.95rem;
		margin-left: auto;
		margin-right: auto;
	}
	.site-salmon .page-content :has([id^="more-"]),
	.site-salmon .page-content :has([id^="more-"]) ~ h2,
	.site-salmon .page-content :has([id^="more-"]) ~ h3,
	.site-salmon .page-content :has([id^="more-"]) ~ ol,
	.site-salmon .page-content :has([id^="more-"]) ~ ul {
		max-width: 85%;
		margin-left: auto;
		margin-right: auto;
	}
}

/* Responsive heading sizes */
@media (max-width: 768px) {
	.site-salmon .page-content h1 {
		font-size: 2rem; /* 32px */
		margin-top: 5em;
	}
	
	/* Reset h1 margin when page has a hero section */
	.site-salmon:has(.hero-section) .page-content h1 {
		margin-top: 0.5em;
	}
	
	.site-salmon .page-content h2 {
		font-size: 1.875rem; /* 30px */
	}
	
	.site-salmon .page-content h3 {
		font-size: 1.375rem; /* 22px */
	}
}

/* =============================================
   SALMON HEADER LAYOUT
   Exact same pattern as Falkenberg
   ============================================= */

/* Logo z-index */
.site-salmon .header-logo {
	z-index: 100;
}

.site-salmon .header-logo-img {
	z-index: 100;
}

/* Logo: absolute position, pinned top-left — aligned to layout padding */
.site-salmon .header-logo {
	position: absolute;
	left: var(--layout-padding, 1rem);
	top: 0;
}

/* Empty block hidden */
.site-salmon .header-wrapper > .empty-block {
	display: none !important;
}

/* Logo image: bigger than Falkenberg defaults */
.site-salmon .header-logo-img.header-logo-img {
	width: 150px;
}

@media screen and (min-width: 640px) {
	.site-salmon .header-logo {
		position: absolute;
		left: var(--layout-padding, 1.5rem);
		top: 0;
	}
	.site-salmon .header-logo-img.header-logo-img {
		width: 190px;
	}
}

@media screen and (min-width: 1024px) {
	.site-salmon .header-logo-img.header-logo-img {
		width: 230px;
	}
	/* Push nav away from the absolute-positioned logo and center items */
	.site-salmon .header-navigation {
		margin-left: 250px;
	}
}

/* =============================================
   SALMON MOBILE MENU - Always visible hamburger
   ============================================= */

/* Show hamburger on all screen sizes for salmon */
.site-salmon .mobile-menu-toggle {
	display: flex !important;
}

/* On desktop for salmon, show BOTH hamburger and inline nav */