/*
 * TeamHouse Campus — estilos del sitio.
 * Comparte los tokens del plugin; si el plugin no está activo, define los suyos.
 */

:root {
	--th-accent: #ff5a1f;
	--thc-bg: #ffffff;
	--thc-surface: #ffffff;
	--thc-ink: #16181d;
	--thc-ink-2: #5b6070;
	--thc-ink-3: #8a8f9e;
	--thc-line: #e7e8ec;
	--thc-radius: 14px;
	--thc-font: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-th-theme="light"]) {
		--thc-bg: #0e0f13;
		--thc-surface: #15171d;
		--thc-ink: #f2f3f5;
		--thc-ink-2: #a9aebd;
		--thc-ink-3: #767c8c;
		--thc-line: #242833;
	}
}

body {
	margin: 0;
	background: var(--thc-bg);
	color: var(--thc-ink);
	font-family: var(--thc-font);
	font-size: 16px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

body.th-campus { font-size: 15px; }

/*
 * El color de enlace va acotado a lo que dibuja el tema. Si lo ponemos suelto
 * sobre "a", le pisamos los colores a cualquier página hecha con un maquetador.
 */
.thc-header a,
.thc-footer a,
.thc-prose a,
.thc-entry__meta a,
.thc-card a,
.thc-comments a { color: var(--th-accent); }

img { max-width: 100%; height: auto; }

/* Con maquetador el contenido manda: ni caja ni tipografía impuesta. */
.thc-entry--ancho { max-width: none; margin: 0; padding: 0; }

.thc-skip {
	position: absolute;
	left: -9999px;
	top: 0;
	padding: 10px 14px;
	background: var(--thc-surface);
	border: 1px solid var(--thc-line);
	z-index: 100;
}

.thc-skip:focus { left: 8px; top: 8px; }

.thc-shell { max-width: 1160px; margin: 0 auto; padding: 0 24px; }
.thc-shell--narrow { max-width: 760px; }

.thc-header { border-bottom: 1px solid var(--thc-line); }
.thc-header .thc-shell { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-top: 16px; padding-bottom: 16px; }
.thc-brand__text { font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--thc-ink); text-decoration: none; font-size: 15px; }
.thc-brand img { max-height: 46px; width: auto; }

.thc-menu { display: flex; flex-wrap: wrap; gap: 18px; list-style: none; margin: 0; padding: 0; }
.thc-menu a { color: var(--thc-ink-2); text-decoration: none; font-size: 14px; }
.thc-menu a:hover { color: var(--thc-ink); }
.thc-menu .current-menu-item > a { color: var(--thc-ink); font-weight: 600; }

.thc-main { padding: 34px 0 60px; }
body.thc-full .thc-main { padding: 0; }
body.thc-full .thc-header,
body.thc-full .thc-footer { display: none; }

.thc-title { font-size: 32px; font-weight: 700; letter-spacing: -.02em; line-height: 1.15; margin: 0 0 12px; }
.thc-entry__meta { font-size: 13.5px; color: var(--thc-ink-3); margin: 0 0 18px; }
.thc-entry__cover { margin: 0 0 24px; border-radius: var(--thc-radius); overflow: hidden; border: 1px solid var(--thc-line); }

.thc-prose { font-size: 16.5px; line-height: 1.72; color: var(--thc-ink-2); }
.thc-prose > * + * { margin-top: 1em; }
.thc-prose h2, .thc-prose h3, .thc-prose h4 { color: var(--thc-ink); line-height: 1.25; margin-top: 1.7em; }
.thc-prose h2 { font-size: 24px; }
.thc-prose h3 { font-size: 20px; }
.thc-prose strong { color: var(--thc-ink); }
.thc-prose blockquote { margin: 1.4em 0; padding-left: 16px; border-left: 2px solid var(--th-accent); font-style: italic; }
.thc-prose code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .92em; border: 1px solid var(--thc-line); border-radius: 5px; padding: 1px 5px; }
.thc-prose pre { border: 1px solid var(--thc-line); border-radius: 10px; padding: 16px; overflow-x: auto; }
.thc-prose img { border-radius: 10px; }
.thc-prose .alignwide { max-width: min(1100px, 92vw); margin-left: 50%; transform: translateX(-50%); }

.thc-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 22px; margin-top: 26px; }
.thc-card { border: 1px solid var(--thc-line); border-radius: var(--thc-radius); overflow: hidden; background: var(--thc-surface); }
.thc-card__cover { display: block; aspect-ratio: 16 / 9; overflow: hidden; }
.thc-card__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.thc-card__body { padding: 18px; }
.thc-card__title { font-size: 19px; line-height: 1.3; margin: 0 0 6px; }
.thc-card__title a { color: var(--thc-ink); text-decoration: none; }
.thc-card__title a:hover { color: var(--th-accent); }
.thc-card__excerpt { font-size: 14.5px; color: var(--thc-ink-2); margin: 0; }

.thc-search { display: flex; gap: 8px; margin-top: 20px; }
.thc-search input {
	flex: 1 1 auto;
	padding: 11px 13px;
	border: 1px solid var(--thc-line);
	border-radius: 10px;
	background: var(--thc-surface);
	color: var(--thc-ink);
	font: inherit;
	font-size: 15px;
}

.thc-404 { text-align: center; padding: 40px 24px 60px; }
.thc-404__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 22px 0; }

.thc-comments { margin-top: 44px; padding-top: 26px; border-top: 1px solid var(--thc-line); }
.thc-comments__title { font-size: 18px; margin: 0 0 18px; }
.thc-comments__list { list-style: none; margin: 0 0 26px; padding: 0; display: flex; flex-direction: column; gap: 18px; }
.thc-comments__list .children { list-style: none; padding-left: 22px; margin-top: 14px; }
.thc-comments textarea,
.thc-comments input[type="text"],
.thc-comments input[type="email"],
.thc-comments input[type="url"] {
	width: 100%;
	padding: 11px 13px;
	border: 1px solid var(--thc-line);
	border-radius: 10px;
	background: var(--thc-surface);
	color: var(--thc-ink);
	font: inherit;
}

.thc-footer { border-top: 1px solid var(--thc-line); padding: 26px 0; margin-top: 40px; }
.thc-footer__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; }
.thc-footer__copy { font-size: 13.5px; color: var(--thc-ink-3); margin: 0; }
.thc-footer__widgets { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 24px; margin-bottom: 22px; }
.thc-widget__title { font-size: 14px; margin: 0 0 8px; }

/* Botones compartidos con el campus, por si el plugin no está activo. */
.th-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 10px 16px;
	border: 1px solid transparent;
	border-radius: 10px;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
}

.th-btn--accent { background: var(--th-accent); color: #fff; }
.th-btn--ghost { border-color: var(--thc-line); color: var(--thc-ink); background: var(--thc-surface); }

/* WooCommerce: lo mínimo para que se vea prolijo sin pisar sus estilos. */
.thc-shop .thc-main { padding-top: 26px; }
.woocommerce-message, .woocommerce-info, .woocommerce-error {
	border-left: 3px solid var(--th-accent);
	background: var(--thc-surface);
	border-radius: 10px;
	padding: 12px 14px;
	list-style: none;
}

@media (max-width: 782px) {
	.thc-shell { padding: 0 16px; }
	.thc-title { font-size: 26px; }
	.thc-header .thc-shell { flex-wrap: wrap; gap: 10px; }
}

@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; animation: none !important; }
}