/* TNA Child — page template styles */
/* ------------------------------------------------------------------
   Shared palette.

   front-page.css already declared --tna-blue and --tna-orange, but it
   only loads on the front page, so every other section ended up with
   hand-picked hex values that drift from it -- var(--tna-blue) and #d0021b
   crept in from screenshots while the property and book sections were
   being built. Declaring them here, in the stylesheet that loads
   everywhere, gives one source for all of it; front-page.css's own
   :root block is harmless now, it just repeats two of these.
   ------------------------------------------------------------------ */
:root {
	--tna-blue: #044a88;
	--tna-blue-dark: #033764;
	--tna-orange: #ff3700;
	--tna-red: #d0021b;
	--tna-text: #333;
	--tna-muted: #666;
	--tna-tile: #ededed;
	--tna-tile-alt: #fff;
	--tna-rule: #e0e0e0;
}
.tna-page-hero {
	position: relative;
	width: 100%;
	min-height: 260px;
	display: flex;
	align-items: center;
	/* The title left-aligned within the page's normal content column
	   rather than centred -- see .tna-page-hero__inner.
	   background-size MUST match #masthead's own 175% exactly, not
	   "cover" -- see the long comment on .tna-hero in front-page.css for
	   why "cover" (which computes its own independent scale from this
	   section's own box) can never align pixel-for-pixel with
	   #masthead's crop, only approximate it. Same fix, this is the
	   equivalent hero for every other page. */
	background-size: 175% auto;
	/* -245px -808px continues exactly where #masthead's own window ends
	   -- see the matching comment on .tna-hero in front-page.css for the
	   arithmetic; same values, since both use the same 175% scale. */
	background-position: -245px -808px;
	background-color: #222;
}

/* Same reasoning as the equivalent front-page.css rule for .tna-hero:
   these values only hold at #masthead's desktop height/scale --
   re-anchor to "top" once the 920px mobile nav breakpoint changes both
   (see header.css). */
@media screen and (max-width: 920px) {
	.tna-page-hero {
		background-size: cover;
		background-position: center top;
	}
}

/* No ::before dark-gradient overlay here any more (there used to be
   one) -- user-reported: with the header/hero crop now pixel-aligned
   (cb17f64), a flat dark tint over just this band made it look like a
   different image again, next to the header's unfiltered (only a
   light semi-transparent grey tint) photo. Legibility for the white
   title/subtitle now comes from text-shadow alone (beefed up below). */

.tna-page-hero__inner {
	position: relative;
	z-index: 1;
	max-width: 1320px;
	width: 100%;
	margin: 0 auto;
	padding: 20px;
	box-sizing: border-box;
	text-align: left;
}

/* Both of these used a solid "chip" background behind the text at one
   point (guaranteed WCAG contrast, verified 12.9:1/14.6:1) --
   user-reported it read as a crude rectangular text box (Paint-style),
   not part of the design. Replaced with a heavy multi-direction
   text-outline instead: four small tight shadows (one per side) form a
   solid dark edge hugging each glyph, plus two soft wider glows for
   depth -- no background shape at all, just outlined white letters.
   Real trade-off, not a free win: unlike the chip, an outline this
   strong is NOT counted toward WCAG 1.4.3's 4.5:1 contrast ratio by
   the spec (or by axe-core) no matter how solid it looks, so this
   knowingly reintroduces the contrast gap the chip closed (sampling
   found ~1.2:1 against the photo's brightest patches, e.g. the
   building's cream walls). Kept because the user explicitly chose
   this trade-off after that was explained. */
.tna-page-hero__title {
	margin: 0;
	color: #fff;
	text-transform: uppercase;
	font-weight: 800;
	font-size: 42px;
	letter-spacing: 0.02em;
	text-shadow:
		-1.5px -1.5px 1px rgba(0, 0, 0, 0.85),
		1.5px -1.5px 1px rgba(0, 0, 0, 0.85),
		-1.5px 1.5px 1px rgba(0, 0, 0, 0.85),
		1.5px 1.5px 1px rgba(0, 0, 0, 0.85),
		0 2px 6px rgba(0, 0, 0, 0.75),
		0 0 22px rgba(0, 0, 0, 0.6);
}

@media screen and (max-width: 700px) {
	.tna-page-hero__title {
		font-size: 28px;
	}
}

/* Second hero line (currently just the search page's quoted query) --
   same treatment as the title, one step smaller so the h1 still reads
   as the primary heading. */
.tna-page-hero__subtitle-line {
	margin: 0.2em 0 0;
	color: #fff;
	text-transform: uppercase;
	font-weight: 800;
	font-size: 28px;
	letter-spacing: 0.02em;
	text-shadow:
		-1.5px -1.5px 1px rgba(0, 0, 0, 0.85),
		1.5px -1.5px 1px rgba(0, 0, 0, 0.85),
		-1.5px 1.5px 1px rgba(0, 0, 0, 0.85),
		1.5px 1.5px 1px rgba(0, 0, 0, 0.85),
		0 2px 6px rgba(0, 0, 0, 0.75),
		0 0 18px rgba(0, 0, 0, 0.6);
}

/* Astra's default page template prints its own entry-title -- redundant
   now that the hero already shows the page title. */
body.page .entry-header > .entry-title {
	display: none;
}

/* Search results list -- tna.lv's own is a plain title + "read more"
   link per match, no excerpt/thumbnail/date (values matched against
   tna.lv's #SearchResults computed styles). */
.tna-search-results {
	max-width: 1100px;
	margin: 0 auto;
	padding: 40px 20px;
}

.tna-search-results__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.tna-search-results__item {
	padding: 16px 0;
	border-bottom: 1px solid #e0e0e0;
}

.tna-search-results__item:first-child {
	border-top: 1px solid #e0e0e0;
}

.tna-search-results__title {
	margin: 0 0 6px;
	font-size: 1.5em;
	font-weight: 400;
}

.tna-search-results__title a,
.tna-search-results__more {
	color: #044a88;
	text-decoration: none;
}

.tna-search-results__title a:hover,
.tna-search-results__more:hover {
	text-decoration: underline;
}

.tna-search-results__more {
	display: inline-block;
	font-size: 1em;
}

.tna-search-results__empty {
	font-size: 1.1em;
	color: #444;
}

/* Breadcrumb trail, directly under the hero -- values (padding, colours,
   font-size/weight) matched against tna.lv's #Breadcrumbs computed styles.
   Rendered as a plain sibling of #content (see functions.php), same as
   the hero -- which, like the hero, makes it a direct child of Astra's
   outer `.hfeed.site` flex column. `width: 100%` is required here (the
   hero sets it too): without it, `margin: 0 auto` on a flex item centers
   the whole shrink-to-fit box instead of just capping+centering a
   full-width one, so every tile ends up bunched in the middle of the
   page instead of left-aligned under the hero. */
.tna-breadcrumbs {
	width: 100%;
	max-width: 1320px;
	margin: 0 auto;
	padding: 14px 20px 0;
	box-sizing: border-box;
}

.tna-breadcrumbs ol {
	list-style: none;
	margin: 0;
	padding: 0;
}

.tna-breadcrumbs__tile {
	display: inline-block;
	padding: 16px 22px;
	text-transform: uppercase;
	font-weight: 600;
	font-size: 0.95em;
	border-radius: 2px;
}

.tna-breadcrumbs__tile a,
.tna-breadcrumbs__tile span {
	color: #044a88 !important;
	text-decoration: none;
}

.tna-breadcrumbs__tile a:hover {
	text-decoration: underline;
}

.tna-breadcrumbs__tile.is-active {
	background: #e4e4e4;
}

.tna-breadcrumbs__tile a::after {
	content: "";
	display: inline-block;
	width: 8px;
	height: 12px;
	margin-left: 12px;
	background: url('../images/breadcrumb-arrow.png') center / contain no-repeat;
	vertical-align: middle;
}

@media screen and (max-width: 700px) {
	.tna-breadcrumbs__tile {
		padding: 10px 12px;
		font-size: 0.8em;
	}
}

/* tna.lv news articles show no author/date byline at all -- Astra's
   default "By ... / [date]" entry-meta is a theme addition, not
   present on the original site, and prints untranslated ("By") even
   for lv posts. Comment form/list is disabled site-wide in functions.php;
   .comments-area is hidden here too as a defense-in-depth belt-and-braces
   in case a future theme update re-enables it despite the filters. */
body.single-post .entry-meta,
body.single-post .comments-area {
	display: none;
}

/* Centered, readable content column (pages + izsoles/iepirkumi single),
   matching tna.lv's layout more closely than Astra's edge-to-edge default. */
.entry-content,
.tna-purchase-single__content {
	max-width: 1100px;
	margin-left: auto;
	margin-right: auto;
	font-size: 17px;
	line-height: 1.7;
}

/* tna.lv-style left sidebar nav for content pages (page.php), listing the
   current section's page tree -- see inc/page-hierarchy.php. Only present
   when the current page's top-level section actually has children. */
.tna-page-layout--with-sidebar {
	display: flex;
	align-items: flex-start;
	gap: 40px;
	padding: 20px;
}

.tna-page-sidebar {
	flex: 0 0 260px;
	width: 260px;
}

.tna-page-primary-col {
	flex: 1 1 auto;
	min-width: 0;
}

/* The centered/capped entry-content only makes sense full-width; inside
   the two-column layout it should just fill the primary column. */
.tna-page-layout--with-sidebar .entry-content {
	max-width: none;
	margin-left: 0;
	margin-right: 0;
}

.tna-sidebar-tree,
.tna-sidebar-tree__sub {
	list-style: none;
	margin: 0;
	padding: 0;
}

.tna-sidebar-tree__item {
	border-top: 1px solid #e0e0e0;
}

.tna-sidebar-tree__item:first-child {
	border-top: none;
}

.tna-sidebar-tree__item > a,
.tna-sidebar-tree__subitem > a {
	display: block;
	text-decoration: none;
	transition: color 0.15s ease;
}

.tna-sidebar-tree__item > a {
	padding: 12px 4px;
	color: #333;
	font-size: 0.95em;
	font-weight: 600;
}

.tna-sidebar-tree__sub {
	padding: 0 0 10px 16px;
}

.tna-sidebar-tree__subitem > a {
	padding: 6px 4px;
	color: #555;
	font-size: 0.9em;
}

.tna-sidebar-tree__item > a:hover,
.tna-sidebar-tree__subitem > a:hover {
	color: #044a88;
}

/* Same darkened accent as elsewhere (see .tna-lang-switcher) -- #ff3700
   text is only 3.7:1 on white, below the WCAG AA 4.5:1 minimum. */
.tna-sidebar-tree__item.is-active > a,
.tna-sidebar-tree__subitem.is-active > a {
	color: #b32d00;
	font-weight: 700;
}

@media screen and (max-width: 768px) {
	/* Matches tna.lv, which also hides this sidebar below its "medium"
	   breakpoint (hide-for-small-only) rather than stacking it. */
	.tna-page-sidebar {
		display: none;
	}

	.tna-page-layout--with-sidebar {
		display: block;
		padding: 15px 20px;
	}
}

.entry-content p,
.tna-purchase-single__content p {
	margin: 0 0 1.3em;
}

.entry-content h2,
.entry-content h3,
.entry-content h4,
.tna-purchase-single__content h2,
.tna-purchase-single__content h3,
.tna-purchase-single__content h4 {
	color: #044a88;
	font-weight: 700;
	margin: 1.4em 0 0.6em;
}

.entry-content h2,
.tna-purchase-single__content h2 {
	font-size: 1.6em;
}

.entry-content h3,
.tna-purchase-single__content h3 {
	font-size: 1.3em;
}

.entry-content h4,
.tna-purchase-single__content h4 {
	font-size: 1.1em;
}

.entry-content strong,
.tna-purchase-single__content strong {
	color: #044a88;
}

.entry-content a,
.tna-purchase-single__content a {
	color: #044a88;
	text-decoration: underline;
}

.entry-content a:hover,
.tna-purchase-single__content a:hover {
	text-decoration: none;
}

.entry-content img,
.tna-purchase-single__content img {
	max-width: 100%;
	height: auto;
	margin: 0.5em 0;
}

.entry-content ul,
.entry-content ol,
.tna-purchase-single__content ul,
.tna-purchase-single__content ol {
	margin: 0 0 1.3em 1.4em;
	padding: 0;
}

.entry-content li,
.tna-purchase-single__content li {
	margin-bottom: 0.4em;
}

.entry-content table,
.tna-purchase-single__content table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 1.5em;
}

.entry-content table th,
.entry-content table td,
.tna-purchase-single__content table th,
.tna-purchase-single__content table td {
	border: 1px solid rgba(0, 0, 0, 0.15);
	padding: 0.6em 0.9em;
	text-align: left;
}

/* Search form + language switcher styling has moved to
   assets/css/header.css, alongside the rest of the custom header
   (inc/custom-header.php) that now renders them. */

.tna-notice-board__empty {
	font-style: italic;
	opacity: 0.75;
}

.tna-notice-board__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.tna-notice-board__item {
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	padding: 1em 0;
}

.tna-notice-board__item time {
	display: block;
	font-size: 0.85em;
	opacity: 0.7;
}

.tna-news-list .tna-news-item {
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	margin-bottom: 1.5em;
	padding-bottom: 1.5em;
}

.tna-document__attachments {
	margin-top: 2em;
}

.tna-document__attachments li {
	margin-bottom: 0.5em;
}

.tna-service__children {
	display: grid;
	gap: 1.5em;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	margin-top: 2em;
}

.tna-service__children .tna-service__child {
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 4px;
	padding: 1.25em;
}

.tna-purchase-archive {
	max-width: 1100px;
	margin: 0 auto;
	padding: 2em 20px 4em;
}

.tna-purchase-archive__title {
	margin-bottom: 1em;
}

.tna-purchase-tabs {
	display: flex;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	margin-bottom: 2em;
}

.tna-purchase-tabs__item {
	padding: 0.75em 1.5em;
	font-weight: 600;
	color: #555;
	text-decoration: none;
	border-bottom: solid 6px transparent;
	margin-bottom: -1px;
}

.tna-purchase-tabs__item--current {
	/* #ff3700 text on white is only 3.7:1, below WCAG AA's 4.5:1 for text
	   (this also fails on the original tna.lv, which uses the same colour
	   here -- darkened only for our text, the underline stays on-brand). */
	color: #b32d00;
	border-bottom: solid 6px #ff3700;
}

.tna-purchase-list {
	display: flex;
	flex-direction: column;
	gap: 1.25em;
}

.tna-purchase-card {
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 4px;
	padding: 1.25em 1.5em;
}

.tna-purchase-card__title {
	margin: 0 0 0.5em;
	font-size: 1.1em;
}

.tna-purchase-card__title a {
	text-decoration: none;
	color: #044a88;
}

.tna-purchase-card__excerpt {
	color: #444;
	margin-bottom: 0.75em;
}

.tna-purchase-card__meta {
	display: flex;
	gap: 1.5em;
	font-size: 0.9em;
	/* #777 was 4.48:1 on white -- just under the 4.5:1 AA minimum. */
	color: #666;
}

.tna-purchase-card__code {
	font-weight: 600;
}

.tna-purchase-list__empty {
	font-style: italic;
	opacity: 0.75;
}

.tna-purchase-pagination {
	margin-top: 2em;
}

.tna-purchase-single {
	max-width: 1100px;
	margin: 0 auto;
	padding: 2em 20px 4em;
}

.tna-purchase-single__back {
	margin-bottom: 1.5em;
}

.tna-purchase-single__back a {
	color: #044a88;
	text-decoration: none;
	font-weight: 600;
}

.tna-purchase-single__back a:hover {
	text-decoration: underline;
}

.tna-purchase-single__title {
	margin-bottom: 0.75em;
}

.tna-purchase-single__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1em;
	padding-bottom: 1.5em;
	margin-bottom: 1.5em;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	color: #555;
}

.tna-purchase-status {
	display: inline-block;
	padding: 0.3em 0.9em;
	border-radius: 3px;
	font-size: 0.85em;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

.tna-purchase-status--open {
	background: #fff0ea;
	/* #ff3700 on this light peach background is only 3.3:1. */
	color: #b32d00;
}

.tna-purchase-status--closed {
	background: #eee;
	/* #777 on this background is only 3.85:1; darkened to clear WCAG AA 4.5:1. */
	color: #5c5c5c;
}

.tna-purchase-single__code {
	font-weight: 600;
	color: #044a88;
}

.tna-purchase-single__content {
	line-height: 1.7;
}

.tna-purchase-single__content a {
	color: #044a88;
}

/* ------------------------------------------------------------------
   Managed properties ("Apsaimniekotie nekustamie īpašumi")

   tna.lv lays these out as a two-column grid of flat tiles with no
   gutter, filled in a checkerboard: the fill alternates per row *and*
   per column, so it repeats every four tiles (1st and 4th grey, 2nd
   and 3rd white). Hence the 4n+1 / 4n+4 selectors rather than a plain
   odd/even.

   The three colour values below are read off the live tna.lv tiles.
   Re-check them against the real page's computed styles if the greys
   look off next to the rest of the theme.
   ------------------------------------------------------------------ */

.tna-properties {
	margin: 3rem 0 0;
}

.tna-properties__heading {
	margin: 0;
	padding: 1.1rem 1rem;
	border-bottom: 4px solid #d0021b;
	background: #e6e6e6;
	color: var(--tna-blue);
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-align: center;
	text-transform: uppercase;
}

.tna-properties__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0;
}

.tna-property {
	padding: 1.4rem 1.5rem;
	background: #fff;
	min-height: 150px;
}

.tna-property:nth-child(4n + 1),
.tna-property:nth-child(4n + 4) {
	background: #eeeeee;
}

.tna-property__title {
	margin: 0 0 0.6rem;
	color: var(--tna-blue);
	font-size: 0.95rem;
	font-weight: 700;
	line-height: 1.4;
	text-transform: uppercase;
}

.tna-property--news .tna-property__title {
	margin-bottom: 0;
}

.tna-property__tenants,
.tna-property__contact {
	font-size: 0.875rem;
	line-height: 1.55;
}

.tna-property__tenants p,
.tna-property__contact p {
	margin: 0 0 0.35rem;
}

.tna-property__tenants p:last-child,
.tna-property__contact p:last-child {
	margin-bottom: 0;
}

.tna-property__contact {
	margin-top: 0.9rem;
}

.tna-property__contact a {
	color: var(--tna-blue);
	text-decoration: underline;
	word-break: break-word;
}

@media screen and (max-width: 920px) {
	.tna-properties__grid {
		grid-template-columns: 1fr;
	}

	.tna-property,
	.tna-property:nth-child(4n + 1),
	.tna-property:nth-child(4n + 4) {
		background: #fff;
		min-height: 0;
	}

	.tna-property:nth-child(odd) {
		background: #eeeeee;
	}
}

/* ------------------------------------------------------------------
   Property tiles, part 2: collapsed state + dialog

   Replaces the first version's always-visible tenant list. tna.lv keeps
   the tile to title (+ contact) and opens the body in an overlay, so the
   grid's rows stay even however long an article is.
   ------------------------------------------------------------------ */

.tna-property__body[hidden] {
	display: none;
}

.tna-property--openable {
	cursor: pointer;
}

.tna-property__open {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	font: inherit;
	text-align: left;
	text-transform: inherit;
	cursor: pointer;
}

.tna-property__open:hover,
.tna-property__open:focus-visible {
	text-decoration: underline;
}

.tna-property__open:focus-visible {
	outline: 2px solid var(--tna-blue);
	outline-offset: 2px;
}

.tna-property-dialog {
	position: fixed;
	z-index: 9999;
	inset: 0;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding: 3vh 1rem;
}

.tna-property-dialog[hidden] {
	display: none;
}

.tna-property-dialog__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.55);
}

.tna-property-dialog__panel {
	position: relative;
	width: min(900px, 100%);
	max-height: 94vh;
	overflow-y: auto;
	padding: 2rem 2.25rem 2.25rem;
	border-top: 4px solid #d0021b;
	background: #fff;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
}

.tna-property-dialog__close {
	position: absolute;
	top: 0.5rem;
	right: 0.75rem;
	padding: 0.25rem 0.5rem;
	border: 0;
	background: none;
	color: #d0021b;
	font-size: 1.75rem;
	line-height: 1;
	cursor: pointer;
}

.tna-property-dialog__close:focus-visible {
	outline: 2px solid var(--tna-blue);
	outline-offset: 2px;
}

.tna-property-dialog__title {
	margin: 0 2rem 1.25rem 0;
	color: var(--tna-blue);
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1.4;
	text-transform: uppercase;
}

.tna-property-dialog__content {
	font-size: 0.925rem;
	line-height: 1.6;
}

.tna-property-dialog__content p {
	margin: 0 0 0.85rem;
}

.tna-property-dialog__content p:last-child {
	margin-bottom: 0;
}

.tna-property-dialog__content img {
	max-width: 100%;
	height: auto;
}

.tna-property-dialog__content a {
	color: var(--tna-blue);
	word-break: break-word;
}

body.tna-property-dialog-open {
	overflow: hidden;
}

@media screen and (max-width: 920px) {
	.tna-property-dialog {
		padding: 0;
	}

	.tna-property-dialog__panel {
		width: 100%;
		max-height: 100vh;
		padding: 1.75rem 1.25rem 2rem;
	}
}

/* Dialog body: tenant list left, the tile's contact block repeated on
   the right, as tna.lv's overlay does. News tiles carry no contact, so
   --no-contact lets the text run the full width instead of leaving a
   dead column. */
.tna-property-dialog__body {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 15rem;
	gap: 2rem;
	align-items: start;
}

.tna-property-dialog--no-contact .tna-property-dialog__body {
	grid-template-columns: 1fr;
}

.tna-property-dialog__contact {
	font-size: 0.875rem;
	line-height: 1.55;
}

.tna-property-dialog__contact p {
	margin: 0 0 0.35rem;
}

.tna-property-dialog__contact p:last-child {
	margin-bottom: 0;
}

.tna-property-dialog__contact a {
	color: var(--tna-blue);
	word-break: break-word;
}

@media screen and (max-width: 920px) {
	.tna-property-dialog__body {
		grid-template-columns: 1fr;
		gap: 1.25rem;
	}
}

/* News tiles that duplicate a Jaunumi post link to it instead of
   opening the dialog; styled as the title, not as a body link. */
.tna-property__link {
	color: inherit;
	text-decoration: none;
}

.tna-property__link:hover,
.tna-property__link:focus-visible {
	text-decoration: underline;
}

.tna-property__link:focus-visible {
	outline: 2px solid var(--tna-blue);
	outline-offset: 2px;
}

/* News tiles that duplicate a Jaunumi post link to it instead of
   opening the dialog; styled as the title, not as a body link. */
.tna-property__link {
	color: inherit;
	text-decoration: none;
}

.tna-property__link:hover,
.tna-property__link:focus-visible {
	text-decoration: underline;
}

.tna-property__link:focus-visible {
	outline: 2px solid var(--tna-blue);
	outline-offset: 2px;
}

/* News dialog: gallery left, prose right, as tna.lv's overlay lays it
   out. Property tiles have no gallery, so their text runs full width. */
.tna-property-dialog__content:has(.tna-property__gallery) {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
	gap: 1.75rem;
	align-items: start;
}

.tna-property__gallery ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.tna-property__gallery li {
	margin: 0 0 0.5rem;
}

.tna-property__gallery img {
	display: block;
	width: 100%;
	height: auto;
}

@media screen and (max-width: 920px) {
	.tna-property-dialog__content:has(.tna-property__gallery) {
		grid-template-columns: 1fr;
		gap: 1.25rem;
	}
}

/* Carousel thumbnails, take 2.

   Astra styles content images by element, which beat the earlier
   single-class rules here and blew the strip up to full-size photos
   stacked vertically. These are scoped tighter and pin both axes, so
   the strip stays a strip whatever the theme says about img. */
.tna-property-dialog .tna-carousel__thumbs {
	display: flex;
	flex-wrap: nowrap;
	gap: 0.25rem;
	margin-top: 0.5rem;
	padding: 0;
	overflow-x: auto;
	overflow-y: hidden;
	background: none;
}

.tna-property-dialog .tna-carousel__thumb {
	flex: 0 0 4.5rem;
	width: 4.5rem;
	height: 3.25rem;
	margin: 0;
	padding: 0;
	border: 2px solid transparent;
	background: none;
	overflow: hidden;
	cursor: pointer;
}

.tna-property-dialog .tna-carousel__thumb img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: 100%;
	margin: 0;
	object-fit: cover;
}

.tna-property-dialog .tna-carousel__thumb.is-current {
	border-color: #d0021b;
}

/* Arrows sat over the frame's lower edge because the frame had no
   explicit stacking context of its own. */
.tna-property-dialog .tna-carousel__frame {
	position: relative;
	z-index: 0;
	line-height: 0;
}

.tna-property-dialog .tna-carousel__arrow {
	z-index: 2;
}

.tna-property-dialog .tna-carousel__main {
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
}

/* ------------------------------------------------------------------
   Hero crops, take 2.

   The three heroes (#masthead, .tna-hero, .tna-page-hero) were each
   pinned with a fixed percentage and a pixel offset, so that the
   header's crop and the band below it would line up pixel-for-pixel.
   That only holds at one viewport width: anywhere else the offsets
   point somewhere else in the photo, so each section showed a
   different part of it, and at some widths the band scrolled past the
   image entirely and came up flat blue.

   Each one now centres its own crop with "cover". The header and the
   hero no longer continue one another exactly -- they show the same
   photo, centred, at whatever size the viewport is -- but every
   section stays filled and recognisable at every width, which the
   pixel alignment never managed.

   These override the earlier rules by source order; the originals are
   left above so the intent behind them is still on record.
   ------------------------------------------------------------------ */

.tna-page-hero {
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

/* Hero crops, take 3.

   "cover" alone zoomed into the middle of the building; the photo is a
   wide panorama whose interesting band -- roofline and treetops -- sits
   in its upper third. Keep cover for the fill, but anchor the crop to
   that band rather than to the centre. */
.tna-page-hero {
	background-position: center 30%;
}

/* Hero now starts at the very top of the page and #masthead floats over
   it -- see the note in header.css. The negative pull is the header's
   own height; padding-top gives the title back the room it takes, so
   the text still sits where it did. */
.tna-page-hero {
	margin-top: calc(-1 * var(--tna-header-h, 150px));
	padding-top: var(--tna-header-h, 150px);
	min-height: calc(260px + var(--tna-header-h, 150px));
	background-position: center 30%;
}

/* Anchor to the top of the photo: the sky band belongs behind the nav
   and search rows, so the treeline sits below them rather than across
   them. */
.tna-page-hero {
	background-position: center top;
}

/* Zoom past "cover" so the visible band is a thinner slice off the top
   of the photo -- sky and the chimneys on the skyline, with the canopy
   pushed below the fold. The wider the scale, the less of the source
   fits in the band's height. Mobile keeps plain cover: at that width
   this scale would crop into the middle of the building. */
@media screen and (min-width: 921px) {
	.tna-page-hero {
		background-size: 135% auto;
		background-position: center top;
	}
}

/* The dot texture belonged to #masthead, so it stopped where the header
   did and the photo below it was bare. Now that the two are one image,
   the dots go on the hero itself and cover the whole band. Layer order:
   dots first (on top), photo behind. */
@media screen and (min-width: 921px) {
	.tna-page-hero {
		background-image:
			url('../images/header-dot.png'),
			url('../images/hero.jpg') !important;
		background-repeat: repeat, no-repeat;
		background-size: auto, 135% auto;
		background-position: left top, center top;
	}
}

.tna-page-hero {
	background-image:
		url('../images/header-dot.png'),
		url('../images/hero.jpg') !important;
	background-repeat: repeat, no-repeat;
	background-size: auto, cover;
	background-position: left top, center top;
}

/* The plain rule above landed after the media query and overrode it, so
   the zoom went back to cover. Re-state the desktop scale last. */
@media screen and (min-width: 921px) {
	.tna-page-hero {
		background-size: auto, 135% auto !important;
		background-position: left top, center top !important;
	}
}
/* ------------------------------------------------------------------
   Publishing page ("Par juridiskās literatūras izdevējdarbību")

   Content left, a narrow column right carrying the e-shop banner, the
   trading locations and the book shortlist -- the arrangement the old
   site assembled from its Banner / Tirdzniecības Vietas / Grāmatas tabs.
   ------------------------------------------------------------------ */

.tna-publishing {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 20rem;
	gap: 2.5rem;
	align-items: start;
}

.tna-publishing__banner img {
	display: block;
	width: 100%;
	height: auto;
}

.tna-publishing__subheading {
	margin: 0 0 0.75rem;
	color: var(--tna-blue);
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.tna-publishing__places,
.tna-publishing__books {
	margin-top: 2rem;
}

.tna-publishing__places-body {
	font-size: 0.9rem;
	line-height: 1.55;
}

.tna-publishing__places-body p {
	margin: 0 0 0.4rem;
}

/* ---- book cards ---- */

.tna-book {
	padding: 1rem 0;
	border-top: 1px solid #e0e0e0;
}

.tna-book:first-of-type {
	border-top: 0;
}

.tna-book__title {
	margin: 0 0 0.3rem;
	color: var(--tna-blue);
	font-size: 0.95rem;
	font-weight: 700;
	line-height: 1.35;
	text-transform: uppercase;
}

.tna-book__title a {
	color: inherit;
	text-decoration: none;
}

.tna-book__title a:hover,
.tna-book__title a:focus-visible {
	text-decoration: underline;
}

.tna-book__author {
	margin: 0 0 0.6rem;
	color: var(--tna-blue);
	font-size: 0.875rem;
	font-weight: 600;
}

.tna-book__cover {
	margin: 0 0 0.6rem;
	/* Covers vary in aspect; cap the height so a tall one cannot push
	   the rest of the column out of sight. */
	max-width: 9rem;
}

.tna-book__cover img {
	display: block;
	width: 100%;
	height: auto;
}

.tna-book__price {
	margin: 0 0 0.5rem;
	color: #d0021b;
	font-size: 1rem;
	font-weight: 700;
}

.tna-book__buy {
	margin: 0;
}

.tna-book__buy-link {
	display: inline-block;
	padding: 0.35rem 1.1rem;
	background: var(--tna-blue);
	color: #fff;
	font-size: 0.85rem;
	text-decoration: none;
}

.tna-book__buy-link:hover,
.tna-book__buy-link:focus-visible {
	background: var(--tna-blue-dark);
	color: #fff;
}

.tna-publishing__shop-link {
	margin: 1.25rem 0 0;
	font-size: 0.9rem;
	font-weight: 600;
}

.tna-publishing__shop-link a {
	color: var(--tna-blue);
}

@media screen and (max-width: 920px) {
	.tna-publishing {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.tna-book__cover {
		max-width: 12rem;
	}
}

/* Contact block above the book list -- the department's own details,
   which the old page carried in its own field. */
.tna-publishing__contact {
	margin: 0 0 1.5rem;
	font-size: 0.875rem;
	line-height: 1.55;
}

.tna-publishing__contact p {
	margin: 0 0 0.4rem;
}

.tna-publishing__contact p:first-child,
.tna-publishing__contact strong {
	color: var(--tna-blue);
	font-weight: 700;
}

.tna-publishing__contact a {
	color: var(--tna-blue);
}

/* The publishing grid sits inside .tna-page-primary-col, which is
   already one column of .tna-page-layout's own grid. A grid child with
   no explicit min-width refuses to shrink below its content, so the
   two nested grids fought over the same width and the aside was pushed
   out past the column's right edge.

   min-width: 0 on the outer column lets it shrink to its share, and the
   inner grid then divides that share instead of the viewport. */
.tna-page-primary-col {
	min-width: 0;
}

.tna-publishing {
	width: 100%;
	min-width: 0;
}

.tna-publishing__main,
.tna-publishing__aside {
	min-width: 0;
}

/* Three columns on this page (section nav, content, books), so the book
   column gets less room here than the property page's two. */
.tna-page-layout--with-sidebar .tna-publishing {
	grid-template-columns: minmax(0, 1fr) 15rem;
	gap: 1.75rem;
}

/* Final word on the page hero -- matches the front page exactly.

   The rules above accumulated while the crop was being tuned and ended
   on a 135% zoom; the front page settled on plain cover anchored to the
   top, which fills at any width and shows the same sky-and-treeline
   band. Same values here so every section reads as one photo. */
.tna-page-hero {
	background-image:
		url('../images/header-dot.png'),
		url('../images/hero.jpg');
	background-repeat: repeat, no-repeat;
	background-size: auto, cover;
	background-position: left top, center top;
}

@media screen and (min-width: 921px) {
	.tna-page-hero {
		background-size: auto, cover;
		background-position: left top, center top;
	}
}

/* Match the front page's band height.

   "cover" scales the photo to fill the element, so two heroes of
   different heights show the same photo at different zooms -- which is
   why the treeline sat higher here than on the front page. Same height,
   same crop. The front page's own 420px + header allowance is the
   reference. */
.tna-page-hero {
	min-height: calc(420px + var(--tna-header-h, 150px));
}

/* Last word, again: an earlier !important rule still forced 135% here,
   so the page hero zoomed differently from the front page's cover.
   Match the front page on both axes -- same scale, same height. */
.tna-page-hero {
	background-size: auto, cover !important;
	background-position: left top, center top !important;
	min-height: 420px !important;
	padding-top: var(--tna-header-h, 150px);
}

/* Procurement / auction rows expand in place.

   The body of one of these is just the EIS and IUB links, so tna.lv
   drops them open under the row instead of making the visitor load a
   page for two links. <details> carries the open/closed state; the
   marker is replaced with the site's own triangle on the right. */
.tna-purchase-card__details {
	margin: 0;
}

.tna-purchase-card__summary {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	padding: 0;
	list-style: none;
	cursor: pointer;
}

/* WebKit draws its own marker unless this is cleared. */
.tna-purchase-card__summary::-webkit-details-marker {
	display: none;
}

.tna-purchase-card__summary::after {
	content: "\25B8";
	flex: 0 0 auto;
	color: var(--tna-blue);
	font-size: 1.1rem;
	line-height: 1.3;
	transform: rotate(0deg);
	transition: transform 0.15s ease;
}

.tna-purchase-card__details[open] .tna-purchase-card__summary::after {
	transform: rotate(90deg);
}

.tna-purchase-card__summary:focus-visible {
	outline: 2px solid var(--tna-blue);
	outline-offset: 2px;
}

.tna-purchase-card__body {
	margin: 0.75rem 0 0;
	font-size: 0.9rem;
	line-height: 1.6;
}

.tna-purchase-card__body p {
	margin: 0 0 0.5rem;
}

.tna-purchase-card__body a {
	color: #c4531a;
	text-decoration: none;
}

.tna-purchase-card__body a:hover,
.tna-purchase-card__body a:focus-visible {
	text-decoration: underline;
}

/* Procurement / auction rows, styled to match the rest of the site.

   The first pass left these at Astra's defaults -- regular weight,
   sentence case -- while every other listing on the site sets its
   titles in bold uppercase blue on alternating tiles. Same treatment
   here, from the shared palette. */
.tna-purchase-card {
	padding: 0.9rem 1.1rem;
	background: var(--tna-tile-alt);
}

.tna-purchase-list .tna-purchase-card:nth-child(odd) {
	background: var(--tna-tile);
}

.tna-purchase-card__title {
	margin: 0;
	color: var(--tna-blue);
	font-size: 0.875rem;
	font-weight: 700;
	line-height: 1.4;
	text-transform: uppercase;
}

.tna-purchase-card__title a {
	color: inherit;
	text-decoration: none;
}

.tna-purchase-card__title a:hover,
.tna-purchase-card__title a:focus-visible {
	text-decoration: underline;
}

.tna-purchase-card__meta {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	margin-top: 0.35rem;
	color: var(--tna-blue);
	font-size: 0.8rem;
	font-weight: 700;
}

.tna-purchase-card__summary::after {
	color: var(--tna-blue);
}

.tna-purchase-card__body a {
	color: var(--tna-orange);
}

.tna-purchase-card__details[open] {
	padding-bottom: 0.25rem;
}

/* Grāmatas: kartīte, vāks pa kreisi, cena un poga pa labi */
.tna-publishing__books .tna-book {
	display: grid;
	grid-template-columns: 45% 1fr;
	column-gap: 1rem;
	margin: 0 0 1rem;
	padding: 1rem;
	background: #e6e6e6;
	border: 0;
}
.tna-publishing__books .tna-book__title,
.tna-publishing__books .tna-book__author {
	grid-column: 1 / -1;
}
.tna-publishing__books .tna-book__author {
	margin: 0 0 1.5rem;
	color: #164194;
	font-weight: 700;
}
.tna-publishing__books .tna-book__cover {
	grid-column: 1;
	grid-row: 3 / 5;
}
.tna-publishing__books .tna-book__cover img {
	display: block;
	width: 100%;
	height: auto;
}
.tna-publishing__books .tna-book__price {
	grid-column: 2;
	grid-row: 3;
	align-self: end;
	margin: 0 0 0.5rem;
	color: #e8501e;
	font-weight: 700;
	text-align: center;
}
.tna-publishing__books .tna-book__buy {
	grid-column: 2;
	grid-row: 4;
	margin: 0;
	text-align: center;
}
.tna-publishing__books .tna-book__buy-link {
	display: inline-block;
	padding: 0.6rem 1.1rem;
	border: 1px solid #e8501e;
	background: transparent;
	color: #164194;
	font-weight: 700;
	text-transform: uppercase;
	text-decoration: none;
}
.tna-publishing__books .tna-book__buy-link:hover,
.tna-publishing__books .tna-book__buy-link:focus {
	background: #e8501e;
	color: #fff;
}