/**
 * AhojNet Smart Akordeón – frontend štýly.
 *
 * Rozloženie je grid o dvoch stĺpcoch (zoznam + sidebar); poradie aj šírky
 * riadi Elementor cez premenné na obale. Otváranie akordeónu je animácia grid
 * riadkov (0fr -> 1fr): výška vychádza z reálneho obsahu, takže neskôr
 * načítané obrázky animáciu nerozbijú a nič sa nemeria v JS.
 */

/* --------------------------------------------------------------------------
   Obal – dva stĺpce
   -------------------------------------------------------------------------- */
.ahn-smart {
	--ahn-list-width: 40%;
	--ahn-list-order: 1;
	--ahn-sb-order: 2;
	--ahn-gap: 8px;
	--ahn-dur: 320ms;
	--ahn-icon-size: 20px;
	--ahn-icon-gap: 12px;
	--ahn-ind-size: 16px;
	--ahn-link-gap: 2px;
	--ahn-link-indent: 8px;
	--ahn-link-icon-size: 14px;
	--ahn-licon-scale: 1;
	--ahn-licon-shift: 0px;
	--ahn-licon-tx: 0px;
	--ahn-licon-ty: 0px;
	--ahn-licon-dur: 200ms;
	--ahn-note-gap: 10px;
	--ahn-note-max: 260px;
	--ahn-note-dur: 180ms;
	--ahn-sb-offset: 24px;
	--ahn-sb-user: 0px;
	--ahn-sb-auto: 0px;

	display: grid;
	grid-template-columns: var(--ahn-list-width) minmax(0, 1fr);
	gap: 32px;
	align-items: start;
	width: 100%;
}

.ahn-smart__list {
	order: var(--ahn-list-order);
	display: flex;
	flex-direction: column;
	gap: var(--ahn-gap);
	min-width: 0;
}

/* Vypnutý vstavaný sidebar. Ovládač polohy sidebaru je v tomto režime skrytý,
   takže Elementor pre neho negeneruje žiadne CSS – mriežku určuje výhradne
   toto pravidlo a nemá ho čo prebiť. */
.ahn-smart--nosidebar {
	grid-template-columns: minmax(0, 1fr);
}

.ahn-smart__sidebar {
	order: var(--ahn-sb-order);
	position: relative;
	min-width: 0;
	/* Vyššia z dvoch hodnôt: vlastná minimálna výška z ovládača a výška
	   najvyššieho panelu, ktorú do premennej zapisuje JS. Bez max() by jedna
	   prebíjala druhú podľa špecificity a poradia pravidiel. */
	min-height: max(var(--ahn-sb-user, 0px), var(--ahn-sb-auto, 0px));
}

.ahn-smart__sidebar--sticky {
	position: sticky;
	top: var(--ahn-sb-offset);
}

/* --------------------------------------------------------------------------
   Položka a lišta akordeónu
   -------------------------------------------------------------------------- */
.ahn-smart__item {
	min-width: 0;
}

.ahn-smart__bar {
	display: flex;
	align-items: center;
	gap: var(--ahn-icon-gap);
	width: 100%;
	margin: 0;
	padding: 16px 20px;
	font: inherit;
	color: inherit;
	text-align: start;
	background: none;
	border: 0;
	cursor: pointer;
	transition: background-color var(--ahn-dur) ease, color var(--ahn-dur) ease,
		border-color var(--ahn-dur) ease, box-shadow var(--ahn-dur) ease;
}

.ahn-smart__bar:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

.ahn-smart__texts {
	display: flex;
	flex-direction: column;
	gap: 2px;
	flex: 1 1 auto;
	min-width: 0;
}

.ahn-smart__title {
	margin: 0;
	font-size: inherit;
	line-height: 1.3;
}

.ahn-smart__subtitle {
	display: block;
	opacity: 0.75;
	font-size: 0.85em;
	line-height: 1.35;
}

/* --------------------------------------------------------------------------
   Obsah pod lištou (HTML/editor + vnorený zoznam)
   -------------------------------------------------------------------------- */
.ahn-smart__content {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows var(--ahn-dur) ease;
}

.ahn-smart__item.is-open > .ahn-smart__content {
	grid-template-rows: 1fr;
}

.ahn-smart__content > .ahn-smart__content-inner {
	overflow: hidden;
	min-height: 0;
}

/* Orezanie je nutné len počas otvárania a zatvárania – bez neho by obsah
   z animovaného riadku mriežky vytekal. Keď je položka otvorená a animácia
   dobehla, orezanie sa pustí, aby poznámka mohla prečnievať mimo stĺpca.
   Triedu is-settled pridáva JS po dobehnutí prechodu. */
.ahn-smart__item.is-open.is-settled > .ahn-smart__content > .ahn-smart__content-inner {
	overflow: visible;
}

/* Prehliadače bez animovateľných grid riadkov: bez animácie, ale funkčné. */
@supports not (grid-template-rows: 0fr) {
	.ahn-smart__content {
		display: none;
	}
	.ahn-smart__item.is-open > .ahn-smart__content {
		display: block;
	}
}

.ahn-smart__html > *:first-child {
	margin-top: 0;
}

.ahn-smart__html > *:last-child {
	margin-bottom: 0;
}

.ahn-smart__html + .ahn-smart__links {
	margin-top: 12px;
}

/* --------------------------------------------------------------------------
   Vnorený zoznam odkazov s ikonami
   -------------------------------------------------------------------------- */
.ahn-smart__links {
	display: flex;
	flex-direction: column;
	gap: var(--ahn-link-gap);
	margin: 0;
	padding: 0 0 0 var(--ahn-link-indent);
	list-style: none;
}

/* Zoznam bez nadradeného akordeónu (odkazy pred prvým nadpisom). */
.ahn-smart__links--loose {
	padding-left: 0;
}

.ahn-smart__link-item {
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
	min-width: 0;
}

.ahn-smart__link {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	margin: 0;
	padding: 8px 12px;
	font: inherit;
	color: inherit;
	text-align: start;
	text-decoration: none;
	background: none;
	border: 0;
	cursor: pointer;
	transition: background-color var(--ahn-dur) ease, color var(--ahn-dur) ease,
		border-color var(--ahn-dur) ease, transform var(--ahn-dur) ease;
}

.ahn-smart__link:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

.ahn-smart__link-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	font-size: var(--ahn-link-icon-size);
	line-height: 1;
	transition: transform var(--ahn-licon-dur) ease, color var(--ahn-dur) ease;
}

.ahn-smart__link-icon svg,
.ahn-smart__link-icon i {
	width: 1em;
	height: 1em;
	font-size: inherit;
}

/* Vlastné ikony sa vyfarbujú výplňou a preberajú farbu ikony. Vstavaná šípka
   je z pravidla vyňatá – je kreslená ťahom a má fill="none". CSS prebíja
   prezentačný atribút, takže bez výnimky by sa vyfarbila do plochy. */
.ahn-smart__link-icon svg:not(.ahn-smart__arrow) {
	fill: currentColor;
}

/* --------------------------------------------------------------------------
   Mikroanimácia ikony
   Hýbe sa len ikona vo vlastnom obale, nie odkaz – text tak ostáva na mieste
   a riadok nemení výšku ani šírku.
   -------------------------------------------------------------------------- */
.ahn-smart--licon .ahn-smart__link:hover .ahn-smart__link-icon,
.ahn-smart--licon .ahn-smart__link:focus-visible .ahn-smart__link-icon {
	transform: translate(var(--ahn-licon-tx), var(--ahn-licon-ty)) scale(var(--ahn-licon-scale));
}

.ahn-smart--licon.ahn-smart--licon-hold .ahn-smart__link.is-active .ahn-smart__link-icon {
	transform: translate(var(--ahn-licon-tx), var(--ahn-licon-ty)) scale(var(--ahn-licon-scale));
}

.ahn-smart__link-text {
	min-width: 0;
	line-height: 1.35;
}

/* --------------------------------------------------------------------------
   Poznámka k odkazu
   Absolútne pozicovaná, takže riadok nemení rozmery. Odkaz bez poznámky
   nemá tento prvok vôbec – v DOM po ňom nezostane ani stopa.
   -------------------------------------------------------------------------- */
.ahn-smart__link-note {
	position: absolute;
	z-index: 5;
	width: max-content;
	max-width: var(--ahn-note-max);
	padding: 8px 12px;
	border-radius: 6px;
	font-size: 0.85em;
	line-height: 1.4;
	text-align: start;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity var(--ahn-note-dur) ease, visibility var(--ahn-note-dur) ease;

	/* Predvolená poloha: vpravo od odkazu. Ovládač polohy ju prepíše. */
	inset-inline-start: 100%;
	top: 50%;
	transform: translateY(-50%);
	margin-inline-start: var(--ahn-note-gap);

	/* Podklad, aby bola čitateľná aj bez nastavenia štýlu. */
	color: #fff;
	background: #2c2f34;
}

/* Zobrazuje sa pri prejdení myšou aj pri fokuse klávesnicou. */
.ahn-smart__link:hover ~ .ahn-smart__link-note,
.ahn-smart__link:focus-visible ~ .ahn-smart__link-note {
	opacity: 1;
	visibility: visible;
}

/* --------------------------------------------------------------------------
   Ikona a indikátor lišty
   -------------------------------------------------------------------------- */
.ahn-smart__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	font-size: var(--ahn-icon-size);
	line-height: 1;
	transition: color var(--ahn-dur) ease;
}

.ahn-smart__icon svg,
.ahn-smart__icon i {
	width: 1em;
	height: 1em;
	font-size: inherit;
}

.ahn-smart__indicator {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	margin-inline-start: auto;
	font-size: var(--ahn-ind-size);
	line-height: 1;
	transition: transform var(--ahn-dur) ease, color var(--ahn-dur) ease;
}

.ahn-smart__indicator svg,
.ahn-smart__indicator i {
	width: 1em;
	height: 1em;
	font-size: inherit;
}

.ahn-smart__item.is-open .ahn-smart__indicator--rotate {
	transform: rotate(180deg);
}

/* --------------------------------------------------------------------------
   Panely sidebaru
   Neaktívne panely sa neschovávajú cez display:none – panel by tým prišiel
   o vlastné nastavenie zobrazenia (napr. grid vo vlastnom HTML). Namiesto toho
   sa vyberú z toku absolútnym pozicovaním, takže výšku sidebaru určuje len
   práve zobrazený panel.
   -------------------------------------------------------------------------- */
.ahn-smart__panel {
	position: absolute;
	inset: 0 0 auto 0;
	min-width: 0;
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
}

/* Prepnutie panelu je zámerne okamžité, bez animácie. Pri hoveri po zozname
   odkazov sa panel mení niekoľkokrát za sekundu a každé prerolovanie pôsobí
   rušivo. Pokoj v pravom stĺpci je tu cennejší než efekt. */
.ahn-smart__panel.is-active {
	position: relative;
	inset: auto;
	visibility: visible;
	opacity: 1;
	pointer-events: auto;
}

.ahn-smart__panel > *:first-child {
	margin-top: 0;
}

.ahn-smart__panel > *:last-child {
	margin-bottom: 0;
}

/* --------------------------------------------------------------------------
   Editor – všetko otvorené a viditeľné, aby sa dal upraviť obsah.
   Triedu pridáva server v režime úprav.
   -------------------------------------------------------------------------- */
.ahn-smart.ahn-is-editor .ahn-smart__content {
	grid-template-rows: 1fr;
}

.ahn-smart.ahn-is-editor .ahn-smart__content-inner {
	overflow: visible;
}

.ahn-smart.ahn-is-editor .ahn-smart__panel {
	position: relative;
	inset: auto;
	visibility: visible;
	opacity: 1;
	pointer-events: auto;
	margin-bottom: 8px;
	outline: 1px dashed rgba(105, 114, 126, 0.4);
	outline-offset: 2px;
}

/* Poznámka pre editor – na frontende sa nikdy nevykresľuje. */
.ahn-editor-note {
	margin: 0 0 10px;
	padding: 8px 12px;
	font-size: 12px;
	line-height: 1.45;
	color: #515962;
	background: #f1f2f3;
	border-inline-start: 3px solid #a4afb7;
	border-radius: 3px;
}

.ahn-editor-note--warn {
	color: #7a4b00;
	background: #fff4e0;
	border-inline-start-color: #e5a33d;
}

/* --------------------------------------------------------------------------
   Widget Akordeón info
   -------------------------------------------------------------------------- */
.ahn-info {
	--ahn-info-gap: 6px;
	--ahn-info-dur: 220ms;
	--ahn-info-shift: 6px;
}

.ahn-info__inner {
	display: flex;
	flex-direction: column;
	gap: var(--ahn-info-gap);
}

/* Prázdny nadpis alebo popis sa skrýva atribútom hidden, nie triedou –
   prehliadač ho vynechá aj z prístupnostného stromu. Pravidlo je nutné, lebo
   display: flex na rodičovi by inak hidden prebilo. */
.ahn-info__title[hidden],
.ahn-info__note[hidden] {
	display: none;
}

.ahn-info__title {
	margin: 0;
}

.ahn-info__note > br:last-child {
	display: none;
}

/* Prehrá sa až pri zmene obsahu; úvodné vykreslenie zo servera triedu nemá. */
.ahn-info__inner.is-in {
	animation: ahn-info-in var(--ahn-info-dur) ease both;
}

@keyframes ahn-info-in {
	from {
		opacity: 0;
		transform: translateY(var(--ahn-info-shift));
	}
	to {
		opacity: 1;
		transform: none;
	}
}

/* --------------------------------------------------------------------------
   Slogan kampane v Akordeón Info

   Objaví sa až po oneskorení, pod poznámkou. Zámerne nie je odkaz – kurzor
   už stojí na cieli a ťahať ho inam je zbytočný pohyb.
   -------------------------------------------------------------------------- */
.ahn-info__campaign {
	margin-top: var(--ahn-info-gap);
}

/* Skrytie atribútom hidden – prehliadač ho vynechá aj z prístupnostného
   stromu. Pravidlo je nutné, lebo flex na rodičovi by hidden prebilo. */
.ahn-info__campaign[hidden] {
	display: none;
}

.ahn-info__campaign:not([hidden]) {
	animation: ahn-info-in var(--ahn-info-dur) ease both;
}

/* --------------------------------------------------------------------------
   Smart Offer Baner
   -------------------------------------------------------------------------- */
.ahn-offer__slot > *:first-child {
	margin-top: 0;
}

.ahn-offer__slot > *:last-child {
	margin-bottom: 0;
}

/* Klikateľná plocha celého baneru. Kurzor nesie informáciu, že sa dá kliknúť –
   bez neho by to návštevník nezistil, kým to neskúsi. */
.ahn-offer--clickable {
	cursor: pointer;
}

/* --------------------------------------------------------------------------
   Malý baner v Akordeón Info

   Rovnaké pravidlá ako slogan: objaví sa až po oneskorení a nie je klikateľný.
   -------------------------------------------------------------------------- */
.ahn-info__banner {
	margin-top: var(--ahn-info-gap);
}

.ahn-info__banner[hidden] {
	display: none;
}

.ahn-info__banner:not([hidden]) {
	animation: ahn-info-in var(--ahn-info-dur) ease both;
}

.ahn-info__banner > *:first-child { margin-top: 0; }
.ahn-info__banner > *:last-child { margin-bottom: 0; }

/* Obrázky v úzkom ľavom stĺpci mega menu musia ustúpiť, nie pretiecť. */
.ahn-info__banner img {
	max-width: 100%;
	height: auto;
}

/* Baner a CTA sú dva samostatné bloky pod sebou, nie plávajúci prvok. Obsah
   kampane je cudzí (šablóna, shortcode, HTML) a nedá sa naň spoľahnúť pri
   pozíciovaní – absolútne umiestnenie tlačidla by sa pri každej kampani
   trafilo inam. Zarovnanie riadi ovládač Zarovnanie na widgete. */
.ahn-offer {
	display: flex;
	flex-direction: column;
	align-items: stretch;
}

.ahn-offer__slot {
	min-width: 0;
}

/* Obal tlačidla nesie zarovnanie; samotné tlačidlo si drží vlastnú šírku,
   inak by sa roztiahlo na celý stĺpec. */
.ahn-offer__actions {
	display: flex;
	margin-top: 14px;
}

.ahn-offer[style*="center"] .ahn-offer__actions,
.ahn-offer--cta-center .ahn-offer__actions { justify-content: center; }

.ahn-offer--cta-end .ahn-offer__actions { justify-content: flex-end; }

.ahn-offer__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 24px;
	text-decoration: none;
	line-height: 1.2;
	border-radius: 4px;
	background: #1e1e1e;
	color: #fff;
	transition: opacity 150ms ease;
}

.ahn-offer__cta:hover,
.ahn-offer__cta:focus {
	opacity: .85;
	text-decoration: none;
}

/* Obsah kampane je cudzí – vlastné HTML, shortcode alebo Elementor šablóna.
   Preto sa mu tu nič nediktuje okrem odstupov; vzhľad patrí do zdroja. */

/* --------------------------------------------------------------------------
   Prístupnosť – rešpektovanie zníženej pohyblivosti
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.ahn-info__inner.is-in {
		animation-duration: 1ms;
	}

	.ahn-info__campaign:not([hidden]) {
		animation-duration: 1ms;
	}

	.ahn-info__banner:not([hidden]) {
		animation-duration: 1ms;
	}

	.ahn-smart__content,
	.ahn-smart__bar,
	.ahn-smart__link,
	.ahn-smart__link-icon,
	.ahn-smart__link-note,
	.ahn-smart__icon,
	.ahn-smart__indicator {
		transition-duration: 1ms;
	}
}