/**
 * TripWays Theme – Dark mode (hybrid: shell tokens + main content invert)
 */

/* === Global === */
html[data-theme="dark"] {
	color-scheme: dark;
}

html[data-theme="dark"] body {
	background: #0a0a0a;
}

/* Shell-only tokens (header + footer). Do NOT set on html — that leaks light
   contrast into #primary and double-inverts headings to near-black. */
html[data-theme="dark"] .tripways-header,
html[data-theme="dark"] .tripways-footer-links,
html[data-theme="dark"] .tripways-footer {
	--wp--preset--color--base: #0a0a0a;
	--wp--preset--color--contrast: #e8eef4;
	--wp--preset--color--primary: #e7fb79;
	--wp--preset--color--primary-dark: #c8dc5a;
	--wp--preset--color--muted: #94a3b8;
}

html[data-theme="dark"] .tripways-header {
	color: var(--wp--preset--color--contrast, #e8eef4);
	background: var(--wp--preset--color--base, #0a0a0a);
}

/* Header / nav borders and shadows */
html[data-theme="dark"] .tripways-header__menu .sub-menu {
	border-color: rgba(255, 255, 255, 0.12);
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.45);
}

html[data-theme="dark"] .tripways-header__mobile-nav {
	border-bottom-color: rgba(255, 255, 255, 0.12);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
}

html[data-theme="dark"] .tripways-header__mobile-menu li {
	border-bottom-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .tripways-header__mobile-actions {
	border-top-color: rgba(255, 255, 255, 0.08);
}

/* Logo on dark header — skip when a dedicated dark attachment is provided */
html[data-theme="dark"] .tripways-header__brand .custom-logo:not([data-tw-theme-img]),
html[data-theme="dark"] .tripways-footer-links__logo-img:not([data-tw-theme-img]) {
	filter: invert(1) hue-rotate(180deg);
}

/*
 * Homepage hero background — absolute themed imgs (Customizer / shortcode / Cover block).
 * Parent #primary invert + img re-invert restores the CMS light/dark asset.
 */
.tripways-home-hero--has-bg,
.wp-block-cover.tripways-cover-hero--has-bg {
	position: relative;
	overflow: hidden;
}

.tripways-home-hero--has-bg {
	background: none !important;
}

.tripways-home-hero__bg,
.wp-block-cover.tripways-cover-hero--has-bg .tripways-home-hero__bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center bottom;
	z-index: 0;
	pointer-events: none;
}

/* Cover block: soften the white gradient overlay in dark mode */
html[data-theme="dark"] .wp-block-cover.tripways-cover-hero--has-bg .wp-block-cover__background.has-background-gradient {
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0.15) 62%) !important;
}

/*
 * Homepage AI search ([tripways_search]) — neon border matches dark-mode brand (#e7fb79).
 * Counter-invert the wrap so border/icon colors are not flipped by #primary invert.
 */
html[data-theme="dark"] #primary.site-main .tripways-search-wrap {
	filter: invert(1) hue-rotate(180deg);
	isolation: isolate;
}

html[data-theme="dark"] #primary.site-main .tripways-search-field {
	background: #141820 !important;
	border-color: #e7fb79 !important;
	box-shadow:
		0 0 0 1px rgba(231, 251, 121, 0.55),
		0 0 14px rgba(231, 251, 121, 0.22) !important;
}

html[data-theme="dark"] #primary.site-main .tripways-search-field:focus-within {
	border-color: #e7fb79 !important;
	box-shadow:
		0 0 0 2px rgba(231, 251, 121, 0.75),
		0 0 20px rgba(231, 251, 121, 0.35) !important;
}

html[data-theme="dark"] #primary.site-main .tripways-search-input {
	color: #e8eef4;
}

html[data-theme="dark"] #primary.site-main .tripways-search-input::placeholder {
	color: #94a3b8;
}

html[data-theme="dark"] #primary.site-main .tripways-search-icon .tripways-search-icon-svg {
	color: #e7fb79;
	stroke: currentColor;
}

html[data-theme="dark"] #primary.site-main .tripways-search-rotating-label {
	color: #94a3b8;
}

.tripways-home-hero--has-bg .tripways-home-hero__inner {
	position: relative;
	z-index: 1;
}

/*
 * Optional background-image swap for non-hero elements (CSS variables):
 *
 * <div class="tripways-theme-bg" style="--tw-theme-bg-light:url(...png);--tw-theme-bg-dark:url(...png)"></div>
 */
.tripways-theme-bg {
	background-image: var(--tw-theme-bg-light);
	background-size: var(--tw-theme-bg-size, cover);
	background-position: var(--tw-theme-bg-position, center);
	background-repeat: var(--tw-theme-bg-repeat, no-repeat);
}

html[data-theme="dark"] .tripways-theme-bg {
	background-image: var(--tw-theme-bg-dark, var(--tw-theme-bg-light));
}

/* === Main content invert (plugin pages + homepage) === */
html[data-theme="dark"] #primary.site-main:not(:has(.tripways-prospectus)):not(:has(.tw-customer-dash)):not(:has(.tw-vhub)) {
	/* Keep light-mode tokens here so invert yields light headings on dark bg */
	--wp--preset--color--base: #ffffff;
	--wp--preset--color--contrast: #1a1a1a;
	--wp--preset--color--primary: #2563eb;
	--wp--preset--color--primary-dark: #0f172a;
	--wp--preset--color--muted: #64748b;
	color: #1a1a1a;
	filter: invert(1) hue-rotate(180deg);
	isolation: isolate;
}

/* Headings + titles that use contrast token (tour h1, blog h1, section titles) */
html[data-theme="light"] #primary.site-main :is(h1, h2, h3, .entry-title, .tripways-blog-title, .tripways-tour-section-title),
html:not([data-theme]) #primary.site-main :is(h1, h2, h3, .entry-title, .tripways-blog-title, .tripways-tour-section-title) {
	color: var(--wp--preset--color--contrast, #1a1a1a);
}

/* Re-invert media so photos stay natural; hero bg uses its own layer rules below */
html[data-theme="dark"] #primary.site-main:not(:has(.tripways-prospectus)):not(:has(.tw-customer-dash)) :is(img:not(.tripways-home-hero__bg), video, picture) {
	filter: invert(1) hue-rotate(180deg);
}

/* Hero bg: parent invert + img re-invert restores the CMS light/dark asset */
html[data-theme="dark"] #primary.site-main .tripways-home-hero__bg {
	filter: invert(1) hue-rotate(180deg);
}

html[data-theme="dark"] #primary.site-main:not(:has(.tripways-prospectus)) svg.tripways-keep-color {
	filter: invert(1) hue-rotate(180deg);
}

html[data-theme="dark"] #primary.site-main .tripways-theme-media-island {
	filter: invert(1) hue-rotate(180deg);
	isolation: isolate;
}

/*
 * Re-invert embeds that must keep their native colors (video, captcha).
 * Do NOT re-invert Bokun booking iframes — they should inherit the single
 * main invert so the calendar matches dark mode instead of a bright white box.
 */
html[data-theme="dark"] #primary.site-main:not(:has(.tripways-prospectus)):not(:has(.tw-customer-dash)) :is(
	.tripways-video-embed iframe,
	.cf-turnstile,
	.g-recaptcha
) {
	filter: invert(1) hue-rotate(180deg);
}

html[data-theme="dark"] #primary.site-main .tripways-calendar-widget-wrap :is(iframe, .bokunWidget) {
	filter: none !important;
}

/*
 * Bokun floating cart bubble — injected on <body> by BokunWidgetsLoader.js,
 * outside #primary, so it misses the main invert and appears as a white square.
 */
html[data-theme="dark"] #bokun-widgets-root {
	filter: invert(1) hue-rotate(180deg);
}

html[data-theme="dark"] #bokun-widgets-root iframe {
	filter: none !important;
}