/*
 * Temaets stilark: bare det theme.json ikke kan uttrykke (oppsett, fokus og
 * overflyt).
 * Farger, skrift og avstander kommer fra preset-variablene i theme.json.
 */

/*
 * Sidelengs overflyt klippes på sidenivå med clip, ikke hidden: hidden
 * ødelegger sticky (hoppemenyen på mobil). wp-standards, «Vannrett overflow».
 */
.wp-site-blocks {
	overflow-x: clip;
}

:where(a, button, input, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--wp--preset--color--skog);
	outline-offset: 2px;
}

/* Header */
.reglene-topp {
	background: var(--wp--preset--color--flate);
	border-bottom: 1px solid var(--wp--preset--color--linje);
}

.reglene-topp__indre,
.reglene-bunn__indre {
	box-sizing: border-box;
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
	padding-inline: var(--wp--style--root--padding-left);
}

.reglene-topp__indre {
	gap: var(--wp--preset--spacing--30) var(--wp--preset--spacing--60);
	min-height: 72px;
	padding-block: var(--wp--preset--spacing--30);
}

.reglene-topp__hoyre {
	flex: 1 1 auto;
	gap: var(--wp--preset--spacing--30) var(--wp--preset--spacing--50);
}

/* Logoen: to kort i palettens farger foran nettstedsnavnet. Pynt, ikke
   innhold. */
.reglene-logo a {
	display: inline-flex;
	gap: 10px;
	align-items: center;
	min-height: 44px;
}

.reglene-logo a::before {
	content: "";
	flex: none;
	width: 34px;
	height: 34px;
	background: url(../img/logo.svg) center / contain no-repeat;
}

.reglene-hovedmeny {
	flex: 1 1 auto;
	gap: 4px var(--wp--preset--spacing--50);
}

.reglene-hovedmeny .wp-block-navigation-item__content {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	color: var(--wp--preset--color--blekk);
	text-decoration: none;
}

.reglene-hovedmeny .wp-block-navigation-item__content:hover {
	text-decoration: underline;
}

/* Meny-knappene får fast størrelse før skriptet lastes, så de ikke flytter seg
   (CLS, 2.4). */
.reglene-hovedmeny .wp-block-navigation__responsive-container-open,
.reglene-toppsok .wp-block-search__button {
	box-sizing: border-box;
	min-width: 44px;
	min-height: 44px;
}

.reglene-toppsok .wp-block-search__button {
	color: var(--wp--preset--color--blekk);
	background: var(--wp--preset--color--flate);
	border: 1px solid var(--wp--preset--color--linje);
	border-radius: var(--wp--custom--radius--pille);
}

/* Footer */
.reglene-bunn {
	color: var(--wp--preset--color--bunntekst);
	background: var(--wp--preset--color--blekk);
}

.reglene-bunn__indre {
	gap: var(--wp--preset--spacing--50) var(--wp--preset--spacing--80);
	padding-block: var(--wp--preset--spacing--70);
}

.reglene-bunn .reglene-logo a,
.reglene-bunn a {
	color: var(--wp--preset--color--flate);
}

.reglene-bunn__tekst {
	max-width: 420px;
	margin: 0;
	font-size: var(--wp--preset--font-size--liten);
}

.reglene-bunnmeny .wp-block-navigation-item__content {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	text-decoration: underline;
}

/* Vanlige sider og arkiver */
.reglene-side {
	padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--90);
}

/* Spillsiden: hovedkolonne og sidekolonne på bred skjerm, én kolonne ellers. */
.reglene-spillside {
	box-sizing: border-box;
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--80);
	align-items: flex-start;
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
	padding: var(--wp--preset--spacing--60) var(--wp--style--root--padding-left) var(--wp--preset--spacing--90);
}

.reglene-spillside__hoved {
	display: flex;
	flex: 999 1 640px;
	flex-direction: column;
	gap: var(--wp--preset--spacing--70);
	min-width: 0;
}

.reglene-spillside__topp {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.reglene-spillside__topp > * {
	margin: 0;
}

.reglene-spillside__innhold {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--70);
}

.reglene-spillside__innhold > * {
	margin-block: 0;
}

/* Overskriften i en seksjon står tett på innholdet under. */
.reglene-spillside__innhold > h2 {
	margin-bottom: calc(-1 * var(--wp--preset--spacing--70) + 18px);
	scroll-margin-top: 96px;
}

.reglene-spillside__side {
	display: flex;
	flex: 1 1 280px;
	flex-direction: column;
	gap: var(--wp--preset--spacing--40);
	min-width: 0;
}

.reglene-spillside__side > * {
	margin: 0;
}

/* På smal skjerm erstattes sidekolonnens innholdsliste og annonse av chips og
   annonseplassen i hovedkolonnen (designet uno-mobil). */
@media (max-width: 781px) {

	.reglene-spillside {
		gap: var(--wp--preset--spacing--70);
		padding-top: var(--wp--preset--spacing--40);
	}

	.reglene-spillside__side .wp-block-reglene-hoppemeny,
	.reglene-spillside__side .wp-block-reglene-annonseplass {
		display: none;
	}

	.reglene-spillside__side:not(:has(> :not(.wp-block-reglene-hoppemeny, .wp-block-reglene-annonseplass))) {
		display: none;
	}
}

/* Tabeller ruller inne i seg selv, aldri hele siden. */
.wp-block-table {
	overflow-x: auto;
}

@media (prefers-reduced-motion: reduce) {

	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}

html {
	scroll-behavior: smooth;
}

/* Mobil: søk og meny til høyre, som i designet. */
@media (max-width: 599px) {

	.reglene-hovedmeny {
		flex: 0 0 auto;
		order: 2;
	}
}

/* Blokkstilen «poeng» på tabeller: tynne linjer, tall høyrestilt (K16). */
.wp-block-table.is-style-poeng {
	overflow-x: auto;
}

.wp-block-table.is-style-poeng table {
	border-collapse: collapse;
}

.wp-block-table.is-style-poeng :is(th, td) {
	padding: var(--wp--preset--spacing--20) 18px;
	text-align: left;
	border: 0;
	border-bottom: 1px solid var(--wp--preset--color--linje);
}

.wp-block-table.is-style-poeng thead {
	border-bottom: 0;
}

.wp-block-table.is-style-poeng th {
	font-size: var(--wp--preset--font-size--liten);
	font-weight: 400;
	color: var(--wp--preset--color--dempet);
}

.wp-block-table.is-style-poeng tr:last-child td {
	border-bottom: 0;
}

.wp-block-table.is-style-poeng :is(th, td):last-child {
	text-align: right;
	font-variant-numeric: tabular-nums;
}

/* Merket på demoinnhold (bare i wp-env). */
.reglene-demo {
	align-self: flex-start;
	padding: 2px 10px;
	font-size: var(--wp--preset--font-size--liten);
	font-weight: 700;
	color: var(--wp--preset--color--blekk);
	background: var(--wp--preset--color--sennep);
	border-radius: var(--wp--custom--radius--pille);
}

/* Forsiden: luft mellom seksjonene; overskrift og «Alle spill» på én linje. */
.reglene-forside {
	padding-bottom: var(--wp--preset--spacing--80);
}

.reglene-forside .wp-block-post-content > * + * {
	margin-block-start: var(--wp--preset--spacing--50);
}

.reglene-forside .wp-block-post-content > .wp-block-reglene-tvistband {
	margin-block: var(--wp--preset--spacing--80);
}

.reglene-forside .wp-block-post-content > .wp-block-reglene-annonseplass {
	margin-block-start: var(--wp--preset--spacing--70);
}

.reglene-seksjonstopp {
	align-items: baseline;
	gap: var(--wp--preset--spacing--10) var(--wp--preset--spacing--50);
}

.reglene-seksjonstopp > * {
	margin: 0;
}

.reglene-seksjonstopp a {
	font-weight: 700;
}

.reglene-kategorier {
	gap: var(--wp--preset--spacing--30);
}

/* Varianter står i et rutenett (gruppe med grid i innholdet). */
.reglene-varianter {
	gap: var(--wp--preset--spacing--30);
}