/*
Theme Name: Gutentools News Child
Theme URI: 
Description: Child theme for Gutentools News with custom color palette matching Signal Medical Solutions branding.
Author: 
Author URI: 
Template: gutentools-news
Version: 1.0.0
Text Domain: gutentools-news-child
*/

/* ==========================================================================
   GLOBAL BACKGROUND COLOR - #fafafa for page backgrounds only
   ========================================================================== */
html,
body,
.wp-site-blocks,
.frettir-posts-page,
.allar-frettir-page,
.single-post-page,
.category-archive-page {
	background-color: #fafafa !important;
}

/* Elements that should have WHITE background (not #fafafa) */
#sticky-header,
#sticky-header .wp-block-group,
header.wp-block-template-part .wp-block-group,
.single-post-meta,
.single-post-meta .wp-block-group,
.sidebar-posts-list,
.sidebar-posts-list .wp-block-group,
.sidebar-post-item,
.sidebar-post-item .wp-block-group,
.category-post-content,
.category-post-content .wp-block-group,
.af-post-card,
.af-taskbar {
	background-color: #ffffff !important;
}

/* ==========================================================================
   STICKY FOOTER - Always at bottom of viewport
   ========================================================================== */
html, body {
	height: 100%;
}

body {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

/* Main content area grows to push footer down */
body > main,
body > .wp-block-group[tagName="main"],
.wp-site-blocks > main,
.wp-site-blocks {
	flex: 1 0 auto;
}

/* Footer stays at bottom */
body > footer,
body > .wp-block-template-part[aria-label*="footer"],
footer.wp-block-template-part,
.wp-site-blocks > footer {
	flex-shrink: 0;
	margin-top: auto;
}

/* Ensure wp-site-blocks uses flexbox layout */
.wp-site-blocks {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

/* ==========================================================================
   STICKY HEADER - MOBILE/TABLET (under 1024px)
   Uses position: fixed as fallback since sticky can fail in block themes
   ========================================================================== */
@media (max-width: 1024px) {
	/* Make the header fixed on mobile/tablet */
	#sticky-header {
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		width: 100% !important;
		z-index: 9999 !important;
		background-color: #ffffff !important;
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
	}
	
	/* Hide the sticky-wrapper placeholder on mobile - it creates empty space */
	#sticky-header-sticky-wrapper.sticky-wrapper {
		height: auto !important;
		background: transparent !important;
	}
	
	/* Add padding to body to account for fixed header height */
	body {
		padding-top: 70px !important;
	}
	
	/* Hide top bar on mobile to save space */
	.wp-block-group[style*="background-color:#030c26"],
	.wp-block-group[style*="background-color: #030c26"] {
		display: none !important;
	}
}

/* ==========================================================================
   COLOR-ONLY OVERRIDES FOR LIGHT MODE
   Colors sourced from https://www.signalmedicalsolutions.com
   Accent color: #6eb7cc (logo color)
   ========================================================================== */

/* ----- Global Icon Colors ----- */
/* Calendar and User icons site-wide should be #6EB7CC */
.single-post-meta svg,
.wp-block-post-author svg,
.wp-block-post-date svg,
svg[aria-label="Author"],
svg[aria-label="Date"],
svg[aria-label="Calendar"] {
	stroke: #6EB7CC !important;
}

/* Hide any duplicate icons from wp-block-post-date (only show our custom SVG) */
.single-post-meta .wp-block-post-date svg,
.single-post-meta .wp-block-post-date::before {
	display: none !important;
}

/* ----- Global Background & Text Colors ----- */
body {
	background-color: #fafafa !important;
	color: #0f172a !important;
}

/* ----- Header Top Bar (override inline #030c26) ----- */
.wp-block-group[style*="background-color:#030c26"],
.wp-block-group[style*="background-color: #030c26"] {
	background-color: #f1f5f9 !important;
}

/* ----- Header Main (override inline #252425) ----- */
header#sticky-header,
header.wp-block-group[style*="background-color:#252425"],
header.wp-block-group[style*="background-color: #252425"],
.wp-block-group[style*="background-color:#252425"],
.wp-block-group[style*="background-color: #252425"] {
	background-color: #ffffff !important;
}

/* ----- Navigation Colors (Desktop) ----- */
@media (min-width: 781px) {
	.wp-block-navigation a {
		color: #334155 !important;
	}

	.wp-block-navigation a:hover,
	.wp-block-navigation-item.current-menu-item a {
		color: #6eb7cc !important;
	}

	.wp-block-navigation a::after {
		background: #6eb7cc !important;
	}

	/* Dropdown menu */
	.wp-block-navigation__submenu-container {
		background: #ffffff !important;
		box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1) !important;
	}

	.wp-block-navigation__submenu-container a {
		color: #334155 !important;
	}

	.wp-block-navigation__submenu-container a:hover {
		color: #6eb7cc !important;
		background: rgba(110, 183, 204, 0.08) !important;
	}
}

/* ----- Navigation Colors (Mobile & Tablet) ----- */
@media (max-width: 1024px) {
	.wp-block-navigation__responsive-container {
		background: #ffffff !important;
	}

	.wp-block-navigation a {
		color: #334155 !important;
		border-bottom: 1px solid #e2e8f0 !important;
	}

	.wp-block-navigation a:hover {
		color: #6eb7cc !important;
	}

	.wp-block-navigation__submenu-container {
		border-left: 2px solid #e2e8f0 !important;
	}

	.wp-block-navigation__submenu-container a {
		color: #475569 !important;
	}

	/* Hamburger buttons - no background, black icon */
	.wp-block-navigation__responsive-container-open,
	.wp-block-navigation__responsive-container-close {
		background: transparent !important;
		color: #000000 !important;
	}

	/* FORCE hamburger to show at 1024px - override WordPress 600px default */
	.wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex !important;
	}
	
	/* Hide the regular nav container below 1024px */
	.wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none !important;
	}

	/* Mobile/Tablet header layout: left group (nav+search), centered logo, right button */
	#sticky-header > .wp-block-group {
		display: grid !important;
		grid-template-columns: 1fr auto 1fr !important;
		align-items: center !important;
		width: 100% !important;
		gap: 12px !important;
		position: relative !important;
	}

	/* Left side: Navigation (hamburger) - move search here too */
	#sticky-header > .wp-block-group > .wp-block-navigation {
		order: 1 !important;
		justify-self: start !important;
		grid-column: 1 !important;
		display: flex !important;
		flex-direction: row !important;
		align-items: center !important;
		gap: 8px !important;
	}

	/* Site title/logo - perfectly centered with absolute positioning */
	#sticky-header > .wp-block-group > .wp-block-group:first-child {
		order: 2 !important;
		grid-column: 2 !important;
		position: static !important;
		justify-self: center !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	/* Right side: Button only */
	#sticky-header > .wp-block-group > .wp-block-group:last-child {
		order: 3 !important;
		justify-self: end !important;
		grid-column: 3 !important;
		display: flex !important;
		flex-direction: row !important;
		align-items: center !important;
		gap: 8px !important;
	}

	/* Move search from right group to left, next to hamburger */
	#sticky-header > .wp-block-group > .wp-block-group:last-child .wp-block-search {
		position: absolute !important;
		left: 44px !important;
		top: 50% !important;
		transform: translateY(-50%) !important;
	}
	
	#sticky-header .wp-block-search__button {
		height: 24px !important;
		width: 24px !important;
		min-height: 24px !important;
		max-height: 24px !important;
		padding: 0 !important;
		background: transparent !important;
	}

	/* Header button - 30px height with arrow */
	.header-btn,
	.header-btn .wp-block-button__link,
	#sticky-header .header-btn,
	#sticky-header .header-btn .wp-block-button__link {
		height: 30px !important;
		min-height: 30px !important;
		max-height: 30px !important;
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		box-sizing: border-box !important;
		white-space: nowrap !important;
	}
	
	.header-btn .wp-block-button__link {
		padding-left: 12px !important;
		padding-right: 12px !important;
		font-size: 12px !important;
		line-height: 30px !important;
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
	}
	
	.header-btn .wp-block-button__link::after {
		content: "↗" !important;
		margin-left: 5px !important;
		font-size: 14px !important;
		font-weight: 700 !important;
	}
}

/* ----- Header Button Arrow (All Devices) ----- */
.header-btn .wp-block-button__link::after {
	content: "↗" !important;
	margin-left: 5px !important;
	font-size: 16px !important;
	font-weight: 700 !important;
}

/* ----- Logo Centering (All Devices) ----- */
#sticky-header > .wp-block-group {
	position: relative !important;
}

/* ----- Header & Sticky Header ----- */
.sticky-wrapper.is-sticky header {
	background-color: #ffffff !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), 0 6px 16px rgba(0, 0, 0, 0.04) !important;
}

#sticky-header {
	background-color: #ffffff !important;
}

/* ----- Buttons ----- */
.wp-element-button,
.wp-block-button__link,
a.wp-block-post-excerpt__more-link {
	background-color: #6eb7cc !important;
	color: #ffffff !important;
}

.wp-element-button:hover,
.wp-block-button__link:hover,
a.wp-block-post-excerpt__more-link:hover {
	background-color: #5a9fb0 !important;
	color: #ffffff !important;
}

/* ----- Pagination ----- */
.page-numbers {
	background: #6eb7cc !important;
	color: #ffffff !important;
}

.page-numbers:hover {
	background: #5a9fb0 !important;
	color: #ffffff !important;
}

.page-numbers.dots {
	background-color: transparent !important;
	color: #475569 !important;
}

/* ----- Tag Cloud & Taxonomy ----- */
.tag-cloud-link,
.taxonomy-post_tag a {
	background: #6eb7cc !important;
	color: #ffffff !important;
}

.tag-cloud-link:hover,
.taxonomy-post_tag a:hover {
	background: #5a9fb0 !important;
	color: #ffffff !important;
}

/* ----- Scroll to Top ----- */
.gutentools-news-scroll-top::before {
	background: #6eb7cc !important;
	color: #ffffff !important;
}

@media screen and (max-width: 600px) {
	.gutentools-news-scroll-top::before {
		background: transparent !important;
		color: #6eb7cc !important;
	}
}

/* ----- Category Taxonomy Colors - REMOVED ----- */
/* Old nth-child coloring removed. New system uses persistent PHP mapping. */

/* ----- Links ----- */
a {
	color: #6eb7cc;
}

a:hover {
	color: #5a9fb0;
}

/* ----- Archive & Category Lists ----- */
.wp-block-archives-list.wp-block-archives li::before,
.wp-block-categories-list.wp-block-categories li::before {
	color: #6eb7cc !important;
}

/* ----- Footer ----- */
footer.wp-block-template-part,
footer .wp-block-group.has-secondary-background-color,
footer .has-secondary-background-color {
	background-color: #0f172a !important;
	color: #e2e8f0 !important;
}

footer .has-base-2-background-color {
	background-color: #0f172a !important;
}

footer .has-contrast-color,
footer p,
footer a {
	color: #e2e8f0 !important;
}

footer a:hover {
	color: #6eb7cc !important;
}

footer .wp-block-social-links .wp-social-link svg {
	fill: #e2e8f0;
}

/* ----- Site Title & Header Text (visible on light bg) ----- */
.wp-block-site-title,
.wp-block-site-title a,
header .wp-block-site-title a {
	color: #0f172a !important;
}

header .has-small-font-size,
header p {
	color: #475569 !important;
}

header .wp-block-social-links .wp-social-link svg {
	fill: #475569;
}

/* ----- Post Meta Icons ----- */
.wp-block-post-author__name::before,
.wp-block-post-date time::before,
.wp-block-read-more-is-layout-flow::after,
a.wp-block-post-author-name__link:before {
	color: #6eb7cc !important;
}

/* ----- Product Block Shadow (Light) ----- */
.products-block-post-template li {
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05), 0 16px 48px rgba(0, 0, 0, 0.06) !important;
}

/* ----- Has Background Image Circle ----- */
.has-bg-image {
	background: #ffffff !important;
}

/* ----- Form Focus States ----- */
input:focus,
textarea:focus,
select:focus {
	border-color: #6eb7cc !important;
	outline-color: #6eb7cc !important;
}

/* ----- General Surface & Card Backgrounds ----- */
/* Removed empty ruleset - blocks inherit from body */

/* ----- Ensure text readability on light backgrounds ----- */
h1, h2, h3, h4, h5, h6 {
	color: #0f172a;
}

p {
	color: #475569;
}

/* ----- Border Colors ----- */
hr {
	border-color: #e2e8f0 !important;
}

/* ----- Search Button in Header ----- */
header .wp-block-search__button svg {
	fill: #334155;
}

header .wp-block-search__button:hover svg {
	fill: #6eb7cc;
}

/* ==========================================================================
   ISSUE 1 FIX: Dark Background Sections → Light Mode
   Override hardcoded dark backgrounds in patterns for readability
   ========================================================================== */

/* ----- Trending News & What's New Sections (override #252425 background) ----- */
.wp-block-group.r-spacing.r-pad[style*="background-color:#252425"],
.r-spacing.r-pad[style*="background-color:#252425"] {
	background-color: #f8fafc !important;
}

/* Text colors for these sections */
.wp-block-group.r-spacing.r-pad[style*="background-color:#252425"] h2,
.wp-block-group.r-spacing.r-pad[style*="background-color:#252425"] h3,
.wp-block-group.r-spacing.r-pad[style*="background-color:#252425"] h4,
.r-spacing.r-pad[style*="background-color:#252425"] h2,
.r-spacing.r-pad[style*="background-color:#252425"] h3,
.r-spacing.r-pad[style*="background-color:#252425"] h4 {
	color: #0f172a !important;
}

.wp-block-group.r-spacing.r-pad[style*="background-color:#252425"] p,
.wp-block-group.r-spacing.r-pad[style*="background-color:#252425"] a,
.wp-block-group.r-spacing.r-pad[style*="background-color:#252425"] .wp-block-post-title a,
.wp-block-group.r-spacing.r-pad[style*="background-color:#252425"] .wp-block-post-author-name,
.wp-block-group.r-spacing.r-pad[style*="background-color:#252425"] .wp-block-post-date,
.r-spacing.r-pad[style*="background-color:#252425"] p,
.r-spacing.r-pad[style*="background-color:#252425"] a,
.r-spacing.r-pad[style*="background-color:#252425"] .wp-block-post-title a,
.r-spacing.r-pad[style*="background-color:#252425"] .wp-block-post-author-name,
.r-spacing.r-pad[style*="background-color:#252425"] .wp-block-post-date {
	color: #475569 !important;
}

.wp-block-group.r-spacing.r-pad[style*="background-color:#252425"] .wp-block-post-title a:hover,
.r-spacing.r-pad[style*="background-color:#252425"] .wp-block-post-title a:hover {
	color: #6eb7cc !important;
}

/* ----- Featured Posts Section (override #101011 dark card background) ----- */
.wp-block-column[style*="background-color:#101011"],
.has-background[style*="background-color:#101011"] {
	background-color: #f1f5f9 !important;
}

.wp-block-column[style*="background-color:#101011"] h4,
.wp-block-column[style*="background-color:#101011"] .wp-block-post-title a,
.has-background[style*="background-color:#101011"] h4,
.has-background[style*="background-color:#101011"] .wp-block-post-title a {
	color: #0f172a !important;
}

.wp-block-column[style*="background-color:#101011"] p,
.wp-block-column[style*="background-color:#101011"] .wp-block-post-author-name,
.wp-block-column[style*="background-color:#101011"] .wp-block-post-date,
.wp-block-column[style*="background-color:#101011"] .wp-block-post-excerpt,
.has-background[style*="background-color:#101011"] p,
.has-background[style*="background-color:#101011"] .wp-block-post-author-name,
.has-background[style*="background-color:#101011"] .wp-block-post-date,
.has-background[style*="background-color:#101011"] .wp-block-post-excerpt {
	color: #475569 !important;
}

.wp-block-column[style*="background-color:#101011"] .wp-block-post-title a:hover,
.has-background[style*="background-color:#101011"] .wp-block-post-title a:hover {
	color: #6eb7cc !important;
}

/* Featured Posts right column specific */
.featured-posts-right {
	background-color: #f1f5f9 !important;
}

.featured-posts-right h4,
.featured-posts-right .wp-block-post-title a {
	color: #0f172a !important;
}

.featured-posts-right p,
.featured-posts-right .wp-block-post-author-name,
.featured-posts-right .wp-block-post-date,
.featured-posts-right .wp-block-post-excerpt {
	color: #475569 !important;
}

/* ==========================================================================
   FIX #1: NEWS BANNER DATE TEXT COLOR
   
   The .wp-block-post-date inside cover blocks with dark gradient overlays
   must be white for readability. Using high specificity to override parent.
   ========================================================================== */

/* Target dates inside cover blocks (News Banner pattern) */
.wp-block-cover .wp-block-post-date,
.wp-block-cover .wp-block-post-date.has-white-color,
.wp-block-cover .wp-block-post-date time,
.wp-block-cover .has-white-color,
.r-spacing .wp-block-cover .wp-block-post-date,
.r-spacing .wp-block-cover .wp-block-post-date.has-white-color,
.r-spacing .wp-block-cover .wp-block-post-date time,
.hoverImageWrapper .wp-block-post-date,
.hoverImageWrapper .wp-block-post-date time,
.r-cover .wp-block-post-date,
.r-cover .wp-block-post-date time {
	color: #ffffff !important;
}

/* Also ensure the Font Awesome icon inherits white color */
.wp-block-cover .wp-block-post-date time::before,
.r-spacing .wp-block-cover .wp-block-post-date time::before,
.hoverImageWrapper .wp-block-post-date time::before,
.r-cover .wp-block-post-date time::before {
	color: #ffffff !important;
}

/* ==========================================================================
   FIX #2: NEWS BANNER MARGIN OVERRIDE
   
   Reduce top/bottom margin from 80px to 20px for the News Banner pattern.
   Uses !important to override inline styles set by Gutenberg.
   ========================================================================== */
.wp-block-group.r-spacing > .wp-block-columns:first-child {
	/* Target the News Banner pattern wrapper */
}
.wp-block-group.r-spacing[style*="margin-top:40px"][style*="margin-bottom:80px"] {
	margin-top: 20px !important;
	margin-bottom: 20px !important;
}

/* News Banner Heading Style */
.news-banner-heading {
	color: #0f172a !important;
	letter-spacing: -0.025em;
	margin-top: 0 !important;
}

/* ==========================================================================
   FIX #3: NEWS BANNER STACKING AT 1024px
   
   Stack the News Banner columns when width is under 1024px.
   ========================================================================== */
@media (max-width: 1024px) {
	/* Stack main News Banner columns */
	.wp-block-group.r-spacing > .wp-block-columns {
		flex-direction: column !important;
	}
	
	.wp-block-group.r-spacing > .wp-block-columns > .wp-block-column {
		flex-basis: 100% !important;
		width: 100% !important;
	}
	
	/* Also stack nested columns inside the banner */
	.wp-block-group.r-spacing .wp-block-columns .wp-block-columns {
		flex-direction: column !important;
	}
	
	.wp-block-group.r-spacing .wp-block-columns .wp-block-columns > .wp-block-column {
		flex-basis: 100% !important;
		width: 100% !important;
	}
	
	/* Adjust the main banner cover height on mobile */
	.wp-block-group.r-spacing .wp-block-cover[style*="min-height:550px"] {
		min-height: 350px !important;
	}
}

/* ----- Social links in light sections ----- */
.r-spacing.r-pad[style*="background-color:#252425"] .wp-block-social-links .wp-social-link,
.wp-block-group.r-spacing.r-pad[style*="background-color:#252425"] .wp-block-social-links .wp-social-link {
	background-color: #6eb7cc !important;
}

.r-spacing.r-pad[style*="background-color:#252425"] .wp-block-social-links .wp-social-link svg,
.wp-block-group.r-spacing.r-pad[style*="background-color:#252425"] .wp-block-social-links .wp-social-link svg {
	fill: #ffffff;
}

/* ==========================================================================
   CATEGORY PILL COLOR SYSTEM
   
   10 distinct colors, persistent mapping via PHP + wp_options.
   - Excludes brand accent #6EB7CC (reserved for brand use only)
   - All colors pass WCAG AA contrast with white text
   - Border radius increased from 3px → 8px
   ========================================================================== */

/* Base category pill styling */
.taxonomy-category a,
.wp-block-post-terms a {
	display: inline-block;
	padding: 3px 12px 1px;
	border-radius: 8px;  /* Increased from 3px */
	font-size: 14px;
	font-weight: 700;    /* Bold for better readability */
	margin-top: 5px;
	margin-right: 10px;
	text-decoration: none;
	transition: opacity 0.2s ease;
	color: #ffffff !important;
}

.taxonomy-category a:hover,
.wp-block-post-terms a:hover {
	opacity: 0.85;
}

/* Reset parent theme's taxonomy color classes - set to transparent so cat-pill-X takes over */
.taxonomy-category.blue-taxonomy a,
.taxonomy-category.red-taxonomy a,
.taxonomy-category.yellow-taxonomy a,
.home .all-taxonomy li:nth-child(3n + 1) .taxonomy-category a,
.home .all-taxonomy li:nth-child(3n + 2) .taxonomy-category a,
.home .all-taxonomy li:nth-child(3n + 3) .taxonomy-category a {
	background-color: transparent;
}

/* ==========================================================================
   10 PILL COLOR CLASSES
   Applied by PHP via gutentools_news_child_get_category_color_class()
   ========================================================================== */

/* 1. Red #E63946 */
.cat-pill-1,
a.cat-pill-1,
.taxonomy-category a.cat-pill-1,
div.wp-block-post-terms a.cat-pill-1 {
	background-color: #E63946 !important;
	color: #ffffff !important;
	font-weight: 700 !important;
	border-radius: 8px !important;
}

/* 2. Orange #F77F00 */
.cat-pill-2,
a.cat-pill-2,
.taxonomy-category a.cat-pill-2,
div.wp-block-post-terms a.cat-pill-2 {
	background-color: #F77F00 !important;
	color: #ffffff !important;
	font-weight: 700 !important;
	border-radius: 8px !important;
}

/* 3. Green #2A9D8F */
.cat-pill-3,
a.cat-pill-3,
.taxonomy-category a.cat-pill-3,
div.wp-block-post-terms a.cat-pill-3 {
	background-color: #2A9D8F !important;
	color: #ffffff !important;
	font-weight: 700 !important;
	border-radius: 8px !important;
}

/* 4. Blue #1D3557 */
.cat-pill-4,
a.cat-pill-4,
.taxonomy-category a.cat-pill-4,
div.wp-block-post-terms a.cat-pill-4 {
	background-color: #1D3557 !important;
	color: #ffffff !important;
	font-weight: 700 !important;
	border-radius: 8px !important;
}

/* 5. Purple #6A4C93 */
.cat-pill-5,
a.cat-pill-5,
.taxonomy-category a.cat-pill-5,
div.wp-block-post-terms a.cat-pill-5 {
	background-color: #6A4C93 !important;
	color: #ffffff !important;
	font-weight: 700 !important;
	border-radius: 8px !important;
}

/* 6. Pink #E91E63 */
.cat-pill-6,
a.cat-pill-6,
.taxonomy-category a.cat-pill-6,
div.wp-block-post-terms a.cat-pill-6 {
	background-color: #E91E63 !important;
	color: #ffffff !important;
	font-weight: 700 !important;
	border-radius: 8px !important;
}

/* 7. Teal #00A0B0 (darkened from #00B4D8 for contrast) */
.cat-pill-7,
a.cat-pill-7,
.taxonomy-category a.cat-pill-7,
div.wp-block-post-terms a.cat-pill-7 {
	background-color: #00A0B0 !important;
	color: #ffffff !important;
	font-weight: 700 !important;
	border-radius: 8px !important;
}

/* 8. Indigo #3F37C9 */
.cat-pill-8,
a.cat-pill-8,
.taxonomy-category a.cat-pill-8,
div.wp-block-post-terms a.cat-pill-8 {
	background-color: #3F37C9 !important;
	color: #ffffff !important;
	font-weight: 700 !important;
	border-radius: 8px !important;
}

/* 9. Crimson #C1121F */
.cat-pill-9,
a.cat-pill-9,
.taxonomy-category a.cat-pill-9,
div.wp-block-post-terms a.cat-pill-9 {
	background-color: #C1121F !important;
	color: #ffffff !important;
	font-weight: 700 !important;
	border-radius: 8px !important;
}

/* 10. Yellow #B8860B (darkened from #FFD60A for contrast) */
.cat-pill-10,
a.cat-pill-10,
.taxonomy-category a.cat-pill-10,
div.wp-block-post-terms a.cat-pill-10 {
	background-color: #B8860B !important;
	color: #ffffff !important;
	font-weight: 700 !important;
	border-radius: 8px !important;
}

/* Category pills inside cover blocks (banner patterns) */
.wp-block-cover .taxonomy-category a,
.wp-block-cover .wp-block-post-terms a {
	text-shadow: none;
	border-radius: 8px !important;
	font-weight: 700 !important;
}
/* ==========================================================================
   ISSUE 1 FIX (Continued): Text Readability Across All Sections
   Comprehensive fixes for all patterns and templates
   ========================================================================== */

/* ----- Featured Blogs Pattern - Light Background ----- */
/* This pattern has no explicit bg, inherits white. Ensure dark text. */
.r-spacing .wp-block-post-date,
.r-spacing .wp-block-post-title a {
	color: #0f172a !important;
}

.r-spacing .wp-block-post-title a:hover {
	color: #6eb7cc !important;
}

/* ----- Cover blocks with dark gradient overlay - keep text white ----- */
.wp-block-cover .wp-block-cover__inner-container .wp-block-post-title a,
.wp-block-cover .wp-block-cover__inner-container h1,
.wp-block-cover .wp-block-cover__inner-container h2,
.wp-block-cover .wp-block-cover__inner-container h3,
.wp-block-cover .wp-block-cover__inner-container h4 {
	color: #ffffff !important;
}

.wp-block-cover .wp-block-cover__inner-container .wp-block-post-date,
.wp-block-cover .wp-block-cover__inner-container .wp-block-post-author-name,
.wp-block-cover .wp-block-cover__inner-container p,
.wp-block-cover .wp-block-cover__inner-container a.wp-block-post-author-name__link {
	color: rgba(255, 255, 255, 0.9) !important;
}

.wp-block-cover .wp-block-cover__inner-container .wp-block-post-title a:hover {
	color: #6eb7cc !important;
}

/* ----- Light sections: ensure date text is readable ----- */
.r-spacing:not(.r-pad) .wp-block-post-date {
	color: #64748b !important;
}

/* ----- Override parent theme's white text on dark sections that we converted ----- */
/* When we override #252425 → #f8fafc, text needs to change from white to dark */
[style*="background-color:#252425"] .has-white-color,
[style*="background-color:#252425"] .wp-block-post-date.has-white-color,
[style*="background-color:#252425"] .wp-block-post-author-name {
	color: #475569 !important;
}

/* BUT: Inside cover blocks, keep white text (they have dark overlays) */
.wp-block-cover [style*="background-color:#252425"] .has-white-color,
.wp-block-cover .has-white-color {
	color: #ffffff !important;
}

/* ----- All pattern headings on light bg ----- */
.r-spacing > .wp-block-group > .wp-block-heading,
.r-spacing h2.wp-block-heading,
.r-spacing h3.wp-block-heading {
	color: #0f172a !important;
}

/* ----- Latest Posts sidebar text ----- */
.all-taxonomy .wp-block-post-title a,
.all-taxonomy .wp-block-post-date,
.all-taxonomy .wp-block-post-author-name,
.all-taxonomy a.wp-block-post-author-name__link {
	color: #475569 !important;
}

.all-taxonomy .wp-block-post-title a:hover {
	color: #6eb7cc !important;
}

/* ==========================================================================
   ALLAR FRÉTTIR PAGE STYLES (Native Gutenberg Blocks)
   Page with all posts, sorting tabs, category filter, and search
   ========================================================================== */

/* Fix header wrapper having white background on Allar Fréttir page */
.allar-frettir-page header.wp-block-template-part,
.allar-frettir-page .sticky-wrapper {
	background: transparent !important;
}

/* Remove any gap between header and main content */
.allar-frettir-page {
	margin-top: 0 !important;
	padding-top: 0 !important;
}

/* ----- Page Container ----- */
.allar-frettir-page,
.allar-frettir-page.has-secondary-bg-background-color,
.allar-frettir-page.has-background {
	background-color: #fafafa !important;
}

/* ----- Header Section: Logo + Title ----- */
.allar-frettir-page .af-page-header {
	text-align: center;
	padding: 40px 20px 30px;
	background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
}

.allar-frettir-page .af-page-header .wp-block-image {
	margin: 0 auto 15px !important;
}

.allar-frettir-page .af-page-header .wp-block-image img {
	max-width: 60px !important;
	height: auto !important;
}

.allar-frettir-page .af-page-header h1 {
	font-size: 2.5rem;
	font-weight: 700;
	color: #0f172a;
	margin: 0;
	letter-spacing: -0.025em;
}

/* ----- Full-Width Header Taskbar ----- */
.allar-frettir-page .af-taskbar {
	position: sticky;
	top: 0;
	z-index: 100;
	background-color: #ffffff;
	padding: 15px 0;
	margin-top: 0 !important;
	width: 100vw;
	margin-left: calc(-50vw + 50%);
	margin-right: calc(-50vw + 50%);
	box-sizing: border-box;
}

/* Subtle blurry separator line between header and taskbar */
.allar-frettir-page .af-taskbar::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(
		90deg,
		transparent 0%,
		rgba(0, 0, 0, 0.08) 20%,
		rgba(0, 0, 0, 0.1) 50%,
		rgba(0, 0, 0, 0.08) 80%,
		transparent 100%
	);
	filter: blur(0.5px);
	box-shadow: 0 0 3px rgba(0, 0, 0, 0.03);
}

.allar-frettir-page .af-taskbar > .wp-block-group__inner-container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
	align-items: center;
	justify-content: space-between;
}

/* ----- Sorting Tabs (Buttons Block) ----- */
.allar-frettir-page .af-sort-tabs {
	display: flex !important;
	background-color: #f1f5f9;
	border-radius: 8px;
	padding: 4px;
	gap: 0 !important;
}

.allar-frettir-page .af-sort-tabs .wp-block-button {
	margin: 0 !important;
}

.allar-frettir-page .af-sort-tabs .wp-block-button__link {
	padding: 8px 16px !important;
	border: none !important;
	background: transparent !important;
	color: #64748b !important;
	font-size: 0.875rem !important;
	font-weight: 500 !important;
	border-radius: 6px !important;
	transition: all 0.2s ease !important;
	text-decoration: none !important;
}

.allar-frettir-page .af-sort-tabs .wp-block-button__link:hover {
	color: #0f172a !important;
}

.allar-frettir-page .af-sort-tabs .wp-block-button.is-style-fill .wp-block-button__link,
.allar-frettir-page .af-sort-tabs .af-sort-active .wp-block-button__link {
	background-color: #ffffff !important;
	color: #0f172a !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

/* ----- Category Filter (Buttons or Categories List) ----- */
.allar-frettir-page .af-category-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
}

.allar-frettir-page .af-category-filter .wp-block-button {
	margin: 0 !important;
}

.allar-frettir-page .af-category-filter .wp-block-button__link {
	padding: 8px 14px !important;
	border: 1px solid #e2e8f0 !important;
	background: #ffffff !important;
	color: #334155 !important;
	font-size: 0.8125rem !important;
	font-weight: 500 !important;
	border-radius: 20px !important;
	transition: all 0.2s ease !important;
	text-decoration: none !important;
}

.allar-frettir-page .af-category-filter .wp-block-button__link:hover {
	border-color: #6eb7cc !important;
	color: #6eb7cc !important;
}

.allar-frettir-page .af-category-filter .af-cat-active .wp-block-button__link {
	background: #6eb7cc !important;
	border-color: #6eb7cc !important;
	color: #ffffff !important;
}

/* Categories List Block styling */
.allar-frettir-page .wp-block-categories {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

.allar-frettir-page .wp-block-categories li {
	margin: 0 !important;
}

.allar-frettir-page .wp-block-categories a {
	display: inline-block;
	padding: 8px 14px;
	border: 1px solid #e2e8f0;
	background: #ffffff;
	color: #334155;
	font-size: 0.8125rem;
	font-weight: 500;
	border-radius: 20px;
	transition: all 0.2s ease;
	text-decoration: none;
}

.allar-frettir-page .wp-block-categories a:hover {
	border-color: #6eb7cc;
	color: #6eb7cc;
}

/* ----- Search Block ----- */
.allar-frettir-page .af-search-block {
	flex: 1;
	max-width: 300px;
	min-width: 200px;
}

.allar-frettir-page .af-search-block .wp-block-search__inside-wrapper {
	border: 1px solid #e2e8f0 !important;
	border-radius: 8px !important;
	overflow: hidden;
	background: #ffffff;
	transition: all 0.2s ease;
}

.allar-frettir-page .af-search-block .wp-block-search__inside-wrapper:focus-within {
	border-color: #6eb7cc !important;
	box-shadow: 0 0 0 3px rgba(110, 183, 204, 0.15);
}

.allar-frettir-page .af-search-block .wp-block-search__input {
	border: none !important;
	padding: 10px 16px !important;
	font-size: 0.875rem !important;
	color: #0f172a !important;
	background: transparent !important;
}

.allar-frettir-page .af-search-block .wp-block-search__input::placeholder {
	color: #94a3b8 !important;
}

.allar-frettir-page .af-search-block .wp-block-search__button {
	background: #6eb7cc !important;
	border: none !important;
	padding: 10px 16px !important;
	color: #ffffff !important;
}

.allar-frettir-page .af-search-block .wp-block-search__button:hover {
	background: #5aa8bd !important;
}

.allar-frettir-page .af-search-block .wp-block-search__button svg {
	fill: #ffffff;
}

/* ----- Query Loop / Post Grid Container ----- */
.allar-frettir-page .af-posts-section {
	max-width: 1200px;
	margin: 0 auto;
	padding: 40px 20px;
}

/* Grid container for Post Template */
.allar-frettir-page .af-posts-grid {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 30px !important;
}

/* Alternative: Use columns class on Post Template */
.allar-frettir-page .wp-block-post-template.is-flex-container.columns-3 {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 30px !important;
}

/* ----- Individual Post Card ----- */
.allar-frettir-page .af-post-card,
.allar-frettir-page .af-posts-grid > .wp-block-post {
	background: #ffffff !important;
	border-radius: 12px !important;
	overflow: hidden !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
	transition: all 0.3s ease !important;
	display: flex !important;
	flex-direction: column !important;
	border: none !important;
}

.allar-frettir-page .af-post-card:hover,
.allar-frettir-page .af-posts-grid > .wp-block-post:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1) !important;
}

/* ----- Card Featured Image ----- */
.allar-frettir-page .af-post-card .wp-block-post-featured-image,
.allar-frettir-page .af-posts-grid .wp-block-post-featured-image {
	margin: 0 !important;
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 10;
	overflow: hidden;
}

.allar-frettir-page .af-post-card .wp-block-post-featured-image img,
.allar-frettir-page .af-posts-grid .wp-block-post-featured-image img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	transition: transform 0.4s ease !important;
}

.allar-frettir-page .af-post-card:hover .wp-block-post-featured-image img,
.allar-frettir-page .af-posts-grid .wp-block-post:hover .wp-block-post-featured-image img {
	transform: scale(1.05);
}

/* ----- Card Content Area ----- */
.allar-frettir-page .af-card-content {
	padding: 20px !important;
	display: flex !important;
	flex-direction: column !important;
	flex: 1 !important;
}

/* ----- Meta Row: Author + Date ----- */
.allar-frettir-page .af-card-meta {
	display: flex !important;
	align-items: center !important;
	gap: 16px !important;
	margin-bottom: 12px !important;
	font-size: 0.8125rem !important;
	color: #64748b !important;
	flex-wrap: wrap;
}

.allar-frettir-page .af-card-meta .wp-block-post-author,
.allar-frettir-page .af-card-meta .wp-block-post-date {
	margin: 0 !important;
	padding: 0 !important;
	font-size: 0.8125rem !important;
	color: #64748b !important;
}

.allar-frettir-page .af-card-meta .wp-block-post-author__name,
.allar-frettir-page .af-card-meta .wp-block-post-author-name {
	font-size: 0.8125rem !important;
	color: #64748b !important;
}

.allar-frettir-page .af-card-meta .wp-block-post-author__name a,
.allar-frettir-page .af-card-meta .wp-block-post-author-name a {
	color: #64748b !important;
	text-decoration: none !important;
}

.allar-frettir-page .af-card-meta .wp-block-post-author__name a:hover,
.allar-frettir-page .af-card-meta .wp-block-post-author-name a:hover {
	color: #6eb7cc !important;
}

/* Meta icons styling - uses pseudo-elements or Font Awesome if available */
.allar-frettir-page .af-card-meta .wp-block-post-author::before,
.allar-frettir-page .af-card-meta .wp-block-post-date::before {
	color: #6eb7cc !important;
}

/* ----- Card Title ----- */
.allar-frettir-page .af-card-content .wp-block-post-title,
.allar-frettir-page .af-posts-grid .wp-block-post-title {
	font-size: 1.125rem !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	color: #0f172a !important;
	margin: 0 0 10px !important;
	display: -webkit-box !important;
	-webkit-line-clamp: 2 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
	min-height: 3.15em;
}

.allar-frettir-page .af-card-content .wp-block-post-title a,
.allar-frettir-page .af-posts-grid .wp-block-post-title a {
	color: inherit !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

.allar-frettir-page .af-card-content .wp-block-post-title a:hover,
.allar-frettir-page .af-posts-grid .wp-block-post-title a:hover {
	color: #6eb7cc !important;
}

/* ----- Card Excerpt ----- */
.allar-frettir-page .af-card-content .wp-block-post-excerpt,
.allar-frettir-page .af-posts-grid .wp-block-post-excerpt {
	font-size: 0.875rem !important;
	line-height: 1.6 !important;
	color: #64748b !important;
	margin: 0 0 16px !important;
	flex: 1;
}

.allar-frettir-page .af-card-content .wp-block-post-excerpt__excerpt,
.allar-frettir-page .af-posts-grid .wp-block-post-excerpt__excerpt {
	display: -webkit-box !important;
	-webkit-line-clamp: 3 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
	min-height: 4.2em;
	margin: 0 !important;
}

/* Hide default "Read more" from excerpt block */
.allar-frettir-page .wp-block-post-excerpt__more-link {
	display: none !important;
}

/* ----- Read More Button ----- */
.allar-frettir-page .af-card-content .af-read-more .wp-block-button__link,
.allar-frettir-page .af-posts-grid .af-read-more .wp-block-button__link,
.allar-frettir-page .af-card-content .wp-block-read-more,
.allar-frettir-page .af-posts-grid .wp-block-read-more {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	padding: 10px 20px !important;
	background: linear-gradient(135deg, #6eb7cc 0%, #5aa8bd 100%) !important;
	color: #ffffff !important;
	font-size: 0.8125rem !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	border-radius: 6px !important;
	transition: all 0.2s ease !important;
	border: none !important;
}

.allar-frettir-page .af-card-content .af-read-more .wp-block-button__link:hover,
.allar-frettir-page .af-posts-grid .af-read-more .wp-block-button__link:hover,
.allar-frettir-page .af-card-content .wp-block-read-more:hover,
.allar-frettir-page .af-posts-grid .wp-block-read-more:hover {
	background: linear-gradient(135deg, #5aa8bd 0%, #4a98ad 100%) !important;
	transform: translateX(2px);
}

/* ----- Query Pagination / Load More ----- */
.allar-frettir-page .af-pagination {
	text-align: center;
	padding: 30px 20px;
}

.allar-frettir-page .af-pagination .wp-block-query-pagination {
	justify-content: center;
	gap: 10px;
}

.allar-frettir-page .af-pagination .wp-block-query-pagination-numbers,
.allar-frettir-page .af-pagination .wp-block-query-pagination-previous,
.allar-frettir-page .af-pagination .wp-block-query-pagination-next {
	padding: 10px 20px;
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	color: #334155;
	text-decoration: none;
	transition: all 0.2s ease;
}

.allar-frettir-page .af-pagination .wp-block-query-pagination-numbers .page-numbers {
	padding: 8px 14px;
	margin: 0 4px;
	border-radius: 6px;
	color: #334155;
	text-decoration: none;
}

.allar-frettir-page .af-pagination .wp-block-query-pagination-numbers .page-numbers.current {
	background: #6eb7cc;
	color: #ffffff;
}

.allar-frettir-page .af-pagination .wp-block-query-pagination-previous:hover,
.allar-frettir-page .af-pagination .wp-block-query-pagination-next:hover,
.allar-frettir-page .af-pagination .wp-block-query-pagination-numbers .page-numbers:hover:not(.current) {
	border-color: #6eb7cc;
	color: #6eb7cc;
}

/* ----- No Results ----- */
.allar-frettir-page .wp-block-query-no-results {
	text-align: center;
	padding: 60px 20px;
	color: #64748b;
}

/* ----- Mobile/Tablet Responsive - Stack posts under 1024px ----- */
@media (max-width: 1024px) {
	.allar-frettir-page .af-posts-grid,
	.allar-frettir-page .wp-block-post-template.is-flex-container.columns-3 {
		grid-template-columns: 1fr !important;
		gap: 24px !important;
	}
	
	/* Control image size at tablet breakpoint */
	.allar-frettir-page .af-post-card .wp-block-post-featured-image,
	.allar-frettir-page .af-posts-grid .wp-block-post-featured-image {
		aspect-ratio: 16 / 10 !important;
		max-height: 250px !important;
	}
	
	.allar-frettir-page .af-post-card .wp-block-post-featured-image img,
	.allar-frettir-page .af-posts-grid .wp-block-post-featured-image img {
		max-height: 250px !important;
	}
}

@media (max-width: 768px) {
	.allar-frettir-page .af-page-header h1 {
		font-size: 2rem;
	}
	
	.allar-frettir-page .af-taskbar > .wp-block-group__inner-container {
		flex-direction: column;
		align-items: stretch;
	}
	
	.allar-frettir-page .af-sort-tabs {
		width: 100%;
		justify-content: center;
	}
	
	.allar-frettir-page .af-category-filter {
		justify-content: center;
	}
	
	.allar-frettir-page .af-search-block {
		max-width: 100%;
		width: 100%;
	}
	
	.allar-frettir-page .af-posts-grid,
	.allar-frettir-page .wp-block-post-template.is-flex-container.columns-3 {
		grid-template-columns: 1fr !important;
		gap: 20px !important;
	}
	
	.allar-frettir-page .af-posts-section {
		padding: 30px 15px;
	}
}

@media (max-width: 480px) {
	.allar-frettir-page .af-page-header {
		padding: 30px 15px 20px;
	}
	
	.allar-frettir-page .af-page-header h1 {
		font-size: 1.75rem;
	}
	
	.allar-frettir-page .af-card-content {
		padding: 16px !important;
	}
	
	.allar-frettir-page .af-card-content .wp-block-post-title,
	.allar-frettir-page .af-posts-grid .wp-block-post-title {
		font-size: 1rem !important;
	}
}

/* ==========================================================================
   FRÉTTIR POSTS PAGE (Index Template)
   
   Full posts page with:
   - Category filtering with color-coded pills
   - Order by selector
   - Grid/List view toggle
   - Infinite scroll
   ========================================================================== */

/* ----- Page Container ----- */
.frettir-posts-page {
	background-color: #fafafa !important;
}

.frettir-container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 24px;
}

/* ----- Page Title (inside taskbar) ----- */
.frettir-page-title {
	font-size: 1.75rem;
	font-weight: 700;
	color: #0f172a;
	margin: 0;
	letter-spacing: -0.025em;
	text-align: left;
	flex-shrink: 0;
}

/* ----- Taskbar ----- */
.frettir-taskbar {
	background-color: #ffffff;
	margin: 0 0 20px 0;
	padding: 14px 20px;
	border-radius: 12px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
	position: sticky;
	top: 100px;
	z-index: 100;
}

.frettir-taskbar-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
}

.frettir-taskbar-actions {
	display: flex;
	align-items: center;
	gap: 12px;
}

/* ----- Action Buttons (Filter, Order) ----- */
.frettir-action-btn {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 16px;
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	color: #0f172a;
	font-size: 0.875rem;
	font-weight: 500;
	cursor: pointer;
	transition: all 0.2s ease;
}

.frettir-action-btn:hover {
	border-color: #cbd5e1;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.frettir-action-btn .frettir-icon {
	color: #6eb7cc;
	flex-shrink: 0;
}

.frettir-action-btn .frettir-chevron {
	color: #94a3b8;
	margin-left: 4px;
	transition: transform 0.2s ease;
}

/* ----- Filter Dropdown ----- */
.frettir-filter-wrapper,
.frettir-order-wrapper {
	position: relative;
}

.frettir-filter-dropdown,
.frettir-order-dropdown {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	min-width: 240px;
	background: #ffffff;
	border-radius: 12px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-10px);
	transition: all 0.2s ease;
	z-index: 200;
	overflow: hidden;
}

.frettir-filter-dropdown.open,
.frettir-order-dropdown.open {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.frettir-filter-option {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 16px;
	cursor: pointer;
	transition: background 0.15s ease;
	font-size: 0.875rem;
	color: #334155;
}

.frettir-filter-option:hover {
	background-color: #f8fafc;
}

.frettir-filter-option input[type="checkbox"] {
	width: 18px;
	height: 18px;
	accent-color: #6eb7cc;
	cursor: pointer;
	flex-shrink: 0;
}

.frettir-filter-dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	flex-shrink: 0;
}

.frettir-filter-all {
	border-bottom: 1px solid #e2e8f0;
	font-weight: 600;
	color: #0f172a;
}

.frettir-filter-categories {
	max-height: 280px;
	overflow-y: auto;
}

/* ----- Order Dropdown ----- */
.frettir-order-dropdown {
	min-width: 160px;
	padding: 8px 0;
}

.frettir-order-option {
	display: block;
	width: 100%;
	padding: 10px 16px;
	background: transparent;
	border: none;
	text-align: left;
	font-size: 0.875rem;
	color: #334155;
	cursor: pointer;
	transition: all 0.15s ease;
}

.frettir-order-option:hover {
	background-color: #f8fafc;
}

.frettir-order-option.active {
	background-color: #f1f5f9;
	color: #6eb7cc;
	font-weight: 600;
}

/* ----- View Toggle ----- */
.frettir-view-toggle {
	display: flex;
	background: #f1f5f9;
	border-radius: 8px;
	padding: 4px;
}

.frettir-view-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background: transparent;
	border: none;
	border-radius: 6px;
	color: #64748b;
	cursor: pointer;
	transition: all 0.2s ease;
}

.frettir-view-btn:hover {
	color: #0f172a;
}

.frettir-view-btn.active {
	background: #ffffff;
	color: #6eb7cc;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* ----- Active Filter Pills ----- */
.frettir-active-filters {
	display: none;
	flex-wrap: wrap;
	gap: 10px;
	padding: 16px 0;
	margin-top: 8px;
}

.frettir-active-pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	border: none;
	border-radius: 20px;
	font-size: 0.8125rem;
	font-weight: 700;
	color: #ffffff;
	cursor: pointer;
	transition: all 0.2s ease;
}

.frettir-active-pill:hover {
	opacity: 0.9;
	transform: scale(1.02);
}

.frettir-active-pill svg {
	color: #ffffff;
	opacity: 0.9;
	flex-shrink: 0;
}

.frettir-active-pill:hover svg {
	opacity: 1;
}

/* Apply category pill colors to active pills */
.frettir-active-pill.cat-pill-1 { background-color: #E63946 !important; }
.frettir-active-pill.cat-pill-2 { background-color: #F77F00 !important; }
.frettir-active-pill.cat-pill-3 { background-color: #2A9D8F !important; }
.frettir-active-pill.cat-pill-4 { background-color: #1D3557 !important; }
.frettir-active-pill.cat-pill-5 { background-color: #6A4C93 !important; }
.frettir-active-pill.cat-pill-6 { background-color: #E91E63 !important; }
.frettir-active-pill.cat-pill-7 { background-color: #00A0B0 !important; }
.frettir-active-pill.cat-pill-8 { background-color: #3F37C9 !important; }
.frettir-active-pill.cat-pill-9 { background-color: #C1121F !important; }
.frettir-active-pill.cat-pill-10 { background-color: #B8860B !important; }

/* ----- Posts Grid Container ----- */
.frettir-posts-wrapper {
	padding: 0 0 20px 0;
}

.frettir-posts-grid {
	display: grid;
	gap: 24px;
}

.frettir-posts-grid[data-view="grid"] {
	grid-template-columns: repeat(3, 1fr);
}

.frettir-posts-grid[data-view="list"] {
	grid-template-columns: 1fr;
}

/* ----- Card Base Styles ----- */
.frettir-card {
	background: #ffffff;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
	transition: all 0.3s ease;
}

.frettir-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
}

/* ----- Grid Card Layout ----- */
.frettir-card-grid {
	display: flex;
	flex-direction: column;
	height: 100%;
}

.frettir-card-grid .frettir-card-image {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 10;
	overflow: hidden;
}

.frettir-card-grid .frettir-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.frettir-card-grid:hover .frettir-card-image img {
	transform: scale(1.05);
}

.frettir-card-grid .frettir-card-content {
	padding: 20px;
	display: flex;
	flex-direction: column;
	flex: 1;
}

/* ----- List Card Layout ----- */
.frettir-card-list {
	display: grid;
	grid-template-columns: 300px 1fr;
	min-height: 200px;
}

.frettir-card-list .frettir-card-image {
	position: relative;
	width: 100%;
	height: 100%;
	min-height: 200px;
	overflow: hidden;
}

.frettir-card-list .frettir-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.frettir-card-list:hover .frettir-card-image img {
	transform: scale(1.05);
}

.frettir-card-list .frettir-card-content {
	padding: 24px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

/* ----- Card Categories ----- */
.frettir-card-categories {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 12px;
}

.frettir-card-cat {
	display: inline-block;
	padding: 4px 12px;
	border-radius: 8px;
	font-size: 0.75rem;
	font-weight: 700;
	color: #ffffff !important;
	text-decoration: none !important;
	transition: opacity 0.2s ease;
}

.frettir-card-cat:hover {
	opacity: 0.85;
	color: #ffffff !important;
}

/* ----- Card Title ----- */
.frettir-card-title {
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.4;
	color: #0f172a;
	margin: 0 0 10px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.frettir-card-grid .frettir-card-title {
	min-height: 3.15em;
}

.frettir-card-title a {
	color: inherit;
	text-decoration: none;
	transition: color 0.2s ease;
}

.frettir-card-title a:hover {
	color: #6eb7cc;
}

/* ----- Card Meta ----- */
.frettir-card-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px;
	margin-bottom: 12px;
	font-size: 0.8125rem;
	color: #475569;
}

.frettir-meta-author,
.frettir-meta-date {
	display: flex;
	align-items: center;
	gap: 6px;
}

.frettir-meta-author svg,
.frettir-meta-date svg {
	color: #6eb7cc;
	flex-shrink: 0;
}

/* ----- Card Excerpt ----- */
.frettir-card-excerpt {
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.6;
	color: #475569;
	margin: 0 0 16px;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.frettir-card-grid .frettir-card-excerpt {
	flex: 1;
	min-height: 4.2em;
}

/* ----- Read More Button ----- */
.frettir-card-readmore {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 20px;
	background: linear-gradient(135deg, #6eb7cc 0%, #5aa8bd 100%);
	color: #ffffff !important;
	font-size: 0.8125rem;
	font-weight: 600;
	text-decoration: none !important;
	border-radius: 8px;
	transition: all 0.2s ease;
	align-self: flex-start;
}

.frettir-card-readmore:hover {
	background: linear-gradient(135deg, #5aa8bd 0%, #4a98ad 100%);
	transform: translateX(2px);
}

.frettir-card-readmore svg {
	transition: transform 0.2s ease;
}

.frettir-card-readmore:hover svg {
	transform: translateX(3px);
}

/* ----- Loading Indicator ----- */
.frettir-loading {
	display: none;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 40px 20px;
	gap: 16px;
}

.frettir-loading-spinner {
	width: 40px;
	height: 40px;
	border: 3px solid #e2e8f0;
	border-top-color: #6eb7cc;
	border-radius: 50%;
	animation: frettir-spin 0.8s linear infinite;
}

@keyframes frettir-spin {
	to { transform: rotate(360deg); }
}

.frettir-loading p {
	margin: 0;
	font-size: 0.875rem;
	color: #64748b;
}

/* ----- End Message ----- */
.frettir-end-message {
	text-align: center;
	padding: 32px 20px;
	color: #94a3b8;
	font-size: 0.875rem;
}

/* ----- No Results ----- */
.frettir-no-results {
	grid-column: 1 / -1;
	text-align: center;
	padding: 60px 20px;
	background: #ffffff;
	border-radius: 12px;
}

.frettir-no-results svg {
	color: #cbd5e1;
	margin-bottom: 16px;
}

.frettir-no-results h3 {
	font-size: 1.25rem;
	color: #334155;
	margin: 0 0 8px;
}

.frettir-no-results p {
	margin: 0;
	font-size: 0.875rem;
	color: #64748b;
}

/* ----- Responsive: Tablet ----- */
@media (max-width: 1024px) {
	.frettir-posts-grid[data-view="grid"] {
		grid-template-columns: repeat(2, 1fr);
	}
	
	.frettir-card-list {
		grid-template-columns: 240px 1fr;
	}
}

/* ----- Responsive: Mobile ----- */
@media (max-width: 768px) {
	.frettir-container {
		padding: 0 16px;
	}
	
	.frettir-page-title {
		font-size: 1.25rem;
	}
	
	.frettir-taskbar {
		margin: 16px 0;
		padding: 12px 16px;
		border-radius: 10px;
	}
	
	.frettir-taskbar-inner {
		flex-wrap: wrap;
		gap: 12px;
	}
	
	.frettir-taskbar-actions {
		flex-wrap: wrap;
		gap: 8px;
	}
	
	.frettir-action-btn {
		padding: 8px 12px;
		font-size: 0.8125rem;
	}
	
	.frettir-action-btn span {
		display: none;
	}
	
	.frettir-filter-dropdown,
	.frettir-order-dropdown {
		right: 0;
		left: auto;
		min-width: 200px;
	}
	
	.frettir-posts-grid[data-view="grid"] {
		grid-template-columns: 1fr;
	}
	
	.frettir-card-list {
		grid-template-columns: 1fr;
	}
	
	.frettir-card-list .frettir-card-image {
		aspect-ratio: 16 / 9;
		min-height: auto;
	}
	
	.frettir-card-list .frettir-card-content {
		padding: 16px;
	}
	
	.frettir-view-toggle {
		display: none;
	}
}

@media (max-width: 480px) {
	.frettir-card-content {
		padding: 16px !important;
	}
	
	.frettir-card-title {
		font-size: 1rem;
	}
	
	.frettir-active-pill {
		padding: 6px 12px;
		font-size: 0.75rem;
	}
}

/* ==========================================================================
   SINGLE POST TEMPLATE STYLES
   ========================================================================== */

/* Single Post Page Container */
.single-post-page {
	min-height: 100vh;
}

/* Single Post Card */
.single-post-card {
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.06);
}

/* Single Post Featured Image - constrained size with good aspect ratio */
.single-post-featured-image-square {
	aspect-ratio: 16 / 9 !important;
	overflow: hidden;
	max-width: 100% !important;
	max-height: 400px !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

.single-post-featured-image-square img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	max-height: 400px !important;
}

/* Responsive single post image */
@media (max-width: 1024px) {
	.single-post-featured-image-square {
		max-height: 350px !important;
	}
	
	.single-post-featured-image-square img {
		max-height: 350px !important;
	}
}

@media (max-width: 768px) {
	.single-post-featured-image-square {
		max-height: 280px !important;
	}
	
	.single-post-featured-image-square img {
		max-height: 280px !important;
	}
}

@media (max-width: 480px) {
	.single-post-featured-image-square {
		max-height: 220px !important;
	}
	
	.single-post-featured-image-square img {
		max-height: 220px !important;
	}
}

/* Single Post Meta Row */
.single-post-meta {
	color: #64748b;
}

.single-post-meta svg {
	flex-shrink: 0;
}

/* Single Post Category Pills - use existing pill system */
.single-post-category-pills a {
	display: inline-block;
	padding: 6px 14px;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
	margin-right: 8px;
	margin-bottom: 8px;
}

/* Sidebar Styles */
.single-post-sidebar {
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.06);
	position: sticky;
	top: 120px;
}

/* Sidebar Post Items */
.sidebar-post-item {
	gap: 12px;
}

.sidebar-post-item:last-child {
	border-bottom: none !important;
}

.sidebar-post-thumb {
	flex-shrink: 0;
}

.sidebar-post-thumb img {
	width: 60px;
	height: 60px;
	object-fit: cover;
}

.sidebar-post-title a {
	text-decoration: none;
	color: #334155;
	transition: color 0.2s ease;
}

.sidebar-post-title a:hover {
	color: #6eb7cc;
}

/* Hide sidebar posts template list bullets */
.sidebar-posts-template {
	list-style: none;
	padding: 0;
	margin: 0;
}

/* Mobile Carousel Container - hidden by default on desktop */
.mobile-carousel-container {
	display: none;
}

/* Desktop: show sidebar, hide carousel */
@media (min-width: 782px) {
	.single-post-sidebar {
		display: block;
	}
}

/* Mobile/Tablet: stack sidebar below post content */
@media (max-width: 781px) {
	.single-post-columns {
		flex-direction: column;
	}
	
	.single-post-main,
	.single-post-sidebar-column {
		flex-basis: 100% !important;
		width: 100%;
	}
	
	/* Show sidebar on mobile (stacked below content) */
	.single-post-sidebar {
		display: block !important;
		margin-top: 32px;
	}
	
	/* Keep white background on post card with shadow on mobile */
	.single-post-card,
	.single-post-card.has-white-background-color,
	.single-post-card.has-background {
		background: #ffffff !important;
		background-color: #ffffff !important;
		box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08) !important;
		margin-bottom: 24px !important;
	}
	
	/* Keep sidebar with white background too */
	.single-post-sidebar {
		background: #ffffff !important;
		box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08) !important;
	}
	
	.single-post-card {
		padding: 20px !important;
	}
	
	/* Bolder fonts on mobile for readability */
	.single-post-card .wp-block-post-title {
		font-weight: 800 !important;
	}
	
	.single-post-card .wp-block-post-author-name,
	.single-post-card .wp-block-post-date {
		font-weight: 600 !important;
	}
	
	.single-post-card .wp-block-post-content,
	.single-post-card .wp-block-post-content p {
		font-weight: 500 !important;
	}
	
	.single-post-category-pills a {
		font-weight: 800 !important;
	}
}

/* Smaller screens - slightly smaller arrows */
@media (max-width: 480px) {
	.carousel-arrow {
		width: 36px;
		height: 36px;
	}
}

/* ==========================================================================
   CATEGORY ARCHIVE PAGE TEMPLATE STYLES
   
   Matches the Allar fréttir / Fréttir page design but without the taskbar.
   ========================================================================== */

/* ----- Page Container ----- */
.category-archive-page {
	background-color: #fafafa !important;
}

/* Hide 'Category:' prefix from archive title */
.category-archive-page .wp-block-query-title {
	text-transform: capitalize;
}

.category-archive-page .wp-block-query-title::before {
	content: none !important;
}

/* Use PHP filter to remove prefix - CSS backup */
.archive .page-title span.screen-reader-text {
	display: none;
}

.category-archive-container {
	max-width: 1200px;
	margin: 0 auto;
}

/* ----- Header Section ----- */
.category-archive-header {
	text-align: left;
	margin-bottom: 20px;
}

.category-archive-header .wp-block-query-title {
	font-size: 2rem !important;
	font-weight: 700 !important;
	color: #0f172a !important;
	margin: 0 0 8px !important;
}

.category-archive-header .wp-block-term-description {
	font-size: 1rem !important;
	color: #64748b !important;
	margin: 0 !important;
}

/* ----- Posts Grid ----- */
.category-posts-grid {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 30px !important;
}

/* ----- Individual Post Card ----- */
.category-post-card {
	background: #ffffff !important;
	border-radius: 12px !important;
	overflow: hidden !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
	transition: all 0.3s ease !important;
	display: flex !important;
	flex-direction: column !important;
	border: none !important;
}

.category-post-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1) !important;
}

/* ----- Card Featured Image ----- */
.category-post-card .wp-block-post-featured-image {
	margin: 0 !important;
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 10;
	overflow: hidden;
}

.category-post-card .wp-block-post-featured-image img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	transition: transform 0.4s ease !important;
}

.category-post-card:hover .wp-block-post-featured-image img {
	transform: scale(1.05);
}

/* ----- Card Content Area ----- */
.category-post-content {
	padding: 20px !important;
	display: flex !important;
	flex-direction: column !important;
	flex: 1 !important;
}

/* ----- Meta Row: Author + Date ----- */
.category-post-meta {
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	margin-bottom: 8px !important;
	font-size: 13px !important;
	color: #64748b !important;
}

.category-post-meta .wp-block-post-author-name,
.category-post-meta .wp-block-post-date {
	margin: 0 !important;
	padding: 0 !important;
	font-size: 13px !important;
	color: #64748b !important;
}

/* ----- Card Title ----- */
.category-post-card .wp-block-post-title {
	font-size: 1.125rem !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	color: #0f172a !important;
	margin: 0 0 8px !important;
	display: -webkit-box !important;
	-webkit-line-clamp: 2 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
}

.category-post-card .wp-block-post-title a {
	color: inherit !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

.category-post-card .wp-block-post-title a:hover {
	color: #6eb7cc !important;
}

/* ----- Card Excerpt ----- */
.category-post-card .wp-block-post-excerpt {
	font-size: 0.875rem !important;
	line-height: 1.6 !important;
	color: #64748b !important;
	margin: 0 !important;
}

.category-post-card .wp-block-post-excerpt__excerpt {
	display: -webkit-box !important;
	-webkit-line-clamp: 3 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
	margin: 0 !important;
}

/* Hide default "Read more" from excerpt block */
.category-post-card .wp-block-post-excerpt__more-link {
	display: none !important;
}

/* ----- Pagination ----- */
.category-pagination {
	margin-top: 40px !important;
	padding: 20px 0 !important;
}

.category-pagination .wp-block-query-pagination-numbers,
.category-pagination .wp-block-query-pagination-previous,
.category-pagination .wp-block-query-pagination-next {
	padding: 10px 20px;
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	color: #334155;
	text-decoration: none;
	transition: all 0.2s ease;
}

.category-pagination .page-numbers {
	padding: 8px 14px;
	margin: 0 4px;
	border-radius: 6px;
	color: #334155;
	text-decoration: none;
	background: #ffffff !important;
}

.category-pagination .page-numbers.current {
	background: #6eb7cc !important;
	color: #ffffff !important;
}

.category-pagination .wp-block-query-pagination-previous:hover,
.category-pagination .wp-block-query-pagination-next:hover,
.category-pagination .page-numbers:hover:not(.current) {
	border-color: #6eb7cc;
	color: #6eb7cc;
}

/* ----- Responsive: Tablet ----- */
@media (max-width: 1024px) {
	.category-posts-grid {
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 24px !important;
	}
	
	.category-post-card .wp-block-post-featured-image {
		max-height: 200px !important;
	}
	
	.category-post-card .wp-block-post-featured-image img {
		max-height: 200px !important;
	}
}

/* ----- Responsive: Mobile ----- */
@media (max-width: 768px) {
	.category-archive-header .wp-block-query-title {
		font-size: 1.5rem !important;
	}
	
	.category-posts-grid {
		grid-template-columns: 1fr !important;
		gap: 20px !important;
	}
	
	.category-post-content {
		padding: 16px !important;
	}
	
	.category-post-card .wp-block-post-title {
		font-size: 1rem !important;
	}
}

@media (max-width: 480px) {
	.category-archive-container {
		padding-left: 16px !important;
		padding-right: 16px !important;
	}
	
	.category-archive-header .wp-block-query-title {
		font-size: 1.25rem !important;
	}
}

/* End of stylesheet */