/* HaruDigi Things to Do — front styles (uses theme design tokens) */

.hdtdo {
	/* Local type root: survives Bootstrap html{font-size:10px} without touching the whole page */
	font-size: max(1rem, 16px);
	--_ink: var(--wp--preset--color--contrast, #3a231a);
	--_ink2: var(--wp--preset--color--text-secondary, #5c4437);
	--_muted: var(--wp--preset--color--muted, #7d6a5f);
	--_surface: var(--wp--preset--color--surface, #fff);
	--_surface-alt: var(--wp--preset--color--surface-alt, #fbf6f1);
	--_border: var(--wp--preset--color--border, #ede4dc);
	--_primary: var(--wp--preset--color--primary, #4a6db5);
	--_accent: var(--wp--preset--color--accent, #ff7b54);
	--_tangerine: var(--wp--preset--color--tangerine, #ff6b00);
	--_gradient: var(--wp--custom--harudigi--gradient, linear-gradient(135deg, #ff6b00 0%, #ff7b54 50%, #ffb26b 100%));
	--_radius: var(--wp--custom--harudigi--radius, 1em);
	--_radius-lg: var(--wp--custom--harudigi--radius-lg, 1.5em);
	--_font-head: var(--wp--preset--font-family--poppins, "Poppins", system-ui, sans-serif);
	--_font-body: var(--wp--preset--font-family--inter, Inter, system-ui, sans-serif);
	--_shadow: 0 10px 34px rgba(58, 35, 26, 0.08);
	--_shadow-lift: 0 18px 44px rgba(58, 35, 26, 0.14);
	color: var(--_ink);
	font-family: var(--_font-body);
	line-height: 1.65;
	overflow-x: clip;
}

.hdtdo-wrap {
	width: min(1160px, calc(100% - 2.5em));
	margin-inline: auto;
}

.hdtdo-wrap--narrow {
	width: min(760px, calc(100% - 2.5em));
}

/* ---------- archive ---------- */
.hdtdo--archive {
	background: var(--_surface);
	color: var(--_ink);
	border-radius: var(--_radius-lg);
	overflow: clip;
}

/* ---------- archive hero ---------- */
.hdtdo-hero {
	position: relative;
	padding: clamp(3em, 7vw, 5.5em) 0 clamp(1.5em, 3vw, 2.5em);
	text-align: center;
	background:
		radial-gradient(60% 90% at 50% 0%, color-mix(in srgb, var(--_tangerine) 9%, transparent), transparent 70%),
		var(--_surface-alt);
}

.hdtdo-hero__eyebrow {
	margin: 0 0 0.85em;
	font-size: 0.8em;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--_accent);
}

.hdtdo-hero__eyebrow a {
	color: inherit;
	text-decoration: none;
}

.hdtdo-hero__eyebrow a:hover {
	text-decoration: underline;
}

.hdtdo-hero__title {
	margin: 0 0 1em;
	font-family: var(--_font-head);
	font-size: clamp(2.1em, 5vw, 3.4em);
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--_ink);
}

.hdtdo-hero__intro {
	margin: 0 auto;
	max-width: 44em;
	color: var(--_ink2);
	font-size: clamp(1em, 1.4vw, 1.15em);
}

/* ---------- category chips ---------- */
.hdtdo-cats {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6em;
	justify-content: center;
	padding: 1.75em 0 0.5em;
}

.hdtdo-cats__chip {
	display: inline-flex;
	align-items: center;
	gap: 0.45em;
	padding: 0.5em 1.1em;
	border: 1px solid var(--_border);
	border-radius: 999px;
	background: var(--_surface);
	color: var(--_ink2);
	text-decoration: none;
	font-size: 0.9em;
	font-weight: 600;
	transition: border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.hdtdo-cats__chip:hover {
	border-color: var(--_accent);
	color: var(--_accent);
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(255, 123, 84, 0.16);
}

.hdtdo-cats__chip.is-active {
	border-color: transparent;
	background: var(--_gradient);
	color: #fff;
}

.hdtdo-cats__chip.is-active .hdtdo-cats__count {
	color: rgba(255, 255, 255, 0.85);
}

.hdtdo-cats__count {
	color: var(--_muted);
	font-size: 0.78em;
	font-weight: 500;
}

/* ---------- card grid ---------- */
/* ---------- coming up strip ---------- */
.hdtdo-upcoming {
	margin: 1.5em 0 0.5em;
	padding: 1.25em 1.25em 1.35em;
	border: 1px solid var(--_border);
	border-radius: var(--_radius-lg);
	background: var(--_surface);
	box-shadow: var(--_shadow);
}

.hdtdo-upcoming .hdtdo-section-title {
	margin-bottom: 0.85em;
	font-size: 1.2em;
}

.hdtdo-upcoming__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.hdtdo-upcoming__item + .hdtdo-upcoming__item {
	border-top: 1px solid color-mix(in srgb, var(--_border) 75%, transparent);
}

.hdtdo-upcoming__row {
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: 0.85em;
	align-items: center;
	padding: 0.85em 0.15em;
	color: inherit;
	text-decoration: none;
	border-radius: 0.65em;
	transition: background 0.15s ease;
}

.hdtdo-upcoming__row:hover {
	background: color-mix(in srgb, var(--_surface-alt) 80%, transparent);
}

.hdtdo-upcoming__chip {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-width: 3.4em;
	padding: 0.4em 0.55em 0.5em;
	border-radius: 0.75em;
	background: var(--_gradient);
	color: #fff;
	line-height: 1.05;
	box-shadow: 0 4px 12px rgba(255, 107, 0, 0.22);
}

.hdtdo-upcoming__month {
	font-family: var(--_font-head);
	font-size: 0.68em;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	opacity: 0.92;
}

.hdtdo-upcoming__day {
	font-family: var(--_font-head);
	font-size: 1.35em;
	font-weight: 700;
}

.hdtdo-upcoming__body {
	display: flex;
	flex-direction: column;
	gap: 0.2em;
	min-width: 0;
}

.hdtdo-upcoming__title {
	font-family: var(--_font-head);
	font-size: 1.02em;
	font-weight: 700;
	color: var(--_ink);
	line-height: 1.3;
}

.hdtdo-upcoming__meta {
	color: var(--_muted);
	font-size: 0.86em;
}

.hdtdo-upcoming__arrow {
	color: var(--_accent);
	font-weight: 700;
	font-size: 1.1em;
}

.hdtdo-picks {
	padding: 1.75em 0 clamp(3em, 6vw, 5em);
}

.hdtdo-listing {
	padding: clamp(1.5em, 4vw, 3em) 0 clamp(3em, 6vw, 5em);
}

.hdtdo-listing .hdtdo-cats {
	padding-top: 0;
}

.hdtdo-block-preview {
	min-height: 2em;
}

.hdtdo-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(1.25em, 3vw, 2em);
}

@media (min-width: 700px) {
	.hdtdo-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.hdtdo-grid--related {
		grid-template-columns: repeat(3, 1fr);
	}
}

.hdtdo-card {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid var(--_border);
	border-radius: var(--_radius-lg);
	background: var(--_surface);
	box-shadow: var(--_shadow);
	transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.hdtdo-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--_shadow-lift);
	border-color: color-mix(in srgb, var(--_accent) 45%, var(--_border));
}

.hdtdo-card__media {
	position: relative;
	display: block;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: var(--_surface-alt);
}

.hdtdo-card__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: transform 0.35s ease;
}

.hdtdo-card:hover .hdtdo-card__img {
	transform: scale(1.04);
}

.hdtdo-card__placeholder {
	display: block;
	width: 100%;
	height: 100%;
	background:
		radial-gradient(80% 120% at 20% 0%, color-mix(in srgb, var(--_tangerine) 16%, transparent), transparent 60%),
		var(--_surface-alt);
}

.hdtdo-card__badge {
	position: absolute;
	top: 0.9em;
	left: 0.9em;
	padding: 0.32em 0.8em;
	border-radius: 999px;
	background: var(--_gradient);
	color: #fff;
	font-family: var(--_font-head);
	font-size: 0.72em;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	box-shadow: 0 4px 12px rgba(255, 107, 0, 0.28);
}

.hdtdo-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 0.5em;
	padding: 1.35em 1.5em 1.5em;
}

.hdtdo-card__date {
	margin: 0;
	color: var(--_muted);
	font-size: 0.84em;
	font-weight: 600;
}

.hdtdo-card__title {
	margin: 0;
	font-family: var(--_font-head);
	font-size: 1.28em;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.01em;
}

.hdtdo-card__title a {
	color: var(--_ink);
	text-decoration: none;
}

/* full-card click target */
.hdtdo-card__title a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.hdtdo-card__excerpt {
	margin: 0;
	color: var(--_ink2);
	font-size: 0.96em;
}

.hdtdo-card__more {
	margin-top: auto;
	padding-top: 0.6em;
	align-self: flex-start;
	color: var(--_accent);
	font-weight: 700;
	font-size: 0.92em;
}

/* ---------- pagination ---------- */
.hdtdo-pagination {
	margin-top: 2.5em;
	text-align: center;
}

.hdtdo-pagination .nav-links {
	display: inline-flex;
	gap: 0.6em;
	flex-wrap: wrap;
	justify-content: center;
}

.hdtdo-pagination a,
.hdtdo-pagination span.page-numbers {
	display: inline-block;
	padding: 0.5em 0.95em;
	border-radius: 999px;
	border: 1px solid var(--_border);
	background: var(--_surface);
	color: var(--_ink2);
	font-weight: 600;
	text-decoration: none;
}

.hdtdo-pagination a:hover {
	border-color: var(--_accent);
	color: var(--_accent);
}

.hdtdo-pagination .current {
	background: var(--_gradient);
	border-color: transparent;
	color: #fff;
}

.hdtdo-empty {
	text-align: center;
	color: var(--_muted);
	padding: 2em 0;
}

/* ---------- single (mobile first) ---------- */
/* Self-contained surfaces so dark theme bodies don't kill contrast */
.hdtdo--single {
	padding: 0 0 clamp(2.5em, 6vw, 4.5em);
	background: var(--_surface);
	color: var(--_ink);
	border-radius: var(--_radius-lg);
	overflow: clip;
}

.hdtdo--single .hdtdo-wrap {
	box-sizing: border-box;
}

.hdtdo-single__header {
	padding: 1.25em 0 1.25em;
	background: var(--_surface);
}

.hdtdo-single__crumb {
	margin: 0 0 0.85em;
	font-size: 0.88em;
	font-weight: 600;
}

.hdtdo-single__crumb a {
	color: var(--_primary);
	text-decoration: none;
}

.hdtdo-single__crumb a:hover {
	text-decoration: underline;
}

.hdtdo-single__title {
	margin: 0 0 0.55em;
	font-family: var(--_font-head);
	font-size: clamp(1.75em, 5.5vw, 2.65em);
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -0.02em;
	color: var(--_ink);
}

.hdtdo-single__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.35em 0.5em;
	margin: 0 0 0.75em;
	color: var(--_muted);
	font-size: 0.92em;
	font-weight: 600;
}

.hdtdo-single__cat {
	color: var(--_accent);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: 0.78em;
	font-family: var(--_font-head);
	font-weight: 700;
}

.hdtdo-single__sep {
	opacity: 0.55;
}

.hdtdo-single__lede {
	margin: 0;
	max-width: 40em;
	color: var(--_ink2);
	font-size: 1.02em;
	line-height: 1.55;
}

.hdtdo-single__hero {
	margin: 0 auto 1.5em;
	padding-bottom: 0.25em;
	background: var(--_surface);
}

.hdtdo-single__hero-img {
	display: block;
	width: 100%;
	height: min(52vh, 520px);
	object-fit: cover;
	object-position: center;
	border-radius: var(--_radius-lg);
	box-shadow: var(--_shadow);
}

/* Layout: stack on mobile, sidebar on desktop */
.hdtdo-layout {
	display: flex;
	flex-direction: column;
	gap: 1.5em;
	padding: 0.25em 0 1.5em;
	background: var(--_surface);
}

.hdtdo-layout__main {
	min-width: 0;
}

.hdtdo-layout__aside {
	min-width: 0;
}

@media (min-width: 960px) {
	.hdtdo-layout--with-aside {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
		gap: 2.25em;
		align-items: start;
	}

	.hdtdo-layout__aside {
		position: sticky;
		top: 6.5em;
	}
}

.hdtdo-section-title {
	margin: 0 0 0.85em;
	font-family: var(--_font-head);
	font-size: clamp(1.2em, 2.2vw, 1.45em);
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--_ink);
}

/* Nutshell */
.hdtdo-nutshell {
	margin: 0 0 1.5em;
	padding: 1.1em 1.15em;
	border-radius: var(--_radius);
	background: var(--_surface-alt);
	border: 1px solid var(--_border);
}

.hdtdo-nutshell .hdtdo-section-title {
	margin-bottom: 0.65em;
	font-size: 1.1em;
}

.hdtdo-nutshell__list,
.hdtdo-details__list {
	margin: 0;
}

.hdtdo-nutshell__row {
	display: grid;
	gap: 0.15em;
	padding: 0.55em 0;
	border-top: 1px solid color-mix(in srgb, var(--_border) 70%, transparent);
}

.hdtdo-nutshell__row:first-child {
	border-top: 0;
	padding-top: 0;
}

.hdtdo-nutshell__row:last-child {
	padding-bottom: 0;
}

.hdtdo-nutshell__row dt {
	margin: 0;
	font-family: var(--_font-head);
	font-weight: 700;
	font-size: 0.88em;
	color: var(--_ink);
}

.hdtdo-nutshell__row dd {
	margin: 0;
	color: var(--_ink2);
	font-size: 0.95em;
}

/* Body */
.hdtdo-content {
	margin: 0 0 1.5em;
	padding: 1.1em 1.15em;
	font-size: 1.02em;
	color: var(--_ink2);
	max-width: 40em;
	background: var(--_surface-alt);
	border: 1px solid var(--_border);
	border-radius: var(--_radius);
}

.hdtdo-content > * + * {
	margin-top: 1em;
}

.hdtdo-content h2,
.hdtdo-content h3 {
	margin: 1.5em 0 0.45em;
	font-family: var(--_font-head);
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--_ink);
}

.hdtdo-content h2 {
	font-size: 1.3em;
}

.hdtdo-content h3 {
	font-size: 1.12em;
}

.hdtdo-content a {
	color: var(--_primary);
}

.hdtdo-content img {
	border-radius: var(--_radius);
	height: auto;
	max-width: 100%;
}

.hdtdo-content blockquote {
	margin: 1.25em 0;
	padding: 0.35em 0 0.35em 1em;
	border-left: 3px solid var(--_accent);
	color: var(--_muted);
	font-style: italic;
}

/* Gallery */
.hdtdo-photos {
	margin: 0;
	padding: 1.1em 1.15em;
	background: var(--_surface-alt);
	border: 1px solid var(--_border);
	border-radius: var(--_radius);
}

.hdtdo-photos__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.65em;
}

.hdtdo-photos__item {
	margin: 0;
	overflow: hidden;
	border-radius: 0.75em;
}

.hdtdo-photos__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	aspect-ratio: 4 / 3;
}

/* Details card (sidebar on desktop) */
.hdtdo-details {
	padding: 1.15em 1.2em 1.25em;
	border-radius: var(--_radius-lg);
	border: 1px solid var(--_border);
	background: var(--_surface);
	box-shadow: var(--_shadow);
}

.hdtdo-details .hdtdo-section-title {
	margin-bottom: 0.7em;
	font-size: 1.1em;
}

.hdtdo-details__row {
	padding: 0.7em 0;
	border-top: 1px solid color-mix(in srgb, var(--_border) 70%, transparent);
}

.hdtdo-details__row:first-child {
	border-top: 0;
	padding-top: 0;
}

.hdtdo-details__row dt {
	margin: 0 0 0.2em;
	font-family: var(--_font-head);
	font-weight: 700;
	font-size: 0.78em;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--_muted);
}

.hdtdo-details__row dd {
	margin: 0;
	color: var(--_ink);
	font-size: 0.95em;
	line-height: 1.45;
	overflow-wrap: anywhere;
}

.hdtdo-details__row dd a {
	color: var(--_primary);
}

.hdtdo-details__actions {
	display: flex;
	flex-direction: column;
	gap: 0.55em;
	margin-top: 1em;
	padding-top: 1em;
	border-top: 1px solid color-mix(in srgb, var(--_border) 70%, transparent);
}

.hdtdo-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 0.7em 1.1em;
	border-radius: 999px;
	background: var(--_gradient);
	color: #fff !important;
	font-family: var(--_font-head);
	font-weight: 700;
	font-size: 0.92em;
	text-decoration: none !important;
	box-shadow: 0 6px 16px rgba(255, 107, 0, 0.22);
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.hdtdo-btn:hover {
	transform: translateY(-1px);
	box-shadow: 0 8px 20px rgba(255, 107, 0, 0.28);
}

.hdtdo-btn--secondary {
	background: var(--_surface);
	color: var(--_ink) !important;
	border: 1px solid var(--_border);
	box-shadow: none;
}

.hdtdo-btn--secondary:hover {
	border-color: var(--_accent);
	color: var(--_accent) !important;
	box-shadow: none;
}

/* Related */
.hdtdo-related {
	margin-top: 0;
	padding: 1.75em 0 2em;
	border-top: 1px solid var(--_border);
	background: var(--_surface);
}

/* Classic sidebar themes: give CPT views the full content column */
body.single-thing_to_do .main-content-inner.col-md-8,
body.post-type-archive-thing_to_do .main-content-inner.col-md-8,
body.tax-thing_category .main-content-inner.col-md-8 {
	width: 100%;
	max-width: 100%;
	flex: 0 0 100%;
}

body.single-thing_to_do .widget-area,
body.post-type-archive-thing_to_do .widget-area,
body.tax-thing_category .widget-area {
	display: none;
}

.hdtdo-card--compact .hdtdo-card__body {
	padding: 1em 1.1em 1.15em;
}

.hdtdo-card--compact .hdtdo-card__title {
	font-size: 1.02em;
}
