/*
Theme Name: Directo
Theme URI: https://jorgesv.com
Author: Jorge Sánchez Vega
Author URI: https://jorgesv.com
Description: A minimal, content-first WordPress block theme for personal blogs, built for clarity, speed, and distraction-free publishing.
Requires at least: 6.7
Tested up to: 7.1
Requires PHP: 7.4
Version: 1.1.2
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: directo
Tags: blog, one-column, block-patterns, block-styles, custom-colors, custom-logo, editor-style, featured-images, full-site-editing, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks
*/

:root {
	color-scheme: light;
	--directo-canvas: #ffffff;
	--directo-surface: #ffffff;
	--directo-ink: #1b1e1c;
	--directo-muted: #68706b;
	--directo-line: #d9ddd8;
	--directo-accent: #027fff;
	--directo-accent-contrast: #ffffff;
}

html[data-theme="dark"] {
	color-scheme: dark;
	--directo-canvas: #15171a;
	--directo-surface: #1d2024;
	--directo-ink: #e6e9ec;
	--directo-muted: #98a2a9;
	--directo-line: #343a40;
	--directo-accent: #027fff;
	--directo-accent-contrast: #101417;
}

@media (prefers-color-scheme: dark) {
	html:not([data-theme="light"]) {
		color-scheme: dark;
		--directo-canvas: #15171a;
		--directo-surface: #1d2024;
		--directo-ink: #e6e9ec;
		--directo-muted: #98a2a9;
		--directo-line: #343a40;
		--directo-accent: #027fff;
		--directo-accent-contrast: #101417;
	}
}

html {
	scroll-behavior: smooth;
}

body {
	background: var(--directo-canvas);
	color: var(--directo-ink);
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}

a {
	color: var(--directo-accent);
	text-decoration-thickness: 0.08em;
	text-underline-offset: 0.18em;
}

a:hover {
	text-decoration-thickness: 0.14em;
}

:where(a, button, input, textarea, select):focus-visible {
	outline: 3px solid var(--directo-accent);
	outline-offset: 3px;
}

::selection {
	background: var(--directo-accent);
	color: var(--directo-accent-contrast);
}

.directo-shell {
	min-height: 100vh;
}

.directo-header {
	border-bottom: 1px solid var(--directo-line);
}

.directo-header__inner,
.directo-footer__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

.directo-header .wp-block-site-title {
	white-space: nowrap;
}

.directo-header .wp-block-navigation {
	flex: 1;
	justify-content: flex-end;
}

.directo-header-search {
	flex: 0 1 14rem;
	width: 14rem;
	margin: 0;
}

.directo-header-search .wp-block-search__inside-wrapper {
	min-height: 2.75rem;
	padding: 0.2rem 0.25rem 0.2rem 0.85rem;
	border: 1px solid var(--directo-line);
	border-radius: 999px;
	background: var(--directo-surface);
	transition: border-color 160ms ease, box-shadow 160ms ease;
}

.directo-header-search .wp-block-search__inside-wrapper:focus-within {
	border-color: var(--directo-accent);
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--directo-accent) 18%, transparent);
}

.directo-header-search .wp-block-search__input {
	min-width: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	font: inherit;
	font-size: var(--wp--preset--font-size--small);
	outline: 0;
}

.directo-header-search .wp-block-search__input::placeholder {
	color: var(--directo-muted);
	opacity: 1;
}

.directo-header-search .wp-block-search__button {
	display: inline-grid;
	place-items: center;
	width: 2.25rem;
	height: 2.25rem;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: var(--directo-accent);
	cursor: pointer;
}

.directo-header-search .wp-block-search__button:hover {
	background: var(--directo-canvas);
}

.directo-header-search .wp-block-search__button svg {
	width: 1.2rem;
	height: 1.2rem;
}

.directo-theme-toggle {
	display: inline-grid;
	place-items: center;
	min-width: 2.75rem;
	min-height: 2.75rem;
	padding: 0;
	border: 1px solid var(--directo-line);
	border-radius: 999px;
	background: transparent;
	color: var(--directo-ink);
	cursor: pointer;
	font: inherit;
}

.directo-theme-toggle:hover {
	background: var(--directo-surface);
}

.directo-theme-toggle__dark,
html[data-theme="dark"] .directo-theme-toggle__light {
	display: none;
}

html[data-theme="dark"] .directo-theme-toggle__dark {
	display: inline;
}

@media (prefers-color-scheme: dark) {
	html:not([data-theme="light"]) .directo-theme-toggle__light {
		display: none;
	}

	html:not([data-theme="light"]) .directo-theme-toggle__dark {
		display: inline;
	}
}

.directo-intro {
	border-bottom: 1px solid var(--directo-line);
}

.directo-kicker,
.directo-post-meta,
.directo-footer,
.directo-query-meta {
	color: var(--directo-muted);
}

.directo-post-list {
	list-style: none;
	padding: 0;
}

.directo-post-list > li {
	border-top: 1px solid var(--directo-line);
	margin-block-start: 0;
	padding-block: 1rem;
}

.directo-post-list > li:last-child {
	border-bottom: 1px solid var(--directo-line);
}

.directo-post-row {
	display: grid;
	grid-template-columns: minmax(6rem, 0.23fr) minmax(0, 1fr);
	gap: 1rem;
	align-items: baseline;
}

.directo-post-row .wp-block-post-title {
	margin: 0;
}

.directo-post-row .wp-block-post-date {
	color: var(--directo-muted);
	font-variant-numeric: tabular-nums;
}

.directo-sticky {
	padding: clamp(1.25rem, 3vw, 2rem);
	border: 1px solid var(--directo-line);
	border-radius: 0.75rem;
	background: var(--directo-surface);
}

.directo-sticky .directo-post-list > li:first-child {
	border-top: 0;
}

.directo-entry-header {
	border-bottom: 1px solid var(--directo-line);
}

.directo-entry-content > :where(p, ul, ol, blockquote) {
	margin-block: 1.2em;
}

.directo-entry-content :where(h2, h3, h4) {
	scroll-margin-top: 2rem;
	margin-top: 1.7em;
}

.directo-entry-content blockquote {
	border-inline-start: 3px solid var(--directo-accent);
	padding-inline-start: 1.25rem;
	color: var(--directo-muted);
}

.directo-entry-content :where(pre, code) {
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}

.directo-entry-content pre {
	overflow-x: auto;
	padding: 1.25rem;
	border: 1px solid var(--directo-line);
	border-radius: 0.5rem;
	background: var(--directo-surface);
}

.directo-entry-content img {
	border-radius: 0.35rem;
}

.directo-entry-footer,
.directo-post-navigation,
.directo-comments {
	border-top: 1px solid var(--directo-line);
}

.directo-rss-card {
	border: 1px solid var(--directo-line);
	border-radius: 0.75rem;
	background: var(--directo-surface);
}

.wp-block-search__input,
:where(input, textarea, select) {
	border: 1px solid var(--directo-line);
	border-radius: 0.4rem;
	background: var(--directo-surface);
	color: var(--directo-ink);
}

.wp-block-search__button,
.wp-block-button__link {
	border: 1px solid var(--directo-accent);
	background: var(--directo-accent);
	color: var(--directo-accent-contrast);
}

.wp-block-query-pagination {
	gap: 1rem;
}

.directo-footer {
	border-top: 1px solid var(--directo-line);
}

@media (max-width: 600px) {
	.directo-header__inner {
		align-items: center;
		flex-wrap: wrap;
	}

	.directo-header .wp-block-navigation {
		order: 3;
		flex-basis: 100%;
		justify-content: flex-start;
	}

	.directo-header .wp-block-navigation__container {
		row-gap: 0.35rem;
	}

	.directo-header-search {
		order: 4;
		flex-basis: 100%;
		width: 100%;
	}

	.directo-post-row {
		grid-template-columns: 1fr;
		gap: 0.25rem;
	}

	.directo-footer__inner {
		align-items: flex-start;
		flex-direction: column;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}
