/*!
 * Lidaretto megamenu Product 1.0.0 (CSS), hlavička webu na všetkých stránkach.
 * Vzhľad 1:1 s editorom v2 (lidaretto-h32sx-v2, schválený klientom 24. 9. 2026), predloha
 * je hlavička V3 témy. Biely panel na celú šírku pod hlavičkou so žltou linkou hore, produkty
 * v jednom rade ako riadky s náhľadom, tenká pätka s jediným CTA. Otvára sa klikom, na
 * desktope aj ukázaním myšou. Značky: views/partials/_menu.twig, správanie: lidaretto-megamenu.js.
 *
 * Súbor sa načítava na každej stránke (MB_ThemeScripts), preto nesie vlastné hodnoty
 * (rovnaké ako tokeny kitu --lk-*) a nezávisí od lidaretto-kit.css. Všetko je pod .lk-mega-item.
 * Panel je position: fixed a jeho vrch = spodok hlavičky (--lk-mega-top, meria skript), takže
 * ho neoreže overflow menu na mobile a sedí pod hlavičkou prilepenou aj neprilepenou.
 */
.lk-mega-item {
	--lk-mega-ink: #0c142a;
	--lk-mega-yellow: #fbd220;
	--lk-mega-line: #e5e5e5;
	--lk-mega-soft: #444;
	--lk-mega-muted: #6b7280;
	--lk-mega-hover: #f4f4f4;
	--lk-mega-ease: cubic-bezier(.2, .65, .25, 1);
}

/* tlačidlo vyzerá ako ostatné položky menu témy (.header_wrapper .uk-navbar-nav > li > a) + šípka */
.lk-mega__toggle {
	appearance: none; display: flex; align-items: center; justify-content: center; gap: 8px;
	box-sizing: border-box; min-height: 80px; margin: 0; padding: 0 25px;
	border: 0; border-bottom: 3px solid transparent; border-radius: 0; background: none;
	font: inherit; font-family: Source Sans Pro, sans-serif; font-size: 16px; font-weight: 400; line-height: inherit;
	color: var(--lk-mega-ink); cursor: pointer; white-space: nowrap;
}
.lk-mega__toggle::after {
	content: ''; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
	transform: translateY(-2px) rotate(45deg); transition: transform .2s var(--lk-mega-ease);
}
.lk-mega-item:hover > .lk-mega__toggle, .lk-mega-item.is-open > .lk-mega__toggle, .lk-mega-item.uk-active > .lk-mega__toggle { border-bottom-color: var(--lk-mega-yellow); }
.lk-mega-item.uk-active > .lk-mega__toggle { font-weight: 600; }
.lk-mega-item.is-open > .lk-mega__toggle::after { transform: translateY(1px) rotate(-135deg); }
.lk-mega__toggle:focus-visible { outline: 2px solid var(--lk-mega-ink); outline-offset: -8px; border-radius: 6px; }

.lk-mega {
	position: fixed; left: 0; right: 0; top: var(--lk-mega-top, 81px); z-index: 1000;
	max-height: calc(100vh - var(--lk-mega-top, 81px)); overflow-y: auto;
	padding: 22px 0 0; background: #fff; border-top: 1px solid var(--lk-mega-line);
	box-shadow: 0 18px 40px -12px rgba(12, 20, 42, .18);
	opacity: 0; visibility: hidden; transform: translateY(-4px);
	transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s;
}
.lk-mega::before { content: ''; position: absolute; left: 0; right: 0; top: -1px; height: 3px; background: var(--lk-mega-yellow); }
.lk-mega-item.is-open .lk-mega { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
@media (hover: hover) and (min-width: 768px) {
	.lk-mega-item:hover .lk-mega { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
}

.lk-mega__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; list-style: none; margin: 0; padding: 0 0 18px; }
/* odkazy v menu témy majú na mobile .header_wrapper .uk-navbar-right a {padding: 0 10px} (0,2,1);
   položky a CTA megamenu preto nesú špecificitu (0,3,0) */
.lk-mega-item .lk-mega__grid .lk-mega__item {
	display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 14px; align-items: center; height: 100%;
	box-sizing: border-box; padding: 10px; border-radius: 6px; color: var(--lk-mega-ink); text-decoration: none;
	transition: background-color .2s ease;
}
.lk-mega-item .lk-mega__grid .lk-mega__item:hover, .lk-mega-item .lk-mega__grid .lk-mega__item:focus-visible, .lk-mega-item .lk-mega__grid .lk-mega__item[aria-current] { background: var(--lk-mega-hover); color: var(--lk-mega-ink); text-decoration: none; }
.lk-mega__item:focus-visible { outline: 2px solid var(--lk-mega-ink); outline-offset: 0; }
.lk-mega__item:active { transform: translateY(1px); }
.lk-mega__thumb {
	display: flex; align-items: center; justify-content: center; aspect-ratio: 4 / 3; box-sizing: border-box; padding: 4px;
	border: 1px solid var(--lk-mega-line); border-radius: 4px; background: #fff; overflow: hidden;
}
.lk-mega__thumb img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: contain; }
.lk-mega__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; line-height: 1.5; }
.lk-mega__title { font-size: 16px; font-weight: 700; line-height: 1.2; }
.lk-mega__new { display: inline-block; margin-left: 6px; padding: 0 6px; border-radius: 3px; background: var(--lk-mega-yellow); font-size: 11px; font-style: normal; font-weight: 700; line-height: 17px; vertical-align: 2px; }
.lk-mega__note { font-size: 14px; line-height: 1.35; color: var(--lk-mega-soft); }
.lk-mega__fact { margin-top: 2px; font-size: 13px; font-weight: 600; color: var(--lk-mega-muted); }
.lk-mega__foot { display: flex; align-items: center; gap: 24px; padding: 12px 10px; border-top: 1px solid var(--lk-mega-line); }
.lk-mega__foot a { font-size: 15px; font-weight: 600; line-height: 1.5; color: var(--lk-mega-ink); text-decoration: none; }
.lk-mega__foot a:focus-visible { outline: 2px solid var(--lk-mega-ink); outline-offset: 3px; }
.lk-mega-item .lk-mega__foot .lk-mega__cta { margin-left: auto; padding: 8px 22px; border-radius: 60px; background: var(--lk-mega-yellow); transition: box-shadow .2s ease; }
.lk-mega__foot .lk-mega__cta:hover { color: var(--lk-mega-ink); text-decoration: none; box-shadow: 0 6px 14px -6px rgba(12, 20, 42, .35); }
.lk-mega__foot .lk-mega__cta:active { transform: translateY(1px); }

@media (max-width: 1100px) { .lk-mega__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) {
	.lk-mega { padding-top: 8px; }
	.lk-mega__grid { grid-template-columns: 1fr; gap: 0; padding-bottom: 6px; }
	.lk-mega-item .lk-mega__grid .lk-mega__item { grid-template-columns: 64px minmax(0, 1fr); gap: 12px; padding: 8px 6px; }
	.lk-mega__fact { display: none; }
	.lk-mega__foot { flex-wrap: wrap; gap: 10px 20px; padding: 12px 6px 16px; }
	.lk-mega-item .lk-mega__foot .lk-mega__cta { margin-left: 0; }
}
/* mobil: položky menu témy majú 65 px a odsadenie 10 px (app.css, .header_wrapper pod 640 px) */
@media (max-width: 639px) {
	.lk-mega__toggle { min-height: 65px; padding: 0 10px; }
}
/* panel je vnorený v uk-container hlavičky a UIkit vnorenému kontajneru okraj nuluje
   (.uk-container .uk-container); vrátime okraje kontajnera, obsah panelu lícuje s logom */
.lk-mega > .uk-container { padding-left: 15px; padding-right: 15px; }
@media (min-width: 640px) { .lk-mega > .uk-container { padding-left: 30px; padding-right: 30px; } }
@media (min-width: 960px) { .lk-mega > .uk-container { padding-left: 40px; padding-right: 40px; } }

@media (prefers-reduced-motion: reduce) {
	.lk-mega, .lk-mega__toggle::after, .lk-mega__item, .lk-mega__foot .lk-mega__cta { transition: none; }
}