/*
Theme Name:   Elkan 5e Child
Theme URI:    https://www.elkan5e.com
Description:  Child theme for the Elkan 5e rules site.
Author:       Ethan Leider
Template:     twentytwentyfive
Version:      0.2.2
Text Domain:  elkan5e-child
*/


/* ==========================================================
   Tokens
   ========================================================== */

:root {
	/* Heavy rule under table headers / above total rows. */
	--elkan-rule: var(--wp--preset--color--rule, currentColor);
	/* Hairline used for every other cell border. */
	--elkan-rule-faint: color-mix(
		in srgb,
		var(--wp--preset--color--contrast) 12%,
		transparent
	);
	--elkan-focus: var(--wp--preset--color--accent, currentColor);
}


/* ==========================================================
   Rules Reference Typography
   ========================================================== */

.entry-content > p > em:only-child {
	display: block;
	font-size: 1.0625rem;
	line-height: 1.55;
	color: color-mix(
		in srgb,
		var(--wp--preset--color--contrast) 75%,
		transparent
	);
}

.entry-content p:empty {
	display: none;
}

/* Level-marker dividers (the red line next to each "Nth Level" badge)
   use core's Separator block with "is-style-wide". Core defaults that to
   a 1px border-bottom; the original Wix page used ~3px. Thickened here so
   every level divider matches regardless of which page was last edited. */
.wp-block-separator.is-style-wide {
	border-bottom-width: 3px;
}

/* Level-marker rows (badge + divider, side by side in a Columns block).
   Core's "are-vertically-aligned-center" / "is-vertically-aligned-center"
   classes are on the markup, but this theme's cascade leaves align-items
   at its stretch-ish default. Re-declaring the same selectors later in
   the stylesheet wins on source order without touching the block markup. */
.wp-block-columns.are-vertically-aligned-center {
	align-items: center;
}

.wp-block-column.is-vertically-aligned-center {
	align-self: center;
}


/* ==========================================================
   Tables

   Plain <table>, core's .wp-block-table table, and the generated
   table.elkan-stats share one set of rules. Differences between them
   are layered on afterwards.
   ========================================================== */

table,
.wp-block-table table,
table.elkan-stats {
	width: 100%;
	margin: 1.5rem 0;
	border-collapse: collapse;
	font-size: 0.9375rem;
}

.wp-block-table table {
	margin: 0;
}

table th,
.wp-block-table table th,
table.elkan-stats th {
	padding: 0.5rem 0.75rem;
	text-align: center;
	font-weight: 700;
	font-family: var(--wp--preset--font-family--display, inherit);
	white-space: normal;
	border-bottom: 2px solid var(--elkan-rule);
}

table td,
.wp-block-table table td,
table.elkan-stats td {
	padding: 0.45rem 0.75rem;
	text-align: center;
	vertical-align: middle;
	border-bottom: 1px solid var(--elkan-rule-faint);
}

/* Core block tables get a full grid rather than horizontal rules only. */
.wp-block-table table td {
	border: 1px solid var(--elkan-rule-faint);
}

/* Header row: same light grid as the body, white background, and a heavy
   Elkan-red underline. Core's block-library prints "th { border: 1px solid }"
   and "thead { border-bottom: 3px solid }" in currentColor, which is what
   made the header look like a black box; both are overridden here. */
.wp-block-table table th,
table th {
	background: #fff;
	border: 1px solid var(--elkan-rule-faint);
	border-bottom: 3px solid var(--elkan-rule);
}

.wp-block-table thead,
table thead {
	border-bottom: 3px solid var(--elkan-rule);
}

/* Header-less tables: treat the first body row as the header. */
table:not(:has(thead)) tbody tr:first-child td,
table.elkan-stats:not(:has(thead)) tbody tr:first-child td {
	font-weight: 700;
	background: #fff;
	border-bottom: 3px solid var(--elkan-rule);
}

.wp-block-table table:not(:has(thead)) tbody tr:first-child td {
	font-weight: 700;
	background: #fff;
	border-bottom: 3px solid var(--elkan-rule);
}

/* Zebra striping. */
table tbody tr:nth-child(odd),
.wp-block-table table tbody tr:nth-child(odd),
table.elkan-stats tbody tr:nth-child(odd) {
	background: #f5f5f5;
}

table tbody tr:nth-child(even),
.wp-block-table table tbody tr:nth-child(even),
table.elkan-stats tbody tr:nth-child(even) {
	background: #fff;
}

/* Numeric columns: centered, with tabular figures so digits line up. */
table td.num,
table th.num,
.wp-block-table table td.num,
.wp-block-table table th.num,
table.elkan-stats .num {
	text-align: center;
	font-variant-numeric: tabular-nums;
}

/* Core's ".wp-block-table .has-fixed-layout th { word-break: break-word }"
   has two-class specificity and would otherwise force mid-word breaks in
   headers; matched here at the same specificity to keep breaks at spaces. */
.wp-block-table .has-fixed-layout th {
	word-break: normal;
}

@media (max-width: 680px) {
	.wp-block-table.elkan-stats {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.wp-block-table.elkan-stats table {
		min-width: 640px;
	}
}


/* ==========================================================
   Elkan Stat Tables
   ========================================================== */

.elkan-table-wrap {
	margin: 1.5rem 0;
}

.elkan-table-wrap .elkan-table-title {
	font-weight: 700 !important;
	margin: 0.75rem 0 0.25rem;
}

.elkan-table-wrap .elkan-magic-table {
	margin-top: 1rem;
}

.elkan-table-wrap strong {
	font-weight: 700;
}

.elkan-variant-toggles {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.25rem;
	align-items: center;
	margin: 0.25rem 0 0.5rem;
	font-size: 0.9rem;
}

.elkan-variant-toggles .evt-label {
	font-weight: 700;
}

.elkan-variant-toggles button {
	cursor: pointer;
	border: 1px solid rgba(0, 0, 0, 0.3);
	background: #f4f4f4;
	border-radius: 999px;
	padding: 0.15rem 0.7rem;
	margin-left: 0.35rem;
	font: inherit;
	line-height: 1.4;
}

.elkan-variant-toggles button[aria-pressed="true"] {
	background: #4682b4;
	color: #fff;
	border-color: #4682b4;
}

tr.elkan-variant-hidden {
	display: none;
}

/* Sortable headers. */
table.elkan-stats.is-sortable th {
	cursor: pointer;
	user-select: none;
}

table.elkan-stats.is-sortable th:hover {
	text-decoration: underline;
}

table.elkan-stats.is-sortable th::after {
	content: "";
	display: inline-block;
	width: 0.7em;
	opacity: 0.45;
}

table.elkan-stats.is-sortable th[aria-sort="ascending"]::after {
	content: " \25B2";
	opacity: 1;
}

table.elkan-stats.is-sortable th[aria-sort="descending"]::after {
	content: " \25BC";
	opacity: 1;
}

table.elkan-stats th:focus-visible {
	outline: 2px solid var(--elkan-focus);
	outline-offset: -2px;
}


/* ==========================================================
   Anchors
   ========================================================== */

:target {
	scroll-margin-top: 5rem;
}

html {
	scroll-behavior: smooth;
}

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


/* ==========================================================
   Disclosure Blocks
   ========================================================== */

.wp-block-details {
	border-block: 1px solid color-mix(
		in srgb,
		var(--wp--preset--color--contrast) 15%,
		transparent
	);
	padding: 0.5rem 0;
	margin: 1.25rem 0;
}

.wp-block-details summary {
	cursor: pointer;
	font-family: var(--wp--preset--font-family--display, inherit);
	font-weight: 600;
	padding: 0.35rem 0;
}

.wp-block-details summary:focus-visible {
	outline: 2px solid var(--elkan-focus);
	outline-offset: 2px;
}

.wp-block-details[open] summary {
	margin-bottom: 0.5rem;
}


/* ==========================================================
   Buttons
   ========================================================== */

.wp-block-button__link.has-contrast-color.has-link-color {
	color: var(--wp--preset--color--contrast) !important;
	font-weight: 700;
}

.elkan-discord-button .wp-block-button__link,
footer .wp-block-button__link {
	padding: 8px 22px !important;
	font-size: 0.9375rem;
}


/* ==========================================================
   Lists
   ========================================================== */

.wp-block-list li {
	margin-top: 0.2em;
}

.wp-block-list li:first-child {
	margin-top: 0;
}

.wp-block-list li li {
	margin-top: 0.1em;
}


/* ==========================================================
   Classes list (archive-style card grid)
   ========================================================== */

.elkan-class-card {
	border: 1px solid var(--wp--preset--color--card-border);
	border-radius: 12px;
	padding: 1.75rem 1.5rem;
	text-align: center;
	height: 100%;
}

.elkan-class-card .wp-block-post-featured-image {
	margin: 0 auto 1rem;
}

.elkan-class-card .wp-block-post-featured-image img {
	object-fit: cover;
}

.elkan-class-card .wp-block-post-title {
	margin-bottom: 0.5rem;
}

.elkan-class-card .wp-block-post-title a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.elkan-class-card .wp-block-post-excerpt {
	font-style: italic;
}

.elkan-class-card .wp-block-post-excerpt p {
	margin: 0;
}

.elkan-class-card .wp-block-read-more {
	display: inline-block;
	margin-top: 1.1rem;
	padding: 0.5rem 1.4rem;
	background: var(--wp--preset--color--accent);
	color: #fff !important;
	border-radius: 999px;
	font-weight: 600;
	text-decoration: none !important;
}

.elkan-class-card .wp-block-read-more:hover {
	opacity: 0.85;
}


/* ==========================================================
   Ancestry / stat cards — .elkan-card-content

   The card body is a stack of one-line paragraphs ("Type:", "Size:",
   "Senses:" ...). Core's flow layout puts a full --wp--style--block-gap
   (a whole paragraph's worth of air) between every one, which reads as
   huge whitespace. Core prints that gap rule inside :where(), so it has
   zero specificity and this single-class rule overrides it. */
.elkan-card-content > * + * {
	margin-block-start: 0.35rem;
}

/* A little more breathing room after the intro paragraph and before the
   trailing italic flavour text, which are full paragraphs, not stat lines. */
.elkan-card-content > p:first-child {
	margin-bottom: 0.85rem;
}

.elkan-card-content > p:last-child {
	margin-top: 0.85rem;
}

/* ==========================================================
   Spells archive page — "View full spell page" links

   Scoped to the Spells archive page (body.page-id-9446) so it only
   affects the spell-card links on that page, not spell links used
   elsewhere on the site (class pages, spell lists, etc). Gives the
   card's own link a distinct blue so it reads clearly as a link
   against the card's other text. */
body.page-id-9446 .elkan-spell-card-link a {
	color: #1a5fb4;
}

body.page-id-9446 .elkan-spell-card-link a:visited {
	color: #1a5fb4;
}

body.page-id-9446 .elkan-spell-card-link a:hover,
body.page-id-9446 .elkan-spell-card-link a:focus {
	color: #0d3d7a;
}

/* ==========================================================
   Wild Magic page — surge tables (Roll / Effect / Roll / Effect)

   Scoped to the Wild Magic page (body.page-id-5014) so it doesn't
   affect other fixed-layout tables elsewhere on the site. Makes the
   two "Roll" columns narrow and the two "Effect" columns wide, which
   also makes the tables read denser overall since each row wraps to
   fewer lines. */
body.page-id-5014 table.has-fixed-layout th:nth-child(1),
body.page-id-5014 table.has-fixed-layout td:nth-child(1),
body.page-id-5014 table.has-fixed-layout th:nth-child(3),
body.page-id-5014 table.has-fixed-layout td:nth-child(3) {
	width: 8%;
}

body.page-id-5014 table.has-fixed-layout th:nth-child(2),
body.page-id-5014 table.has-fixed-layout td:nth-child(2),
body.page-id-5014 table.has-fixed-layout th:nth-child(4),
body.page-id-5014 table.has-fixed-layout td:nth-child(4) {
	width: 42%;
}


/* ==========================================================
   List-page cards (Feats, Invocations, Monsters)
   Moved from Additional CSS on 2026-10-21.
   ========================================================== */

/* Elkan list pages: give Feats, Invocations and Monsters the same card shell as Spells and Items */
li.elkan-filter-card.elkan-spell-card-row,
li.elkan-filter-card.elkan-spell-card-row:last-child {
	border: 1px solid var(--wp--preset--color--contrast-2, #ddd);
	border-radius: 6px;
	padding: calc(0.75rem + 0.5rem + 0.65rem) 1rem calc(0.75rem + 0.5rem + 0.65rem) calc(1rem + 3px + 0.75rem + 1rem);
	background-image: linear-gradient(var(--wp--preset--color--accent, #8B1A1A), var(--wp--preset--color--accent, #8B1A1A));
	background-repeat: no-repeat;
	background-position: 1rem 0.75rem;
	background-size: 3px calc(100% - 1.5rem);
}
li.elkan-filter-card.elkan-spell-card-row > .wp-block-post-title.elkan-spell-card-name { margin: 0; }
li.elkan-filter-card.elkan-spell-card-row > .wp-block-post-title.elkan-spell-card-name a { color: inherit; text-decoration: none; }
li.elkan-filter-card.elkan-spell-card-row > .wp-block-post-title.elkan-spell-card-name a:hover { text-decoration: underline; }
li.elkan-filter-card.elkan-spell-card-row > .elkan-card-content { margin-top: 0.5rem; }
li.elkan-filter-card.elkan-spell-card-row > .elkan-card-content > :first-child { margin-top: 0; }
li.elkan-filter-card.elkan-spell-card-row > .elkan-card-content > :last-child { margin-bottom: 0; }
/* Monsters: name and Type/Level on one line, like the Spells and Items summary */
li.elkan-filter-card.elkan-spell-card-row:has(> .elkan-monster-meta-row) {
	display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.25rem 0.9rem;
}
li.elkan-filter-card.elkan-spell-card-row > .elkan-monster-meta-row,
li.elkan-filter-card.elkan-spell-card-row > .elkan-monster-meta-row * {
	font-family: var(--wp--preset--font-family--display, inherit);
	font-size: 13px !important; font-weight: 600; margin: 0;
}
li.elkan-filter-card.elkan-spell-card-row > .elkan-monster-meta-row { gap: 0.35rem 0.9rem; }
li.elkan-filter-card.elkan-spell-card-row > .wp-block-post-excerpt,
li.elkan-filter-card.elkan-spell-card-row > .wp-block-read-more { flex-basis: 100%; margin: 0; }
li.elkan-filter-card.elkan-spell-card-row > .wp-block-post-excerpt { margin-top: 0.4rem; }
li.elkan-filter-card.elkan-spell-card-row > .wp-block-post-excerpt p { margin: 0; }
li.elkan-filter-card.elkan-spell-card-row > .wp-block-read-more { font-size: 0.875rem; margin-top: 0.35rem; }
/* row-gap-fix: same spacing between cards as Spells and Items */
.wp-block-post-template:has(> li.elkan-filter-card.elkan-spell-card-row) { gap: 0.6rem; }
.wp-block-post-template > li.elkan-filter-card.elkan-spell-card-row { margin-block: 0; }