/**
 * Kilincscentrum – Alapréteg
 * =============================================================================
 * Szándékosan visszafogott réteg. Ebben a fejlesztési egységben a téma
 * aktiválása nem alakíthatja át a Blocksy meglévő oldalstruktúráját, ezért
 * itt nincs globális betűtípus-, szín- vagy elrendezésfelülírás.
 *
 * Amit ez a fájl vállal:
 * - kiszámítható dobozmodell,
 * - vízszintes scrollt okozó túlcsordulások megelőzése,
 * - eltávolíthatatlan, akadálymentes fókuszjelzés,
 * - prefers-reduced-motion tiszteletben tartása,
 * - tartalmi konténer és néhány akadálymentességi segédosztály.
 * =============================================================================
 */

/* -----------------------------------------------------------------------------
 * 1. DOBOZMODELL
 * -------------------------------------------------------------------------- */
*,
*::before,
*::after {
	box-sizing: border-box;
}

/* -----------------------------------------------------------------------------
 * 2. TÚLCSORDULÁS ELLENI ALAPOK (mobil-first)
 * Nem használunk overflow-x: hidden megoldást, mert az elrontja a ragadós
 * (sticky) elemeket. Helyette a tipikus túlcsordulási forrásokat kezeljük.
 * -------------------------------------------------------------------------- */
img,
video,
canvas,
svg,
iframe,
embed,
object {
	max-width: 100%;
}

img,
video {
	height: auto;
}

/* Hosszú termékkódok, URL-ek és e-mail címek nem feszíthetik szét a rácsot. */
body {
	overflow-wrap: break-word;
}

/* Rács- és flexgyerekek alapértelmezés szerint nem zsugorodnak a tartalmuk
 * alá; a saját komponenseinknél ezt feloldjuk. */
[class^="kc-"],
[class*=" kc-"] {
	min-width: 0;
}

/* Táblázat és kódblokk saját, vízszintes görgetésű dobozban maradjon. */
.kc-scroll-x {
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

/* -----------------------------------------------------------------------------
 * 3. FÓKUSZJELZÉS
 * Kötelező és nem eltávolítható. Ha egy külső stílus outline: none szabályt
 * ad, ezek a szabályok később töltődnek be, és visszaállítják a jelzést.
 * -------------------------------------------------------------------------- */
:focus-visible {
	outline: var(--kc-focus-ring-width) var(--kc-focus-ring-style) var(--kc-focus-ring-color);
	outline-offset: var(--kc-focus-ring-offset);
}

/* Régebbi böngészőkben, ahol nincs :focus-visible, marad a látható fókusz. */
@supports not selector(:focus-visible) {
	:focus {
		outline: var(--kc-focus-ring-width) var(--kc-focus-ring-style) var(--kc-focus-ring-color);
		outline-offset: var(--kc-focus-ring-offset);
	}
}

/* Sötét vagy telített hátterű felületeken világos kontrasztgyűrű. */
.kc-on-dark :focus-visible {
	outline-color: var(--kc-focus-ring-contrast);
}

/* Nagy kontrasztú módban a gyűrű a rendszerszínt kövesse. */
@media (forced-colors: active) {
	:focus-visible {
		outline-color: Highlight;
	}
}

/* -----------------------------------------------------------------------------
 * 4. MOZGÁSCSÖKKENTÉS
 * -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {

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

/* -----------------------------------------------------------------------------
 * 5. TARTALMI KONTÉNER
 * A projekt saját konténere. Nem cseréli le a Blocksy konténereit, csak a
 * saját komponensblokkjaink köré használjuk.
 * -------------------------------------------------------------------------- */
.kc-container {
	width: 100%;
	max-width: var(--kc-container-max);
	margin-inline: auto;
	padding-inline: var(--kc-container-gutter);
}

.kc-container--narrow {
	max-width: var(--kc-container-narrow);
}

.kc-container--wide {
	max-width: var(--kc-container-wide);
}

.kc-container--flush {
	padding-inline: 0;
}

/* Olvasható sorhossz szöveges blokkokhoz. */
.kc-measure {
	max-width: var(--kc-measure);
}

/* -----------------------------------------------------------------------------
 * 6. AKADÁLYMENTESSÉGI SEGÉDOSZTÁLYOK
 * -------------------------------------------------------------------------- */
.kc-visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* Billentyűzetes fókusznál a rejtett elem láthatóvá válhat. */
.kc-visually-hidden--focusable:focus,
.kc-visually-hidden--focusable:focus-visible {
	position: static;
	width: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	clip: auto;
	clip-path: none;
	white-space: normal;
}

/* Görgetészár nyitott dialógushoz vagy drawerhez. A JavaScript-viselkedést
 * későbbi fejlesztési egység adja hozzá; itt csak a kapcsolóosztály él. */
.kc-scroll-locked {
	overflow: hidden;
}