/*
Theme Name: Fispro Block
Description: Child téma Extendable pre fispro.sk — natívne bloky namiesto Elementoru.
Template: extendable
Version: 1.0.0
Requires at least: 6.6
Requires PHP: 8.1
Text Domain: fispro-block
License: GNU General Public License v2 or later

Ikony: Font Awesome Free (https://fontawesome.com), licencia CC BY 4.0.
*/

/* ── Hlavička ─────────────────────────────────────────────────────────── */

.fispro-header .wp-block-navigation-item__content {
	padding: 0.5rem 0;
}

/* Na mobile sa tlačidlo s menu nezmestí — kontakt je v menu aj v CTA sekcii stránky. */
@media (max-width: 781px) {
	.fispro-header .fispro-header__cta {
		display: none !important;
	}
}

/* ── Tlačidlo s lietadielkom (otvára kontaktný popup) ─────────────────── */

.wp-block-button.is-style-fispro-plane .wp-block-button__link::after {
	content: "";
	display: inline-block;
	width: 0.95em;
	height: 0.95em;
	margin-left: 0.75em;
	vertical-align: -0.1em;
	background-color: currentColor;
	-webkit-mask: url("assets/icons/paper-plane.svg") center / contain no-repeat;
	mask: url("assets/icons/paper-plane.svg") center / contain no-repeat;
}

/* ── Krátka čiara pod nadpisom sekcie ─────────────────────────────────── */

.wp-block-separator.is-style-fispro-short {
	width: 80px;
	max-width: 80px;
	border: 0;
	border-top: 4px solid currentColor;
	margin-left: auto;
	margin-right: auto;
	opacity: 1;
}

/* ── Karta služby (náhrada flip-boxu) ─────────────────────────────────── */
/* Celá karta je klikateľná cez odkaz „Zistiť viac“ (roztiahnutý ::after). */

.wp-block-group.is-style-fispro-card {
	position: relative;
	border: 1px solid var(--wp--preset--color--secondary);
	border-radius: var(--wp--custom--fispro--radius);
	background: var(--wp--preset--color--background);
	transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.wp-block-group.is-style-fispro-card:hover,
.wp-block-group.is-style-fispro-card:focus-within {
	transform: translateY(-4px);
	border-color: var(--wp--preset--color--primary);
	box-shadow: var(--wp--custom--fispro--card-shadow);
}

.is-style-fispro-card .wp-block-image img {
	width: 48px;
	height: 48px;
	object-fit: contain;
}

.is-style-fispro-card .fispro-card__more {
	margin-top: auto;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}

.is-style-fispro-card .fispro-card__more a {
	color: var(--wp--preset--color--secondary);
	text-decoration: none;
}

.is-style-fispro-card .fispro-card__more a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.is-style-fispro-card .fispro-card__more a:focus-visible {
	outline: none;
}

.is-style-fispro-card:focus-within {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
}

/* ── Zoznamy s ikonami (pätička) ──────────────────────────────────────── */

.wp-block-list.is-style-fispro-check,
.wp-block-list.is-style-fispro-plain,
.fispro-icon-list {
	list-style: none;
	padding-left: 0;
}

.wp-block-list.is-style-fispro-check > li {
	position: relative;
	padding: 0.7rem 0 0.7rem 1.75rem;
	border-bottom: 1px solid var(--wp--preset--color--line);
	font-weight: 600;
}

.wp-block-list.is-style-fispro-check > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 1rem;
	height: 1rem;
	transform: translateY(-50%);
	background-color: var(--wp--preset--color--secondary);
	-webkit-mask: url("assets/icons/check.svg") center / contain no-repeat;
	mask: url("assets/icons/check.svg") center / contain no-repeat;
}

.wp-block-list.is-style-fispro-plain > li {
	margin: 0 0 0.6rem;
}

.wp-block-list.is-style-fispro-plain a {
	text-decoration: none;
}

.fispro-icon-list > li {
	position: relative;
	margin: 0 0 0.6rem;
	padding-left: 1.75rem;
}

.fispro-icon-list > li[class*="is-icon-"]::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.3em;
	width: 1rem;
	height: 1rem;
	background-color: var(--wp--preset--color--primary);
	-webkit-mask: var(--fispro-icon) center / contain no-repeat;
	mask: var(--fispro-icon) center / contain no-repeat;
}

.fispro-icon-list > li.is-icon-map { --fispro-icon: url("assets/icons/location-dot.svg"); }
.fispro-icon-list > li.is-icon-phone { --fispro-icon: url("assets/icons/phone.svg"); }
.fispro-icon-list > li.is-icon-mail { --fispro-icon: url("assets/icons/envelope-regular.svg"); }

.fispro-icon-list a {
	text-decoration: none;
}

/* ── Akcentová farba karty (farebný rámik, nadpis, odkaz, kruh ikony) ─── */

.has-accent-primary { --fispro-accent: var(--wp--preset--color--primary); }
.has-accent-secondary { --fispro-accent: var(--wp--preset--color--secondary); }
.has-accent-biznis { --fispro-accent: var(--wp--preset--color--biznis); }
.has-accent-invest { --fispro-accent: var(--wp--preset--color--invest); }
.has-accent-gold { --fispro-accent: var(--wp--preset--color--gold); }

.wp-block-group.is-style-fispro-card[class*="has-accent-"],
.wp-block-group.is-style-fispro-card[class*="has-accent-"]:hover {
	border-color: var(--fispro-accent);
}

.is-style-fispro-card[class*="has-accent-"] h3,
.is-style-fispro-card[class*="has-accent-"] .fispro-card__more a {
	color: var(--fispro-accent);
}

.wp-block-group.is-style-fispro-card.has-thick-border {
	border-width: 3px;
}

.is-style-fispro-card.is-icon-stacked .wp-block-image {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100px;
	height: 100px;
	margin: 0 auto 0.5rem;
	border-radius: 50%;
	background: var(--fispro-accent, var(--wp--preset--color--secondary));
}

.is-style-fispro-card.is-icon-stacked .wp-block-image img {
	filter: brightness(0) invert(1);
}

/* Karty v stĺpcoch majú rovnakú výšku aj pri rôzne dlhom nadpise (flex, nie height: 100 %). */
.wp-block-columns:has(> .wp-block-column > .is-style-fispro-card, > .wp-block-column > .fispro-box) {
	align-items: stretch !important;
}

.wp-block-column:has(> .is-style-fispro-card, > .fispro-box) {
	display: flex;
	flex-direction: column;
	align-self: stretch !important;
}

.wp-block-column > .is-style-fispro-card,
.wp-block-column > .fispro-box {
	flex: 1 1 auto;
}

/* Prvok skrytý na mobile (Elementor „skryť na mobile“). */
@media (max-width: 781px) {
	.fispro-hide-mobile {
		display: none !important;
	}
}

/* Tlačidlá s vlastnou farbou pozadia majú rámik v rovnakej farbe (nie tmavomodrý z theme.json). */
.wp-block-button__link.has-background {
	border-color: transparent;
}

/* Nadpis v karte je menší ako globálny H3. */
.is-style-fispro-card h3 {
	font-size: var(--wp--preset--font-size--large);
	font-weight: 600;
}

/* Obrysové tlačidlo (štýl Outline) — tmavomodrý rámik a text. */
.wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background) {
	background: transparent;
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}

.wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background):hover {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--background);
}

/* Karta konzultanta — okrúhla fotka, väčšie zaoblenie. */
.wp-block-group.fispro-person {
	border-radius: 12px;
}

.fispro-person .wp-block-image img {
	border-radius: 50%;
	object-fit: cover;
}

/* ── Blog: karty článkov, bočný panel ─────────────────────────────────── */

.wp-block-group.is-style-fispro-card {
	overflow: hidden;
}

.is-style-fispro-card .wp-block-post-featured-image {
	margin: 0;
}

.is-style-fispro-card .wp-block-post-title a {
	text-decoration: none;
}

.wp-block-latest-posts.is-style-fispro-plain,
.wp-block-categories.is-style-fispro-plain {
	list-style: none;
	padding-left: 0;
}

.wp-block-latest-posts.is-style-fispro-plain li,
.wp-block-categories.is-style-fispro-plain li {
	padding: 0.6rem 0;
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.wp-block-latest-posts.is-style-fispro-plain a,
.wp-block-categories.is-style-fispro-plain a,
.fispro-sidebar-posts a {
	font-weight: 600;
	text-decoration: none;
}

.wp-block-latest-posts__post-date {
	color: var(--wp--preset--color--foreground-alt);
	font-size: var(--wp--preset--font-size--small);
}

/* ── Ikony v zoznamoch: trieda is-icon-<názov súboru v assets/icons> (vygenerované) ── */

.fispro-icon-list > li.is-icon-arrow-right { --fispro-icon: url("assets/icons/arrow-right.svg"); }
.fispro-icon-list > li.is-icon-book { --fispro-icon: url("assets/icons/book.svg"); }
.fispro-icon-list > li.is-icon-briefcase { --fispro-icon: url("assets/icons/briefcase.svg"); }
.fispro-icon-list > li.is-icon-building-regular { --fispro-icon: url("assets/icons/building-regular.svg"); }
.fispro-icon-list > li.is-icon-building { --fispro-icon: url("assets/icons/building.svg"); }
.fispro-icon-list > li.is-icon-calendar { --fispro-icon: url("assets/icons/calendar.svg"); }
.fispro-icon-list > li.is-icon-chart-line { --fispro-icon: url("assets/icons/chart-line.svg"); }
.fispro-icon-list > li.is-icon-check { --fispro-icon: url("assets/icons/check.svg"); }
.fispro-icon-list > li.is-icon-chevron-right { --fispro-icon: url("assets/icons/chevron-right.svg"); }
.fispro-icon-list > li.is-icon-circle-check-regular { --fispro-icon: url("assets/icons/circle-check-regular.svg"); }
.fispro-icon-list > li.is-icon-circle-check { --fispro-icon: url("assets/icons/circle-check.svg"); }
.fispro-icon-list > li.is-icon-circle-dollar-to-slot { --fispro-icon: url("assets/icons/circle-dollar-to-slot.svg"); }
.fispro-icon-list > li.is-icon-circle-user-regular { --fispro-icon: url("assets/icons/circle-user-regular.svg"); }
.fispro-icon-list > li.is-icon-clock-regular { --fispro-icon: url("assets/icons/clock-regular.svg"); }
.fispro-icon-list > li.is-icon-clock { --fispro-icon: url("assets/icons/clock.svg"); }
.fispro-icon-list > li.is-icon-coins { --fispro-icon: url("assets/icons/coins.svg"); }
.fispro-icon-list > li.is-icon-comments { --fispro-icon: url("assets/icons/comments.svg"); }
.fispro-icon-list > li.is-icon-compass-regular { --fispro-icon: url("assets/icons/compass-regular.svg"); }
.fispro-icon-list > li.is-icon-credit-card { --fispro-icon: url("assets/icons/credit-card.svg"); }
.fispro-icon-list > li.is-icon-envelope-regular { --fispro-icon: url("assets/icons/envelope-regular.svg"); }
.fispro-icon-list > li.is-icon-envelope { --fispro-icon: url("assets/icons/envelope.svg"); }
.fispro-icon-list > li.is-icon-golf-ball-tee { --fispro-icon: url("assets/icons/golf-ball-tee.svg"); }
.fispro-icon-list > li.is-icon-handshake-regular { --fispro-icon: url("assets/icons/handshake-regular.svg"); }
.fispro-icon-list > li.is-icon-handshake { --fispro-icon: url("assets/icons/handshake.svg"); }
.fispro-icon-list > li.is-icon-house { --fispro-icon: url("assets/icons/house.svg"); }
.fispro-icon-list > li.is-icon-location-dot { --fispro-icon: url("assets/icons/location-dot.svg"); }
.fispro-icon-list > li.is-icon-magnifying-glass { --fispro-icon: url("assets/icons/magnifying-glass.svg"); }
.fispro-icon-list > li.is-icon-map-pin { --fispro-icon: url("assets/icons/map-pin.svg"); }
.fispro-icon-list > li.is-icon-money-bill { --fispro-icon: url("assets/icons/money-bill.svg"); }
.fispro-icon-list > li.is-icon-money-check { --fispro-icon: url("assets/icons/money-check.svg"); }
.fispro-icon-list > li.is-icon-paper-plane { --fispro-icon: url("assets/icons/paper-plane.svg"); }
.fispro-icon-list > li.is-icon-pen-to-square { --fispro-icon: url("assets/icons/pen-to-square.svg"); }
.fispro-icon-list > li.is-icon-pencil { --fispro-icon: url("assets/icons/pencil.svg"); }
.fispro-icon-list > li.is-icon-phone { --fispro-icon: url("assets/icons/phone.svg"); }
.fispro-icon-list > li.is-icon-piggy-bank { --fispro-icon: url("assets/icons/piggy-bank.svg"); }
.fispro-icon-list > li.is-icon-shield-halved { --fispro-icon: url("assets/icons/shield-halved.svg"); }
.fispro-icon-list > li.is-icon-square-full { --fispro-icon: url("assets/icons/square-full.svg"); }
.fispro-icon-list > li.is-icon-star { --fispro-icon: url("assets/icons/star.svg"); }
.fispro-icon-list > li.is-icon-stopwatch { --fispro-icon: url("assets/icons/stopwatch.svg"); }
.fispro-icon-list > li.is-icon-suitcase { --fispro-icon: url("assets/icons/suitcase.svg"); }
.fispro-icon-list > li.is-icon-thumbs-up { --fispro-icon: url("assets/icons/thumbs-up.svg"); }
.fispro-icon-list > li.is-icon-user-tie { --fispro-icon: url("assets/icons/user-tie.svg"); }

.fispro-icon-list.is-centered > li {
	display: flex;
	justify-content: center;
	padding-left: 0;
}

.fispro-icon-list.is-centered > li[class*="is-icon-"]::before {
	position: static;
	flex: 0 0 1rem;
	margin: 0.3em 0.6rem 0 0;
}

/* Ikona v kruhu (Elementor ikona „stacked“) — biela ikona na farebnom kruhu. */
.wp-block-image.fispro-icon-stacked {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	margin-left: auto;
	margin-right: auto;
	border-radius: 50%;
	background: var(--fispro-accent, var(--wp--preset--color--primary));
}

.wp-block-image.fispro-icon-stacked img {
	width: 50% !important;
	height: 50% !important;
	filter: brightness(0) invert(1);
}


/* Stĺpec s obrázkom na pozadí (Elementor) — aby bol obrázok vidieť aj bez obsahu. */
.wp-block-group.fispro-box.has-bg-image {
	min-height: 360px;
	border-radius: 8px;
}

/* ── Fluent Forms — zladenie s dizajnom (tlačidlo, polia, súhlas GDPR) ─── */

.fluentform .ff-el-form-control {
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 5px;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--primary);
}

.fluentform .ff-el-form-control:focus {
	border-color: var(--wp--preset--color--secondary);
	box-shadow: 0 0 0 3px rgba(105, 200, 201, 0.25);
}

.fluentform .ff-btn-submit,
.fluentform .ff-btn-submit:hover {
	background-color: var(--wp--preset--color--primary) !important;
	border: 2px solid var(--wp--preset--color--primary) !important;
	border-radius: 5px !important;
	color: var(--wp--preset--color--background) !important;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	text-transform: none;
	padding: 0.75em 1.75em;
}

.fluentform .ff-btn-submit:hover {
	border-color: var(--wp--preset--color--secondary) !important;
	box-shadow: 0 0 20px 0 #40BA93;
}

.fluentform .ff-el-form-check-label,
.fluentform .ff_t_c {
	color: var(--wp--preset--color--primary);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 400;
}

/* ── Lightbox obrázkov v článkoch (assets/js/lightbox.js) ─────────────── */

.fispro-lightbox {
	max-width: 92vw;
	max-height: 92vh;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: zoom-out;
}

.fispro-lightbox::backdrop {
	background: rgba(47, 65, 88, 0.85);
}

.fispro-lightbox img {
	display: block;
	max-width: 92vw;
	max-height: 92vh;
	border-radius: 6px;
}

.fispro-lightbox__close {
	position: absolute;
	top: 0.5rem;
	right: 0.75rem;
	border: 0;
	background: none;
	color: #fff;
	font-size: 2rem;
	line-height: 1;
	cursor: pointer;
}

.wp-block-post-content a[href$=".jpg" i] img,
.wp-block-post-content a[href$=".png" i] img {
	cursor: zoom-in;
}

.fluentform .ff-gdpr-note {
	margin: -0.5rem 0 1rem;
	font-size: 0.8125rem;
	color: var(--wp--preset--color--foreground-alt);
}

/* ── Lepkavá hlavička ─────────────────────────────────────────────────── */

header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 100;
}

.admin-bar header.wp-block-template-part {
	top: var(--wp-admin--admin-bar--height, 32px);
}

.fispro-header {
	box-shadow: 0 1px 0 var(--wp--preset--color--line);
	transition: box-shadow 0.2s ease;
}

/* ── Telefón v hlavičke — len na mobile, klikateľný ──────────────────── */

.fispro-header__phone {
	display: none;
	margin: 0;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	white-space: nowrap;
}

.fispro-header__phone a {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	text-decoration: none;
}

.fispro-header__phone a::before {
	content: "";
	width: 1rem;
	height: 1rem;
	background-color: var(--wp--preset--color--secondary);
	-webkit-mask: url("assets/icons/phone.svg") center / contain no-repeat;
	mask: url("assets/icons/phone.svg") center / contain no-repeat;
}

@media (max-width: 781px) {
	.fispro-header .fispro-header__phone {
		display: block;
	}
}

/* ── Tlačidlo „späť hore“ (assets/js/back-to-top.js) ─────────────────── */

.fispro-back-to-top {
	position: fixed;
	right: 1.25rem;
	bottom: 1.25rem;
	z-index: 90;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 0;
	border-radius: 50%;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--background);
	box-shadow: var(--wp--custom--fispro--card-shadow);
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
}

.fispro-back-to-top.is-visible {
	opacity: 1;
	visibility: visible;
	transform: none;
}

.fispro-back-to-top:hover {
	background: var(--wp--preset--color--secondary);
}

.fispro-back-to-top svg {
	width: 22px;
	height: 22px;
	fill: currentColor;
}
