/*
Theme Name: FILA Slovenija
Theme URI: https://filasolutions.si/
Author: Marand
Description: Blokovna tema za filasolutions.si. Vso vsebino se ureja z Gutenbergom (bloki, vzorci, urejevalnik spletnega mesta). Katalog izdelkov zagotavlja vtičnik »FILA katalog«.
Requires at least: 6.6
Tested up to: 6.9
Requires PHP: 8.1
Version: 1.0.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: fila-si
*/

/* ---------- osnova ---------- */
:root {
	--fila-crna: var(--wp--preset--color--contrast, #1D1D1B);
	--fila-rumena: var(--wp--preset--color--accent, #FFD400);
	--fila-siva: var(--wp--preset--color--surface, #F2F2F2);
	--fila-crte: var(--wp--preset--color--line, #E3E3E1);
	--fila-besedilo-2: var(--wp--preset--color--text-2, #4A4A48);
	--fila-pisava-naslovi: var(--wp--preset--font-family--heading, Montserrat, sans-serif);
}
body { -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; }
:focus-visible { outline: 3px solid var(--fila-rumena); outline-offset: 2px; }
:where(.wp-site-blocks) > * { margin-block-start: 0; margin-block-end: 0; }
.fila-sekcije > * { margin-block-start: 0 !important; margin-block-end: 0 !important; }
.fila-sekcija { padding-top: var(--wp--preset--spacing--70); padding-bottom: var(--wp--preset--spacing--70); }
.fila-sekcija--kratka { padding-top: var(--wp--preset--spacing--60); padding-bottom: var(--wp--preset--spacing--60); }
.fila-sekcija > .wp-block-group__inner-container > *:first-child,
.fila-sekcija > *:first-child { margin-block-start: 0; }

/* ---------- slogi skupin ---------- */
.is-style-siva { background-color: var(--fila-siva); }
.is-style-temna { background-color: var(--fila-crna); color: #FFFFFF; }
.is-style-temna a:where(:not(.wp-element-button)) { color: #FFFFFF; }
.is-style-temna p { color: #E6E6E6; }
.is-style-temna :where(h1, h2, h3, h4) { color: #FFFFFF; }
.is-style-rumena { background-color: var(--fila-rumena); color: var(--fila-crna); }
.is-style-okvir { background-color: var(--fila-siva); padding: clamp(24px, 3vw, 36px); }

/* ---------- tipografija ---------- */
.is-style-oznaka {
	font-family: var(--fila-pisava-naslovi);
	font-weight: 700 !important;
	font-size: 0.875rem !important;
	letter-spacing: 0.05em !important;
	text-transform: uppercase;
	line-height: 1.3 !important;
}
.is-style-oznaka::after { content: ""; display: block; width: 32px; height: 2px; margin-top: 10px; background: currentColor; }
p.is-style-uvod { font-size: 1.1875rem; font-weight: 300; color: var(--fila-besedilo-2); }
.is-style-temna p.is-style-uvod { color: #E6E6E6; }
.fila-nadnaslov { font-family: var(--fila-pisava-naslovi); font-weight: 600; font-size: 0.8125rem; letter-spacing: 0.08em; text-transform: uppercase; color: #61615F; }
.fila-letnica { font-family: var(--fila-pisava-naslovi); font-weight: 800; font-size: clamp(88px, 13vw, 200px); line-height: 0.9; letter-spacing: -0.03em; color: var(--fila-rumena) !important; margin: 0; }
.fila-mejnik { border-top: 4px solid var(--fila-rumena); padding-top: 24px; }
.fila-mejnik__leto { font-family: var(--fila-pisava-naslovi); font-weight: 800; font-size: 3.25rem; line-height: 1; color: var(--fila-rumena) !important; }
.fila-kratica { font-family: var(--fila-pisava-naslovi); font-weight: 600; font-size: 0.875rem; letter-spacing: 0.06em; text-transform: uppercase; color: #61615F; }
.fila-kartica { background: var(--fila-siva); padding: 28px; min-height: 240px; }
.fila-kartica h3 { font-size: 1.375rem; text-transform: uppercase; margin-top: 1.5rem; }
.fila-stevilka { display: inline-flex !important; align-items: center; justify-content: center; width: 44px; height: 44px; background: var(--fila-rumena); font-family: var(--fila-pisava-naslovi); font-weight: 800; }
.fila-podatki p { padding: 14px 0; margin: 0; border-bottom: 1px solid #D0D0CE; }
.fila-podatki p:first-child { border-top: 2px solid var(--fila-crna); }
.fila-podatki strong { display: block; font-family: var(--fila-pisava-naslovi); font-size: 0.6875rem; letter-spacing: 0.06em; text-transform: uppercase; color: #61615F; }

/* ---------- seznami ---------- */
ul.is-style-kljukice { list-style: none; padding-left: 0; display: flex; flex-direction: column; gap: 12px; }
ul.is-style-kljukice > li { position: relative; padding-left: 30px; }
ul.is-style-kljukice > li::before {
	content: ""; position: absolute; left: 0; top: 0.2em; width: 18px; height: 18px;
	background: var(--fila-rumena) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231D1D1B' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center / 12px no-repeat;
}
ul.is-style-vrstice { list-style: none; padding: 0; }
ul.is-style-vrstice > li { padding: 12px 16px; font-family: var(--fila-pisava-naslovi); font-weight: 500; font-size: 0.8125rem; letter-spacing: 0.02em; text-transform: uppercase; }
ul.is-style-vrstice > li:nth-child(odd) { background: #F0F0F0; }
ul.is-style-povezave { list-style: none; padding: 0; border-top: 2px solid var(--fila-crna); }
ul.is-style-povezave > li { border-bottom: 1px solid var(--fila-crte); }
ul.is-style-povezave > li a { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 0; text-decoration: none; font-size: 1.125rem; font-weight: 500; }
ul.is-style-povezave > li a::after { content: "→"; flex-shrink: 0; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; background: var(--fila-rumena); }
ul.is-style-brez { list-style: none; padding: 0; }

/* ---------- gumbi ---------- */
.wp-block-button.is-style-crn .wp-block-button__link { background-color: var(--fila-crna); color: var(--fila-rumena); }
.wp-block-button.is-style-crn .wp-block-button__link:hover { background-color: #000000; color: var(--fila-rumena); }
.wp-block-button.is-style-oranzen .wp-block-button__link { background-color: var(--wp--preset--color--buy, #FD9F36); color: var(--fila-crna); }
.wp-block-button.is-style-obroba .wp-block-button__link { background-color: transparent; color: var(--fila-crna); box-shadow: inset 0 0 0 2px currentColor; }
.wp-block-button.is-style-obroba .wp-block-button__link:hover { background-color: var(--fila-crna); color: #FFFFFF; }
.is-style-temna .wp-block-button.is-style-obroba .wp-block-button__link { color: #FFFFFF; }
.is-style-temna .wp-block-button.is-style-obroba .wp-block-button__link:hover { background-color: #FFFFFF; color: var(--fila-crna); }

/* ---------- glava ---------- */
.fila-glava { background-color: var(--fila-crna); position: relative; z-index: 30; }
.fila-glava__vrstica { min-height: var(--wp--custom--fila--header-height, 88px); }
.fila-glava .wp-block-site-logo { align-self: flex-start; margin-bottom: -24px; position: relative; z-index: 2; }
.fila-glava .wp-block-site-logo img { width: var(--wp--custom--fila--logo-size, 112px); height: var(--wp--custom--fila--logo-size, 112px); object-fit: contain; background: var(--fila-rumena); }
.fila-glava .wp-block-navigation { color: #FFFFFF; margin-left: auto; }
.fila-glava .wp-block-navigation .wp-block-navigation-item__content { padding: 12px 0; color: #FFFFFF; }
.fila-glava .wp-block-navigation .wp-block-navigation__container { gap: 36px; }
.fila-glava .wp-block-navigation .current-menu-item > .wp-block-navigation-item__content,
.post-type-archive-fila_izdelek .fila-glava .fila-nav-katalog > .wp-block-navigation-item__content,
.tax-fila_vrsta .fila-glava .fila-nav-katalog > .wp-block-navigation-item__content,
.tax-fila_linija .fila-glava .fila-nav-katalog > .wp-block-navigation-item__content,
.tax-fila_povrsina .fila-glava .fila-nav-katalog > .wp-block-navigation-item__content,
.single-fila_izdelek .fila-glava .fila-nav-katalog > .wp-block-navigation-item__content { box-shadow: inset 0 -3px 0 var(--fila-rumena); }
.fila-glava .wp-block-navigation__responsive-container-open { color: #FFFFFF; }
.fila-glava .wp-block-navigation__responsive-container-open svg { width: 30px; height: 30px; }
.fila-glava .wp-block-navigation__responsive-container.is-menu-open { background-color: var(--fila-crna) !important; color: #FFFFFF !important; padding: 24px 16px; }
.fila-glava .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 0; width: 100%; }
.fila-glava .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { width: 100%; border-bottom: 1px solid #3A3A38; }
.fila-glava .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 1.375rem; padding: 18px 0; width: 100%; }
.fila-glava .wp-block-navigation__responsive-container-close { color: #FFFFFF; }
.fila-glava .wp-block-search__button {
	width: 44px; height: 44px; padding: 0; margin: 0; border: 0; border-radius: 0;
	background: var(--fila-rumena); color: var(--fila-crna); display: flex; align-items: center; justify-content: center;
}
.fila-glava .wp-block-search__button svg { width: 22px; height: 22px; fill: currentColor; }
.fila-glava .wp-block-search__inside-wrapper { border: 0; padding: 0; background: transparent; }
.fila-glava .wp-block-search__input { border: 0; border-radius: 0; height: 44px; padding: 0 12px; font-size: 1rem; }
@media (max-width: 900px) {
	.fila-glava__vrstica { min-height: 64px; }
	.fila-glava .wp-block-site-logo { margin-bottom: -8px; }
	.fila-glava .wp-block-site-logo img { width: 72px; height: 72px; }
	.fila-glava .wp-block-navigation .wp-block-navigation__container { gap: 22px; }
}

/* ---------- noga ---------- */
.fila-noga { font-size: 0.9375rem; }
.fila-noga .wp-block-site-logo img { width: 80px; height: 80px; object-fit: contain; background: var(--fila-rumena); }
.fila-noga .fila-noga__naslov { font-family: var(--fila-pisava-naslovi); font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: #FFFFFF !important; margin-bottom: 6px; }
.fila-noga ul.is-style-brez li { padding: 4px 0; }
.fila-noga ul.is-style-brez a { color: #E6E6E6; text-decoration: none; }
.fila-noga ul.is-style-brez a:hover { color: var(--fila-rumena); }
.fila-noga__spodaj { border-top: 1px solid #3A3A38; padding-top: 20px; font-size: 0.875rem; }
.fila-noga__spodaj p, .fila-noga__spodaj a { color: #BDBDBB !important; }

/* ---------- vprašanja (blok Podrobnosti) ---------- */
.wp-block-details { background: var(--fila-siva); margin: 0 0 8px !important; padding: 0; }
.wp-block-details summary {
	display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 18px 20px;
	font-family: var(--fila-pisava-naslovi); font-weight: 600; font-size: 1.0625rem; line-height: 1.35; list-style: none; cursor: pointer;
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after {
	content: "+"; flex-shrink: 0; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center;
	background: var(--fila-rumena); font-size: 22px; font-weight: 400; transition: transform 0.2s;
}
.wp-block-details[open] summary::after { transform: rotate(45deg); }
.wp-block-details > :not(summary) { padding: 0 64px 0 20px; margin-top: 0; font-weight: 300; }
.wp-block-details > :last-child { padding-bottom: 22px; }

/* ---------- strani ---------- */
.fila-poziv { padding: clamp(24px, 3vw, 40px); gap: 20px; }
.fila-poziv h2 { margin: 0; }
.fila-hero-slika img { width: 100%; height: auto; display: block; }
@media (max-width: 781px) { .fila-pas-rumen .wp-block-columns { gap: 0; } .fila-pas-rumen p { padding: 12px 0 !important; } .fila-pas-rumen .wp-block-column + .wp-block-column p { border-top: 1px solid rgba(0, 0, 0, 0.15); } }
.fila-pas-rumen p { font-family: var(--fila-pisava-naslovi); font-weight: 700; font-size: 1rem; letter-spacing: 0.02em; text-transform: uppercase; margin: 0; padding: 22px 0; }
.fila-glava-sekcije { margin-bottom: 2.25rem !important; }
.fila-naslov-strani { padding-top: var(--wp--preset--spacing--60); padding-bottom: var(--wp--preset--spacing--40); }
.fila-vsebina-strani { padding-bottom: var(--wp--preset--spacing--70); }
.fila-404 { padding-top: var(--wp--preset--spacing--70); padding-bottom: var(--wp--preset--spacing--70); }
.wp-block-query .wp-block-post { padding: 20px 0; border-bottom: 1px solid var(--fila-crte); }
.wp-block-query .wp-block-post-title { font-size: 1.375rem; text-transform: uppercase; }
.wp-block-query .wp-block-post-title a { text-decoration: none; }