/* PSC-teeman lisätyylit. */

/* Yleiset apuluokat kuvioille */
.psc-eyebrow {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-size: var(--wp--preset--font-size--small);
	/* Vaaleilla pohjilla käytetään tummempaa korostussävyä (accent-dark),
	   jotta kontrasti pysyy riittävänä (WCAG AA, ks. laaturaportti). */
	color: var(--wp--preset--color--accent-dark);
}

/* Kiinteällä tummalla pohjalla (psc-band, ei läpinäkyvyyttä) kulta-korostusväri
   riittää sellaisenaan: 7.05:1 väriä #1a1d21 vasten. */
.psc-band .psc-eyebrow,
.has-contrast-background-color:not(.wp-block-cover) .psc-eyebrow {
	color: var(--wp--preset--color--accent);
}

/* Hero-kuvion cover-lohko käyttää has-background-dim-70:tä, joka on
   OSITTAIN LÄPINÄKYVÄ tumma taso (opacity 0.7) — ilman taustakuvaa se
   sekoittuu sen alla olevaan vaaleaan sivupohjaan (#f6f5f2), jolloin
   todellinen renderöity tausta on n. #5c5e60, ei täysi #1a1d21. Kulta
   (#c9a24a) antaa siihen vain 2.71:1, joten cover-lohkossa käytetään
   vaaleampaa, kermaista sävyä (4.8:1 mitattua taustaa vasten). */
.wp-block-cover .psc-eyebrow {
	color: #eddcae;
}

.psc-card {
	background: var(--wp--preset--color--surface);
	border-radius: var(--wp--custom--radius);
	box-shadow: var(--wp--custom--shadow);
	padding: var(--wp--preset--spacing--40);
}
/* Kortin kuva: 3:2, täyttää leveyden ja pyöristetyt kulmat kuten muukin kortti. */
.psc-card .wp-block-image {
	margin: calc(var(--wp--preset--spacing--40) * -1) calc(var(--wp--preset--spacing--40) * -1) var(--wp--preset--spacing--40);
}
.psc-card .wp-block-image img {
	aspect-ratio: 3 / 2;
	object-fit: cover;
	width: 100%;
	border-radius: var(--wp--custom--radius) var(--wp--custom--radius) 0 0;
}

.psc-band {
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
}
.psc-band a { color: inherit; }
/* Sama periytymisongelma kuin .psc-headerissa: psc-bandin vaalea teksti ei saa
   periytyä täytettyyn kulta-painikkeeseen (vaalea teksti kullalla vain 2.2:1).
   Ääriviiva-tyylinen (is-style-outline) painike jätetään ulos, koska sillä ei
   ole täyteväriä — sen pitää säilyttää vaalea teksti/reunaviiva tummalla
   nauhalla. */
.psc-band .wp-block-button:not(.is-style-outline) .wp-element-button {
	color: var(--wp--preset--color--contrast);
}

/* Rata-osio: vaihda korostus punaiseen (asetetaan body-luokalla Task 7) */
.psc-rata {
	--wp--preset--color--accent: var(--wp--preset--color--accent-rata);
}
/* accent-rata on tumma punainen: valkoinen teksti sillä on 5.9:1, tumma teksti
   vain ~3.6:1 — siksi rata-osion täytetyt painikkeet pitävät vaalean tekstin,
   vaikka muualla korostuspainikkeissa on tumma teksti kullalla. Ääriviiva-
   painikkeet (is-style-outline, ei täyteväriä) jätetään ulos. */
.psc-rata .wp-block-button:not(.is-style-outline) .wp-element-button {
	color: var(--wp--preset--color--surface);
}

/* Kuvat */
.wp-block-image img { border-radius: var(--wp--custom--radius); }

/* Header */
.psc-header {
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
	position: sticky;
	top: 0;
	z-index: 100;
}
.psc-header .wp-block-navigation a { color: var(--wp--preset--color--base); }
.psc-header .wp-block-navigation a:hover { color: var(--wp--preset--color--accent); }
/* .psc-header asettaa tekstivärin (base) koko lohkolle; ilman tätä sääntöä
   sama vaalea väri periytyisi myös "Varaa vuoro" -painikkeeseen ja
   heikentäisi sen kontrastin (vaalea teksti kultaisella pohjalla, 2.2:1).
   Painike pitää tumman tekstin (theme.json:in oletus), kuten muuallakin. */
.psc-header .wp-element-button { color: var(--wp--preset--color--contrast); }
.psc-header .wp-block-site-logo img { height: 52px; width: auto; aspect-ratio: 946 / 250; }

/* Footer */
.psc-footer h3 { color: var(--wp--preset--color--base); font-size: var(--wp--preset--font-size--medium); }
/* Kosketuskohteet vähintään 24x24px riittävällä välillä (WCAG target size). */
.psc-footer .wp-block-list li a {
	display: inline-block;
	padding: 0.35rem 0;
}

/* Taulukot */
.wp-block-table.is-style-stripes td, .wp-block-table.is-style-stripes th { padding: 0.75rem 1rem; }

/* Contact Form 7 */
.wpcf7 input:not([type="submit"]), .wpcf7 textarea, .wpcf7 select {
	width: 100%;
	padding: 0.65rem 0.8rem;
	border: 1px solid var(--wp--preset--color--muted);
	border-radius: var(--wp--custom--radius);
	font: inherit;
}
.wpcf7 input[type="submit"] {
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--contrast);
	border: 0;
	border-radius: var(--wp--custom--radius);
	padding: 0.75rem 1.5rem;
	font-family: var(--wp--preset--font-family--heading);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	cursor: pointer;
}
/* Rata-osiossa tausta on punainen: pidä teksti vaaleana (ks. .psc-rata .wp-element-button). */
.psc-rata .wpcf7 input[type="submit"] {
	color: var(--wp--preset--color--surface);
}

/* Flexires: sidotaan lisäosan teemamuuttujat teeman palettiin.
   Lisäosa asettaa muuttujat inline-tyylinä, siksi !important. */
.flexires-booking-container, .fr-rental-app, .fr-layout-container, .flexires-feedback-wrap {
	--fr-primary:      var(--wp--preset--color--accent) !important;
	--fr-primary-text: var(--wp--preset--color--surface) !important;
	--fr-container-bg: var(--wp--preset--color--surface) !important;
	--fr-text:         var(--wp--preset--color--contrast) !important;
	--fr-slot-bg:      var(--wp--preset--color--base) !important;
	--fr-slot-text:    var(--wp--preset--color--contrast) !important;
	--fr-filter-bg:    var(--wp--preset--color--surface) !important;
	/* viikkokalenteri (flexires_week_calendar) */
	--fr-wc-bg:        var(--wp--preset--color--contrast) !important;
	--fr-wc-nav-bg:    var(--wp--preset--color--accent) !important;
	--fr-wc-nav-text:  var(--wp--preset--color--base) !important;
}

/* Kioski: isot kosketuskohteet tabletille */
.psc-kiosk { font-size: 1.15rem; }
.psc-kiosk input, .psc-kiosk select, .psc-kiosk textarea, .psc-kiosk button {
	font-size: 1.15rem;
	min-height: 48px;
}
.psc-kiosk .wp-block-site-logo img { height: 52px; width: auto; }

/* Rata-päiväkirja (kaikilla pohjilla): kentät ja lähetysnappi teeman tyyliin.
   Käyntityyppien valintakortit (.rp-type-btn) jätetään lisäosan omaan tyyliin. */
.rp-wrap input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
.rp-wrap select,
.rp-wrap textarea {
	width: 100%;
	padding: 0.65rem 0.8rem;
	border: 1px solid var(--wp--preset--color--muted);
	border-radius: var(--wp--custom--radius);
}
.rp-wrap .rp-submit, .rp-wrap input[type="submit"] {
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--contrast);
	border: 0;
	border-radius: var(--wp--custom--radius);
	padding: 0.85rem 1.5rem;
	font-family: var(--wp--preset--font-family--heading);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	min-height: 48px;
	cursor: pointer;
}
.rp-wrap .rp-submit:disabled { opacity: 0.5; cursor: not-allowed; }
.psc-rata .rp-wrap .rp-submit, .psc-rata .rp-wrap input[type="submit"] {
	color: var(--wp--preset--color--surface);
}

/* --- Viimeistely 0.3.0 --- */

/* Artikkeli: pääkuva 16:9 pyöristetyin kulmin. */
.wp-block-post-featured-image.alignwide img {
	aspect-ratio: 16 / 9;
	object-fit: cover;
	width: 100%;
	border-radius: var(--wp--custom--radius);
}

/* Artikkelin navigointi: pienet otsikkofontin nimiöt, otsikko alla. */
.psc-post-nav .wp-block-post-navigation-link {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	max-width: 45%;
}
.psc-post-nav .wp-block-post-navigation-link.has-text-align-right { text-align: right; }
.psc-post-nav .post-navigation-link__label {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--accent-dark);
}
.psc-post-nav .wp-block-post-navigation-link a {
	text-decoration: none;
	color: var(--wp--preset--color--contrast);
	font-weight: 600;
}
.psc-post-nav .wp-block-post-navigation-link a:hover { color: var(--wp--preset--color--accent-dark); text-decoration: underline; }

/* Listauskortit: pääkuva 3:2 kortin yläreunaan, koko kortti klikattava. */
.psc-card { position: relative; }
.psc-card .wp-block-post-featured-image {
	margin: calc(var(--wp--preset--spacing--40) * -1) calc(var(--wp--preset--spacing--40) * -1) var(--wp--preset--spacing--40);
}
.psc-card .wp-block-post-featured-image img {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	border-radius: var(--wp--custom--radius) var(--wp--custom--radius) 0 0;
}
.psc-card .wp-block-post-title a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}
.psc-card .wp-block-post-title a:hover { color: var(--wp--preset--color--accent-dark); }
.psc-card .wp-block-post-title a::after {
	content: "";
	position: absolute;
	inset: 0;
}
.psc-card:has(.wp-block-post-title a):hover { box-shadow: 0 12px 32px rgba(26, 29, 33, 0.14); }
/* Muut kortin linkit (kategoria, kuva) pysyvät klikattavina kattavan linkin päällä. */
.psc-card .wp-block-post-terms a,
.psc-card .wp-block-post-featured-image a,
.psc-card .wp-block-post-excerpt a {
	position: relative;
	z-index: 1;
}

/* Sivutus: pienet ääriviivapainikkeet, nykyinen sivu täytetty. */
.wp-block-query-pagination { margin-top: var(--wp--preset--spacing--50); }
.wp-block-query-pagination a,
.wp-block-query-pagination .page-numbers.current {
	display: inline-block;
	padding: 0.4rem 0.9rem;
	border: 1px solid var(--wp--preset--color--contrast);
	border-radius: var(--wp--custom--radius);
	font-family: var(--wp--preset--font-family--heading);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-size: var(--wp--preset--font-size--small);
	text-decoration: none;
	color: var(--wp--preset--color--contrast);
	line-height: 1.4;
}
.wp-block-query-pagination a:hover {
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
}
.wp-block-query-pagination .page-numbers.current {
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
}
.wp-block-query-pagination .page-numbers.dots { padding: 0.4rem 0.3rem; }

/* Etusivun rata-nosto: kuva pyöristetyin kulmin. */
.psc-rata-nosto .wp-block-media-text__media,
.psc-rata-nosto .wp-block-media-text__media img {
	border-radius: var(--wp--custom--radius);
}
.psc-rata-nosto .wp-block-media-text__media { overflow: hidden; }
.psc-rata-nosto .wp-block-media-text__media img { min-height: 280px; }

/* Etusivun Flexires-nosto: lisäosan oma sisäotsikko piiloon, otsikko tulee lohkosta. */
.psc-vapaat-vuorot .fr-na-title { display: none; }

/* Footer: Seura-lista ilman luoteja; Facebook-linkit allekkain nimiöineen. */
.psc-footer .wp-block-list { list-style: none; padding-left: 0; }
.psc-footer__social.wp-block-social-links { gap: 0.35rem; }
.psc-footer__social .wp-social-link a { padding: 0.25rem 0; }
.psc-footer__social .wp-block-social-link-label { font-size: var(--wp--preset--font-size--small); }

/* Mobiiliheader: logo, hampurilainen ja painike samalla rivillä. */
@media (max-width: 782px) {
	.psc-header .psc-header__inner {
		flex-wrap: nowrap;
		justify-content: space-between;
		gap: 0.5rem;
	}
	.psc-header .psc-header__actions {
		flex-wrap: nowrap;
		gap: 0.5rem;
	}
	.psc-header .wp-block-site-logo img { height: 40px; }
	.psc-header .psc-header__actions .wp-element-button {
		padding: 0.5rem 0.9rem;
		font-size: var(--wp--preset--font-size--small);
		white-space: nowrap;
	}
}