/**
 * NalepCar - sitewide štýly témy (footer, drobné opravy).
 * Načítava sa na každej stránke PO main.css.
 */

/* ── footer ──────────────────────────────────────────────────────────── */

.nal-footer {
	background: #14161a;
	color: rgba(255, 255, 255, .78);
	margin-top: 4rem;
	padding: 3.5rem 0 0;
}

.nal-footer a {
	color: #fff;
	text-decoration: none;
}

.nal-footer a:hover {
	color: var(--color-primary, #abcf0a);
}

.nal-footer__mriezka {
	display: grid;
	grid-template-columns: minmax(0, 4fr) minmax(0, 2fr) minmax(0, 2fr) minmax(0, 2fr);
	gap: 2.5rem;
	padding-bottom: 2.5rem;
}

.nal-footer__logo img {
	height: 44px;
	width: auto;
	display: block;
}

.nal-footer__logo--text {
	font-size: 1.5rem;
	font-weight: 800;
	letter-spacing: -.02em;
}

.nal-footer__slogan {
	margin: 1rem 0 0;
	max-width: 30em;
	line-height: 1.6;
	font-size: .9375rem;
}

.nal-footer__stlpec h3 {
	color: var(--color-primary, #abcf0a);
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	margin: 0 0 1rem;
}

.nal-footer__kontakty,
.nal-footer__menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: .55rem;
	font-size: .9375rem;
}

.nal-footer__menu a {
	display: inline-block;
}

.nal-footer__spodok {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: .5rem 1.5rem;
	border-top: 1px solid rgba(255, 255, 255, .12);
	padding: 1.25rem 0;
	font-size: .8125rem;
	color: rgba(255, 255, 255, .55);
}

.nal-footer__spodok p {
	margin: 0;
}

@media (max-width: 768px) {
	.nal-footer__mriezka {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.nal-footer {
		margin-top: 2.5rem;
		padding-top: 2.5rem;
	}
}

/* ── katalóg: chips filter + vyhľadávanie ────────────────────────────── */

.nal-chips {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin: 0 0 1.75rem;
}

.nal-chip {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	padding: .5rem 1rem;
	border: 1.5px solid var(--color-contrast-low, #d7dbe0);
	border-radius: 999px;
	font-size: .875rem;
	font-weight: 600;
	color: var(--color-contrast-higher, #14161a) !important;
	text-decoration: none;
	transition: border-color .12s ease, background .12s ease, color .12s ease;
}

.nal-chip:hover {
	border-color: var(--color-contrast-higher, #14161a);
}

.nal-chip--aktivny {
	background: var(--color-contrast-higher, #14161a);
	border-color: var(--color-contrast-higher, #14161a);
	color: #fff !important;
}

.nal-chip__pocet {
	font-size: .75rem;
	font-weight: 700;
	color: var(--color-primary, #abcf0a);
}

.nal-chip:not(.nal-chip--aktivny) .nal-chip__pocet {
	color: var(--color-contrast-medium, #6b7280);
}

/* toolbar: hľadanie + počet + radenie v jednom riadku */
.woocommerce-content-loop-header {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .75rem 1.25rem;
	margin-bottom: 1.5rem;
}

.nal-hladanie {
	display: flex;
	align-items: center;
	flex: 1 1 14rem;
	max-width: 22rem;
	border: 1.5px solid var(--color-contrast-low, #d7dbe0);
	border-radius: 999px;
	overflow: hidden;
	background: var(--color-bg, #fff);
}

.nal-hladanie input[type="search"] {
	flex: 1;
	min-width: 0;
	border: none;
	background: transparent;
	padding: .55rem 0 .55rem 1rem;
	font-size: .9375rem;
}

.nal-hladanie input[type="search"]:focus {
	outline: none;
}

.nal-hladanie:focus-within {
	border-color: var(--color-contrast-higher, #14161a);
}

.nal-hladanie button {
	border: none;
	background: transparent;
	padding: .55rem .9rem;
	cursor: pointer;
	color: var(--color-contrast-medium, #6b7280);
	display: grid;
	place-items: center;
}

.nal-hladanie button:hover {
	color: var(--color-contrast-higher, #14161a);
}

@media (max-width: 600px) {
	.nal-chips {
		/* na mobile jeden posuvný riadok namiesto zalamovania */
		flex-wrap: nowrap;
		overflow-x: auto;
		padding-bottom: .375rem;
		margin-left: -15px;
		margin-right: -15px;
		padding-left: 15px;
		padding-right: 15px;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.nal-chips::-webkit-scrollbar {
		display: none;
	}

	.nal-chip {
		flex: none;
	}
}

/* druhý riadok chips - štítky (menšie, tlmenejšie) */
.nal-chips--stitky {
	margin-top: -1rem;
}

.nal-chip--maly {
	padding: .3rem .75rem;
	font-size: .8125rem;
	font-weight: 500;
	border-width: 1px;
	color: var(--color-contrast-medium, #6b7280) !important;
}

.nal-chip--maly.nal-chip--aktivny {
	color: #fff !important;
	font-weight: 600;
}

/* ── hlavné menu: desktop = 4 položky ako hero buttony, mobil = plný zoznam ──
   Položky s triedou nal-len-mobil (nastavené v Vzhľad › Menu) sa od
   desktopového breakpointu témy (1024 px) skryjú - nech header nie je busy. */

@media (min-width: 1024px) {
	.main-header__nav .nal-len-mobil {
		display: none !important;
	}
}

/* ── väčšie logo v hlavičke (pôvodných 50 px pôsobilo stratene) ─────── */

.main-header__logo img {
	height: 72px !important;
	width: auto !important;
	max-height: none;
}

@media (max-width: 767px) {
	.main-header__logo img {
		height: 56px !important;
	}
}

/* ── badge upraviteľných produktov (S menom / Tvoj text) ────────────── */

.ms-product-media,
.nal-produkt__obrazok {
	position: relative;
}

.nk-badge-uprav {
	position: absolute;
	top: .6rem;
	left: .6rem;
	z-index: 3;
	padding: .22em .7em;
	border-radius: 999px;
	background: var(--color-primary, #abcf0a);
	color: #14161a;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .02em;
	pointer-events: none;
}

/* ── vyhľadávací modal (produkty, živé výsledky) ────────────────────── */

.header__search--inner { max-width: 46rem; width: 100%; }

.nal-modal-kicker {
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--color-primary, #abcf0a);
	margin-bottom: .25rem;
}

.nal-modal-nadpis { font-size: 2rem; font-weight: 800; margin: 0 0 1.1rem; color: var(--color-contrast-higher, #101114); }

.nal-modal-form { display: flex; gap: .5rem; }

.nal-modal-form input[type="search"] {
	flex: 1;
	font-size: 1.1rem;
	padding: .85em 1.1em;
	border: 2px solid var(--color-contrast-higher, #111);
	border-radius: 14px;
	background: var(--color-bg, #fff);
	color: inherit;
}

.nal-modal-form input[type="search"]:focus { outline: none; box-shadow: 0 0 0 .2em rgba(171, 207, 10, .35); }

.nal-modal-form button {
	padding: 0 1.4em;
	border: none;
	border-radius: 14px;
	background: var(--color-primary, #abcf0a);
	color: #14161a;
	font-weight: 800;
	cursor: pointer;
}

.nal-modal-vysledky { margin-top: 1.25rem; }

.nal-modal-mriezka {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: .75rem;
}

@media (max-width: 767px) {
	.nal-modal-mriezka { grid-template-columns: repeat(2, 1fr); }
}

.nal-modal-vysledok { display: block; text-decoration: none; color: inherit; }
.nal-modal-vysledok img { width: 100%; border-radius: 12px; display: block; margin-bottom: .35rem; }
.nal-modal-vysledok .nazov { display: block; font-size: .8rem; font-weight: 600; line-height: 1.25; }
.nal-modal-vysledok .cena { display: block; font-size: .75rem; color: var(--color-contrast-medium, #6b7280); }
.nal-modal-vysledok:hover .nazov { text-decoration: underline; }

.nal-modal-vsetky {
	display: inline-block;
	margin-top: 1rem;
	font-weight: 700;
	color: inherit;
}

.nal-modal-nic { color: var(--color-contrast-medium, #6b7280); }

.nal-modal-napoveda { margin-top: 1.25rem; }
.nal-modal-tip { font-size: .8rem; color: var(--color-contrast-medium, #6b7280); margin-bottom: .5rem; }
.nal-modal-chipy { display: flex; flex-wrap: wrap; gap: .5rem; }
.nal-modal-chipy a {
	padding: .35em .9em;
	border: 1.5px solid var(--color-contrast-low, #d7dbe0);
	border-radius: 999px;
	text-decoration: none;
	color: inherit;
	font-size: .875rem;
}
.nal-modal-chipy a:hover { border-color: var(--color-contrast-higher, #111); }

/* ── hlava katalógu (obchod/kategórie/štítky/hľadanie) ──────────────── */

.nal-shop-hlava {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 1rem 2rem;
	padding: 2.25rem 0 1.25rem;
}

.nal-shop-hlava h1 {
	font-size: clamp(1.9rem, 4vw, 2.8rem);
	font-weight: 800;
	line-height: 1.05;
	margin: 0 0 .3rem;
}

.nal-shop-pocet {
	margin: 0;
	color: var(--color-contrast-medium, #6b7280);
	font-size: .95rem;
}

.nal-hladanie--hlava {
	flex: 0 1 24rem;
	min-width: 16rem;
}

/* kategórie: jeden skrolovateľný pás namiesto steny pilúl */
.nal-filter {
	display: flex;
	align-items: center;
	gap: .75rem;
	margin-bottom: .75rem;
}

.nal-chips-pas {
	display: flex;
	gap: .5rem;
	overflow-x: auto;
	flex: 1;
	min-width: 0;
	padding-bottom: .35rem;
	scrollbar-width: thin;
	-webkit-mask-image: linear-gradient(90deg, #000 92%, transparent);
	mask-image: linear-gradient(90deg, #000 92%, transparent);
}

.nal-chips-pas .nal-chip {
	flex: none;
	white-space: nowrap;
}

.nal-temy-prepinac {
	flex: none;
	padding: .5em 1em;
	border: 1.5px solid var(--color-contrast-low, #d7dbe0);
	border-radius: 999px;
	background: var(--color-bg, #fff);
	font: inherit;
	font-size: .9rem;
	font-weight: 600;
	cursor: pointer;
	color: inherit;
}

.nal-temy-prepinac.je-otvorene,
.nal-temy-prepinac:hover {
	border-color: var(--color-contrast-higher, #111);
}

.nal-temy-prepinac.je-otvorene span { display: inline-block; transform: rotate(180deg); }

.nal-chips--stitky[data-nal-temy] { margin-bottom: 1rem; }

/* poistka: resety témy vedia prebiť [hidden] na flex blokoch */
.nal-chips--stitky[hidden],
.nal-modal-vysledky[hidden],
.nal-modal-napoveda[hidden] { display: none !important; }

/* tiahlo pásu kategórií v brand limetke - vyzerá ako zámer a pozýva ťahať */
.nal-chips-pas {
	scrollbar-color: var(--color-primary, #abcf0a) transparent;
}

.nal-chips-pas::-webkit-scrollbar {
	height: 6px;
}

.nal-chips-pas::-webkit-scrollbar-track {
	background: transparent;
}

.nal-chips-pas::-webkit-scrollbar-thumb {
	background: var(--color-primary, #abcf0a);
	border-radius: 999px;
}

/* právne odkazy v spodnom riadku pätičky */
.nal-footer__pravne {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem 1.5rem;
}

.nal-footer__pravne a {
	color: rgba(255, 255, 255, .55);
	text-decoration: none;
}

.nal-footer__pravne a:hover {
	color: #fff;
	text-decoration: underline;
}

@media (max-width: 992px) {
	.nal-footer__mriezka {
		grid-template-columns: 1fr 1fr;
	}
	.nal-footer__znacka { grid-column: 1 / -1; }
}

/* ── breadcrumbs: limetkové odkazy na bielom nemajú kontrast - tmavšia limetka (WCAG AA) ── */
.ms-page-title__breadcrumbs a,
.woocommerce-breadcrumb a {
	color: #5f7800 !important;
}

/* ── mobil: position:fixed musí držať pri spodku ─────────────────────────
   Téma Most má html{overflow-x:hidden} + body{height:100vh}. Mobilné Safari
   (a časť Androidov) pri tom prestane brať viewport ako kontajner pre
   position:fixed a sticky panel akcie „pláva“ uprostred stránky.
   overflow-x:clip nevytvára scroll kontajner a body s min-height namiesto
   pevnej výšky zachová flex layout (pätička dole) aj správne fixed. */
html {
	overflow-x: clip;
}

/* overflow-x:clip na <html> sa (na rozdiel od hidden) neprenáša na viewport,
   takže bootstrapový .row so zápornými okrajmi rozšíril dokument o ~20 px a
   mobilný prehliadač celú stránku posunul/oddialil (katalóg „natlačený na
   stranu“). Orezávame preto priamo obsahové obaly - clip nevytvára scroll
   kontajner, sticky/fixed prvky ostávajú v poriadku. */
main.ms-main,
.nal-footer {
	overflow-x: clip;
}

body {
	height: auto !important;
	min-height: 100vh;
	min-height: 100dvh;
}