/* ============================================================================
   assets/css/footer.css — lucide-sk
   ----------------------------------------------------------------------------
   Enqueue: wp_enqueue_scripts (functions.php → lucide_sk_enqueue_front),
   závislosť `lucide-sk-tokens`. Načíta sa na KAŽDEJ stránke front-endu.

   Kontrakt s markupom (parts/footer.html):
     .lu-footer            core/group, alignfull, pozadie footer-black
     .lu-footer__top       core/columns — blok A (25 %) + blok B (75 %)
     .lu-footer__brand     identifikácia predajcu (JOGISE, s. r. o.)
     .lu-footer__seller / __contact / __social / __trust
     .lu-footer__links     obal 5 skupín odkazov
     .lu-footer__group     jedna skupina, .lu-footer__group--b2b = „Pre firmy“
     .lu-footer__title / __list / __wholesale
     .lu-footer__seo       core/details (SEO akordeón)
     .lu-footer__rule      core/separator
     .lu-footer__legal     právny pás

   Mobile-first: 2 stĺpce odkazov → 3 od 600 px → 5 od 1200 px.
   Farby výhradne z tokens.css. Odkazy v pätke NESMÚ zostať na globálnej
   modrej --lu-blue-dark (na čiernej má len 3,05:1) — preto biela a --lu-line.
   ========================================================================== */

/* ============================================================================
   1. RÁM PÄTKY
   ----------------------------------------------------------------------------
   Template part nie je .has-global-padding, takže `alignfull` vnútri neho
   nedostane od jadra záporné okraje. Vyrobíme ich presným zrušením root
   paddingu; obsah sa potom centruje na --lu-container rovnako ako hlavička.
   ========================================================================== */
.lu-footer {
	margin-inline: calc(-1 * var(--lu-gutter));
	padding-inline: max(var(--lu-gutter), calc((100% - var(--lu-container)) / 2));
	color: var(--lu-white);
}

.lu-footer > .alignwide,
.lu-footer > .alignfull {
	max-width: none;
	margin-inline: 0;
}

/* ============================================================================
   2. HORNÁ ČASŤ — blok A (predajca) + blok B (odkazy)
   ========================================================================== */
.lu-footer .lu-footer__top {
	flex-wrap: wrap;
	column-gap: var(--lu-sp-40);
	row-gap: var(--lu-sp-40);
	margin-block-end: var(--lu-sp-40);
}

.lu-footer .lu-footer__top > .wp-block-column {
	min-inline-size: 0;
}

/* ---- blok A: identifikácia predajcu --------------------------------------- */
.lu-footer .lu-footer__brand {
	display: flex;
	flex-direction: column;
	gap: var(--lu-sp-15);
}

.lu-footer .lu-footer__logo {
	margin: 0;
	max-inline-size: 170px;
}

.lu-footer .lu-footer__logo img {
	max-inline-size: 100%;
	block-size: auto;
}

.lu-footer .lu-footer__seller,
.lu-footer .lu-footer__contact {
	margin: 0;
	color: var(--lu-line); /* #ccc na čiernej ≈ 13:1 */
	line-height: var(--lu-lh-base);
}

.lu-footer .lu-footer__seller strong {
	display: inline-block;
	margin-block-end: var(--lu-sp-5);
	color: var(--lu-white);
	font-weight: var(--lu-fw-medium);
	letter-spacing: var(--lu-ls-caps);
	text-transform: uppercase;
	font-size: var(--lu-fs-sm);
}

.lu-footer .lu-footer__contact a {
	color: var(--lu-white);
	font-weight: var(--lu-fw-medium);
}

.lu-footer .lu-footer__social {
	margin: 0;
	gap: var(--lu-sp-10);
}

.lu-footer .lu-footer__social .wp-social-link {
	margin: 0;
}

.lu-footer .lu-footer__trust {
	margin: 0;
	color: var(--lu-cream);
	line-height: 1.9;
}

/* ---- blok B: 5 skupín odkazov -------------------------------------------- */
.lu-footer .lu-footer__links {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: var(--lu-sp-20);
	row-gap: var(--lu-sp-30);
}

.lu-footer .lu-footer__group {
	min-inline-size: 0;
}

.lu-footer .lu-footer__title {
	margin-block: 0 var(--lu-sp-15);
	color: var(--lu-white);
	font-family: var(--lu-font-body);
	font-size: var(--lu-fs-md-plus);
	font-weight: var(--lu-fw-medium);
	line-height: var(--lu-lh-tight);
}

.lu-footer .lu-footer__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.lu-footer .lu-footer__list li {
	margin-block-end: var(--lu-sp-10);
	font-size: var(--lu-fs-sm-plus);
	line-height: 1.4;
}

.lu-footer .lu-footer__list a {
	color: var(--lu-line);
	text-decoration: none;
}

.lu-footer .lu-footer__list a:hover,
.lu-footer .lu-footer__list a:focus-visible {
	color: var(--lu-white);
	text-decoration: underline;
}

/* ---- odkaz na vlastný veľkoobchod (lucide2b.eu) --------------------------- */
.lu-footer .lu-footer__wholesale {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--lu-cream);
	font-weight: var(--lu-fw-medium);
}

.lu-footer .lu-footer__wholesale::after {
	content: "↗";
	font-size: var(--lu-fs-xs);
}

.lu-footer .lu-footer__wholesale:hover,
.lu-footer .lu-footer__wholesale:focus-visible {
	color: var(--lu-white);
}

/* ============================================================================
   3. SEO AKORDEÓN, DELIACA LINKA A PRÁVNY PÁS
   ========================================================================== */
.lu-footer .lu-footer__seo {
	max-width: none;
	margin-block: var(--lu-sp-30) 0;
	color: var(--lu-line);
}

.lu-footer .lu-footer__seo > summary {
	padding-block: var(--lu-sp-10);
	color: var(--lu-white);
	font-weight: var(--lu-fw-medium);
	letter-spacing: var(--lu-ls-caps);
	text-transform: uppercase;
	cursor: pointer;
}

.lu-footer .lu-footer__seo p {
	margin-block: var(--lu-sp-10) 0;
	line-height: var(--lu-lh-base);
}

.lu-footer .lu-footer__rule {
	max-width: none;
	margin-block: var(--lu-sp-30) var(--lu-sp-20);
	border-block-end-width: 1px;
	color: var(--lu-ink-muted);
	opacity: 1;
}

.lu-footer .lu-footer__legal {
	margin: 0;
	color: var(--lu-line);
	line-height: 2;
}

.lu-footer .lu-footer__legal a {
	color: var(--lu-line);
	text-decoration: none;
	white-space: nowrap;
}

.lu-footer .lu-footer__legal a:hover,
.lu-footer .lu-footer__legal a:focus-visible {
	color: var(--lu-white);
	text-decoration: underline;
}

/* ============================================================================
   4. RESPONZÍVNE ZBALENIE
   ----------------------------------------------------------------------------
   Jadro láme core/columns na 781 px; nad ňou už blok A drží 25 % a blok B
   75 %, preto sa skupiny odkazov rozťahujú v troch a napokon v piatich
   stĺpcoch. „Pre firmy“ dostane od 1200 px vlastnú deliacu linku.
   ========================================================================== */
@media (min-width: 600px) {
	.lu-footer .lu-footer__links {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (min-width: 782px) {
	.lu-footer .lu-footer__brand {
		gap: var(--lu-sp-20);
	}
}

@media (min-width: 1200px) {
	.lu-footer .lu-footer__links {
		grid-template-columns: repeat(5, minmax(0, 1fr));
		column-gap: var(--lu-sp-30);
	}

	.lu-footer .lu-footer__group--b2b {
		padding-inline-start: var(--lu-sp-20);
		border-inline-start: 1px solid var(--lu-ink-muted);
	}
}

/* ---- platobné logá (tatrapay+ vyžaduje logá na webe) ---------------------- */
.lu-footer__platby {
	margin-block: var(--lu-sp-10, 10px) 0;
}

.lu-footer__platby .lu-platby {
	display: inline-flex;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
	justify-content: center;
	padding: 8px 16px;
	background: #ffffff;
	border-radius: 4px;
}

.lu-footer__platby .lu-platby img {
	height: 26px;
	width: auto;
	display: block;
	filter: none;
}