/* ══════════════════════════════════════════════════════════════════════════
 * OGA Mini App · assets/css/ogace-templates.css
 * Styles for the template files added in v109004.1:
 *   single.php · page.php · archive.php · search.php · 404.php
 *   comments.php · searchform.php · woocommerce.php
 *
 * Consumes design tokens from style.css :root — defines no new colours.
 * ══════════════════════════════════════════════════════════════════════════ */

/* ── Shared: terminal prompt line ──────────────────────────────────────── */
.oga-prompt {
	display: block;
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: .06em;
	color: var(--fg3);
	margin-bottom: 10px;
}

/* ── Shared: entry meta ────────────────────────────────────────────────── */
.oga-entry-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	font-family: var(--mono);
	font-size: 10px;
	color: var(--fg3);
	letter-spacing: .04em;
}
.oga-entry-meta a { color: var(--fg2); text-decoration: none; }
.oga-entry-meta a:hover { color: var(--gold); }
.oga-entry-sep { opacity: .5; }

/* ══════════════════════════════════════════════════════════════════════════
 * SINGLE + PAGE
 * ══════════════════════════════════════════════════════════════════════════ */
.oga-article--single,
.oga-article--page {
	max-width: 760px;
	margin: 0 auto;
}

.oga-article-header {
	padding-bottom: 18px;
	margin-bottom: 22px;
	border-bottom: 1px solid var(--line1);
}

.oga-article-title {
	font-family: var(--display);
	font-size: clamp(24px, 4vw, 36px);
	font-weight: 600;
	line-height: 1.18;
	letter-spacing: -.02em;
	color: var(--fg0);
	margin-bottom: 12px;
}

.oga-article-hero {
	margin: 0 0 26px;
	border-radius: var(--r12);
	overflow: hidden;
	border: 1px solid var(--line1);
	background: var(--bg2);
}
.oga-article-hero-img,
.oga-article-hero img {
	display: block;
	width: 100%;
	height: auto;
}
.oga-article-hero-caption {
	padding: 8px 12px;
	font-family: var(--mono);
	font-size: 10px;
	color: var(--fg3);
	border-top: 1px solid var(--line1);
}

/* ── Article body typography ───────────────────────────────────────────── */
.oga-article-body {
	font-size: 15px;
	line-height: 1.75;
	color: var(--fg1);
}
.oga-article-body > * + * { margin-top: 1.1em; }

.oga-article-body h2,
.oga-article-body h3,
.oga-article-body h4 {
	font-family: var(--display);
	color: var(--fg0);
	line-height: 1.3;
	letter-spacing: -.01em;
	margin-top: 1.9em;
	margin-bottom: .6em;
}
.oga-article-body h2 { font-size: 22px; font-weight: 600; }
.oga-article-body h3 { font-size: 18px; font-weight: 600; }
.oga-article-body h4 { font-size: 15px; font-weight: 600; }

.oga-article-body a {
	color: var(--gold);
	text-decoration: none;
	border-bottom: 1px solid var(--gold-dim);
	transition: border-color .15s ease;
}
.oga-article-body a:hover { border-bottom-color: var(--gold); }

.oga-article-body ul,
.oga-article-body ol { padding-left: 1.4em; }
.oga-article-body li + li { margin-top: .4em; }

.oga-article-body blockquote {
	padding: 12px 18px;
	border-left: 2px solid var(--gold);
	background: var(--gold-dim);
	border-radius: 0 var(--r8) var(--r8) 0;
	color: var(--fg1);
	font-style: normal;
}

.oga-article-body code {
	font-family: var(--mono);
	font-size: .88em;
	padding: 2px 5px;
	border-radius: var(--r4);
	background: var(--bg3);
	color: var(--fg0);
	border: 1px solid var(--line1);
}
.oga-article-body pre {
	padding: 14px 16px;
	border-radius: var(--r8);
	background: var(--bg2);
	border: 1px solid var(--line1);
	overflow-x: auto;
}
.oga-article-body pre code { border: 0; background: none; padding: 0; }

.oga-article-body img,
.oga-article-body figure { border-radius: var(--r8); max-width: 100%; height: auto; }

.oga-article-body table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}
.oga-article-body th,
.oga-article-body td {
	padding: 8px 10px;
	border: 1px solid var(--line1);
	text-align: left;
}
.oga-article-body th {
	background: var(--bg2);
	color: var(--fg0);
	font-weight: 600;
}

/* ── Article footer / tags ─────────────────────────────────────────────── */
.oga-article-footer {
	margin-top: 30px;
	padding-top: 18px;
	border-top: 1px solid var(--line1);
}
.oga-article-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}
.oga-article-tags a {
	display: inline-block;
	padding: 3px 9px;
	border-radius: 100px;
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: .04em;
	color: var(--fg2);
	background: var(--bg3);
	border: 1px solid var(--line1);
	text-decoration: none;
	transition: all .15s ease;
}
.oga-article-tags a:hover {
	color: var(--gold);
	border-color: var(--gold-dim);
	background: var(--gold-dim);
}

/* ── Page links (multipage posts) ──────────────────────────────────────── */
.oga-page-links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin-top: 24px;
	font-family: var(--mono);
	font-size: 11px;
}
.oga-page-links-label { color: var(--fg3); margin-right: 4px; }
.oga-page-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 26px;
	height: 26px;
	padding: 0 6px;
	border-radius: var(--r4);
	background: var(--bg3);
	border: 1px solid var(--line1);
	color: var(--fg1);
}
.oga-page-links a .oga-page-link { color: var(--fg2); }
.oga-page-links a:hover .oga-page-link { color: var(--gold); border-color: var(--gold-dim); }

/* ══════════════════════════════════════════════════════════════════════════
 * POST NAVIGATION
 * ══════════════════════════════════════════════════════════════════════════ */
.oga-post-nav {
	max-width: 760px;
	margin: 32px auto 0;
	padding-top: 20px;
	border-top: 1px solid var(--line1);
}
.oga-post-nav .nav-links {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}
.oga-post-nav .nav-previous,
.oga-post-nav .nav-next { min-width: 0; }
.oga-post-nav .nav-next { text-align: right; }

.oga-post-nav a {
	display: block;
	padding: 12px 14px;
	border-radius: var(--r8);
	background: var(--bg2);
	border: 1px solid var(--line1);
	text-decoration: none;
	transition: all .15s ease;
}
.oga-post-nav a:hover {
	border-color: var(--line3);
	background: var(--bg3);
}
.oga-nav-dir {
	display: block;
	font-family: var(--mono);
	font-size: 9px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--fg3);
	margin-bottom: 4px;
}
.oga-nav-title {
	display: block;
	font-size: 13px;
	font-weight: 500;
	color: var(--fg1);
	line-height: 1.4;
}
.oga-post-nav a:hover .oga-nav-title { color: var(--gold); }

@media (max-width: 560px) {
	.oga-post-nav .nav-links { grid-template-columns: 1fr; }
	.oga-post-nav .nav-next { text-align: left; }
}

/* ══════════════════════════════════════════════════════════════════════════
 * RELATED POSTS
 * ══════════════════════════════════════════════════════════════════════════ */
.oga-related {
	max-width: 760px;
	margin: 36px auto 0;
	padding-top: 22px;
	border-top: 1px solid var(--line1);
}
.oga-related-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 12px;
	margin-top: 14px;
}
.oga-related-card {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 12px;
	border-radius: var(--r8);
	background: var(--bg2);
	border: 1px solid var(--line1);
	text-decoration: none;
	transition: all .15s ease;
}
.oga-related-card:hover {
	border-color: var(--line3);
	background: var(--bg3);
	transform: translateY(-1px);
}
.oga-related-thumb {
	display: block;
	border-radius: var(--r6);
	overflow: hidden;
	aspect-ratio: 3 / 2;
	background: var(--bg3);
}
.oga-related-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.oga-related-title {
	font-size: 13px;
	font-weight: 500;
	line-height: 1.4;
	color: var(--fg1);
}
.oga-related-card:hover .oga-related-title { color: var(--gold); }
.oga-related-date {
	font-family: var(--mono);
	font-size: 9px;
	color: var(--fg3);
}

/* ══════════════════════════════════════════════════════════════════════════
 * ARCHIVE + SEARCH LISTS
 * ══════════════════════════════════════════════════════════════════════════ */
.oga-archive-header {
	padding-bottom: 16px;
	margin-bottom: 20px;
	border-bottom: 1px solid var(--line1);
}
.oga-archive-desc {
	margin-top: 8px;
	font-size: 13px;
	color: var(--fg2);
	line-height: 1.6;
}

.oga-archive-list {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.oga-article--list {
	display: grid;
	grid-template-columns: 132px 1fr;
	gap: 14px;
	padding: 14px 0;
	border-bottom: 1px solid var(--line1);
}
.oga-article--list:last-child { border-bottom: 0; }

.oga-article-list-thumb {
	display: block;
	border-radius: var(--r8);
	overflow: hidden;
	aspect-ratio: 3 / 2;
	background: var(--bg2);
	border: 1px solid var(--line1);
}
.oga-article-list-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .25s ease;
}
.oga-article--list:hover .oga-article-list-thumb img { transform: scale(1.03); }

.oga-article-list-body { min-width: 0; }

.oga-article-list-title {
	font-family: var(--display);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: -.01em;
	margin-bottom: 6px;
}
.oga-article-list-title a {
	color: var(--fg0);
	text-decoration: none;
}
.oga-article-list-title a:hover { color: var(--gold); }

.oga-article-list-excerpt {
	margin-top: 8px;
	font-size: 13px;
	line-height: 1.65;
	color: var(--fg2);
}
.oga-article-list-excerpt .read-more {
	color: var(--gold);
	text-decoration: none;
	font-weight: 500;
}

@media (max-width: 560px) {
	.oga-article--list { grid-template-columns: 96px 1fr; gap: 10px; }
	.oga-article-list-title { font-size: 14px; }
	.oga-article-list-excerpt { font-size: 12px; }
}

/* ── Search specifics ──────────────────────────────────────────────────── */
.oga-search-term { color: var(--gold); }
.oga-search-count {
	margin-top: 6px;
	font-family: var(--mono);
	font-size: 10px;
	color: var(--fg3);
}
.oga-search-form-wrap { margin-bottom: 22px; }
.oga-search-type {
	padding: 1px 6px;
	border-radius: var(--r4);
	background: var(--g1-bg);
	border: 1px solid var(--g1-bd);
	color: var(--g1);
	font-size: 9px;
	text-transform: uppercase;
	letter-spacing: .06em;
}

/* ══════════════════════════════════════════════════════════════════════════
 * SEARCH FORM
 * ══════════════════════════════════════════════════════════════════════════ */
.oga-searchform-row {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 0 12px;
	border-radius: var(--r8);
	background: var(--bg2);
	border: 1px solid var(--line2);
	transition: border-color .15s ease;
}
.oga-searchform-row:focus-within {
	border-color: var(--gold);
	box-shadow: 0 0 0 3px var(--gold-dim);
}
.oga-searchform-prompt {
	font-family: var(--mono);
	font-size: 13px;
	color: var(--gold);
	flex-shrink: 0;
}
.oga-searchform-input {
	flex: 1;
	min-width: 0;
	padding: 11px 0;
	border: 0;
	background: none;
	color: var(--fg0);
	font-family: var(--sans);
	font-size: 14px;
}
.oga-searchform-input::placeholder { color: var(--fg3); }
.oga-searchform-input:focus { outline: none; }
.oga-searchform-submit {
	flex-shrink: 0;
	width: 30px;
	height: 30px;
	display: grid;
	place-items: center;
	border: 0;
	border-radius: var(--r6);
	background: var(--gold);
	color: #fff;
	cursor: pointer;
	font-size: 14px;
	transition: background .15s ease;
}
.oga-searchform-submit:hover { background: var(--gold-hover); }

/* ══════════════════════════════════════════════════════════════════════════
 * 404
 * ══════════════════════════════════════════════════════════════════════════ */
.oga-404-panel {
	max-width: 560px;
	margin: 0 auto;
	padding: 36px 24px;
	text-align: center;
	border-radius: var(--r12);
	background: var(--bg1);
	border: 1px solid var(--line1);
}
.oga-404-code {
	font-family: var(--mono);
	font-size: clamp(56px, 14vw, 88px);
	font-weight: 500;
	line-height: 1;
	color: var(--gold);
	letter-spacing: -.03em;
	margin-bottom: 12px;
}
.oga-404-msg {
	font-size: 14px;
	line-height: 1.65;
	color: var(--fg2);
	margin-bottom: 22px;
}
.oga-404-search { margin-bottom: 20px; text-align: left; }

.oga-404-nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
}
.oga-404-btn {
	display: inline-flex;
	align-items: center;
	padding: 9px 18px;
	border-radius: var(--r8);
	font-size: 13px;
	font-weight: 500;
	text-decoration: none;
	background: var(--bg3);
	border: 1px solid var(--line2);
	color: var(--fg1);
	transition: all .15s ease;
}
.oga-404-btn:hover { border-color: var(--line3); background: var(--bg4); }
.oga-404-btn--primary {
	background: var(--gold);
	border-color: var(--gold);
	color: #fff;
}
.oga-404-btn--primary:hover { background: var(--gold-hover); border-color: var(--gold-hover); }

.oga-404-recent {
	margin-top: 28px;
	padding-top: 20px;
	border-top: 1px solid var(--line1);
	text-align: left;
}
.oga-404-recent-list { list-style: none; margin-top: 12px; }
.oga-404-recent-list li {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
	padding: 8px 0;
	border-bottom: 1px solid var(--line1);
}
.oga-404-recent-list li:last-child { border-bottom: 0; }
.oga-404-recent-list a {
	font-size: 13px;
	color: var(--fg1);
	text-decoration: none;
	line-height: 1.4;
}
.oga-404-recent-list a:hover { color: var(--gold); }
.oga-404-recent-date {
	flex-shrink: 0;
	font-family: var(--mono);
	font-size: 9px;
	color: var(--fg3);
}

/* ══════════════════════════════════════════════════════════════════════════
 * EMPTY STATES
 * ══════════════════════════════════════════════════════════════════════════ */
.oga-empty {
	padding: 32px 20px;
	text-align: center;
	border-radius: var(--r12);
	background: var(--bg1);
	border: 1px dashed var(--line2);
}
.oga-empty > p {
	font-size: 14px;
	color: var(--fg2);
	margin-bottom: 18px;
}
.oga-empty-suggest { margin-top: 24px; text-align: left; }
.oga-empty-links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	list-style: none;
	margin-top: 12px;
}
.oga-empty-links a {
	display: inline-block;
	padding: 6px 12px;
	border-radius: 100px;
	font-size: 12px;
	background: var(--bg3);
	border: 1px solid var(--line1);
	color: var(--fg1);
	text-decoration: none;
	transition: all .15s ease;
}
.oga-empty-links a:hover {
	color: var(--gold);
	border-color: var(--gold-dim);
	background: var(--gold-dim);
}

/* ══════════════════════════════════════════════════════════════════════════
 * PAGINATION
 * ══════════════════════════════════════════════════════════════════════════ */
.oga-pagination {
	margin-top: 26px;
	padding-top: 18px;
	border-top: 1px solid var(--line1);
}
.oga-pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 5px;
}
.oga-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 32px;
	height: 32px;
	padding: 0 9px;
	border-radius: var(--r6);
	font-family: var(--mono);
	font-size: 11px;
	text-decoration: none;
	background: var(--bg2);
	border: 1px solid var(--line1);
	color: var(--fg2);
	transition: all .15s ease;
}
.oga-pagination .page-numbers:hover {
	color: var(--fg0);
	border-color: var(--line3);
	background: var(--bg3);
}
.oga-pagination .page-numbers.current {
	background: var(--gold);
	border-color: var(--gold);
	color: #fff;
}
.oga-pagination .page-numbers.dots {
	background: none;
	border-color: transparent;
}

/* ══════════════════════════════════════════════════════════════════════════
 * COMMENTS
 * ══════════════════════════════════════════════════════════════════════════ */
.oga-comments {
	max-width: 760px;
	margin: 40px auto 0;
	padding-top: 24px;
	border-top: 1px solid var(--line1);
}

.oga-comment-list {
	list-style: none;
	margin-top: 16px;
}
.oga-comment-list ol.children {
	list-style: none;
	margin-left: 20px;
	padding-left: 14px;
	border-left: 1px solid var(--line1);
}
.oga-comment-list li.comment,
.oga-comment-list li.pingback {
	padding: 14px 0;
	border-bottom: 1px solid var(--line1);
}
.oga-comment-list li:last-child { border-bottom: 0; }

.oga-comment-list .comment-body { position: relative; }
.oga-comment-list .comment-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-bottom: 8px;
}
.oga-comment-list .comment-author {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	font-weight: 600;
	color: var(--fg0);
}
.oga-comment-list .comment-author img {
	border-radius: 50%;
	border: 1px solid var(--line2);
}
.oga-comment-list .comment-author .says { display: none; }
.oga-comment-list .comment-metadata {
	font-family: var(--mono);
	font-size: 9px;
	color: var(--fg3);
}
.oga-comment-list .comment-metadata a { color: var(--fg3); text-decoration: none; }
.oga-comment-list .comment-metadata a:hover { color: var(--gold); }

.oga-comment-list .comment-content {
	font-size: 13px;
	line-height: 1.7;
	color: var(--fg1);
}
.oga-comment-list .comment-content > * + * { margin-top: .8em; }
.oga-comment-list .comment-content a { color: var(--gold); }

.oga-comment-list .reply {
	margin-top: 8px;
}
.oga-comment-list .comment-reply-link {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 100px;
	font-family: var(--mono);
	font-size: 9px;
	letter-spacing: .06em;
	text-transform: uppercase;
	text-decoration: none;
	background: var(--bg3);
	border: 1px solid var(--line1);
	color: var(--fg2);
	transition: all .15s ease;
}
.oga-comment-list .comment-reply-link:hover {
	color: var(--gold);
	border-color: var(--gold-dim);
	background: var(--gold-dim);
}

.oga-comment-list .comment-awaiting-moderation {
	display: block;
	margin-top: 6px;
	font-family: var(--mono);
	font-size: 10px;
	color: var(--g7);
}

.oga-comments-closed {
	margin-top: 16px;
	padding: 10px 14px;
	border-radius: var(--r8);
	background: var(--bg2);
	border: 1px solid var(--line1);
	font-size: 12px;
	color: var(--fg2);
}

/* ── Comment form ─────────────────────────────────────────────────────── */
.oga-comment-respond {
	margin-top: 28px;
	padding-top: 22px;
	border-top: 1px solid var(--line1);
}
.oga-comment-reply-title { margin-bottom: 6px; }
.oga-comment-reply-title small { margin-left: 8px; font-size: 10px; }
.oga-comment-reply-title small a { color: var(--g6); text-decoration: none; }

.oga-comment-notes,
.oga-comment-form .comment-notes {
	font-family: var(--mono);
	font-size: 10px;
	color: var(--fg3);
	margin-bottom: 14px;
}

.oga-comment-form p { margin-bottom: 14px; }

.oga-comment-form label {
	display: block;
	margin-bottom: 5px;
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--fg2);
}

.oga-comment-form input[type="text"],
.oga-comment-form input[type="email"],
.oga-comment-form input[type="url"],
.oga-comment-form textarea {
	width: 100%;
	padding: 10px 12px;
	border-radius: var(--r8);
	background: var(--bg2);
	border: 1px solid var(--line2);
	color: var(--fg0);
	font-family: var(--sans);
	font-size: 14px;
	line-height: 1.6;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.oga-comment-form textarea { resize: vertical; min-height: 110px; }
.oga-comment-form input:focus,
.oga-comment-form textarea:focus {
	outline: none;
	border-color: var(--gold);
	box-shadow: 0 0 0 3px var(--gold-dim);
}

.oga-comment-form .comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: 8px;
}
.oga-comment-form .comment-form-cookies-consent label {
	margin: 0;
	text-transform: none;
	letter-spacing: 0;
	font-family: var(--sans);
	font-size: 12px;
	color: var(--fg2);
}
.oga-comment-form input[type="checkbox"] {
	width: auto;
	margin-top: 2px;
	accent-color: var(--gold);
}

.oga-comment-submit,
.oga-comment-form input[type="submit"] {
	display: inline-flex;
	align-items: center;
	padding: 10px 22px;
	border: 0;
	border-radius: var(--r8);
	background: var(--gold);
	color: #fff;
	font-family: var(--sans);
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: background .15s ease;
}
.oga-comment-submit:hover,
.oga-comment-form input[type="submit"]:hover { background: var(--gold-hover); }

/* ══════════════════════════════════════════════════════════════════════════
 * WOOCOMMERCE WRAPPER
 * ══════════════════════════════════════════════════════════════════════════ */
.oga-wc-header {
	padding-bottom: 12px;
	margin-bottom: 16px;
	border-bottom: 1px solid var(--line1);
}
.oga-wc-wrap--checkout .oga-prompt,
.oga-wc-wrap--account .oga-prompt { color: var(--g4); }

/* ══════════════════════════════════════════════════════════════════════════
 * ADJACENT LINK CLASSES (applied by ogace-compat.php filters)
 * ══════════════════════════════════════════════════════════════════════════ */
.oga-adjacent-link { text-decoration: none; color: var(--fg1); }
.oga-adjacent-link:hover { color: var(--gold); }

/* ══════════════════════════════════════════════════════════════════════════
 * REDUCED MOTION
 * ══════════════════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
	.oga-related-card,
	.oga-article-list-thumb img,
	.oga-post-nav a,
	.oga-404-btn,
	.oga-searchform-row,
	.oga-comment-reply-link {
		transition: none;
	}
	.oga-related-card:hover { transform: none; }
	.oga-article--list:hover .oga-article-list-thumb img { transform: none; }
}