/*
Theme Name: Twenty Twenty-Four Child
Template: twentytwentyfour
Description: Child theme for Twenty Twenty-Four.
Version: 0.2.0
Text Domain: twentytwentyfour-child
*/

/* ---------- Trail search + filters ---------- */
.at-trail-search {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 1rem auto;
	max-width: 760px;
	align-items: stretch;
}
.at-trail-search-label {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}
.at-trail-search-q {
	flex: 2 1 240px;
	min-width: 0;
	padding: 0.65rem 0.9rem;
	font-size: 1rem;
	font-family: inherit;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 8px;
	background: #fff;
	color: var(--wp--preset--color--ink);
}
.at-trail-search-q:focus {
	outline: 2px solid var(--wp--preset--color--brand);
	outline-offset: 1px;
}
.at-trail-search-select {
	flex: 1 1 140px;
	padding: 0.6rem 0.65rem;
	font-size: 0.95rem;
	font-family: inherit;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 8px;
	background: #fff;
	color: var(--wp--preset--color--ink);
}
.at-trail-search-btn {
	flex: 0 0 auto;
	padding: 0.65rem 1.25rem;
	font-size: 1rem;
	white-space: nowrap;
}

@media (max-width: 480px) {
	.at-trail-search { flex-direction: column; }
	.at-trail-search-q,
	.at-trail-search-select,
	.at-trail-search-btn { flex: 1 1 auto; width: 100%; min-width: 0; }
}

/* ---------- Trails map view + view-toggle link ---------- */
.at-trails-map-wrap {
	margin: 1rem auto 2rem;
	max-width: 1100px;
}
.at-trails-map-toolbar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	margin-bottom: 0.6rem;
	flex-wrap: wrap;
}
.at-trails-map-count {
	font-size: 0.95rem;
	color: rgba(0, 0, 0, 0.65);
}
.at-trails-map-link,
.at-trails-view-toggle {
	font-weight: 600;
	text-decoration: none;
	color: var(--wp--preset--color--brand);
}
.at-trails-map-link:hover,
.at-trails-view-toggle:hover {
	text-decoration: underline;
}
.at-trails-view-toggle-wrap {
	max-width: 760px;
	margin: 0.25rem auto 1rem;
	text-align: right;
	font-size: 0.95rem;
}
.at-trails-map {
	height: 70vh;
	min-height: 480px;
	width: 100%;
	border-radius: 12px;
	overflow: hidden;
	border: 1px solid rgba(0, 0, 0, 0.1);
}
.at-trails-map-wrap.is-compact .at-trails-map {
	height: 380px;
	min-height: 320px;
}
/* Homepage: make the embedded map square (height follows its width). No !important
   so the fullscreen rules below still win when expanded. */
body.home .at-trails-map-wrap.is-compact .at-trails-map {
	height: auto;
	min-height: 0;
	aspect-ratio: 1 / 1;
}
/* Fullscreen for the trails listing map (native Fullscreen API + CSS fallback). */
.at-trails-map:-webkit-full-screen {
	width: 100% !important;
	height: 100% !important;
	border-radius: 0;
}
.at-trails-map:fullscreen {
	width: 100% !important;
	height: 100% !important;
	border-radius: 0;
}
.at-trails-map.is-fullscreen {
	position: fixed;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	z-index: 100000;
	margin: 0;
	border-radius: 0;
}
.at-trails-map-heading {
	font-size: 1.5rem;
	font-weight: 700;
	margin: 0 0 0.5rem;
}
.at-trails-map-popup {
	display: flex;
	gap: 0.6rem;
	max-width: 280px;
}
.at-trails-map-popup img {
	width: 80px;
	height: 80px;
	object-fit: cover;
	border-radius: 6px;
	flex: 0 0 auto;
}
.at-trails-map-popup-body {
	min-width: 0;
}
.at-trails-map-popup-title {
	font-weight: 700;
	font-size: 1rem;
	line-height: 1.25;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	display: block;
	margin-bottom: 0.35rem;
}
.at-trails-map-popup-title:hover {
	color: var(--wp--preset--color--brand);
}
/* Difficulty-colored pin markers for the all-trails map. */
.at-tmap-pin { background: transparent; border: 0; }
.at-tmap-pin svg { display: block; filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.35)); }
.at-tmap-pin:hover svg { transform: translateY(-2px); transition: transform 120ms ease; }

/* Layer switcher + zoom controls — match the styling we use on single-trail maps. */
.at-trails-map .leaflet-control-layers {
	border-radius: 10px;
	border: 0;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
	padding: 0.4rem 0.6rem;
	font-family: inherit;
	font-size: 0.85rem;
}
.at-trails-map .leaflet-control-layers-base label {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.15rem 0.1rem;
	cursor: pointer;
	font-weight: 600;
	color: rgba(0, 0, 0, 0.75);
}
.at-trails-map .leaflet-control-layers-base label input {
	accent-color: #ea580c;
}
.at-trails-map .leaflet-control-scale-line {
	background: rgba(255, 255, 255, 0.85);
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-top: 0;
	color: rgba(0, 0, 0, 0.75);
	font-size: 0.75rem;
	font-weight: 600;
}
.at-trails-map .leaflet-control-zoom a {
	border-radius: 6px !important;
	color: #0f172a;
	font-weight: 600;
}

.at-trails-map-popup-thumb {
	position: relative;
	flex: 0 0 auto;
	display: block;
	line-height: 0;
}
.at-trails-map-popup-meta {
	font-size: 0.85rem;
	color: rgba(0, 0, 0, 0.65);
}

/* ---------- Activity overlay badge on trail thumbnails ---------- */
.at-thumb-wrap {
	position: relative;
	display: inline-block;
	max-width: 100%;
	line-height: 0;
}
.at-thumb-wrap img {
	display: block;
	max-width: 100%;
	height: auto;
}
/* Inside aspect-ratio-locked figures (archive cards), make the wrap and image
   fill the figure so the badge anchors to the actual image bounds rather than
   collapsing to the image's intrinsic height. */
.wp-block-post-featured-image .at-thumb-wrap {
	display: block;
	width: 100%;
	height: 100%;
}
.wp-block-post-featured-image .at-thumb-wrap img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/* Hero featured-image lightbox link — fill the wrap, no inline gap, zoom cursor. */
.at-hero-photo-link {
	display: block;
	width: 100%;
	height: 100%;
	line-height: 0;
	cursor: zoom-in;
}
.wp-block-post-featured-image .at-thumb-wrap .at-hero-photo-link img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.at-activity-badge {
	position: absolute;
	top: 0.5rem;
	left: 0.5rem;
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.3rem 0.65rem;
	background: rgba(0, 0, 0, 0.7);
	color: #fff;
	border-radius: 999px;
	font-size: 0.8rem;
	font-weight: 600;
	line-height: 1.2;
	pointer-events: none;
	backdrop-filter: blur(2px);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
.at-activity-badge-icon {
	font-size: 1rem;
	line-height: 1;
}
.at-activity-badge-label {
	white-space: nowrap;
}
.at-difficulty-badge {
	position: absolute;
	top: 0.5rem;
	right: 0.5rem;
	display: inline-block;
	padding: 0.3rem 0.65rem;
	color: #fff;
	border-radius: 999px;
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	pointer-events: none;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
/* Hide the difficulty pill on trail-archive cards. The badge stays elsewhere
   (homepage cards, single-trail hero, map popups, saved/profile lists). */
.wp-block-post .at-difficulty-badge {
	display: none;
}

/* Match the archive card thumbnails to the homepage card aspect (16:10).
   The pattern sets aspect-ratio:3/4 inline, so we override with !important. */
body.post-type-archive-trail .wp-block-post-featured-image {
	aspect-ratio: 16 / 10 !important;
	padding-bottom: 0 !important;
}

/* ---------- Profile edit (/profile/) ---------- */
.at-profile-edit {
	max-width: 620px;
	margin: 1.5rem auto 3rem;
	padding: 0 1rem;
}
.at-profile-edit-welcome {
	background: #fef3c7;
	border: 1px solid #fde68a;
	border-radius: 10px;
	padding: 1rem 1.25rem;
	margin-bottom: 1.5rem;
}
.at-profile-edit-welcome h2 {
	margin: 0 0 0.35rem;
	font-size: 1.2rem;
	color: #78350f;
}
.at-profile-edit-welcome p {
	margin: 0;
	color: #78350f;
}
.at-profile-edit-flash {
	margin: 0 0 1.25rem;
	padding: 0.6rem 0.9rem;
	border-radius: 6px;
	font-size: 0.95rem;
}
.at-profile-edit-flash.is-success {
	background: #d1fae5;
	color: #065f46;
}
.at-profile-edit-flash.is-error {
	background: #fee2e2;
	color: #991b1b;
}
.at-profile-edit-form {
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 10px;
	padding: 1.5rem 1.25rem;
}
.at-profile-edit-avatar {
	display: flex;
	gap: 1.1rem;
	align-items: flex-start;
	padding-bottom: 1.25rem;
	margin-bottom: 1.25rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.at-profile-edit-avatar-preview {
	flex: 0 0 auto;
}
.at-profile-edit-avatar-img,
.at-profile-edit-avatar-preview img {
	width: 96px;
	height: 96px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
	background: rgba(0, 0, 0, 0.05);
}
.at-profile-edit-avatar-controls {
	flex: 1 1 auto;
	min-width: 0;
}
.at-profile-edit-avatar-file {
	display: block;
	font-weight: 600;
	font-size: 0.95rem;
	margin-bottom: 0.6rem;
}
.at-profile-edit-avatar-file > span {
	display: block;
	margin-bottom: 0.35rem;
	color: rgba(0, 0, 0, 0.8);
}
.at-profile-edit-avatar-file input[type="file"] {
	display: block;
	font-family: inherit;
	font-size: 0.9rem;
}
.at-profile-edit-avatar-file small {
	display: block;
	margin-top: 0.35rem;
	font-size: 0.8rem;
	color: rgba(0, 0, 0, 0.55);
}
.at-profile-edit-avatar-remove {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.85rem;
	color: rgba(0, 0, 0, 0.7);
	margin-top: 0.5rem;
}
.at-profile-edit-age {
	display: inline-block;
	margin-left: 0.4rem;
	padding: 0.05rem 0.45rem;
	background: rgba(0, 0, 0, 0.06);
	border-radius: 999px;
	font-weight: 500;
	color: rgba(0, 0, 0, 0.75);
}
.at-profile-edit-age[hidden] {
	display: none;
}
.at-profile-edit-age strong {
	color: var(--wp--preset--color--brand);
	font-weight: 700;
}
.at-profile-edit-label {
	display: block;
	margin-bottom: 1.1rem;
	font-weight: 600;
	font-size: 0.95rem;
}
.at-profile-edit-label > span {
	display: block;
	margin-bottom: 0.3rem;
	color: rgba(0, 0, 0, 0.8);
}
.at-profile-edit-label small {
	display: block;
	margin-top: 0.4rem;
	font-size: 0.8rem;
	font-weight: 400;
	color: rgba(0, 0, 0, 0.55);
}
.at-profile-edit-label code {
	background: rgba(0, 0, 0, 0.05);
	padding: 0.1rem 0.35rem;
	border-radius: 4px;
	font-size: 0.8rem;
}
.at-profile-edit-form input[type="text"],
.at-profile-edit-form input[type="email"],
.at-profile-edit-form input[type="date"],
.at-profile-edit-form textarea {
	width: 100%;
	padding: 0.6rem 0.8rem;
	font-size: 1rem;
	font-family: inherit;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 6px;
	background: #fff;
	box-sizing: border-box;
	color: var(--wp--preset--color--ink);
}
.at-profile-edit-form input[type="date"] {
	max-width: 220px;
}
.at-profile-edit-form input:focus,
.at-profile-edit-form textarea:focus {
	outline: 2px solid var(--wp--preset--color--brand);
	outline-offset: 1px;
}
/* Height/weight unit toggle + metric/imperial inputs. */
.at-profile-edit-units {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem;
	margin: 0 0 1rem;
	padding: 0.5rem 0.85rem;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 8px;
}
.at-profile-edit-units legend {
	font-weight: 600;
	font-size: 0.9rem;
	padding: 0 0.3rem;
}
.at-profile-edit-units label {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	font-size: 0.9rem;
}
.at-measure {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	margin-right: 0.5rem;
}
.at-measure[hidden] {
	display: none;
}
.at-measure input[type="number"] {
	width: 6rem;
	padding: 0.6rem 0.8rem;
	font-size: 1rem;
	font-family: inherit;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 6px;
	background: #fff;
	box-sizing: border-box;
	color: var(--wp--preset--color--ink);
}
.at-measure[data-unit-imperial] input[type="number"] {
	width: 4.5rem;
}
.at-profile-edit-actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-top: 1.25rem;
}
.at-profile-edit-cancel {
	font-size: 0.9rem;
	color: var(--wp--preset--color--brand);
	text-decoration: none;
	font-weight: 600;
}
.at-profile-edit-cancel:hover { text-decoration: underline; }
.at-profile-edit-submit {
	padding: 0.7rem 1.4rem;
	font-size: 0.95rem;
	font-weight: 700;
	background: var(--wp--preset--color--brand);
	color: #fff;
	border: 0;
	border-radius: 6px;
	cursor: pointer;
}
.at-profile-edit-submit:hover {
	background: var(--wp--preset--color--ink);
}

.at-auth-help {
	margin: 0 0 1rem;
	font-size: 0.85rem;
	color: rgba(0, 0, 0, 0.55);
}

/* ---------- Help / FAQ page ---------- */
.at-faq {
	max-width: 720px;
	margin: 1.5rem auto;
}
.at-faq-item {
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 8px;
	margin-bottom: 0.6rem;
	overflow: hidden;
}
.at-faq-item > summary {
	cursor: pointer;
	list-style: none;
	padding: 0.85rem 1rem 0.85rem 2.5rem;
	font-weight: 600;
	font-size: 1rem;
	color: var(--wp--preset--color--ink);
	position: relative;
}
.at-faq-item > summary::-webkit-details-marker {
	display: none;
}
.at-faq-item > summary::before {
	content: "+";
	position: absolute;
	left: 1rem;
	top: 50%;
	transform: translateY(-50%);
	font-size: 1.4rem;
	font-weight: 400;
	line-height: 1;
	color: var(--wp--preset--color--brand);
	transition: transform 140ms ease;
}
.at-faq-item[open] > summary::before {
	content: "−";
	color: var(--wp--preset--color--brand);
}
.at-faq-item > summary:hover {
	background: rgba(0, 0, 0, 0.02);
}
.at-faq-item > p,
.at-faq-item > div {
	padding: 0 1rem 1rem 2.5rem;
	margin: 0;
	color: rgba(0, 0, 0, 0.75);
	line-height: 1.55;
}

/* ---------- Settings page ---------- */
.at-settings {
	max-width: 620px;
	margin: 1.5rem auto 3rem;
	padding: 0 1rem;
}
.at-settings-section {
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 10px;
	padding: 1.25rem 1.25rem 1rem;
	margin-bottom: 1.25rem;
}
.at-settings-section h2 {
	margin: 0 0 0.85rem;
	font-size: 1.1rem;
	font-weight: 700;
}
.at-settings-label {
	display: block;
	margin-bottom: 0.85rem;
	font-weight: 600;
	font-size: 0.95rem;
}
.at-settings-label > span {
	display: block;
	margin-bottom: 0.3rem;
	color: rgba(0, 0, 0, 0.8);
}
.at-settings-label small {
	display: block;
	margin-top: 0.35rem;
	font-size: 0.8rem;
	font-weight: 400;
	color: rgba(0, 0, 0, 0.55);
}
.at-settings-form input[type="email"],
.at-settings-form input[type="text"],
.at-settings-form input[type="password"] {
	width: 100%;
	padding: 0.6rem 0.8rem;
	font-size: 1rem;
	font-family: inherit;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 6px;
	background: #fff;
	box-sizing: border-box;
}
.at-settings-form input:focus {
	outline: 2px solid var(--wp--preset--color--brand);
	outline-offset: 1px;
}
.at-settings-checkbox {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.95rem;
	margin-bottom: 0.4rem;
}
.at-settings-form small {
	display: block;
	font-size: 0.8rem;
	color: rgba(0, 0, 0, 0.55);
	margin-bottom: 0.85rem;
}
.at-settings-submit {
	padding: 0.6rem 1.2rem;
	font-size: 0.95rem;
	font-weight: 700;
	background: var(--wp--preset--color--brand);
	color: #fff;
	border: 0;
	border-radius: 6px;
	cursor: pointer;
}
.at-settings-submit:hover {
	background: var(--wp--preset--color--ink);
}

/* ---------- Logged-in: Profile + Logout nav items ---------- */
/* The Profile pill sits at the head of the nav with the user's display name.
   Avatar-style circle holds a small SVG silhouette to make it visually distinct
   from the page-list entries. */
.at-profile-item {
	margin-right: 0.35rem;
}
.at-profile-item {
	position: relative;
}
.at-profile-link {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0.3rem 0.7rem 0.3rem 0.35rem;
	font-family: inherit;
	font-size: 1rem;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	background: rgba(0, 0, 0, 0.04);
	border: 0;
	border-radius: 999px;
	cursor: pointer;
	transition: background-color 120ms ease;
}
.at-profile-link:hover,
.at-profile-item.is-open .at-profile-link {
	background: rgba(0, 0, 0, 0.08);
	color: var(--wp--preset--color--brand);
}
.at-profile-caret {
	transition: transform 140ms ease;
	color: rgba(0, 0, 0, 0.55);
}
.at-profile-item.is-open .at-profile-caret {
	transform: rotate(180deg);
	color: var(--wp--preset--color--brand);
}

.at-profile-submenu {
	position: absolute;
	top: calc(100% + 0.5rem);
	right: 0;
	min-width: 220px;
	margin: 0;
	padding: 0.4rem 0;
	list-style: none;
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 10px;
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);
	z-index: 9000;
}
.at-profile-submenu[hidden] {
	display: none;
}
.at-profile-submenu-item {
	margin: 0;
	padding: 0;
	list-style: none;
}
.at-profile-submenu-item > a {
	display: flex;
	align-items: center;
	gap: 0.65rem;
	padding: 0.55rem 1rem;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	font-size: 0.95rem;
	font-weight: 500;
}
.at-profile-submenu-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	flex: 0 0 auto;
	color: rgba(0, 0, 0, 0.55);
	line-height: 0;
}
.at-profile-submenu-item > a:hover .at-profile-submenu-icon,
.at-profile-submenu-item > a:focus .at-profile-submenu-icon {
	color: var(--wp--preset--color--brand);
}
.at-profile-submenu-label {
	flex: 1 1 auto;
	min-width: 0;
}
.at-profile-submenu-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	height: 20px;
	padding: 0 0.4rem;
	border-radius: 999px;
	background: #dc2626;
	color: #fff;
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1;
}
.at-profile-submenu-item > a:hover,
.at-profile-submenu-item > a:focus {
	background: rgba(0, 0, 0, 0.05);
	color: var(--wp--preset--color--brand);
}
.at-profile-submenu-divider {
	height: 1px;
	margin: 0.4rem 0;
	background: rgba(0, 0, 0, 0.1);
	list-style: none;
}
.at-profile-submenu .at-logout-link {
	display: flex !important;
	align-items: center;
	gap: 0.5rem;
	padding: 0.55rem 1rem;
	color: rgba(0, 0, 0, 0.65) !important;
	font-size: 0.85rem !important;
	font-weight: 600 !important;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	text-decoration: none;
	border: 0;
	background: transparent;
}
.at-profile-submenu .at-logout-link:hover {
	background: rgba(185, 28, 28, 0.06) !important;
	color: #b91c1c !important;
}
.at-profile-link-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	overflow: hidden;
	background: rgba(0, 0, 0, 0.06);
	color: #fff;
	flex: 0 0 auto;
}
.at-profile-link-avatar {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
}


/* Distinguish Log out from the other page-list items: muted, slightly smaller,
   with a visual separator before it, and a red hover state to telegraph that
   it's destructive (signs you out of the site). */
.at-logout-item {
	margin-left: 0.5rem;
	padding-left: 0.85rem;
	border-left: 1px solid rgba(0, 0, 0, 0.15);
}
.at-logout-link,
.at-logout-link.wp-block-pages-list__item__link {
	display: inline-flex !important;
	align-items: center;
	gap: 0.35rem;
	font-size: 0.85rem !important;
	font-weight: 500 !important;
	color: rgba(0, 0, 0, 0.55) !important;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.at-logout-link:hover,
.at-logout-link.wp-block-pages-list__item__link:hover {
	color: #b91c1c !important;
}
.at-logout-icon {
	display: inline-flex;
	align-items: center;
	line-height: 0;
}

/* ---------- Guest nav + login modal ---------- */
.at-guest-nav {
	list-style: none;
	margin: 0;
	padding: 0;
}
.at-login-trigger {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.45rem 1.1rem;
	background: var(--wp--preset--color--brand);
	color: #fff !important;
	border-radius: 999px;
	font-weight: 600;
	text-decoration: none;
}
.at-login-trigger-icon {
	display: inline-flex;
	align-items: center;
	line-height: 0;
}
.at-login-trigger:hover,
.at-login-trigger:focus {
	background: var(--wp--preset--color--ink);
	color: #fff !important;
}

.at-auth-modal {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem;
}
.at-auth-modal[hidden] {
	display: none;
}
.at-auth-modal-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.55);
	cursor: pointer;
}
.at-auth-modal-dialog {
	position: relative;
	z-index: 1;
	background: #fff;
	color: var(--wp--preset--color--ink);
	border-radius: 12px;
	max-width: 400px;
	width: 100%;
	padding: 2.25rem 1.75rem 1.5rem;
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
}
.at-auth-modal-close {
	position: absolute;
	top: 0.55rem;
	right: 0.7rem;
	background: transparent;
	border: 0;
	font-size: 1.75rem;
	line-height: 1;
	cursor: pointer;
	color: rgba(0, 0, 0, 0.55);
	padding: 0.25rem 0.5rem;
}
.at-auth-modal-close:hover {
	color: #000;
}
.at-auth-modal-dialog h2,
.at-auth-pane-title {
	margin: 0 0 1.25rem;
	font-size: 1.4rem;
	font-weight: 700;
	/* Forced black so the title can't inherit/lose to global heading styles. */
	color: #000 !important;
}
.at-auth-tabs {
	display: flex;
	gap: 0.25rem;
	margin: 0 0 1.5rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.at-auth-tab {
	flex: 1 1 auto;
	background: transparent;
	border: 0;
	padding: 0.65rem 0.75rem;
	font-family: inherit;
	font-size: 0.95rem;
	font-weight: 600;
	cursor: pointer;
	color: rgba(0, 0, 0, 0.6);
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
}
.at-auth-tab.is-active {
	color: var(--wp--preset--color--brand);
	border-bottom-color: var(--wp--preset--color--brand);
}
.at-auth-tab:hover:not(.is-active) {
	color: var(--wp--preset--color--ink);
}
.at-auth-pane[hidden] {
	display: none;
}
.at-auth-link {
	background: transparent;
	border: 0;
	padding: 0;
	font: inherit;
	color: var(--wp--preset--color--brand);
	font-weight: 600;
	cursor: pointer;
	text-decoration: underline;
}
.at-auth-link:hover {
	color: var(--wp--preset--color--ink);
}

/* OAuth provider buttons */
.at-oauth-buttons {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	margin-bottom: 1.25rem;
}
.at-oauth-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.6rem;
	padding: 0.65rem 0.8rem;
	border: 1px solid rgba(0, 0, 0, 0.18);
	border-radius: 8px;
	background: #fff;
	color: rgba(0, 0, 0, 0.85);
	font-size: 0.95rem;
	font-weight: 600;
	text-decoration: none;
	transition: background-color 120ms ease, border-color 120ms ease;
}
.at-oauth-btn:hover {
	background: rgba(0, 0, 0, 0.03);
	border-color: rgba(0, 0, 0, 0.35);
	color: rgba(0, 0, 0, 0.95);
}
.at-oauth-btn-icon {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
}
.at-oauth-btn-apple {
	background: #000;
	color: #fff;
	border-color: #000;
}
.at-oauth-btn-apple:hover {
	background: #1a1a1a;
	color: #fff;
}
.at-auth-divider {
	position: relative;
	text-align: center;
	margin: 0 0 1rem;
	font-size: 0.85rem;
	color: rgba(0, 0, 0, 0.5);
}
.at-auth-divider::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	border-top: 1px solid rgba(0, 0, 0, 0.12);
	z-index: 0;
}
.at-auth-divider span {
	position: relative;
	z-index: 1;
	background: #fff;
	padding: 0 0.6rem;
}
.at-auth-form .at-auth-label {
	display: block;
	margin-bottom: 0.85rem;
	font-size: 0.9rem;
	font-weight: 600;
}
.at-auth-form .at-auth-label > span {
	display: block;
	margin-bottom: 0.3rem;
	color: rgba(0, 0, 0, 0.75);
}
.at-auth-form input[type="text"],
.at-auth-form input[type="email"],
.at-auth-form input[type="password"] {
	width: 100%;
	padding: 0.65rem 0.8rem;
	font-size: 1rem;
	font-family: inherit;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 6px;
	background: #fff;
	box-sizing: border-box;
}
.at-auth-form input:focus {
	outline: 2px solid var(--wp--preset--color--brand);
	outline-offset: 1px;
}
.at-auth-checkbox {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.9rem;
	margin: 0 0 1rem;
}
.at-auth-form-feedback {
	margin: 0.5rem 0 0.85rem;
	padding: 0.55rem 0.75rem;
	border-radius: 6px;
	font-size: 0.9rem;
}
.at-auth-form-feedback.is-error {
	background: #fee2e2;
	color: #991b1b;
}
.at-auth-form-feedback.is-success {
	background: #d1fae5;
	color: #065f46;
}
.at-auth-submit {
	width: 100%;
	padding: 0.75rem;
	font-size: 1rem;
	font-weight: 700;
	background: var(--wp--preset--color--brand);
	color: #fff;
	border: 0;
	border-radius: 6px;
	cursor: pointer;
}
.at-auth-submit:hover:not(:disabled) {
	background: var(--wp--preset--color--ink);
}
.at-auth-submit:disabled {
	opacity: 0.7;
	cursor: progress;
}
.at-auth-modal-dialog .at-auth-register,
.at-auth-modal-dialog .at-auth-lost {
	margin: 0.85rem 0 0;
	font-size: 0.9rem;
	text-align: center;
	/* Forced black so this text wins over any global paragraph/element styles. */
	color: #000 !important;
}
.at-auth-modal-dialog .at-auth-register a,
.at-auth-modal-dialog .at-auth-lost a,
.at-auth-modal-dialog .at-auth-register .at-auth-link,
.at-auth-modal-dialog .at-auth-lost .at-auth-link {
	color: #000 !important;
	font-weight: 600;
	text-decoration: underline;
}
body.at-auth-modal-open,
body.at-confirm-modal-open {
	overflow: hidden;
}

/* ---------- Confirmation modal (logout, future destructive actions) ---------- */
.at-confirm-modal {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem;
}
.at-confirm-modal[hidden] {
	display: none;
}
.at-confirm-modal-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.55);
	cursor: pointer;
}
.at-confirm-modal-dialog {
	position: relative;
	z-index: 1;
	background: #fff;
	color: var(--wp--preset--color--ink);
	border-radius: 12px;
	max-width: 380px;
	width: 100%;
	padding: 1.75rem 1.5rem 1.25rem;
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
}
.at-confirm-modal-dialog h2 {
	margin: 0 0 0.5rem;
	font-size: 1.25rem;
	font-weight: 700;
}
.at-confirm-modal-dialog p {
	margin: 0 0 1.25rem;
	font-size: 0.95rem;
	color: rgba(0, 0, 0, 0.7);
}
.at-confirm-modal-actions {
	display: flex;
	gap: 0.6rem;
	justify-content: flex-end;
}
.at-confirm-cancel,
.at-confirm-confirm {
	padding: 0.6rem 1.1rem;
	font-size: 0.95rem;
	font-weight: 600;
	border-radius: 6px;
	cursor: pointer;
	font-family: inherit;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.at-confirm-cancel {
	background: #fff;
	color: rgba(0, 0, 0, 0.85);
	border: 1.5px solid rgba(0, 0, 0, 0.45);
}
.at-confirm-cancel:hover,
.at-confirm-cancel:focus-visible {
	background: rgba(0, 0, 0, 0.05);
	border-color: rgba(0, 0, 0, 0.7);
	color: #000;
}
.at-confirm-confirm {
	background: #dc2626 !important;
	color: #fff !important;
	border: 1.5px solid #dc2626 !important;
	box-shadow: 0 1px 2px rgba(220, 38, 38, 0.4);
	gap: 0.45rem;
}
.at-confirm-confirm-icon {
	display: inline-flex;
	align-items: center;
	line-height: 0;
}
.at-confirm-confirm-icon:empty {
	display: none;
}
.at-confirm-confirm:hover,
.at-confirm-confirm:focus-visible {
	background: #b91c1c !important;
	border-color: #b91c1c !important;
	color: #fff !important;
	box-shadow: 0 2px 6px rgba(185, 28, 28, 0.5);
}
/* On very small thumbs (homepage near-you cards <= 320px), hide the label and keep just the icon to avoid covering the image. */
@media (max-width: 480px) {
	.at-activity-badge-label {
		display: none;
	}
	.at-activity-badge {
		padding: 0.3rem 0.4rem;
	}
}

/* ---------- Homepage: Trails near you ---------- */
.at-trails-near-you {
	margin: 2rem 0;
}
.at-trails-near-you-header {
	display: flex;
	align-items: baseline;
	gap: 1rem;
	flex-wrap: wrap;
	margin-bottom: 1.25rem;
}
.at-trails-near-you-title {
	margin: 0;
	font-size: 1.5rem;
	font-weight: 700;
}
.at-trails-near-you-help {
	margin: 0;
	font-size: 0.85rem;
	opacity: 0.6;
}
.at-trails-near-you-help[hidden] { display: none; }

.at-trails-near-you-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1rem;
}
@media (max-width: 1100px) { .at-trails-near-you-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 820px)  { .at-trails-near-you-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px)  { .at-trails-near-you-grid { grid-template-columns: 1fr; } }

/* Distance chip — overlaid on the featured image when geolocation re-sort
   is active. Positioned relative to the WP post-template <li>. */
li.wp-block-post[data-lat] {
	position: relative;
}
.at-distance-chip {
	position: absolute;
	top: 0.5rem;
	right: 0.5rem;
	z-index: 5;
	padding: 0.25rem 0.6rem;
	background: rgba(0, 0, 0, 0.75);
	color: #fff;
	border-radius: 999px;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	pointer-events: none;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

/* Force 4 columns on the trail + recipe archive grids AND the homepage trails
   query (parent posts-3-col pattern defaults to 3). */
body.post-type-archive-trail  .wp-block-post-template-is-layout-grid,
body.post-type-archive-recipe .wp-block-post-template-is-layout-grid,
body.home                     .wp-block-post-template-is-layout-grid {
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
@media (max-width: 1100px) {
	body.post-type-archive-trail  .wp-block-post-template-is-layout-grid,
	body.post-type-archive-recipe .wp-block-post-template-is-layout-grid,
	body.home                     .wp-block-post-template-is-layout-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
}
@media (max-width: 820px) {
	body.post-type-archive-trail  .wp-block-post-template-is-layout-grid,
	body.post-type-archive-recipe .wp-block-post-template-is-layout-grid,
	body.home                     .wp-block-post-template-is-layout-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}
@media (max-width: 520px) {
	body.post-type-archive-trail  .wp-block-post-template-is-layout-grid,
	body.post-type-archive-recipe .wp-block-post-template-is-layout-grid,
	body.home                     .wp-block-post-template-is-layout-grid {
		grid-template-columns: 1fr !important;
	}
}

.at-trail-card {
	display: flex;
	flex-direction: column;
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 10px;
	overflow: hidden;
	text-decoration: none;
	color: var(--wp--preset--color--ink);
	transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}
.at-trail-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
	border-color: rgba(0, 0, 0, 0.14);
}
.at-trail-card-thumb {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	display: block;
	background: rgba(0, 0, 0, 0.06);
}
.at-trail-card-thumb-placeholder {
	background: rgba(0, 0, 0, 0.06);
}
.at-trail-card-body {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding: 0.85rem 1rem 1rem;
}
.at-trail-card-title {
	margin: 0;
	font-size: 1.05rem;
	font-weight: 600;
	line-height: 1.3;
}
.at-trail-card-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	font-size: 0.8rem;
	opacity: 0.75;
}
.at-trail-card-meta span {
	padding: 0.15rem 0.55rem;
	background: rgba(0, 0, 0, 0.04);
	border-radius: 999px;
	font-variant-numeric: tabular-nums;
}
.at-trail-card-distance {
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--wp--preset--color--brand);
	min-height: 1.1em; /* reserve space so layout doesn't shift when JS fills it */
}
.at-trail-card-distance:empty { display: none; }

.at-trails-near-you-empty {
	padding: 1.5rem;
	text-align: center;
	background: rgba(0, 0, 0, 0.03);
	border-radius: 10px;
	opacity: 0.75;
}

/* ---------- Trail stats card ---------- */
.at-trail-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: 1rem;
	padding: 1.25rem;
	margin: 1.5rem 0;
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 8px;
}
.at-trail-stats > div {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}
.at-trail-stats dt {
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	opacity: 0.6;
	margin: 0;
}
.at-trail-stats dd {
	font-size: 1.25rem;
	font-weight: 600;
	margin: 0;
}

/* Title-row action chips (favorite toggle, conditions summary, review summary, edit pill).
   Keep them on the same flex line as the author byline; spacing comes from the wp:group
   flex layout, but we want consistent vertical alignment. */
.wp-block-group .at-trail-favorite-toggle,
.wp-block-group .at-trail-edit-link,
.wp-block-group .at-trail-conditions-summary,
.wp-block-group .at-trail-review-summary {
	margin: 0;
}

/* Sidebar — the trip-plan-save card sticks while you scroll through the body. */
.at-trail-sidebar {
	align-self: flex-start;
}
@media (min-width: 900px) {
	.at-trail-sidebar > * {
		position: sticky;
		top: 1rem;
	}
}

/* Collapse the two-column layout below ~720px for a clean mobile read. */
@media (max-width: 720px) {
	.wp-block-columns.alignwide {
		flex-direction: column;
	}
	.wp-block-columns.alignwide > .wp-block-column {
		flex-basis: auto !important;
	}
}

/* ---------- Trail map + elevation ---------- */
.at-trail-map {
	height: clamp(380px, 55vh, 560px);
	border-radius: 14px;
	overflow: hidden;
	margin: 1.5rem 0 0;
	background: #eef2f7;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.05) inset;
}
/* Fullscreen toggle button on the trail map (matches Leaflet's control look). */
.at-map-fs-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	color: #333;
	background: #fff;
}
.at-map-fs-btn:hover {
	background: #f4f4f4;
	color: #000;
}
/* Native Fullscreen API: the map element fills the screen. Kept as separate rules
   so a browser that doesn't recognise one pseudo-class doesn't drop the other. */
.at-trail-map:-webkit-full-screen {
	width: 100% !important;
	height: 100% !important;
	border-radius: 0;
}
.at-trail-map:fullscreen {
	width: 100% !important;
	height: 100% !important;
	border-radius: 0;
}
/* CSS pseudo-fullscreen fallback (browsers without the Fullscreen API). */
.at-trail-map.is-fullscreen {
	position: fixed;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	z-index: 100000;
	margin: 0;
	border-radius: 0;
}
body.at-map-fs-lock {
	overflow: hidden;
}
.at-trail-elevation {
	height: 200px;
	margin: 0.75rem 0 1.5rem;
	padding: 0.25rem 0;
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 10px;
	overflow: hidden;
}
.at-trail-elevation.is-ready {
	cursor: crosshair;
}
/* Photo-location indicators on the elevation profile — hidden until toggled on. */
.at-elev-photo { display: none; cursor: pointer; }
.at-trail-elevation.show-photo-marks .at-elev-photo { display: inline; }
.at-elev-photo text { pointer-events: none; }
.at-elev-photo:hover circle { stroke-width: 2.5; }
.at-elev-photo-toggle {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	margin: 0.5rem 0 0;
	font-size: 0.85rem;
	cursor: pointer;
}
/* Layer switcher — make it match the AllTrails-y card style. */
.at-trail-map .leaflet-control-layers {
	border-radius: 10px;
	border: 0;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
	padding: 0.4rem 0.6rem;
	font-family: inherit;
	font-size: 0.85rem;
}
.at-trail-map .leaflet-control-layers-base label {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.15rem 0.1rem;
	cursor: pointer;
	font-weight: 600;
	color: rgba(0, 0, 0, 0.75);
}
.at-trail-map .leaflet-control-layers-base label input {
	accent-color: #ea580c;
}
.at-trail-map .leaflet-control-scale-line {
	background: rgba(255, 255, 255, 0.85);
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-top: 0;
	color: rgba(0, 0, 0, 0.75);
	font-size: 0.75rem;
	font-weight: 600;
}
.at-trail-map .leaflet-control-zoom a {
	border-radius: 6px !important;
	color: #0f172a;
	font-weight: 600;
}
/* Custom start marker — the divIcon outputs an inline SVG; we just need to
   make sure the wrapper doesn't clip or shift. */
.at-trail-marker { background: transparent; border: 0; }
.at-trail-marker-start svg {
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.35));
}

/* High / Low point markers — pill-shaped with arrow + elevation label. */
.at-trail-marker-elev .at-trail-marker-pin {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	padding: 0.2rem 0.55rem 0.2rem 0.4rem;
	border-radius: 999px;
	font-size: 0.78rem;
	font-weight: 700;
	color: #fff;
	background: #b91c1c;
	border: 2px solid #fff;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.35);
	white-space: nowrap;
	transform: translate(-50%, -100%);
}
.at-trail-marker-elev .at-trail-marker-icon {
	font-size: 0.85rem;
	line-height: 1;
}
.at-trail-marker-elev.at-trail-marker-low .at-trail-marker-pin {
	background: #0369a1;
}

/* Distance / km markers along the track. */
.at-trail-marker-mile .at-trail-marker-mile-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: #fff;
	color: #0f172a;
	font-size: 0.7rem;
	font-weight: 800;
	border: 2px solid #ea580c;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
	white-space: nowrap;
}
/* Geotagged photo markers on the trail map. */
.at-trail-photo-marker { background: transparent; border: 0; }
.at-trail-photo-marker-inner {
	display: block;
	width: 46px;
	height: 46px;
	border-radius: 8px;
	border: 2px solid #fff;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.45);
	overflow: hidden;
	background: #fff;
	cursor: pointer;
	transition: transform 100ms ease, box-shadow 100ms ease;
}
.at-trail-photo-marker-inner:hover {
	transform: scale(1.12);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.55);
}
.at-trail-photo-marker-inner img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.at-trail-map-empty {
	padding: 1.5rem;
	margin: 1.5rem 0;
	text-align: center;
	background: var(--wp--preset--color--paper);
	border: 1px dashed rgba(0, 0, 0, 0.2);
	border-radius: 8px;
	opacity: 0.75;
}

/* ---------- Calorie calculator ---------- */
.at-trail-calc {
	margin: 2rem 0;
	padding: 1.5rem;
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 10px;
}
.at-trail-calc-header { margin-bottom: 1.25rem; }
.at-trail-calc-title {
	margin: 0 0 0.25rem;
	font-size: 1.5rem;
	font-weight: 600;
}
.at-trail-calc-intro {
	margin: 0;
	font-size: 0.95rem;
	opacity: 0.75;
}
.at-trail-calc-intro a { color: var(--wp--preset--color--brand); }

.at-trail-calc-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 0.85rem 1rem;
	margin-bottom: 1.25rem;
}
.at-trail-calc-field-full { grid-column: 1 / -1; }
.at-trail-calc-field {
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
	font-size: 0.85rem;
}
.at-trail-calc-field span {
	font-weight: 600;
	letter-spacing: 0.02em;
	opacity: 0.75;
}
.at-trail-calc-field input,
.at-trail-calc-field select {
	padding: 0.5rem 0.65rem;
	font-size: 1rem;
	background: #fff;
	color: var(--wp--preset--color--ink);
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 6px;
	font-family: inherit;
}
.at-trail-calc-field input:focus,
.at-trail-calc-field select:focus {
	outline: 2px solid var(--wp--preset--color--brand);
	outline-offset: 1px;
}

.at-trail-calc-results {
	display: grid;
	grid-template-columns: minmax(160px, 1fr) 2fr;
	gap: 1rem;
	align-items: stretch;
	margin-bottom: 1rem;
}
.at-trail-calc-total {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 1rem;
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--paper);
	border-radius: 8px;
	text-align: center;
}
.at-trail-calc-num {
	font-size: 2.25rem;
	font-weight: 700;
	line-height: 1;
}
.at-trail-calc-lbl {
	margin-top: 0.35rem;
	font-size: 0.85rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	opacity: 0.85;
}
.at-trail-calc-breakdown {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
	gap: 0.85rem;
	margin: 0;
	padding: 1rem;
	background: rgba(0, 0, 0, 0.03);
	border-radius: 8px;
}
.at-trail-calc-breakdown > div {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
}
.at-trail-calc-breakdown dt {
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	opacity: 0.6;
	margin: 0;
}
.at-trail-calc-breakdown dd {
	margin: 0;
	font-size: 1.05rem;
	font-weight: 600;
}

.at-trail-calc-foot {
	margin: 0;
	font-size: 0.8rem;
	line-height: 1.5;
	opacity: 0.6;
}

@media (max-width: 540px) {
	.at-trail-calc-results { grid-template-columns: 1fr; }
}

/* ---------- Gear library ---------- */
.at-gear {
	color: var(--wp--preset--color--ink);
}
.at-gear-gate {
	padding: 1.5rem;
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 10px;
}
.at-gear-gate p { margin: 0 0 0.75rem; }

.at-gear-flash {
	padding: 0.65rem 1rem;
	margin-bottom: 1rem;
	border-radius: 6px;
	font-size: 0.95rem;
}
.at-gear-flash.ok    { background: #e6f4ea; color: #1f6b3a; border: 1px solid #b6dec3; }
.at-gear-flash.error { background: #fdecea; color: #8a2a26; border: 1px solid #f3b8b3; }

.at-gear-form {
	padding: 1.5rem;
	margin-bottom: 2rem;
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 10px;
}
.at-gear-form-title {
	margin: 0 0 1rem;
	font-size: 1.25rem;
	font-weight: 600;
}
.at-gear-form-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 0.85rem 1rem;
}
.at-gear-field {
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
	font-size: 0.85rem;
}
.at-gear-field-wide { grid-column: 1 / -1; }
.at-foods-form-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 0.75rem;
	flex-wrap: wrap;
	margin-bottom: 0.5rem;
}
.at-foods-lookup-toggle {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.45rem 0.9rem;
	font-size: 0.9rem;
	font-weight: 600;
	font-family: inherit;
	background: rgba(0, 0, 0, 0.05);
	color: var(--wp--preset--color--ink);
	border: 1px solid rgba(0, 0, 0, 0.12);
	border-radius: 999px;
	cursor: pointer;
}
.at-foods-lookup-toggle:hover {
	background: rgba(0, 0, 0, 0.08);
}
.at-foods-lookup-toggle[aria-expanded="true"] {
	background: var(--wp--preset--color--brand);
	color: #fff;
	border-color: var(--wp--preset--color--brand);
}

.at-foods-lookup-panel {
	background: rgba(0, 0, 0, 0.025);
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 8px;
	padding: 1rem;
	margin-bottom: 1rem;
}
.at-foods-lookup-search {
	display: flex;
	gap: 0.5rem;
	margin-bottom: 0.6rem;
}
.at-foods-lookup-search input[type="search"] {
	flex: 1 1 auto;
	min-width: 0;
	padding: 0.55rem 0.75rem;
	font-size: 0.95rem;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 6px;
	background: #fff;
}
.at-foods-lookup-search button {
	padding: 0.55rem 1.1rem;
	font-size: 0.9rem;
	font-weight: 700;
	background: var(--wp--preset--color--brand);
	color: #fff;
	border: 0;
	border-radius: 6px;
	cursor: pointer;
}
.at-foods-lookup-status {
	font-size: 0.85rem;
	color: rgba(0, 0, 0, 0.6);
	margin-bottom: 0.5rem;
}
.at-foods-lookup-results {
	list-style: none;
	margin: 0;
	padding: 0;
	max-height: 360px;
	overflow-y: auto;
}
.at-foods-lookup-result {
	margin: 0;
	padding: 0;
}
.at-foods-lookup-result button {
	display: flex;
	gap: 0.7rem;
	align-items: center;
	width: 100%;
	padding: 0.55rem 0.65rem;
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 6px;
	margin-bottom: 0.3rem;
	cursor: pointer;
	text-align: left;
	font-family: inherit;
}
.at-foods-lookup-result button:hover,
.at-foods-lookup-result button:focus-visible {
	border-color: var(--wp--preset--color--brand);
	background: rgba(var(--wp--preset--color--brand), 0.04);
}
.at-foods-lookup-result img,
.at-foods-lookup-thumb-placeholder {
	width: 48px;
	height: 48px;
	flex: 0 0 auto;
	border-radius: 4px;
	object-fit: cover;
	background: rgba(0, 0, 0, 0.05);
}
.at-foods-lookup-text {
	display: flex;
	flex-direction: column;
	min-width: 0;
	flex: 1 1 auto;
}
.at-foods-lookup-title {
	font-weight: 600;
	font-size: 0.95rem;
	color: var(--wp--preset--color--ink);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.at-foods-lookup-sub {
	font-size: 0.8rem;
	color: rgba(0, 0, 0, 0.55);
	margin-top: 0.15rem;
}
.at-foods-lookup-credit {
	margin: 0.5rem 0 0;
	font-size: 0.75rem;
	color: rgba(0, 0, 0, 0.5);
}

.at-foods-lookup-barcode {
	display: flex;
	gap: 0.5rem;
	margin-bottom: 0.7rem;
	flex-wrap: wrap;
}
.at-foods-lookup-barcode input[type="text"] {
	flex: 1 1 180px;
	min-width: 0;
	padding: 0.55rem 0.75rem;
	font-size: 0.95rem;
	font-family: inherit;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 6px;
	background: #fff;
}
.at-foods-lookup-barcode button {
	padding: 0.55rem 1rem;
	font-size: 0.9rem;
	font-weight: 600;
	border: 1px solid rgba(0, 0, 0, 0.15);
	background: #fff;
	border-radius: 6px;
	cursor: pointer;
}
.at-foods-lookup-barcode .at-foods-lookup-scan-btn {
	background: var(--wp--preset--color--brand);
	color: #fff;
	border-color: var(--wp--preset--color--brand);
}
.at-foods-lookup-barcode .at-foods-lookup-scan-btn:hover {
	background: var(--wp--preset--color--ink);
}
[data-at-foods-barcode-lookup]:hover {
	border-color: rgba(0, 0, 0, 0.35);
}

.at-foods-scanner {
	position: relative;
	margin: 0.5rem 0 0.75rem;
	background: #000;
	border-radius: 8px;
	overflow: hidden;
	aspect-ratio: 16 / 10;
	max-height: 320px;
}
.at-foods-scanner[hidden] {
	display: none;
}
.at-foods-scanner video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.at-foods-scanner-frame {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 60%;
	max-width: 320px;
	height: 100px;
	border: 2px dashed rgba(255, 255, 255, 0.7);
	border-radius: 6px;
	pointer-events: none;
}
.at-foods-scanner-cancel {
	position: absolute;
	bottom: 0.6rem;
	right: 0.6rem;
	padding: 0.4rem 0.85rem;
	background: rgba(0, 0, 0, 0.7);
	color: #fff;
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 999px;
	font-size: 0.85rem;
	font-weight: 600;
	cursor: pointer;
}
.at-foods-scanner-cancel:hover {
	background: #b91c1c;
	border-color: #b91c1c;
}
.at-foods-lookup-credit a {
	color: rgba(0, 0, 0, 0.65);
	text-decoration: underline;
}

.at-foods-section-title {
	margin: 1.5rem 0 0.5rem;
	font-size: 1rem;
	font-weight: 700;
	color: rgba(0, 0, 0, 0.7);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}
.at-foods-nutrition-grid {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (max-width: 720px) {
	.at-foods-nutrition-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
.at-foods-list .at-gear-cat-total {
	color: var(--wp--preset--color--brand);
}
.at-gear-weight-row {
	display: flex;
	gap: 0.5rem;
	align-items: stretch;
}
.at-gear-weight-row input[name="weight_value"] {
	flex: 1 1 auto;
	min-width: 0;
}
.at-gear-weight-row select[name="weight_unit"] {
	flex: 0 0 auto;
	width: auto;
	padding-right: 1.5rem;
}
.at-gear-field span {
	font-weight: 600;
	letter-spacing: 0.02em;
	opacity: 0.75;
}
.at-gear-field span em {
	color: var(--wp--preset--color--brand);
	font-style: normal;
	margin-left: 0.15rem;
}
.at-gear-field input,
.at-gear-field select,
.at-gear-field textarea {
	padding: 0.5rem 0.65rem;
	font-size: 1rem;
	font-family: inherit;
	color: var(--wp--preset--color--ink);
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 6px;
}
.at-gear-field input:focus,
.at-gear-field select:focus,
.at-gear-field textarea:focus {
	outline: 2px solid var(--wp--preset--color--brand);
	outline-offset: 1px;
}
.at-gear-form-actions {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-top: 1.25rem;
}

.at-gear-list {
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}
.at-gear-cat {
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 10px;
	overflow: hidden;
}
.at-gear-cat-header {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 1rem;
	padding: 0.85rem 1.25rem;
	background: rgba(0, 0, 0, 0.03);
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.at-gear-cat-header h4 {
	margin: 0;
	font-size: 1rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.at-gear-cat-total {
	font-size: 0.9rem;
	font-weight: 600;
	opacity: 0.75;
}
.at-gear-rows {
	list-style: none;
	margin: 0;
	padding: 0;
}
.at-gear-row {
	display: grid;
	grid-template-columns: 48px 1fr auto auto;
	gap: 1rem;
	align-items: center;
	padding: 0.75rem 1.25rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}
.at-gear-row-thumb {
	width: 48px;
	height: 48px;
	object-fit: cover;
	border-radius: 6px;
	display: block;
	background: rgba(0, 0, 0, 0.05);
}
.at-gear-row-thumb-placeholder {
	background: rgba(0, 0, 0, 0.05);
}
.at-gear-row:last-child { border-bottom: 0; }
.at-gear-row-title {
	font-weight: 600;
	color: var(--wp--preset--color--ink);
}
.at-gear-row-sub {
	font-size: 0.85rem;
	opacity: 0.65;
}
.at-gear-row-weight {
	font-variant-numeric: tabular-nums;
	font-weight: 600;
	min-width: 4.5rem;
	text-align: right;
}
.at-gear-row-actions {
	display: flex;
	gap: 0.85rem;
	align-items: center;
}
.at-gear-inline-form {
	display: inline;
	margin: 0;
	padding: 0;
}
.at-gear-link {
	background: none;
	border: 0;
	padding: 0;
	color: var(--wp--preset--color--brand);
	font-size: 0.9rem;
	cursor: pointer;
	text-decoration: underline;
}
.at-gear-link.danger { color: #b3261e; }

.at-gear-total {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	padding: 1rem 1.5rem;
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--paper);
	border-radius: 10px;
	font-size: 1.05rem;
}
.at-gear-total strong {
	font-size: 1.5rem;
	font-variant-numeric: tabular-nums;
}

.at-gear-empty {
	padding: 1.5rem;
	text-align: center;
	background: var(--wp--preset--color--paper);
	border: 1px dashed rgba(0, 0, 0, 0.2);
	border-radius: 10px;
	opacity: 0.75;
}

@media (max-width: 540px) {
	.at-gear-row { grid-template-columns: 48px 1fr auto; }
	.at-gear-row-actions { grid-column: 1 / -1; justify-content: flex-end; }
}

/* ---------- Shared mini-nav (Gear · Packs) ---------- */
.at-mini-nav {
	display: flex;
	gap: 0.5rem;
	margin-bottom: 1.25rem;
	padding-bottom: 0.75rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.at-mini-nav-link {
	padding: 0.35rem 0.85rem;
	border-radius: 999px;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	background: transparent;
	border: 1px solid transparent;
}
.at-mini-nav-link:hover {
	background: rgba(0, 0, 0, 0.04);
}
.at-mini-nav-link.is-active {
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--paper);
}

/* ---------- Packs form ---------- */
.at-packs-items-title {
	margin: 1.5rem 0 0.75rem;
	font-size: 0.85rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-weight: 700;
	opacity: 0.75;
}
.at-packs-items {
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
	margin-bottom: 1.25rem;
}
.at-packs-cat {
	background: rgba(0, 0, 0, 0.02);
	border: 1px solid rgba(0, 0, 0, 0.06);
	border-radius: 8px;
	overflow: hidden;
}
.at-packs-cat .at-gear-cat-header h5 {
	margin: 0;
	font-size: 0.85rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.at-packs-rows {
	list-style: none;
	margin: 0;
	padding: 0;
}
.at-packs-row {
	display: grid;
	grid-template-columns: 1fr auto auto;
	gap: 0.85rem;
	align-items: center;
	padding: 0.55rem 1rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.04);
}
.at-packs-row:last-child { border-bottom: 0; }
.at-packs-row-label {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	cursor: pointer;
	font-weight: 500;
}
.at-packs-row-label input[type="checkbox"] {
	width: 1.05rem;
	height: 1.05rem;
	accent-color: var(--wp--preset--color--brand);
}
.at-packs-row-title { color: var(--wp--preset--color--ink); }
.at-packs-row-weight {
	font-variant-numeric: tabular-nums;
	font-size: 0.85rem;
	opacity: 0.65;
	min-width: 4.25rem;
	text-align: right;
}
.at-packs-row-qty {
	width: 4rem;
	padding: 0.3rem 0.45rem;
	font-size: 0.95rem;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 5px;
	text-align: center;
}

.at-packs-total {
	display: flex;
	justify-content: flex-start;
	align-items: baseline;
	gap: 0.5rem;
	flex-wrap: wrap;
	padding: 0.85rem 1.25rem;
	margin: 1rem 0 1.25rem;
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--paper);
	border-radius: 8px;
	font-size: 1rem;
}
.at-packs-total > span:first-child {
	margin-right: auto;
}
.at-packs-total strong {
	font-size: 1.4rem;
	font-variant-numeric: tabular-nums;
}
.at-packs-total-divider {
	opacity: 0.5;
}
.at-packs-total-kcal-label {
	font-size: 0.95rem;
	opacity: 0.85;
}

.at-packs-foods-empty {
	margin: 1rem 0 0;
	font-size: 0.9rem;
	color: rgba(0, 0, 0, 0.55);
}

/* ---------- Pack picker (dropdown + Add) + selected rows ---------- */
.at-packs-picker-section {
	margin: 1.5rem 0;
}
.at-packs-picker-row {
	display: flex;
	gap: 0.5rem;
	margin-bottom: 0.75rem;
	align-items: stretch;
}
.at-packs-picker-select {
	flex: 1 1 auto;
	min-width: 0;
	padding: 0.55rem 0.75rem;
	font-size: 0.95rem;
	font-family: inherit;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 6px;
	background: #fff;
	color: var(--wp--preset--color--ink);
}
.at-packs-picker-add {
	flex: 0 0 auto;
	padding: 0.55rem 1.1rem;
	font-size: 0.95rem;
	font-weight: 700;
	background: var(--wp--preset--color--brand);
	color: #fff;
	border: 0;
	border-radius: 6px;
	cursor: pointer;
}
.at-packs-picker-add:hover {
	background: var(--wp--preset--color--ink);
}
.at-packs-selected {
	list-style: none;
	margin: 0;
	padding: 0;
}
.at-packs-selected:empty::before {
	content: 'No items added yet.';
	display: block;
	padding: 0.6rem 0;
	font-size: 0.85rem;
	color: rgba(0, 0, 0, 0.45);
}
.at-packs-selected-row {
	display: grid;
	grid-template-columns: 1fr auto 5rem auto;
	gap: 0.6rem;
	align-items: center;
	padding: 0.5rem 0.75rem;
	margin-bottom: 0.35rem;
	background: rgba(0, 0, 0, 0.025);
	border-radius: 6px;
}
.at-packs-selected-title {
	font-weight: 600;
	font-size: 0.95rem;
}
.at-packs-selected-meta {
	font-size: 0.8rem;
	color: rgba(0, 0, 0, 0.55);
	white-space: nowrap;
}
.at-packs-selected-qty {
	width: 5rem;
	padding: 0.35rem 0.5rem;
	font-size: 0.9rem;
	font-family: inherit;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 4px;
	text-align: center;
}
.at-packs-selected-remove {
	width: 30px;
	height: 30px;
	background: transparent;
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	font-size: 1.25rem;
	line-height: 1;
	color: rgba(0, 0, 0, 0.45);
}
.at-packs-selected-remove:hover {
	background: rgba(220, 38, 38, 0.1);
	color: #b91c1c;
}

@media (max-width: 540px) {
	.at-packs-selected-row {
		grid-template-columns: 1fr auto;
		grid-template-areas:
			'title remove'
			'meta  meta'
			'qty   qty';
		gap: 0.35rem;
	}
	.at-packs-selected-title  { grid-area: title; }
	.at-packs-selected-meta   { grid-area: meta; white-space: normal; }
	.at-packs-selected-qty    { grid-area: qty; width: 100%; }
	.at-packs-selected-remove { grid-area: remove; }
}

/* ---------- Packs list ---------- */
.at-packs-list-title {
	margin: 1.75rem 0 0.85rem;
	font-size: 0.85rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-weight: 700;
	opacity: 0.75;
}
.at-packs-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
}
.at-packs-list-item {
	display: grid;
	grid-template-columns: 48px 1fr auto auto;
	gap: 1rem;
	align-items: center;
	padding: 0.85rem 1.25rem;
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 8px;
}
.at-packs-list-thumb {
	width: 48px;
	height: 48px;
	object-fit: cover;
	border-radius: 6px;
	display: block;
	background: rgba(0, 0, 0, 0.05);
}
.at-packs-list-thumb-placeholder {
	background: rgba(0, 0, 0, 0.05);
}
.at-packs-list-title-row {
	font-weight: 600;
	font-size: 1.05rem;
}
.at-packs-list-sub {
	font-size: 0.85rem;
	opacity: 0.65;
}
.at-packs-list-total {
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	min-width: 5rem;
	text-align: right;
}
.at-packs-missing {
	color: #b3261e;
	opacity: 0.85;
}

@media (max-width: 540px) {
	.at-packs-row { grid-template-columns: 1fr auto; }
	.at-packs-row-qty { grid-column: 1 / -1; justify-self: end; }
	.at-packs-list-item { grid-template-columns: 48px 1fr auto; }
	.at-packs-list-item .at-gear-row-actions { grid-column: 1 / -1; justify-content: flex-end; }
}

/* ---------- Recipe stats reuse trail-stats styles ---------- */
.at-recipe-stats { /* inherits .at-trail-stats */ }

/* ---------- Meal planner ---------- */
/* Meal planner — picker rows + selected list (new). */
.at-meal-pickers {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	margin: 1rem 0;
}
.at-meal-picker-row {
	display: flex;
	gap: 0.5rem;
}
.at-meal-picker-select {
	flex: 1 1 auto;
	min-width: 0;
	padding: 0.55rem 0.75rem;
	font-size: 0.95rem;
	font-family: inherit;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 6px;
	background: #fff;
	color: var(--wp--preset--color--ink);
}
.at-meal-picker-add {
	flex: 0 0 auto;
	padding: 0.55rem 1.1rem;
	font-size: 0.95rem;
	font-weight: 700;
	background: var(--wp--preset--color--brand);
	color: #fff;
	border: 0;
	border-radius: 6px;
	cursor: pointer;
}
.at-meal-picker-add:hover {
	background: var(--wp--preset--color--ink);
}
.at-meal-selected {
	list-style: none;
	margin: 0 0 1rem;
	padding: 0;
}
.at-meal-selected:empty::before {
	content: 'No items added yet. Use a dropdown above.';
	display: block;
	padding: 0.6rem 0;
	font-size: 0.85rem;
	color: rgba(0, 0, 0, 0.45);
}
.at-meal-selected-row {
	display: grid;
	grid-template-columns: auto 1fr auto 5rem auto;
	gap: 0.6rem;
	align-items: center;
	padding: 0.5rem 0.75rem;
	margin-bottom: 0.35rem;
	background: rgba(0, 0, 0, 0.025);
	border-radius: 6px;
}
.at-meal-selected-kind {
	font-size: 0.65rem;
	font-weight: 800;
	letter-spacing: 0.06em;
	padding: 0.15rem 0.4rem;
	border-radius: 4px;
	background: var(--wp--preset--color--brand);
	color: #fff;
}
.at-meal-selected-row[data-kind="recipe"] .at-meal-selected-kind {
	background: #b58900;
}
.at-meal-selected-title {
	font-weight: 600;
	font-size: 0.95rem;
}
.at-meal-selected-meta {
	font-size: 0.8rem;
	color: rgba(0, 0, 0, 0.55);
	white-space: nowrap;
}
.at-meal-selected-qty {
	width: 5rem;
	padding: 0.35rem 0.5rem;
	font-size: 0.9rem;
	font-family: inherit;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 4px;
	text-align: center;
}
.at-meal-selected-remove {
	width: 30px;
	height: 30px;
	background: transparent;
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	font-size: 1.25rem;
	line-height: 1;
	color: rgba(0, 0, 0, 0.45);
}
.at-meal-selected-remove:hover {
	background: rgba(220, 38, 38, 0.1);
	color: #b91c1c;
}
@media (max-width: 540px) {
	.at-meal-selected-row {
		grid-template-columns: auto 1fr auto;
		grid-template-areas:
			'kind  title remove'
			'meta  meta  meta'
			'qty   qty   qty';
		gap: 0.35rem;
	}
	.at-meal-selected-kind   { grid-area: kind; }
	.at-meal-selected-title  { grid-area: title; }
	.at-meal-selected-meta   { grid-area: meta; white-space: normal; }
	.at-meal-selected-qty    { grid-area: qty; width: 100%; }
	.at-meal-selected-remove { grid-area: remove; justify-self: end; }
}

.at-meal-planner {
	margin: 2rem 0;
	padding: 1.5rem;
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 10px;
}
.at-meal-planner-header { margin-bottom: 1.25rem; }
.at-meal-planner-title {
	margin: 0 0 0.25rem;
	font-size: 1.5rem;
	font-weight: 600;
}
.at-meal-planner-intro {
	margin: 0;
	font-size: 0.95rem;
	opacity: 0.75;
}

.at-meal-planner-controls {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-bottom: 1.5rem;
	padding-bottom: 1.25rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
	flex-wrap: wrap;
}
.at-meal-target-field {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.95rem;
}
.at-meal-target-field span {
	font-weight: 600;
	opacity: 0.75;
}
.at-meal-target-field input {
	width: 7rem;
	padding: 0.45rem 0.6rem;
	font-size: 1rem;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 6px;
	font-family: inherit;
}
.at-meal-unit { opacity: 0.55; }

.at-meal-planner-grid {
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
	margin-bottom: 1.5rem;
}
.at-meal-cat {
	background: rgba(0, 0, 0, 0.02);
	border: 1px solid rgba(0, 0, 0, 0.06);
	border-radius: 8px;
	overflow: hidden;
}
.at-meal-cat .at-gear-cat-header h3 {
	margin: 0;
	font-size: 0.95rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.at-meal-rows {
	list-style: none;
	margin: 0;
	padding: 0;
}
.at-meal-row {
	display: grid;
	grid-template-columns: 1fr auto auto;
	gap: 1rem;
	align-items: center;
	padding: 0.55rem 1rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.04);
}
.at-meal-row:last-child { border-bottom: 0; }
.at-meal-row-label {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	cursor: pointer;
}
.at-meal-row-label input[type="checkbox"] {
	width: 1.05rem;
	height: 1.05rem;
	accent-color: var(--wp--preset--color--brand);
}
.at-meal-row-title a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	font-weight: 500;
}
.at-meal-row-title a:hover {
	color: var(--wp--preset--color--brand);
	text-decoration: underline;
}
.at-meal-row-nutri {
	font-size: 0.85rem;
	opacity: 0.65;
	font-variant-numeric: tabular-nums;
}
.at-meal-row-qty {
	width: 4rem;
	padding: 0.3rem 0.45rem;
	font-size: 0.95rem;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 5px;
	text-align: center;
}

.at-meal-planner-totals {
	display: grid;
	grid-template-columns: minmax(140px, 1fr) 2fr;
	gap: 1rem;
	align-items: stretch;
}
.at-meal-total-card {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 1rem;
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--paper);
	border-radius: 8px;
	text-align: center;
}
.at-meal-total-num {
	font-size: 2rem;
	font-weight: 700;
	line-height: 1;
	font-variant-numeric: tabular-nums;
}
.at-meal-total-lbl {
	margin-top: 0.35rem;
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	opacity: 0.85;
}
.at-meal-total-breakdown {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
	gap: 0.85rem;
	margin: 0;
	padding: 1rem;
	background: rgba(0, 0, 0, 0.03);
	border-radius: 8px;
}
.at-meal-total-breakdown > div {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
}
.at-meal-total-breakdown dt {
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	opacity: 0.6;
	margin: 0;
}
.at-meal-total-breakdown dd {
	margin: 0;
	font-size: 1.05rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}
.at-meal-total-breakdown dd.ok    { color: #1f6b3a; }
.at-meal-total-breakdown dd.over  { color: #b3261e; }
.at-meal-total-breakdown dd.under { color: #8a6d3b; }

.at-meal-empty,
.at-meal-no-results {
	padding: 1.5rem;
	text-align: center;
	background: rgba(0, 0, 0, 0.03);
	border-radius: 8px;
	opacity: 0.7;
	margin: 0 0 1rem;
}

/* ---------- Dietary filter pills ---------- */
.at-meal-dietary {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
	margin: 0 0 1.5rem;
	padding-bottom: 1.25rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.at-meal-dietary-heading {
	font-size: 0.8rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	opacity: 0.6;
	margin-right: 0.25rem;
}
.at-meal-dietary-label {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.3rem 0.85rem;
	background: rgba(0, 0, 0, 0.04);
	border: 1px solid rgba(0, 0, 0, 0.06);
	border-radius: 999px;
	cursor: pointer;
	font-size: 0.85rem;
	font-weight: 500;
	user-select: none;
	transition: background-color 120ms ease, color 120ms ease, border-color 120ms ease;
}
.at-meal-dietary-label input[type="checkbox"] {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	border: 0;
}
.at-meal-dietary-label:hover {
	background: rgba(0, 0, 0, 0.07);
}
.at-meal-dietary-label:has(input:checked) {
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--paper);
	border-color: var(--wp--preset--color--brand);
}
.at-meal-dietary-label input:focus-visible + span {
	outline: 2px solid var(--wp--preset--color--brand);
	outline-offset: 4px;
	border-radius: 4px;
}

/* ---------- Hidden utility (used by dietary filter) ---------- */
.at-meal-planner .is-hidden { display: none !important; }

/* ---------- My Trips list ---------- */
.at-trips-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
}
.at-trips-list-item {
	display: grid;
	grid-template-columns: 2fr 3fr auto;
	gap: 1rem;
	align-items: center;
	padding: 0.95rem 1.25rem;
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 8px;
}
.at-trips-list-item.is-orphan {
	border-style: dashed;
	opacity: 0.75;
}
.at-trips-list-title-row {
	font-size: 1.05rem;
	font-weight: 600;
}
.at-trips-list-title-row a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}
.at-trips-list-title-row a:hover {
	color: var(--wp--preset--color--brand);
	text-decoration: underline;
}
.at-trips-orphan { color: #b3261e; }
.at-trips-list-sub {
	font-size: 0.85rem;
	opacity: 0.65;
}
.at-trips-summary {
	display: flex;
	gap: 1.25rem;
	margin: 0;
	padding: 0;
}
.at-trips-summary > div {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}
.at-trips-summary dt {
	font-size: 0.7rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	opacity: 0.55;
	margin: 0;
}
.at-trips-summary dd {
	margin: 0;
	font-size: 0.95rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}
.at-trips-summary-multi {
	display: flex;
	flex-wrap: wrap;
	gap: 0.15rem 0.5rem;
	line-height: 1.3;
}
.at-trips-summary-multi span {
	white-space: nowrap;
}
.at-trips-summary-multi span + span {
	color: rgba(0, 0, 0, 0.55);
	font-weight: 500;
}

@media (max-width: 640px) {
	.at-trips-list-item {
		grid-template-columns: 1fr;
	}
	.at-trips-summary { flex-wrap: wrap; }
	.at-trips-list-item .at-gear-row-actions { justify-content: flex-end; }
}

/* ---------- Gallery editor (used in submit forms) ---------- */
.at-gallery-editor {
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
	margin-top: 0.4rem;
}
.at-gallery-editor-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
	gap: 0.65rem;
}
.at-gallery-editor-item {
	position: relative;
	background: rgba(0, 0, 0, 0.05);
	border-radius: 8px;
	overflow: hidden;
	aspect-ratio: 1 / 1;
	cursor: grab;
	transition: opacity 120ms ease, transform 120ms ease;
}
.at-gallery-editor-item:active {
	cursor: grabbing;
}
.at-gallery-editor-item.is-dragging {
	opacity: 0.4;
	cursor: grabbing;
}
.at-gallery-editor-thumb {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.at-gallery-editor-controls {
	position: absolute;
	inset: auto 0 0 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.2rem;
	padding: 0.3rem 0.4rem;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}
.at-gallery-editor-controls button {
	background: rgba(255, 255, 255, 0.18);
	color: #fff;
	border: 0;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	cursor: pointer;
	font-size: 1rem;
	line-height: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.at-gallery-editor-controls button:hover { background: rgba(255, 255, 255, 0.3); }
.at-gallery-editor-remove { background: rgba(220, 38, 38, 0.55) !important; }
.at-gallery-editor-remove:hover { background: rgba(220, 38, 38, 0.8) !important; }
.at-gallery-editor-pos {
	color: #fff;
	font-size: 0.8rem;
	font-weight: 700;
	min-width: 1.2em;
	text-align: center;
	font-variant-numeric: tabular-nums;
}
.at-gallery-editor-badge {
	position: absolute;
	top: 0.35rem;
	left: 0.35rem;
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--paper);
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	padding: 0.15rem 0.45rem;
	border-radius: 999px;
}
.at-gallery-editor-add {
	display: flex;
	align-items: center;
	gap: 0.65rem;
	padding: 0.65rem 0.85rem;
	background: rgba(0, 0, 0, 0.03);
	border: 1px dashed rgba(0, 0, 0, 0.18);
	border-radius: 8px;
	font-size: 0.85rem;
}
.at-gallery-editor-add input[type="file"] {
	font-size: 0.85rem;
}
.at-gallery-editor-add-help {
	color: var(--wp--preset--color--ink);
	opacity: 0.75;
	line-height: 1.4;
}

/* ---------- Gallery (public grid) ---------- */
.at-gallery {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 0.5rem;
	margin: 0.85rem 0 1.25rem;
}
.at-gallery-link {
	display: block;
	line-height: 0;
	border-radius: 8px;
	overflow: hidden;
	aspect-ratio: 16 / 10;
	background: rgba(0, 0, 0, 0.05);
}
.at-gallery-thumb {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 200ms ease;
}
.at-gallery-link:hover .at-gallery-thumb {
	transform: scale(1.04);
}

/* ---------- Trail edit link (single-trail page) ---------- */
.at-trail-edit-link {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.3rem 0.75rem;
	margin: 0.5rem 0;
	font-size: 0.85rem;
	font-weight: 500;
	color: var(--wp--preset--color--ink);
	background: transparent;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 999px;
	text-decoration: none;
	opacity: 0.75;
	transition: opacity 120ms ease, background-color 120ms ease;
}
.at-trail-edit-link:hover {
	opacity: 1;
	background: rgba(0, 0, 0, 0.04);
	color: var(--wp--preset--color--brand);
}

/* ---------- Submit-a-trail form ---------- */
.at-submit-trail-intro {
	margin: 0 0 1.25rem;
	font-size: 0.95rem;
	opacity: 0.8;
	line-height: 1.6;
}
.at-submit-trail-form input[type="file"] {
	font-size: 0.95rem;
	padding: 0.4rem;
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 6px;
}
.at-submit-trail-form input[type="file"]::file-selector-button {
	margin-right: 0.75rem;
	padding: 0.4rem 0.85rem;
	border: 0;
	border-radius: 5px;
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--paper);
	font-size: 0.85rem;
	font-weight: 600;
	cursor: pointer;
}

/* ---------- WYSIWYG notes editor ---------- */
.at-wysiwyg {
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 6px;
	overflow: hidden;
	background: #fff;
}
.at-wysiwyg-toolbar {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem;
	padding: 0.4rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	background: #f7fafc;
}
.at-wysiwyg-btn {
	border: 1px solid rgba(0, 0, 0, 0.15);
	background: #fff;
	border-radius: 4px;
	padding: 0.2rem 0.55rem;
	font-size: 0.85rem;
	line-height: 1.2;
	color: #1a202c;
	cursor: pointer;
}
.at-wysiwyg-btn:hover {
	background: #edf2f7;
}
.at-wysiwyg-area {
	min-height: 7rem;
	max-height: 22rem;
	overflow-y: auto;
	padding: 0.6rem 0.75rem;
	font-size: 0.95rem;
	line-height: 1.55;
	outline: none;
}
.at-wysiwyg-area:focus {
	box-shadow: inset 0 0 0 2px var(--wp--preset--color--brand, #2b6cb0);
}
.at-wysiwyg-area p {
	margin: 0 0 0.5rem;
}
.at-wysiwyg-area ul,
.at-wysiwyg-area ol {
	margin: 0 0 0.5rem 1.25rem;
}
.at-gear-field-hint {
	display: block;
	margin-top: 0.3rem;
	font-size: 0.8rem;
	opacity: 0.7;
}

/* ---------- Merge trails ---------- */
.at-submissions-merge-cta {
	margin: 0 0 1rem;
	font-size: 0.95rem;
}
.at-merge-list {
	list-style: none;
	margin: 1rem 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}
.at-merge-row {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 0.6rem 0.75rem;
	border: 1px solid rgba(0, 0, 0, 0.12);
	border-radius: 8px;
	background: #fff;
}
.at-merge-check {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	flex: 1 1 auto;
	cursor: pointer;
	font-weight: 400;
}
.at-merge-thumb {
	width: 56px;
	height: 56px;
	object-fit: cover;
	border-radius: 6px;
	flex: 0 0 auto;
}
.at-merge-thumb-empty {
	background: rgba(0, 0, 0, 0.08);
	display: inline-block;
}
.at-merge-meta {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}
.at-merge-title {
	font-weight: 600;
}
.at-merge-sub {
	font-size: 0.85rem;
	opacity: 0.7;
}
.at-merge-order {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.2rem;
	font-size: 0.75rem;
	opacity: 0.8;
	flex: 0 0 auto;
}
.at-merge-order input {
	width: 4rem;
	text-align: center;
}

/* ---------- On-map trail editor (crop / extend) ---------- */
.at-trail-editor-help {
	margin: 0 0 0.6rem;
	font-size: 0.85rem;
	line-height: 1.55;
	opacity: 0.85;
}
.at-trail-editor-map {
	height: 460px;
	border-radius: 8px;
	overflow: hidden;
	border: 1px solid rgba(0, 0, 0, 0.15);
}
.at-trail-editor-map.is-drawing {
	cursor: crosshair;
	box-shadow: 0 0 0 2px var(--wp--preset--color--accent, #ed8936);
}
.at-trail-editor-controls {
	margin-top: 0.75rem;
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
}
.at-trail-editor-row {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	align-items: center;
}
.at-trail-editor-row label {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.85rem;
	font-weight: 600;
	flex: 1 1 220px;
}
.at-trail-editor-row input[type="range"] {
	flex: 1 1 auto;
}
.at-trail-editor-buttons {
	gap: 0.5rem;
}
.at-trail-editor-buttons .at-gear-link {
	border: 1px solid rgba(0, 0, 0, 0.2);
	padding: 0.35rem 0.7rem;
	border-radius: 6px;
	background: #fff;
	cursor: pointer;
	font-size: 0.85rem;
}
.at-trail-editor-buttons .at-gear-link.is-active {
	background: var(--wp--preset--color--accent, #ed8936);
	color: #fff;
	border-color: var(--wp--preset--color--accent, #ed8936);
}
.at-trail-editor-buttons .at-gear-link.danger {
	color: #b91c1c;
}
.at-trail-editor-readout {
	font-size: 0.9rem;
	line-height: 1.5;
}
.at-trail-editor-readout .at-trail-editor-orig {
	opacity: 0.6;
}

/* ---------- Trail conditions ---------- */
.at-conditions-summary {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0.35rem 0.85rem;
	margin: 0.5rem 0 1rem;
	border-radius: 999px;
	font-size: 0.9rem;
	font-weight: 600;
	text-decoration: none;
	border: 1px solid;
}
.at-conditions-summary .at-conditions-icon { font-size: 1rem; line-height: 1; }
.at-conditions-summary .at-conditions-age  { font-weight: 500; opacity: 0.75; }

.at-conditions-summary.is-passable  { background: #e6f4ea; border-color: #b6dec3; color: #1f6b3a; }
.at-conditions-summary.is-caution   { background: #fef6dc; border-color: #ecd587; color: #7a5b08; }
.at-conditions-summary.is-hazardous { background: #fde9d6; border-color: #f5b889; color: #8a3d10; }
.at-conditions-summary.is-closed    { background: #fdecea; border-color: #f3b8b3; color: #8a2a26; }

.at-conditions-summary.is-stale { opacity: 0.55; }
.at-conditions-summary.is-recent { opacity: 0.85; }

.at-conditions {
	margin: 3rem 0 1.5rem;
	padding-top: 2rem;
	border-top: 1px solid rgba(0, 0, 0, 0.08);
}
.at-conditions-title {
	margin: 0 0 0.75rem;
	font-size: 1.5rem;
	font-weight: 600;
}
.at-conditions-form { margin: 0.5rem 0 2rem; }

.at-conditions-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
}
.at-condition-row {
	display: grid;
	grid-template-columns: 140px 1fr;
	gap: 1rem;
	padding: 0.85rem 1rem;
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 8px;
	align-items: start;
}
.at-condition-row.is-stale  { opacity: 0.55; }
.at-condition-row.is-recent { opacity: 0.85; }

.at-condition-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.2rem 0.7rem;
	border-radius: 999px;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.03em;
	width: fit-content;
}
.at-condition-badge.is-passable  { background: #e6f4ea; color: #1f6b3a; }
.at-condition-badge.is-caution   { background: #fef6dc; color: #7a5b08; }
.at-condition-badge.is-hazardous { background: #fde9d6; color: #8a3d10; }
.at-condition-badge.is-closed    { background: #fdecea; color: #8a2a26; }

.at-condition-body {
	font-size: 0.95rem;
	line-height: 1.5;
	margin-bottom: 0.4rem;
}
.at-condition-photo-link {
	display: inline-block;
	line-height: 0;
	border-radius: 6px;
	overflow: hidden;
	margin: 0.25rem 0 0.5rem;
}
.at-condition-photo {
	width: 160px;
	height: 120px;
	object-fit: cover;
	display: block;
	transition: transform 200ms ease;
}
.at-condition-photo-link:hover .at-condition-photo {
	transform: scale(1.03);
}
.at-condition-meta {
	font-size: 0.85rem;
	opacity: 0.7;
}
.at-condition-author {
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}
.at-condition-author:hover {
	color: var(--wp--preset--color--brand);
	text-decoration: underline;
}

@media (max-width: 540px) {
	.at-condition-row { grid-template-columns: 1fr; }
}

/* ---------- Notifications list + nav badge ---------- */
.at-mini-nav-badge {
	display: inline-block;
	min-width: 1.4em;
	padding: 0 0.45em;
	margin-left: 0.3em;
	font-size: 0.7rem;
	font-weight: 700;
	line-height: 1.4;
	color: #fff;
	background: #b3261e;
	border-radius: 999px;
	vertical-align: 1px;
	font-variant-numeric: tabular-nums;
}
.at-mini-nav-link.is-active .at-mini-nav-badge {
	background: rgba(255, 255, 255, 0.25);
	color: var(--wp--preset--color--paper);
}

.at-notifications-just-read {
	margin: 0 0 1rem;
	font-size: 0.85rem;
	opacity: 0.65;
	font-style: italic;
}

/* Digest preference toggle */
.at-digest-pref {
	margin: 0 0 1.5rem;
	padding: 0.75rem 1rem;
	background: rgba(0, 0, 0, 0.03);
	border: 1px solid rgba(0, 0, 0, 0.06);
	border-radius: 8px;
}
.at-digest-pref-toggle {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.9rem;
	cursor: pointer;
}
.at-digest-pref-toggle input[type="checkbox"] {
	width: 1.05rem;
	height: 1.05rem;
	accent-color: var(--wp--preset--color--brand);
}
.at-digest-pref-actions {
	display: flex;
	gap: 1rem;
	margin-top: 0.5rem;
	font-size: 0.85rem;
}
.at-digest-pref-actions button {
	background: none;
	border: 0;
	padding: 0;
	color: var(--wp--preset--color--brand);
	cursor: pointer;
	text-decoration: underline;
	font-family: inherit;
	font-size: 0.85rem;
}
.at-notification-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
}
.at-notification-item {
	display: grid;
	grid-template-columns: 36px 1fr;
	gap: 0.85rem;
	padding: 0.75rem 1rem;
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 8px;
}
.at-notification-avatar img {
	display: block;
	border-radius: 50%;
}
.at-notification-line { font-size: 0.95rem; }
.at-notification-actor {
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}
.at-notification-actor:hover { color: var(--wp--preset--color--brand); text-decoration: underline; }
.at-notification-verb { opacity: 0.8; margin: 0 0.2rem; }
.at-notification-target {
	color: var(--wp--preset--color--brand);
	text-decoration: none;
	font-weight: 500;
}
.at-notification-target:hover { text-decoration: underline; }
.at-notification-time {
	font-size: 0.8rem;
	opacity: 0.55;
	margin-top: 0.2rem;
}

/* type-specific accents */
.at-notification-item.is-type-published { border-left: 3px solid #1f6b3a; padding-left: 0.85rem; }
.at-notification-item.is-type-follow    { border-left: 3px solid var(--wp--preset--color--brand); padding-left: 0.85rem; }
.at-notification-item.is-type-review    { border-left: 3px solid #d4a017; padding-left: 0.85rem; }
.at-notification-item.is-type-condition         { border-left: 3px solid #b3261e; padding-left: 0.85rem; }
.at-notification-item.is-type-helpful_milestone { border-left: 3px solid #d4a017; padding-left: 0.85rem; }

/* ---------- Follow button ---------- */
.at-follow-button {
	display: inline-flex;
	align-items: center;
	padding: 0.5rem 1.1rem;
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--wp--preset--color--paper);
	background: var(--wp--preset--color--brand);
	border: 1px solid var(--wp--preset--color--brand);
	border-radius: 999px;
	cursor: pointer;
	text-decoration: none;
	font-family: inherit;
	transition: background-color 120ms ease, color 120ms ease, border-color 120ms ease;
}
.at-follow-button:hover {
	opacity: 0.9;
}
.at-follow-button.is-following {
	background: transparent;
	color: var(--wp--preset--color--ink);
	border-color: rgba(0, 0, 0, 0.18);
}
.at-follow-button.is-cta {
	background: transparent;
	color: var(--wp--preset--color--brand);
}
.at-follow-button[disabled] { opacity: 0.6; cursor: progress; }

/* ---------- Activity feed ---------- */
.at-feed-following {
	margin: 0 0 1.5rem;
	padding: 0.6rem 0.85rem;
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 8px;
	font-size: 0.85rem;
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	align-items: center;
}
.at-feed-following-chip {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	padding: 0.15rem 0.55rem;
	background: rgba(0, 0, 0, 0.04);
	border-radius: 999px;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}
.at-feed-following-chip:hover { background: rgba(0, 0, 0, 0.08); }
.at-feed-following-avatar { border-radius: 50%; }

.at-feed-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
}
.at-feed-item {
	display: grid;
	grid-template-columns: 36px 1fr;
	gap: 0.85rem;
	padding: 0.85rem 1rem;
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 8px;
}
.at-feed-avatar img { display: block; border-radius: 50%; }
.at-feed-line { font-size: 0.95rem; }
.at-feed-user {
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}
.at-feed-user:hover { color: var(--wp--preset--color--brand); text-decoration: underline; }
.at-feed-target {
	color: var(--wp--preset--color--brand);
	text-decoration: none;
	font-weight: 500;
}
.at-feed-target:hover { text-decoration: underline; }
.at-feed-time { opacity: 0.55; font-size: 0.85rem; }

.at-feed-review { margin-top: 0.5rem; font-size: 0.95rem; }
.at-feed-review blockquote {
	margin: 0.3rem 0 0;
	padding: 0 0 0 0.75rem;
	border-left: 3px solid rgba(0, 0, 0, 0.08);
	opacity: 0.85;
}

.at-feed-post { margin-top: 0.5rem; }
.at-feed-post-link {
	display: inline-flex;
	align-items: center;
	gap: 0.65rem;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	font-weight: 500;
}
.at-feed-post-link:hover { color: var(--wp--preset--color--brand); }
.at-feed-thumb {
	width: 56px;
	height: 56px;
	object-fit: cover;
	border-radius: 6px;
}

.at-profile-actions {
	margin-left: auto;
}

/* ---------- Profile relations (followers / following list view) ---------- */
.at-profile-relations { display: flex; flex-direction: column; gap: 1rem; }
.at-profile-relations-back a {
	font-size: 0.9rem;
	color: var(--wp--preset--color--ink);
	opacity: 0.7;
	text-decoration: none;
}
.at-profile-relations-back a:hover {
	opacity: 1;
	color: var(--wp--preset--color--brand);
}
.at-profile-rel-link {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px dashed rgba(0, 0, 0, 0.25);
}
.at-profile-rel-link:hover {
	color: var(--wp--preset--color--brand);
	border-bottom-color: var(--wp--preset--color--brand);
}
.at-relations-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}
.at-relations-row {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	padding: 0.6rem 1rem;
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 8px;
}
.at-relations-avatar img {
	width: 40px;
	height: 40px;
	display: block;
	border-radius: 50%;
	object-fit: cover;
	background: rgba(0, 0, 0, 0.05);
}
.at-relations-name {
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}
.at-relations-name:hover {
	color: var(--wp--preset--color--brand);
	text-decoration: underline;
}

/* ---------- User profile (/author/<username>/) ---------- */
.at-profile {
	display: flex;
	flex-direction: column;
	gap: 2.5rem;
}
.at-profile-header {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	padding-bottom: 1.5rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.at-profile-avatar img {
	width: 96px;
	height: 96px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
	background: rgba(0, 0, 0, 0.05);
}
.at-profile-name {
	margin: 0 0 0.35rem;
	font-size: 1.75rem;
	font-weight: 700;
	line-height: 1.1;
}
.at-profile-sub {
	margin: 0;
	font-size: 0.95rem;
	opacity: 0.7;
}
.at-profile-dot { margin: 0 0.5rem; }
.at-profile-section-title {
	display: flex;
	align-items: baseline;
	gap: 0.6rem;
	margin: 0 0 1rem;
	font-size: 1.15rem;
	font-weight: 700;
}
.at-profile-count {
	font-size: 0.8rem;
	font-weight: 600;
	padding: 0.1rem 0.5rem;
	background: rgba(0, 0, 0, 0.06);
	border-radius: 999px;
	opacity: 0.75;
}
.at-profile-reviews {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
}
.at-profile-review {
	padding: 0.85rem 1rem;
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 8px;
}
.at-profile-review-head {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	align-items: baseline;
	font-size: 0.95rem;
	margin-bottom: 0.4rem;
}
.at-profile-review-trail {
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}
.at-profile-review-trail:hover {
	color: var(--wp--preset--color--brand);
	text-decoration: underline;
}
.at-profile-review-date {
	font-size: 0.85rem;
	opacity: 0.6;
}
.at-profile-review-excerpt {
	margin: 0;
	padding: 0 0 0 0.85rem;
	border-left: 3px solid rgba(0, 0, 0, 0.08);
	font-size: 0.95rem;
	line-height: 1.5;
	opacity: 0.85;
}

.at-profile-cards {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 1rem;
}
.at-profile-card {
	display: flex;
	gap: 0.85rem;
	padding: 0.85rem;
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 8px;
}
.at-profile-card-thumb {
	flex: 0 0 auto;
	line-height: 0;
}
.at-profile-thumb {
	width: 100px;
	height: 70px;
	object-fit: cover;
	border-radius: 6px;
	display: block;
}
.at-profile-thumb-placeholder {
	background: rgba(0, 0, 0, 0.06);
}
.at-profile-card-body {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
}
.at-profile-card-title {
	font-weight: 600;
	overflow: hidden;
	text-overflow: ellipsis;
}
.at-profile-card-title a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}
.at-profile-card-title a:hover {
	color: var(--wp--preset--color--brand);
	text-decoration: underline;
}
.at-profile-card-meta {
	font-size: 0.85rem;
	opacity: 0.7;
	font-variant-numeric: tabular-nums;
}
.at-profile-card-date {
	font-size: 0.8rem;
	opacity: 0.55;
}

@media (max-width: 540px) {
	.at-profile-header { flex-direction: column; align-items: flex-start; text-align: left; }
}

/* ---------- Reviews ---------- */
.at-stars {
	color: #d4a017;
	letter-spacing: 0.05em;
	font-size: 1rem;
}
.at-review-summary {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.35rem 0.75rem;
	margin: 0.5rem 0;
	background: rgba(212, 160, 23, 0.08);
	border: 1px solid rgba(212, 160, 23, 0.25);
	border-radius: 999px;
	font-size: 0.95rem;
}
.at-review-summary-num {
	font-weight: 700;
}
.at-review-summary-count {
	opacity: 0.7;
	font-size: 0.85rem;
}
.at-review-summary-inline {
	margin-bottom: 1rem;
}

.at-reviews {
	margin: 3rem 0 1.5rem;
	padding-top: 2rem;
	border-top: 1px solid rgba(0, 0, 0, 0.08);
}
.at-reviews-title {
	margin: 0 0 0.75rem;
	font-size: 1.5rem;
	font-weight: 600;
}
.at-reviews-logged-in {
	margin: 0 0 0.75rem;
	font-size: 0.9rem;
	opacity: 0.8;
}
.at-reviews-gate {
	padding: 1rem 1.25rem;
	background: var(--wp--preset--color--paper);
	border: 1px dashed rgba(0, 0, 0, 0.2);
	border-radius: 8px;
}

/* Star rating input (form) */
.at-rating-input {
	border: 0;
	margin: 0 0 1rem;
	padding: 0;
}
.at-rating-input legend {
	font-weight: 600;
	font-size: 0.95rem;
	margin-bottom: 0.4rem;
}
.at-rating-input legend em {
	color: var(--wp--preset--color--brand);
	font-style: normal;
	margin-left: 0.15rem;
}
.at-rating-stars {
	display: inline-flex;
	gap: 0.15rem;
	font-size: 1.85rem;
	line-height: 1;
}
.at-rating-stars label {
	cursor: pointer;
	color: #cbb27a;
	transition: color 80ms ease;
	display: inline-flex;
	align-items: center;
}
.at-rating-stars label.is-filled,
.at-rating-stars label:hover {
	color: #d4a017;
}
.at-rating-stars input[type="radio"] {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	margin: -1px;
}
.at-rating-star {
	display: inline-block;
}

/* Submitted review list */
.at-review-list {
	list-style: none;
	margin: 1.5rem 0 0;
	padding: 0;
}
.at-review-list .comment {
	padding: 1rem 1.25rem;
	margin-bottom: 0.85rem;
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 8px;
	list-style: none;
}
.at-review-list .comment .children {
	list-style: none;
	margin: 1rem 0 0 1.5rem;
	padding: 0;
}
.at-review-stars {
	display: flex;
	align-items: baseline;
	gap: 0.5rem;
	margin-bottom: 0.5rem;
}
.at-review-rating-num {
	font-size: 0.8rem;
	opacity: 0.65;
	font-variant-numeric: tabular-nums;
}
.at-review-list .comment-meta {
	font-size: 0.85rem;
	opacity: 0.65;
	margin-bottom: 0.5rem;
}

/* Standard WP comment form (reused here) — keep inputs styled like the rest */
.at-reviews .comment-form textarea {
	width: 100%;
	padding: 0.65rem 0.8rem;
	font-size: 1rem;
	font-family: inherit;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 6px;
	background: #fff;
}
.at-reviews .comment-form textarea:focus {
	outline: 2px solid var(--wp--preset--color--brand);
	outline-offset: 1px;
}

/* Photo upload field */
.at-review-photos-field {
	margin: 1rem 0;
}
.at-review-photos-field label {
	display: block;
	font-weight: 600;
	font-size: 0.95rem;
	margin-bottom: 0.4rem;
}
.at-review-photos-help {
	font-weight: 400;
	opacity: 0.65;
	font-size: 0.85rem;
}
.at-review-photos-field input[type="file"] {
	font-size: 0.9rem;
	padding: 0.35rem;
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 6px;
}
.at-review-photos-field input[type="file"]::file-selector-button {
	margin-right: 0.65rem;
	padding: 0.35rem 0.75rem;
	border: 0;
	border-radius: 5px;
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--paper);
	font-size: 0.85rem;
	font-weight: 600;
	cursor: pointer;
}

/* Lightbox for review photos */
body.at-lightbox-open { overflow: hidden; }

.at-lightbox {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, 0.88);
}
.at-lightbox[hidden] { display: none; }
.at-lightbox-image {
	max-width: 92vw;
	max-height: 86vh;
	display: block;
	border-radius: 6px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.6);
	background: #111;
}
.at-lightbox-close,
.at-lightbox-prev,
.at-lightbox-next {
	position: absolute;
	background: rgba(255, 255, 255, 0.12);
	color: #fff;
	border: 1px solid rgba(255, 255, 255, 0.22);
	font-size: 1.5rem;
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	cursor: pointer;
	font-family: inherit;
	line-height: 1;
	font-weight: 400;
	padding: 0;
}
.at-lightbox-close[hidden],
.at-lightbox-prev[hidden],
.at-lightbox-next[hidden] { display: none; }
.at-lightbox-close:hover,
.at-lightbox-prev:hover,
.at-lightbox-next:hover {
	background: rgba(255, 255, 255, 0.22);
}
.at-lightbox-close:focus-visible,
.at-lightbox-prev:focus-visible,
.at-lightbox-next:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}
.at-lightbox-close { top: 1rem; right: 1rem; font-size: 1.75rem; }
.at-lightbox-prev  { left: 1rem; top: 50%; transform: translateY(-50%); font-size: 1.8rem; }
.at-lightbox-next  { right: 1rem; top: 50%; transform: translateY(-50%); font-size: 1.8rem; }
.at-lightbox-caption {
	position: absolute;
	bottom: 1rem;
	left: 50%;
	transform: translateX(-50%);
	color: rgba(255, 255, 255, 0.85);
	font-size: 0.85rem;
	background: rgba(0, 0, 0, 0.5);
	padding: 0.25rem 0.7rem;
	border-radius: 999px;
}

/* Sort toggle on the reviews section */
.at-reviews-sort {
	display: flex;
	gap: 0.4rem;
	margin: 1.25rem 0 0.5rem;
}
.at-reviews-sort-link {
	display: inline-block;
	padding: 0.3rem 0.85rem;
	background: rgba(0, 0, 0, 0.04);
	color: var(--wp--preset--color--ink);
	border: 1px solid rgba(0, 0, 0, 0.06);
	border-radius: 999px;
	font-size: 0.85rem;
	font-weight: 600;
	text-decoration: none;
}
.at-reviews-sort-link:hover { background: rgba(0, 0, 0, 0.07); }
.at-reviews-sort-link.is-active {
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--paper);
	border-color: var(--wp--preset--color--brand);
}

/* Helpful-votes button on reviews */
.at-helpful {
	margin-top: 0.75rem;
}
.at-helpful.is-readonly {
	font-size: 0.85rem;
	opacity: 0.65;
}
.at-helpful-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.35rem 0.85rem;
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	background: rgba(0, 0, 0, 0.04);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 999px;
	cursor: pointer;
	font-family: inherit;
	transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease;
}
.at-helpful-btn:hover { background: rgba(0, 0, 0, 0.07); }
.at-helpful-btn.is-voted {
	background: #e6f4ea;
	color: #1f6b3a;
	border-color: #b6dec3;
}
.at-helpful-icon { font-size: 0.95rem; line-height: 1; }
.at-helpful-count {
	font-variant-numeric: tabular-nums;
	font-weight: 700;
	margin-left: 0.15rem;
}
.at-helpful-btn[disabled] { opacity: 0.6; cursor: progress; }

/* Review photo grid (display) */
.at-review-photos {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(120px, max-content));
	gap: 0.5rem;
	margin-top: 0.75rem;
}
.at-review-photo-link {
	display: block;
	line-height: 0;
	border-radius: 6px;
	overflow: hidden;
}
.at-review-photo-thumb {
	width: 120px;
	height: 120px;
	object-fit: cover;
	display: block;
	transition: transform 200ms ease;
}
.at-review-photo-link:hover .at-review-photo-thumb {
	transform: scale(1.04);
}

/* ---------- Favorite (Save trail) button ---------- */
.at-favorite-toggle {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0.5rem 1rem;
	margin: 0.5rem 0 1rem;
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 999px;
	cursor: pointer;
	text-decoration: none;
	font-family: inherit;
	transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease;
}
.at-favorite-toggle:hover {
	background: rgba(0, 0, 0, 0.04);
}
.at-favorite-toggle.is-favorited {
	background: #ffe4ec;
	color: #be185d;
	border-color: #f9a8c8;
}
.at-favorite-toggle.is-favorited:hover {
	background: #fbcfde;
}
.at-favorite-toggle.is-cta {
	opacity: 0.85;
}
.at-favorite-icon {
	display: inline-flex;
	align-items: center;
	line-height: 0;
}
/* Outline heart by default. Fills + recolors when the toggle is marked favorited. */
.at-favorite-icon svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linejoin: round;
	transition: fill 140ms ease, stroke 140ms ease, transform 140ms ease;
}
.at-favorite-toggle.is-favorited .at-favorite-icon svg {
	fill: #e11d48;
	stroke: #e11d48;
	animation: at-favorite-pop 260ms ease-out;
}
@keyframes at-favorite-pop {
	0%   { transform: scale(1); }
	40%  { transform: scale(1.25); }
	100% { transform: scale(1); }
}
.at-favorite-toggle[disabled] { opacity: 0.6; cursor: progress; }

/* ---------- Saved sub-nav (trails / recipes tabs) ---------- */
.at-saved-subnav {
	display: flex;
	gap: 0.5rem;
	margin-bottom: 1.5rem;
}
.at-saved-subnav-link {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.4rem 0.95rem;
	background: rgba(0, 0, 0, 0.04);
	color: var(--wp--preset--color--ink);
	border: 1px solid rgba(0, 0, 0, 0.06);
	border-radius: 999px;
	font-size: 0.85rem;
	font-weight: 600;
	text-decoration: none;
}
.at-saved-subnav-link:hover {
	background: rgba(0, 0, 0, 0.07);
}
.at-saved-subnav-link.is-active {
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--paper);
	border-color: var(--wp--preset--color--brand);
}
.at-saved-subnav-count {
	font-variant-numeric: tabular-nums;
	font-size: 0.75rem;
	padding: 0.05rem 0.45rem;
	background: rgba(255, 255, 255, 0.4);
	border-radius: 999px;
}
.at-saved-subnav-link.is-active .at-saved-subnav-count {
	background: rgba(255, 255, 255, 0.25);
}

/* ---------- Saved-trails list ---------- */
.at-saved-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
}
.at-saved-row {
	display: grid;
	grid-template-columns: 120px 1fr auto;
	gap: 1rem;
	align-items: center;
	padding: 0.85rem 1.25rem;
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 8px;
}
.at-saved-thumb-link {
	display: block;
	line-height: 0;
}
.at-saved-thumb {
	width: 120px;
	height: 80px;
	object-fit: cover;
	border-radius: 6px;
	display: block;
}
.at-saved-thumb-placeholder {
	background: rgba(0, 0, 0, 0.06);
}
.at-saved-title {
	font-size: 1.05rem;
	font-weight: 600;
}
.at-saved-title a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}
.at-saved-title a:hover {
	color: var(--wp--preset--color--brand);
	text-decoration: underline;
}
.at-saved-meta {
	display: flex;
	gap: 1.25rem;
	margin: 0.35rem 0 0;
}
.at-saved-meta > div {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}
.at-saved-meta dt {
	font-size: 0.7rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	opacity: 0.55;
	margin: 0;
}
.at-saved-meta dd {
	margin: 0;
	font-size: 0.9rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

@media (max-width: 640px) {
	.at-saved-row {
		grid-template-columns: 90px 1fr;
	}
	.at-saved-thumb {
		width: 90px;
		height: 64px;
	}
	.at-saved-row .at-gear-row-actions {
		grid-column: 1 / -1;
		justify-content: flex-end;
	}
}

/* ---------- Archive CTA (trails/recipes) ---------- */
.at-archive-cta {
	margin: 1.5rem auto 2rem;
	max-width: var(--wp--style--global--content-size, 680px);
}
.at-archive-cta-link {
	display: block;
	padding: 0.85rem 1.25rem;
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--paper);
	border-radius: 8px;
	text-decoration: none;
	font-weight: 600;
	font-size: 0.95rem;
	text-align: center;
	transition: opacity 120ms ease;
}
.at-archive-cta-link:hover {
	opacity: 0.9;
	color: var(--wp--preset--color--paper);
}

/* ---------- My Submissions list ---------- */
.at-submissions-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
}
.at-submissions-row {
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: 1rem;
	align-items: center;
	padding: 0.85rem 1.25rem;
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 8px;
}
.at-submissions-type {
	padding: 0.2rem 0.7rem;
	border-radius: 999px;
	font-size: 0.7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}
.at-submissions-type-trail {
	background: #e1ecf9;
	color: #1f3d6b;
}
.at-submissions-type-recipe {
	background: #fdecd1;
	color: #7a4f10;
}
.at-submissions-main {
	min-width: 0;
}
.at-submissions-title {
	font-size: 1.05rem;
	font-weight: 600;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.at-submissions-sub {
	font-size: 0.85rem;
	opacity: 0.65;
}
.at-submissions-note {
	margin-top: 1rem;
	font-size: 0.85rem;
	opacity: 0.6;
}

@media (max-width: 540px) {
	.at-submissions-row {
		grid-template-columns: auto 1fr;
	}
	.at-submissions-row .at-gear-row-actions {
		grid-column: 1 / -1;
		justify-content: flex-end;
	}
}

/* ---------- Submit-a-recipe dietary pills ---------- */
.at-submit-recipe-dietary {
	border: 0;
	margin: 0;
	padding: 0;
}
.at-submit-recipe-dietary legend {
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	opacity: 0.75;
	margin-bottom: 0.4rem;
}
.at-submit-recipe-dietary-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}
.at-submit-recipe-dietary-pill {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.35rem 0.85rem;
	background: rgba(0, 0, 0, 0.04);
	border: 1px solid rgba(0, 0, 0, 0.06);
	border-radius: 999px;
	cursor: pointer;
	font-size: 0.85rem;
	user-select: none;
	transition: background-color 120ms ease, color 120ms ease, border-color 120ms ease;
}
.at-submit-recipe-dietary-pill input[type="checkbox"] {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	border: 0;
}
.at-submit-recipe-dietary-pill:has(input:checked) {
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--paper);
	border-color: var(--wp--preset--color--brand);
}

/* ---------- Trip plan save panel ---------- */
.at-trip-plan-gate {
	margin: 1.5rem 0;
	padding: 1.25rem 1.5rem;
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink);
	border: 1px dashed rgba(0, 0, 0, 0.2);
	border-radius: 10px;
	font-size: 0.95rem;
}

.at-trip-plan-save {
	display: flex;
	align-items: center;
	gap: 1rem;
	flex-wrap: wrap;
	margin: 1.5rem 0;
	padding: 1.25rem 1.5rem;
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 10px;
}
.at-trip-plan-save-btn {
	font-size: 1rem;
	padding: 0.6rem 1.3rem;
	cursor: pointer;
}
.at-trip-plan-status {
	font-size: 0.9rem;
	opacity: 0.8;
}
.at-trip-plan-status.ok    { color: #1f6b3a; }
.at-trip-plan-status.error { color: #b3261e; }
.at-trip-plan-status.busy  { opacity: 0.6; }

@media (max-width: 540px) {
	.at-meal-row { grid-template-columns: 1fr auto; }
	.at-meal-row-nutri { grid-column: 1 / -1; padding-left: 1.65rem; }
	.at-meal-planner-totals { grid-template-columns: 1fr; }
}

/* ---------- Homepage full-page video background ---------- */
.at-page-bg {
	position: fixed;
	inset: 0;
	z-index: -1;
	overflow: hidden;
	pointer-events: none;
	background-color: #1a2b1f;
	background-image: url('assets/video/forest-hero-poster.jpg');
	background-size: cover;
	background-position: center;
}
.at-page-bg-video {
	position: absolute;
	inset: 0;
	width: 100vw;
	height: 100vh;
	object-fit: cover;
}
.at-page-bg-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(10, 25, 15, 0.30) 0%, rgba(10, 25, 15, 0.45) 100%);
}

/* Homepage: clear every container background so the fixed video shows through. */
body.home,
body.home .wp-site-blocks,
body.home main,
body.home .wp-block-group:not(.at-hero-card):not(.wp-block-post),
body.home .wp-block-query {
	background-color: transparent !important;
}

.at-hero {
	position: relative;
	display: grid;
	place-items: center;
	padding: clamp(0.75rem, 2vh, 1.5rem) clamp(1rem, 4vw, 2rem);
}
.at-hero > .at-hero-card,
.at-hero > .wp-block-group.at-hero-card {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: 680px;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
	background-color: rgba(15, 30, 20, 0.32);
	backdrop-filter: blur(10px) saturate(140%);
	-webkit-backdrop-filter: blur(10px) saturate(140%);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.40);
	border: 1px solid rgba(255, 255, 255, 0.18);
	color: #fff;
}
.at-hero-card h1.wp-block-heading,
.at-hero-card p {
	color: #fff;
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.55);
}
.at-hero-card a {
	color: #fff;
	text-decoration: underline;
}
.at-hero-card a:hover {
	color: #d6f0e0;
}
.at-hero-card,
.at-hero-card * {
	min-width: 0;
}
.at-hero-card h1.wp-block-heading {
	overflow-wrap: break-word;
	hyphens: auto;
}
.at-hero-card .at-trail-search {
	width: 100%;
	max-width: 100%;
}
.at-hero-card .at-trail-search-select,
.at-hero-card .at-trail-search-q,
.at-hero-card .at-trail-search-btn {
	max-width: 100%;
	box-sizing: border-box;
}

/* Mobile: skip the video download entirely; show the poster as a CSS background. */
@media (max-width: 768px) {
	.at-hero {
		padding: clamp(0.75rem, 2vh, 1.5rem) 1rem;
	}
	.at-page-bg-video { display: none; }
}

/* Respect reduced-motion: kill the video, keep the poster as background. */
@media (prefers-reduced-motion: reduce) {
	.at-page-bg-video { display: none; }
}

/* On the homepage, all body text is white over the dark video background. */
body.home,
body.home main,
body.home h1, body.home h2, body.home h3, body.home h4, body.home h5, body.home h6,
body.home p,
body.home li,
body.home a,
body.home .wp-block-post-title,
body.home .wp-block-post-title a,
body.home .wp-block-post-excerpt,
body.home .wp-block-post-excerpt p,
body.home .wp-block-post-date,
body.home .wp-block-post-author,
body.home .at-trails-map-count,
body.home .at-trails-map-toolbar a {
	color: #fff !important;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.55);
}
body.home h1, body.home h2 {
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.65);
}
body.home a:hover {
	color: #d6f0e0 !important;
}

/* But form widgets keep their own (dark-on-white) color so they remain usable. */
body.home input,
body.home select,
body.home textarea,
body.home .at-trail-search-q,
body.home .at-trail-search-select {
	color: var(--wp--preset--color--ink, #111) !important;
	text-shadow: none !important;
}
body.home .at-trail-search-btn {
	color: #fff !important;
	text-shadow: none !important;
}
/* The auth modal floats over the homepage's dark hero but renders on its own
   white surface, so its text must stay dark and drop the hero text-shadow.
   Specificity (0,2,2) here beats the body.home h2 / p / a rules above. */
body.home .at-auth-modal-dialog h1,
body.home .at-auth-modal-dialog h2,
body.home .at-auth-modal-dialog h3,
body.home .at-auth-modal-dialog p,
body.home .at-auth-modal-dialog li,
body.home .at-auth-modal-dialog label,
body.home .at-auth-modal-dialog a,
body.home .at-auth-modal-dialog .at-auth-pane-title {
	color: #000 !important;
	text-shadow: none !important;
}
/* Same exception for the confirmation modal (logout + other destructive prompts),
   which is shown to logged-in users and also floats on its own white surface. */
body.home .at-confirm-modal-dialog h1,
body.home .at-confirm-modal-dialog h2,
body.home .at-confirm-modal-dialog h3,
body.home .at-confirm-modal-dialog p,
body.home .at-confirm-modal-dialog li,
body.home .at-confirm-modal-dialog label,
body.home .at-confirm-modal-dialog a,
body.home .at-confirm-modal-dialog .at-confirm-modal-title {
	color: #000 !important;
	text-shadow: none !important;
}
/* And the Leaflet map content (popups, controls) stays at default colors. */
body.home .at-trails-map,
body.home .at-trails-map * {
	color: initial;
	text-shadow: none;
}
body.home .at-trails-map a {
	color: #0066cc !important;
	text-shadow: none !important;
}

/* Profile dropdown trigger in the header sits over the video on the homepage.
   Make the button + name + caret white so they're readable. The opened submenu
   has its own white background, so its inner items go back to dark text. */
body.home .at-profile-link,
body.home .at-profile-link-name,
body.home .at-profile-caret {
	color: #fff !important;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.55);
}
body.home .at-profile-link {
	background: rgba(255, 255, 255, 0.18) !important;
}
body.home .at-profile-link:hover,
body.home .at-profile-item.is-open .at-profile-link {
	background: rgba(255, 255, 255, 0.30) !important;
	color: #fff !important;
}
body.home .at-profile-submenu,
body.home .at-profile-submenu * {
	color: var(--wp--preset--color--ink) !important;
	text-shadow: none !important;
}
body.home .at-profile-submenu .at-profile-submenu-badge {
	color: #fff !important;
}
body.home .at-profile-submenu .at-logout-link {
	color: #b3261e !important;
}

/* Mobile hamburger overlay: when open it shows a white modal panel — undo the
   homepage white-text rules so the menu items are readable on their own bg. */
body.home .wp-block-navigation__responsive-container.is-menu-open,
body.home .wp-block-navigation__responsive-container.is-menu-open *,
body.home .wp-block-navigation__responsive-container.is-menu-open a,
body.home .wp-block-navigation__responsive-container.is-menu-open p,
body.home .wp-block-navigation__responsive-container.is-menu-open li,
body.home.has-modal-open .wp-block-navigation__responsive-container *,
body.home.has-modal-open .wp-block-navigation__responsive-container a {
	color: var(--wp--preset--color--ink, #111827) !important;
	text-shadow: none !important;
}
body.home .wp-block-navigation__responsive-container.is-menu-open .at-profile-link,
body.home .wp-block-navigation__responsive-container.is-menu-open .at-profile-link-name {
	color: var(--wp--preset--color--ink, #111827) !important;
	background: rgba(0, 0, 0, 0.04) !important;
}

/* Header logo backdrop: a mostly-opaque white panel behind the logo. */
header .wp-block-site-logo {
	width: fit-content;
	padding: 8px 12px;
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.85);
}