/**
 * Saratoga Sparks — dark mode (html[data-sspks-theme="dark"] / body.sspks-theme-dark)
 * Uses tokens from wp_head inline #sspks-dark-mode-vars.
 */

/* -------------------------------------------------------------------------
 * Document & base typography
 * ------------------------------------------------------------------------- */

html[data-sspks-theme="dark"] body,
body.sspks-theme-dark {
	background-color: var(--sspks-surface) !important;
	color: var(--sspks-ink) !important;
}

html[data-sspks-theme="dark"] .wp-site-blocks,
html[data-sspks-theme="dark"] .wp-block-group,
html[data-sspks-theme="dark"] .wp-block-columns,
html[data-sspks-theme="dark"] .wp-block-column,
html[data-sspks-theme="dark"] main,
html[data-sspks-theme="dark"] article,
html[data-sspks-theme="dark"] .entry-content,
html[data-sspks-theme="dark"] .entry-header,
html[data-sspks-theme="dark"] .entry-footer,
html[data-sspks-theme="dark"] .post-content,
html[data-sspks-theme="dark"] .post-excerpt,
html[data-sspks-theme="dark"] .content-area,
html[data-sspks-theme="dark"] .site-content,
html[data-sspks-theme="dark"] .site-main,
html[data-sspks-theme="dark"] .widget,
html[data-sspks-theme="dark"] .widget-area,
html[data-sspks-theme="dark"] .sidebar,
html[data-sspks-theme="dark"] .comments-area,
html[data-sspks-theme="dark"] .comment-body,
html[data-sspks-theme="dark"] .comment-meta,
html[data-sspks-theme="dark"] .comment-content,
html[data-sspks-theme="dark"] .wp-block-post-title,
html[data-sspks-theme="dark"] .wp-block-post-content,
html[data-sspks-theme="dark"] .wp-block-post-excerpt,
html[data-sspks-theme="dark"] .wp-block-post-date,
html[data-sspks-theme="dark"] .wp-block-post-author,
html[data-sspks-theme="dark"] .wp-block-post-terms,
html[data-sspks-theme="dark"] .wp-block-query-title,
html[data-sspks-theme="dark"] .wp-block-site-title,
html[data-sspks-theme="dark"] .wp-block-site-tagline,
html[data-sspks-theme="dark"] .wp-block-navigation,
html[data-sspks-theme="dark"] .wp-block-navigation-item,
html[data-sspks-theme="dark"] .wp-block-navigation__responsive-container,
html[data-sspks-theme="dark"] .wp-block-latest-posts,
html[data-sspks-theme="dark"] .wp-block-latest-comments,
html[data-sspks-theme="dark"] .wp-block-archives,
html[data-sspks-theme="dark"] .wp-block-categories,
html[data-sspks-theme="dark"] .wp-block-calendar,
html[data-sspks-theme="dark"] .wp-block-table,
html[data-sspks-theme="dark"] .wp-block-media-text,
html[data-sspks-theme="dark"] .wp-block-quote,
html[data-sspks-theme="dark"] .wp-block-pullquote,
html[data-sspks-theme="dark"] .wp-block-verse,
html[data-sspks-theme="dark"] .wp-block-list,
html[data-sspks-theme="dark"] .wp-block-separator,
html[data-sspks-theme="dark"] .wp-block-read-more,
html[data-sspks-theme="dark"] .wp-block-breadcrumbs,
html[data-sspks-theme="dark"] .alignwide,
html[data-sspks-theme="dark"] .alignfull,
body.sspks-theme-dark .wp-site-blocks,
body.sspks-theme-dark .entry-content,
body.sspks-theme-dark .wp-block-post-content {
	color: var(--sspks-ink);
}

html[data-sspks-theme="dark"] h1,
html[data-sspks-theme="dark"] h2,
html[data-sspks-theme="dark"] h3,
html[data-sspks-theme="dark"] h4,
html[data-sspks-theme="dark"] h5,
html[data-sspks-theme="dark"] h6,
html[data-sspks-theme="dark"] .wp-block-heading,
body.sspks-theme-dark h1,
body.sspks-theme-dark h2,
body.sspks-theme-dark h3,
body.sspks-theme-dark h4,
body.sspks-theme-dark h5,
body.sspks-theme-dark h6 {
	color: var(--sspks-ink);
}

html[data-sspks-theme="dark"] p,
html[data-sspks-theme="dark"] li,
html[data-sspks-theme="dark"] dd,
html[data-sspks-theme="dark"] dt,
html[data-sspks-theme="dark"] td,
html[data-sspks-theme="dark"] th,
html[data-sspks-theme="dark"] caption,
html[data-sspks-theme="dark"] label,
html[data-sspks-theme="dark"] legend,
html[data-sspks-theme="dark"] figcaption,
html[data-sspks-theme="dark"] .wp-element-caption,
html[data-sspks-theme="dark"] .wp-caption-text,
html[data-sspks-theme="dark"] .gallery-caption,
html[data-sspks-theme="dark"] .blocks-gallery-caption {
	color: var(--sspks-ink);
}

html[data-sspks-theme="dark"] small,
html[data-sspks-theme="dark"] .wp-block-post-date,
html[data-sspks-theme="dark"] .post-meta,
html[data-sspks-theme="dark"] .entry-meta,
html[data-sspks-theme="dark"] .muted,
html[data-sspks-theme="dark"] .is-style-muted,
html[data-sspks-theme="dark"] .has-muted-color {
	color: var(--sspks-muted);
}

/* -------------------------------------------------------------------------
 * Links
 * ------------------------------------------------------------------------- */

html[data-sspks-theme="dark"] a,
body.sspks-theme-dark a {
	color: var(--sspks-accent);
}

html[data-sspks-theme="dark"] a:hover,
html[data-sspks-theme="dark"] a:focus-visible,
body.sspks-theme-dark a:hover,
body.sspks-theme-dark a:focus-visible {
	color: var(--sspks-accent-hover);
}

html[data-sspks-theme="dark"] a:visited,
body.sspks-theme-dark a:visited {
	color: color-mix(in srgb, var(--sspks-accent) 88%, var(--sspks-ink) 12%);
}

html[data-sspks-theme="dark"] .entry-content a.wp-block-button__link,
html[data-sspks-theme="dark"] .wp-block-button__link {
	color: var(--sspks-on-accent);
}

html[data-sspks-theme="dark"] .entry-content a.wp-block-button__link:hover {
	color: var(--sspks-on-accent);
}

/* -------------------------------------------------------------------------
 * Plugin buttons (solid uses on-accent, not page surface)
 * ------------------------------------------------------------------------- */

html[data-sspks-theme="dark"] .sspks-button:not(.is-outline),
body.sspks-theme-dark .sspks-button:not(.is-outline) {
	color: var(--sspks-on-accent);
}

html[data-sspks-theme="dark"] .sspks-button.is-outline,
body.sspks-theme-dark .sspks-button.is-outline {
	color: var(--sspks-accent);
	background: var(--sspks-surface);
	border-color: var(--sspks-border-strong);
}

html[data-sspks-theme="dark"] .sspks-button.is-outline:hover,
body.sspks-theme-dark .sspks-button.is-outline:hover {
	color: var(--sspks-accent-hover);
	background: var(--sspks-accent-soft);
	border-color: var(--sspks-accent);
}

/* -------------------------------------------------------------------------
 * Forms
 * ------------------------------------------------------------------------- */

html[data-sspks-theme="dark"] input[type="text"],
html[data-sspks-theme="dark"] input[type="search"],
html[data-sspks-theme="dark"] input[type="email"],
html[data-sspks-theme="dark"] input[type="url"],
html[data-sspks-theme="dark"] input[type="tel"],
html[data-sspks-theme="dark"] input[type="number"],
html[data-sspks-theme="dark"] input[type="password"],
html[data-sspks-theme="dark"] input[type="date"],
html[data-sspks-theme="dark"] input[type="time"],
html[data-sspks-theme="dark"] textarea,
html[data-sspks-theme="dark"] select {
	background-color: var(--sspks-dark-surface-2);
	color: var(--sspks-ink);
	border-color: var(--sspks-border-strong);
}

html[data-sspks-theme="dark"] input::placeholder,
html[data-sspks-theme="dark"] textarea::placeholder {
	color: var(--sspks-ink-faint);
}

html[data-sspks-theme="dark"] select option {
	background-color: var(--sspks-surface);
	color: var(--sspks-ink);
}

/* -------------------------------------------------------------------------
 * Tables, quotes, code
 * ------------------------------------------------------------------------- */

html[data-sspks-theme="dark"] table,
html[data-sspks-theme="dark"] .wp-block-table table {
	border-color: var(--sspks-border);
}

html[data-sspks-theme="dark"] th,
html[data-sspks-theme="dark"] td {
	border-color: var(--sspks-border);
}

html[data-sspks-theme="dark"] blockquote,
html[data-sspks-theme="dark"] .wp-block-quote {
	border-color: var(--sspks-border-strong);
	color: var(--sspks-ink);
}

html[data-sspks-theme="dark"] pre,
html[data-sspks-theme="dark"] code,
html[data-sspks-theme="dark"] kbd,
html[data-sspks-theme="dark"] samp {
	background: var(--sspks-dark-surface-2);
	color: var(--sspks-ink);
	border-color: var(--sspks-border);
}

html[data-sspks-theme="dark"] hr,
html[data-sspks-theme="dark"] .wp-block-separator {
	border-color: var(--sspks-border);
	opacity: 1;
}

/* -------------------------------------------------------------------------
 * Media & embeds (no filter on images)
 * ------------------------------------------------------------------------- */

html[data-sspks-theme="dark"] .wp-block-embed,
html[data-sspks-theme="dark"] .wp-block-video,
html[data-sspks-theme="dark"] iframe {
	color: var(--sspks-ink);
}

/* -------------------------------------------------------------------------
 * WordPress preset / theme color classes (override common light defaults)
 * ------------------------------------------------------------------------- */

html[data-sspks-theme="dark"] .has-background,
html[data-sspks-theme="dark"] .has-base-background-color {
	background-color: var(--sspks-surface) !important;
}

html[data-sspks-theme="dark"] .has-contrast-color {
	color: var(--sspks-ink) !important;
}

html[data-sspks-theme="dark"] .has-link-color a {
	color: var(--sspks-accent) !important;
}

/* -------------------------------------------------------------------------
 * Plugin surfaces (nav, grids, footer, etc.)
 * ------------------------------------------------------------------------- */

html[data-sspks-theme="dark"] .sspks-site-nav-root,
html[data-sspks-theme="dark"] .sspks-post-grid,
html[data-sspks-theme="dark"] .sspks-newsfeed,
html[data-sspks-theme="dark"] .sspks-single-post-meta,
html[data-sspks-theme="dark"] .sspks-related-sidebar,
html[data-sspks-theme="dark"] .sspks-event-card,
html[data-sspks-theme="dark"] .sspks-simple-footer,
html[data-sspks-theme="dark"] [class*="sspks-cornerstone"],
html[data-sspks-theme="dark"] [class^="sspks-"],
html[data-sspks-theme="dark"] [class*=" sspks-"] {
	color: var(--sspks-ink);
}

html[data-sspks-theme="dark"] .sspks-site-nav-root a,
html[data-sspks-theme="dark"] .sspks-post-grid a,
html[data-sspks-theme="dark"] .sspks-simple-footer a {
	color: var(--sspks-accent);
}

html[data-sspks-theme="dark"] .sspks-site-nav-root a:hover,
html[data-sspks-theme="dark"] .sspks-post-grid a:hover,
html[data-sspks-theme="dark"] .sspks-simple-footer a:hover {
	color: var(--sspks-accent-hover);
}

/* Post grid: filters & location use --sspks-pg-ink as a dark fill in light mode; in dark mode that token is light text — remap. */
html[data-sspks-theme="dark"] .sspks-post-grid__filter,
body.sspks-theme-dark .sspks-post-grid__filter {
	background: var(--sspks-dark-surface-2);
	border-color: var(--sspks-border-strong);
	color: var(--sspks-ink);
}

html[data-sspks-theme="dark"] .sspks-post-grid__filter:hover,
html[data-sspks-theme="dark"] .sspks-post-grid__filter:focus-visible,
body.sspks-theme-dark .sspks-post-grid__filter:hover,
body.sspks-theme-dark .sspks-post-grid__filter:focus-visible {
	background: var(--sspks-surface-raised);
	border-color: var(--sspks-border-strong);
	color: var(--sspks-ink);
}

html[data-sspks-theme="dark"] .sspks-post-grid__filter.is-active,
body.sspks-theme-dark .sspks-post-grid__filter.is-active {
	background: var(--sspks-accent);
	border-color: var(--sspks-accent);
	color: var(--sspks-on-accent);
}

html[data-sspks-theme="dark"] .sspks-post-grid__filter.is-active:hover,
html[data-sspks-theme="dark"] .sspks-post-grid__filter.is-active:focus-visible,
body.sspks-theme-dark .sspks-post-grid__filter.is-active:hover,
body.sspks-theme-dark .sspks-post-grid__filter.is-active:focus-visible {
	background: var(--sspks-accent-hover);
	border-color: var(--sspks-accent-hover);
	color: var(--sspks-on-accent);
}

html[data-sspks-theme="dark"] .sspks-post-grid__active-location,
body.sspks-theme-dark .sspks-post-grid__active-location {
	background: var(--sspks-dark-surface-2);
	color: var(--sspks-ink);
	border: 1px solid var(--sspks-border-strong);
}

html[data-sspks-theme="dark"] .sspks-post-grid__active-location-clear,
body.sspks-theme-dark .sspks-post-grid__active-location-clear {
	color: var(--sspks-accent);
	opacity: 0.9;
}

html[data-sspks-theme="dark"] .sspks-post-grid__active-location-clear:hover,
body.sspks-theme-dark .sspks-post-grid__active-location-clear:hover {
	color: var(--sspks-accent-hover);
	opacity: 1;
}

html[data-sspks-theme="dark"] .sspks-post-grid__filter-select,
body.sspks-theme-dark .sspks-post-grid__filter-select {
	background: var(--sspks-dark-surface-2);
	border-color: var(--sspks-border-strong);
	color: var(--sspks-ink);
}

html[data-sspks-theme="dark"] .sspks-post-grid__pagination .page-numbers.current,
body.sspks-theme-dark .sspks-post-grid__pagination .page-numbers.current {
	background: var(--sspks-accent);
	border-color: var(--sspks-accent);
	color: var(--sspks-on-accent);
}

/* -------------------------------------------------------------------------
 * Theme toggle control
 * ------------------------------------------------------------------------- */

.sspks-theme-toggle-wrap {
	display: inline-flex;
	align-items: center;
	vertical-align: middle;
}

.sspks-theme-toggle {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	padding: 0.45em 0.65em;
	margin: 0;
	font: inherit;
	line-height: 1;
	cursor: pointer;
	color: var(--sspks-ink);
	background: var(--sspks-surface-muted);
	border: 1px solid var(--sspks-border);
	border-radius: var(--sspks-radius-pill);
	box-shadow: var(--sspks-shadow-xs);
	transition:
		background var(--sspks-duration) var(--sspks-ease),
		color var(--sspks-duration) var(--sspks-ease),
		border-color var(--sspks-duration) var(--sspks-ease);
}

.sspks-theme-toggle:hover,
.sspks-theme-toggle:focus-visible {
	background: var(--sspks-surface-raised);
	border-color: var(--sspks-border-strong);
	outline: none;
}

.sspks-theme-toggle:focus-visible {
	outline: 2px solid var(--sspks-accent);
	outline-offset: 2px;
}

.sspks-theme-toggle__icon {
	display: inline-flex;
	color: currentColor;
}

.sspks-theme-toggle__icon svg {
	display: block;
}

.sspks-theme-toggle__label {
	font-size: 0.875rem;
	font-weight: 600;
}

html[data-sspks-theme="dark"] .sspks-theme-toggle,
body.sspks-theme-dark .sspks-theme-toggle {
	color: var(--sspks-ink);
	background: var(--sspks-dark-surface-2);
	border-color: var(--sspks-border-strong);
}