/******************************************************************************
* 1. ROOT & GLOBAL DESIGN TOKENS
******************************************************************************/

:root {
	/* Typography & Layout Tokens */
	--boho--font-size: var(--wp--preset--font-size--medium);
	--boho--line-height: 1.5;
	--boho--letter-spacing: initial;
	--boho--text-wrap: balance;
	--boho--text-decoration-thickness: max(2px, 0.12em);
	
	/* UI Component Tokens */
	--boho--border-radius: 8px;
	--boho--border-width: 2px;
	--boho--outline-width: 2px;
	--boho--outline-style: solid;
	--boho--outline-offset: 2px;
	--boho--excerpt--line-clamp: 4;	
	--boho--table--svg--max-height: calc(2ex * var(--boho--line-height, 1.5));
	
	/* Visual Filter Tokens */
	--boho--post-title--image-filter: saturate(50%) contrast(80%) blur(4px);
	--boho--post-title--image-overlay-opacity: 80%;
	--theme-icon-size: .8em;

	/* Scroll Offset */
	scroll-padding: var(--wp--preset--spacing--50, 1.5rem);
}

/* Smooth scrolling unless user prefers reduced motion */
@media (prefers-reduced-motion: no-preference) {
	:root {
		scroll-behavior: smooth;
	}
}


/******************************************************************************
* 2. BASE & GLOBAL ACCESSIBILITY
******************************************************************************/

/* Global Focus Outline for Interactive Elements */
body a:focus-visible,
body :is(summary, button):focus-visible,
body .wp-block-image a:focus-within img,
body .skip-link:focus,
body pre[tabindex="0"]:focus {
	outline-width: var(--boho--outline-width);
	outline-style: var(--boho--outline-style);
	outline-color: var(--theme-link-hover-color, initial);
	outline-offset: var(--boho--outline-offset);
}

/* Base Link & Hover Underline Effects */
body button.ct-toggle:hover .ct-label,
body :is(p, td, cite, address, figcaption, h3) > a:hover,
body :is(li:not([data-type="pill"]), .site-title, .entry-title, .ct-breadcrumbs, .related-entry-title, .contact-text) a:hover {
	--theme-text-decoration: underline;
	--has-link-decoration: var(--true);
	text-decoration-thickness: var(--boho--text-decoration-thickness);
}

/* Underline standard citation & address links */
body :where(cite, address, figcaption) > a {
	--theme-text-decoration: underline;
}

/* Reset bold font weight */
body :is(strong, b) {
	font-weight: 700;
}


/******************************************************************************
* 3. BOHO TYPOGRAPHY SYSTEM
******************************************************************************/

/* Heading Size Scales & Line Heights */
body :where(h1, .has-xx-large-font-size) {
	--boho--font-size: var(--wp--preset--font-size--xx-large);
	--boho--line-height: 1.1;
}

body :where(h2, .has-x-large-font-size) {
	--boho--font-size: var(--wp--preset--font-size--x-large);
	--boho--line-height: 1.2;
}

body :where(h3, .has-large-font-size) {
	--boho--font-size: var(--wp--preset--font-size--large);
	--boho--line-height: 1.3;
}

body :where(h4, .has-medium-font-size) {
	--boho--font-size: var(--wp--preset--font-size--medium);
	--boho--line-height: 1.4;
}

body :where(h5, .has-small-font-size) {
	--boho--font-size: var(--wp--preset--font-size--small);
	--boho--line-height: 1.5;
}

/* Balance Text Wrapping on Headings & Titles */
body :where(h1, h2, h3, h4, h5, .site-title, .page-description) {
	text-wrap: var(--boho--text-wrap);
}

/* Paragraph Block Style: "Like Heading" (.is-style-heading-like) */
p.is-style-heading-like {
	line-height: var(--boho--line-height, inherit);
	text-wrap: var(--boho--text-wrap, balance);
}


/******************************************************************************
* 4. CREATIVE THEMES (.ct) BLOCKSY STYLING 
******************************************************************************/

/**
* HEADER & NAVIGATION
**/

.ct-header {
	--boho--font-size: var(--wp--preset--font-size--small);
}

.ct-header .site-title {
	--boho--font-size: var(--wp--preset--font-size--large);
}

.ct-header .site-description {
	--boho--font-size: var(--wp--preset--font-size--small);
}

.ct-header :is([data-id="menu"], [data-id="language-switcher"], [data-id="color-mode-switcher"], [data-id="search"]) {
	--boho--letter-spacing: 1px;
}

/* Pointer cursor on unlinked parent menu items */
nav .menu-item-has-children a.ct-menu-link:not([href]) {
	--theme-text-decoration: none;
	--has-link-decoration: unset;
	cursor: pointer;    
}

/* Off-canvas mobile menu */
.ct-header [data-device="mobile"] .ct-panel-content-inner {
	--boho--font-size: var(--wp--preset--font-size--medium);
}

#offcanvas .ct-panel-actions .ct-toggle-close:focus-visible {
	outline-color: var(--theme-icon-color);
}

/* Sticky Header Pill Transformation */
#header .ct-sticky-container:has([data-row="bottom"]) {
	height: 0 !important;
	overflow: visible;
}

#header .ct-sticky-container:has([data-row="bottom"]) [data-sticky^="yes"] [data-items="primary"] {
	--boho-pill-padding: calc(var(--header-sticky-height) * .314);
	--boho-pill-shadow: rgb(from var(--theme-palette-color-11) r g b / 0.1);
	width: fit-content;
	margin-left: auto;
	margin-right: calc(var(--boho-pill-padding) * -1);
	border-radius: calc(var(--header-sticky-height) * .5);
	padding: 0 var(--boho-pill-padding);
	background: var(--theme-palette-color-8);
	background: rgb(from var(--theme-palette-color-8) r g b / 0.8);
	backdrop-filter: blur(2px);
	filter: drop-shadow(2px 2px 3px var(--boho-pill-shadow));
	will-change: backdrop-filter, background;
	transition: background 0.2s ease, backdrop-filter 0.2s ease;
}

/* Search Modal */
#search-modal .ct-search-results {
	--boho--font-size: var(--wp--preset--font-size--small);
}


/**
* HERO SECTION
**/

.hero-section .page-title {
	--boho--font-size: var(--wp--preset--font-size--xx-large);
	--boho--line-height: 1.1;
}

.hero-section .page-description {
	--boho--font-size: var(--wp--preset--font-size--large);
	--boho--line-height: 1.3;
}

.hero-section .entry-meta,
.hero-section .ct-breadcrumbs {
	--boho--font-size: var(--wp--preset--font-size--small);
}


/**
* ARTICLE CARDS & BLOG POSTS
**/

[data-prefix="blog"] .entry-card .entry-title {
	--boho--font-size: var(--wp--preset--font-size--large);
	--boho--line-height: 1.3;
}

[data-prefix="blog"] .entry-card .entry-excerpt {
	--boho--font-size: inherit;
	--boho--line-height: inherit;
	display: -webkit-box;
	line-clamp: var(--boho--excerpt--line-clamp);
	-webkit-line-clamp: var(--boho--excerpt--line-clamp);
	-webkit-box-orient: vertical;
	overflow: hidden;
}

[data-prefix="blog"] .entry-card .entry-meta {
	--boho--font-size: var(--wp--preset--font-size--small);
	--boho--line-height: inherit;
}

article .boho-clickable-figure:hover ~ [class$="title"] a,
article .boho-clickable-figure:hover ~ .card-content [class$="title"] a {
	--theme-text-decoration: underline;
	--has-link-decoration: var(--true);
	text-decoration-thickness: var(--boho--text-decoration-thickness);
	color: var(--theme-link-hover-color);
}

article .boho-clickable-figure:hover {
	cursor: pointer;
}

@supports (-moz-appearance: none) {
	article [class$="title"] a:focus-visible {
		display: inline-block;
	}
}


/**
* SIDEBAR, AUTHOR BOX & RELATED POSTS
**/

.ct-sidebar .widget-title {
	--boho--font-size: var(--wp--preset--font-size--large);
	--boho--line-height: 1.4;
}

.author-box .author-box-bio {
	text-wrap: balance;
}

[data-prefix="single_blog_post"] .ct-related-posts .related-entry-title {
	--boho--font-size: var(--wp--preset--font-size--small);
}


/**
* NEWSLETTER & PAGINATION
**/

.ct-newsletter-subscribe-form button {
	--theme-button-border-radius: 4em;
	height: var(--theme-form-field-height, 40px);
	max-height: var(--theme-form-field-height, 40px);
	font-size: var(--theme-button-font-size);
}

[data-pagination] :is(.prev, .next) {
	font-size: var(--wp--preset--font-size--small);
}


/**
* COMMENTS
**/

#comments .comment-reply-title {
	font-size: var(--wp--preset--font-size--large);
}

#comments .comment-reply-title #cancel-comment-reply-link {
	font-family: var(--theme-button-font-family);
	font-weight: 600;
	font-size: .8rem;
	padding: 0.3em 0.6em;
}

#comments .comment-form :is(.logged-in-as, .comment-notes, label) {
	font-size: var(--wp--preset--font-size--small);
}

#comments .ct-comment-list .ct-comment-author {
	font-size: var(--wp--preset--font-size--medium);
}

#comments .ct-comment-list .ct-comment-meta-data {
	--theme-link-initial-color: var(--theme-palette-color-1);
	--theme-text-decoration: underline;
	font-size: var(--wp--preset--font-size--small);
	gap: 0.8em;
}

#comments .ct-comment-list .ct-comment-meta-data .comment-reply-link {
	height: unset;
	padding: 0em 0.5em;
}


/**
* FOOTER
**/

.ct-footer {
	--boho--font-size: var(--wp--preset--font-size--small);
}

.ct-footer .site-title {
	--boho--font-size: var(--wp--preset--font-size--large);
}

.ct-footer .site-description {
	--boho--font-size: var(--wp--preset--font-size--small);
}

.ct-footer :is([data-id="menu"], [data-id="language-switcher"]) {
	--boho--letter-spacing: 1px;
}

.ct-footer .ct-widget a {
	--theme-text-decoration: underline;
}


/******************************************************************************
* 5. CORE WORDPRESS BLOCKS
******************************************************************************/

/**
* TEXT BLOCKS
**/

:is(blockquote, figure.wp-block-pullquote blockquote) cite {
	font-size: var(--wp--preset--font-size--small, inherit);
	font-weight: unset;
}

.wp-block-details {
	margin-block-start: var(--wp--preset--spacing--50);
	border: var(--boho--border-width) solid var(--theme-palette-color-5);
	border-radius: var(--boho--border-radius);
	background: var(--theme-palette-color-8);
	padding: 0.25em;
}

.wp-block-details > summary {
	margin-bottom: 0;
	font-weight: bold;
}

.wp-block-details > summary:hover {
	text-decoration: underline;
	text-decoration-thickness: var(--boho--text-decoration-thickness);
}

.wp-block-details > * {
	border-radius: 2px;
	margin: 0.25em;
	padding-inline: 0.25em;
}

.wp-block-details > :not(summary) {
	margin-block-start: 0.5rem;
}

.wp-block-details > :last-child {
	margin-bottom: 0.25rem;
}

:where(.editor-styles-wrapper, .entry-content) :is(pre, samp, kbd),
:not(pre) > code {
	border-radius: var(--boho--border-radius);
	border: var(--boho--border-width) solid var(--theme-palette-color-5);
	background: var(--theme-palette-color-6);
	font-size: var(--theme-font-size, inherit);  
	font-weight: var(--theme-font-weight, inherit);
}

:where(.editor-styles-wrapper, .entry-content) :is(code, kbd, samp) {
	padding: 3px 6px;
}

.wp-block-pullquote.has-text-align-center {
	text-wrap: var(--boho--text-wrap);
}


/**
* TABLE BLOCKS
**/

.wp-block-table.is-style-stripes tbody tr:nth-child(2n+1) {
	background-color: var(--theme-palette-color-6, #8882);
}

.wp-block-table img[src$=".svg"] {
	max-height: var(--boho--table--svg--max-height);
}

.wp-block-table td:has(img[src$=".svg"]) {
	line-height: var(--boho--table--svg--max-height);
}

.wp-block-table .block-editor-rich-text__editable.rich-text:has(img[src$=".svg"]) {
	max-height: var(--boho--table--svg--max-height);
}


/**
* ACCORDION BLOCK
**/

.wp-block-accordion-heading__toggle-icon {
	border-radius: 50%;
	color: var(--theme-button-background-initial-color);
	border-width: var(--boho--border-width);
	border-style: solid;
	border-color: var(--theme-button-background-initial-color);
}

.wp-block-accordion-heading__toggle:hover .wp-block-accordion-heading__toggle-title {
	text-decoration-thickness: var(--boho--text-decoration-thickness);
	color: var(--theme-link-hover-color);
}

.wp-block-accordion-heading__toggle:hover .wp-block-accordion-heading__toggle-icon,
.wp-block-accordion-heading__toggle-icon:hover {
	color: var(--theme-button-text-hover-color);
	border-color: var(--theme-button-background-hover-color);
	background-color: var(--theme-button-background-hover-color);
}


/**
* TABS BLOCK
**/

.wp-block-tab-list {
	font-weight: bold;
}

.wp-block-tab-list button[aria-selected="true"] {
	color: var(--theme-headings-color);
}

.wp-block-tab-list button[aria-selected="true"]::before {
	border-bottom: var(--boho--text-decoration-thickness) solid;
}

.wp-block-tab-list button[aria-selected="false"]:hover {
	color: var(--theme-link-hover-color);
}

.wp-block-tab-list button[aria-selected="false"]:hover::before {
	content: "";
	position: absolute;
	border-bottom: var(--boho--text-decoration-thickness) solid var(--theme-link-hover-color);
	pointer-events: none;
	left: 0;
	width: 100%;
	bottom: 0;
}


/**
* EMBED BLOCKS & MEDIA
**/

.wp-block-embed.is-provider-peertube iframe {
	aspect-ratio: 16 / 9;
	width: 100%;
	height: auto;
}

.wp-block-embed.is-provider-pocket-casts iframe {
	width: 100%;
}

@supports (-moz-appearance: none) {
	[data-color-mode="dark"] .wp-block-audio audio {
		--audio-border-color: #3337;
		--audio-background: #7777;
		--audio-filter: brightness(1.2) saturate(0.5);
	}

	.wp-block-audio audio {
		display: flex;
		border: 2px solid var(--audio-border-color, #7777);
		background: var(--audio-background, #0007);
		filter: var(--audio-filter, invert(1) contrast(0.8) brightness(1.2) hue-rotate(180deg) saturate(0.7));
	}
}


/******************************************************************************
* 6. THIRD-PARTY PLUGIN INTEGRATIONS
******************************************************************************/

/**
* POLYLANG / LANGUAGE SWITCHER
**/

.ct-language-switcher .ct-language img,
.ct-language-switcher li img,
.pll-parent-menu-item a img {
	width: calc(var(--theme-icon-size, .8em) * 1.2);
	max-width: calc(var(--theme-icon-size, .8em) * 1.2);
}


/**
* LIGHTBOX (BAGUETTEBOX & CORE LIGHTBOX)
**/

.wp-lightbox-overlay .scrim {
	background: var(--theme-palette-color-8) !important;
}

.wp-lightbox-overlay .wp-lightbox-navigation-button,
.wp-lightbox-overlay .wp-lightbox-close-button {
	fill: var(--theme-palette-color-4) !important;
}

.wp-lightbox-overlay .wp-lightbox-navigation-text,
.wp-lightbox-overlay .wp-lightbox-close-text {
	color: var(--theme-palette-color-4) !important;
}

#baguetteBox-overlay .full-image img {
	max-height: calc(100vh - 48px);
}

.baguetteBox-button svg {
	filter: brightness(150%);
}


/**
* SIMPLETOC
**/

.simpletoc-list li a:not(:hover) {
	text-decoration: none;
}


/**
* EMBED PRIVACY
**/

@media (max-width: 480px) {
	.wp-block-embed .embed-privacy-overlay {
		min-height: 160px;
		padding: 12px;
	}

	.wp-block-embed .embed-privacy-overlay .embed-privacy-logo {
		height: 32px;
		margin-bottom: 12px;
	}

	.wp-block-embed .embed-privacy-overlay p {
		line-height: 1.25;
		margin-block-end: 12px;
	}

	.wp-block-embed .embed-privacy-overlay a {
		white-space: nowrap;
	}
}

.wp-block-embed .embed-privacy-container .screen-reader-text {
	color: black;
	background: white;
}

.wp-block-embed .embed-privacy-container .embed-privacy-overlay {
	backdrop-filter: blur(3px);
}

.wp-block-embed .embed-privacy-input-wrapper label {
	font-size: var(--wp--preset--font-size--small, small);
}


/******************************************************************************
* 7. UTILITIES & HELPER CLASSES
******************************************************************************/

/* Dark / Light adaptive grayscale for logos */
[data-color-mode="dark"] img {
	--boho--grayscale: grayscale(1) contrast(0.3) brightness(1.7);
}

:is(.boho--grayscale img, img.boho--grayscale) {
	filter: var(--boho--grayscale, grayscale(1) contrast(1.5) brightness(0.7));
}

/* Prevent phone numbers from wrapping */
a[href^="tel:"] {
	white-space: nowrap;
}


/******************************************************************************
* 8. PATTERNS & EXPERIMENTAL
******************************************************************************/

/* Hero Section Media Filter */
.hero-section[data-type="type-2"] > figure .ct-media-container img {
	filter: var(--boho--post-title--image-filter);
	object-position: center 33%;
}

.hero-section[data-type="type-2"] > figure .ct-media-container::after {
	opacity: var(--boho--post-title--image-overlay-opacity);
}
