/* ==========================================================================
   Filteri kataloga (dodatak Tamban Smart Commerce).
   Boje i radius dolaze iz theme.json aktivne teme, uz rezervne vrednosti.
   ========================================================================== */

.tb-filters *,
.tb-sheet * {
	box-sizing: border-box;
}

.tb-filters,
.tb-sheet,
.tb-chips,
.tb-filters-open {
	--tbf-ink: var(--wp--preset--color--ink, #17231f);
	--tbf-muted: var(--wp--preset--color--muted, #6e756f);
	--tbf-line: var(--wp--preset--color--line, #dedbd3);
	--tbf-paper: var(--wp--preset--color--paper, #fbfaf7);
	--tbf-accent: var(--wp--preset--color--forest, #0d352d);
	--tbf-accent-2: var(--wp--preset--color--forest-2, #16483d);
	--tbf-radius: var(--wp--custom--radius, 10px);
	--tbf-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
	/* Ivice kontrola (štiklir, prekidač, polja cene) i okvir fokusa: najmanje 3:1 prema beloj (WCAG 1.4.11) */
	--tbf-control: #8a877f;
	--tbf-control-hover: #76736b;
	--tbf-focus: #9c7a3c;
}

.tb-sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.tb-svg {
	flex: none;
	width: 1.125rem;
	height: 1.125rem;
}

/* --------------------------------------------------------------------------
   Bočna kolona
   -------------------------------------------------------------------------- */
.tb-filters {
	color: var(--tbf-ink);
	font-size: 0.9375rem;
}

.tb-filters__form {
	display: grid;
	gap: 0;
	margin: 0;
}

.tb-filters__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	padding-bottom: 0.9rem;
	border-bottom: 1px solid var(--tbf-line);
}

.tb-filters__title {
	margin: 0;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.tb-filters__clear {
	color: var(--tbf-muted);
	font-size: 0.8125rem;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.tb-filters__clear:hover {
	color: var(--tbf-accent);
}

.tb-filters__submit {
	padding-top: 1rem;
}

.tb-filters__submit button {
	width: 100%;
	min-height: 44px;
	border: 0;
	border-radius: var(--tbf-radius);
	background: var(--tbf-accent);
	color: #fff;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}

.tb-filters.is-enhanced .tb-filters__submit,
.tb-sheet .tb-filters__submit {
	display: none;
}

/* Grupa filtera */
.tb-facet {
	margin: 0;
	padding: 0;
	border: 0;
	border-bottom: 1px solid var(--tbf-line);
}

.tb-facet__legend,
.tb-facet__title {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	width: 100%;
	padding: 1rem 0 0.75rem;
	color: var(--tbf-ink);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.tb-facet--status {
	padding-bottom: 1rem;
}

.tb-facet__legend {
	float: left;
	padding-bottom: 0.75rem;
}

.tb-facet__legend + * {
	clear: both;
}

.tb-facet__title {
	cursor: pointer;
	list-style: none;
}

.tb-facet__title::-webkit-details-marker {
	display: none;
}

.tb-facet__title > span:first-child {
	flex: 1;
}

.tb-facet__badge {
	display: inline-grid;
	place-items: center;
	min-width: 1.25rem;
	height: 1.25rem;
	padding: 0 0.35rem;
	border-radius: 999px;
	background: var(--tbf-accent);
	color: #fff;
	font-size: 0.6875rem;
	letter-spacing: 0;
}

.tb-facet__chevron {
	width: 1rem;
	height: 1rem;
	color: var(--tbf-muted);
	transition: transform 200ms var(--tbf-ease);
}

.tb-facet[open] > .tb-facet__title .tb-facet__chevron {
	transform: rotate(180deg);
}

.tb-facet > :not(summary):not(legend) {
	margin-bottom: 1rem;
}

/* Prekidači: obojena oznaka + prekidač (primer koji je dao Stefan, 24.09.) */
.tb-facet--status {
	padding-top: 1rem;
}

.tb-toggles {
	display: grid;
	gap: 0.8rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.tb-toggle {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	cursor: pointer;
}

.tb-toggle input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}

.tb-toggle__label {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	padding: 0.3rem 0.7rem;
	border-radius: 6px;
	background: var(--tbf-accent);
	color: #fff;
	font-size: 0.8125rem;
	font-weight: 700;
	line-height: 1.2;
	white-space: nowrap;
}

.tb-toggle--green .tb-toggle__label {
	background: #3d7f35;
}

.tb-toggle--red .tb-toggle__label {
	background: var(--wp--preset--color--sale, #c93a29);
}

.tb-toggle--light .tb-toggle__label {
	background: #fff;
	box-shadow: inset 0 0 0 1.5px var(--tbf-ink);
	color: var(--tbf-ink);
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.tb-toggle--forest .tb-toggle__label {
	background: var(--tbf-accent);
}

.tb-toggle__switch {
	position: relative;
	flex: none;
	width: 46px;
	height: 26px;
	border-radius: 999px;
	background: var(--tbf-control);
	transition: background-color 200ms ease;
}

.tb-toggle__switch::after {
	content: "";
	position: absolute;
	top: 3px;
	left: 3px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
	transition: transform 220ms var(--tbf-ease);
}

.tb-toggle:hover .tb-toggle__switch {
	background: var(--tbf-control-hover);
}

.tb-toggle input:checked ~ .tb-toggle__switch {
	background: var(--tbf-accent);
}

.tb-toggle input:checked ~ .tb-toggle__switch::after {
	transform: translateX(20px);
}

.tb-toggle input:focus-visible ~ .tb-toggle__switch {
	outline: 2px solid var(--tbf-focus);
	outline-offset: 2px;
}

/* Opcije sa štikliranjem i kružići: pravo polje je nevidljivo preko cele opcije (radi tastatura i čitač ekrana) */
.tb-option input,
.tb-swatch input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}

/* Opcije sa štikliranjem */
.tb-options {
	display: grid;
	gap: 0.1rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.tb-option {
	position: relative;
	display: flex;
	align-items: center;
	gap: 0.65rem;
	min-height: 38px;
	padding: 0 0.5rem;
	margin: 0 -0.5rem;
	border-radius: 8px;
	cursor: pointer;
	transition: background-color 140ms ease;
}

.tb-option:hover {
	background: var(--tbf-paper);
}

.tb-option__box {
	display: grid;
	place-items: center;
	flex: none;
	width: 1.125rem;
	height: 1.125rem;
	border: 1.5px solid var(--tbf-control);
	border-radius: 5px;
	background: #fff;
	color: #fff;
	transition: background-color 140ms ease, border-color 140ms ease;
}

.tb-option__box .tb-svg {
	width: 0.8rem;
	height: 0.8rem;
	opacity: 0;
	stroke-width: 3;
}

.tb-option input:checked + .tb-option__box {
	border-color: var(--tbf-accent);
	background: var(--tbf-accent);
}

.tb-option input:checked + .tb-option__box .tb-svg {
	opacity: 1;
}

/* Fokus sa tastature: pravo polje je nevidljivo, pa se okvir crta oko vidljivog štiklira */
.tb-option input:focus-visible + .tb-option__box {
	outline: 2px solid var(--tbf-focus);
	outline-offset: 2px;
}

.tb-option__name {
	min-width: 0;
	line-height: 1.3;
}

/* Broj kao „(7)“ odmah posle naziva (primer sa brendovima) */
.tb-option__count {
	margin-right: auto;
	color: var(--tbf-muted);
	font-size: 0.875rem;
	font-variant-numeric: tabular-nums;
}

/* Brendovi: štikliranje, logo u okviru, naziv i broj */
.tb-option--logo {
	min-height: 64px;
	gap: 0.75rem;
}

.tb-option__logo {
	/* Flex (ne grid): slika dobija visinu okvira, pa ni kvadratni logo ne izlazi iz njega. */
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 92px;
	height: 54px;
	padding: 6px 10px;
	overflow: hidden;
	border: 1px solid var(--tbf-line);
	border-radius: 10px;
	background: #fff;
	transition: border-color 140ms ease, box-shadow 140ms ease;
}

.tb-option__logo img {
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 100%;
	object-fit: contain;
}

.tb-option__wordmark {
	color: var(--tbf-ink);
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	line-height: 1.1;
	text-align: center;
	text-transform: uppercase;
	overflow-wrap: anywhere;
}

.tb-option--logo:hover .tb-option__logo,
.tb-option--logo input:checked ~ .tb-option__logo {
	border-color: var(--tbf-accent);
}

.tb-option--logo input:checked ~ .tb-option__logo {
	box-shadow: 0 0 0 1px var(--tbf-accent);
}

/* Kod brendova se fokus vidi na okviru sa logom (veći i uočljiviji od štiklira) */
.tb-option--logo input:focus-visible + .tb-option__box {
	outline: 0;
}

.tb-option--logo input:focus-visible ~ .tb-option__logo {
	outline: 2px solid var(--tbf-focus);
	outline-offset: 2px;
}

.tb-filters.is-enhanced .tb-facet:not(.is-expanded) .is-extra,
.tb-sheet .tb-facet:not(.is-expanded) .is-extra {
	display: none;
}

.tb-facet__more {
	margin: 0.25rem 0 1rem;
	padding: 0.25rem 0;
	border: 0;
	background: none;
	color: var(--tbf-accent);
	font: inherit;
	font-size: 0.8125rem;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}

.tb-filters:not(.is-enhanced) .tb-facet__more {
	display: none;
}

/* Prst: „Prikaži još N“ je visok 44 px (pravilo za dodir), a razmak oko njega ostaje isti kao na računaru. */
@media (pointer: coarse) {
	.tb-facet__more {
		display: inline-flex;
		align-items: center;
		min-block-size: 44px;
		margin-block: calc(0.25rem - 7px) calc(1rem - 7px);
	}
}

/* Boje (kružići, kao na referentnoj slici 01), sa malim nazivom ispod: boja se ne prepoznaje samo po boji,
   a naziv se vidi i na dodir (title se na telefonu ne prikazuje). */
.tb-swatches {
	--tbf-dot: 2rem;
	--tbf-dot-ring: inset 0 0 0 1px rgba(0, 0, 0, 0.45); /* 3:1 i za svetle boje (Bela, Bež) na beloj pozadini */

	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(4.25rem, 1fr)); /* kolona dovoljno široka za „Narandžasta“ */
	gap: 0.8rem 0;
	margin: 0;
	padding: 0.25rem 0 0;
	list-style: none;
}

.tb-swatch {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.35rem;
	min-width: 0;
	cursor: pointer;
}

.tb-swatch__dot {
	display: grid;
	place-items: center;
	flex: none;
	width: var(--tbf-dot);
	height: var(--tbf-dot);
	border-radius: 999px;
	background: var(--tb-swatch);
	box-shadow: var(--tbf-dot-ring);
	transition: transform 160ms var(--tbf-ease), box-shadow 160ms ease;
}

.tb-swatch:hover .tb-swatch__dot {
	transform: scale(1.08);
}

.tb-swatch__check {
	width: 0.95rem;
	height: 0.95rem;
	color: #fff;
	opacity: 0;
	stroke-width: 3;
	filter: drop-shadow(0 0 1.5px rgba(0, 0, 0, 0.7));
}

.tb-swatch input:checked + .tb-swatch__dot {
	box-shadow: var(--tbf-dot-ring), 0 0 0 2px #fff, 0 0 0 4px var(--tbf-accent);
}

.tb-swatch input:checked + .tb-swatch__dot .tb-swatch__check {
	opacity: 1;
}

/* Fokus sa tastature: zlatni prsten (izabrana boja ima tamnozeleni, pa se oba vide zajedno) */
.tb-swatch input:focus-visible + .tb-swatch__dot {
	box-shadow: var(--tbf-dot-ring), 0 0 0 2px #fff, 0 0 0 4px var(--tbf-focus);
}

.tb-swatch input:checked:focus-visible + .tb-swatch__dot {
	box-shadow: var(--tbf-dot-ring), 0 0 0 2px #fff, 0 0 0 4px var(--tbf-accent), 0 0 0 6px var(--tbf-focus);
}

.tb-swatch__name {
	max-width: 100%;
	overflow: hidden;
	color: var(--tbf-muted);
	font-size: 0.6875rem;
	line-height: 1.2;
	text-align: center;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.tb-swatch input:checked ~ .tb-swatch__name {
	color: var(--tbf-ink);
	font-weight: 600;
}

/* Cena: klizač sa dve ručice i polja od-do */
/* Ručica 24 px: najmanja meta za dodir i klik (WCAG 2.5.8); visina polja klizača prati ručicu. */
.tb-price {
	--tbf-thumb: 24px;
	padding-top: 0.25rem;
}

.tb-price__slider {
	position: relative;
	height: var(--tbf-thumb);
	margin: 0 calc(var(--tbf-thumb) / 2) 0.9rem;
}

.tb-price__track {
	position: absolute;
	top: 50%;
	right: calc(var(--tbf-thumb) / -2);
	left: calc(var(--tbf-thumb) / -2);
	height: 4px;
	border-radius: 999px;
	background: var(--tbf-line);
	transform: translateY(-50%);
}

.tb-price__fill {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: 0 calc(var(--tbf-thumb) / 2);
	border-radius: inherit;
	background: var(--tbf-accent);
}

.tb-price input[type="range"] {
	position: absolute;
	top: 0;
	right: calc(var(--tbf-thumb) / -2);
	left: calc(var(--tbf-thumb) / -2);
	width: calc(100% + var(--tbf-thumb));
	height: var(--tbf-thumb);
	margin: 0;
	background: none;
	pointer-events: none;
	appearance: none;
	-webkit-appearance: none;
}

.tb-price input[type="range"]::-webkit-slider-runnable-track {
	height: var(--tbf-thumb);
	background: none;
}

.tb-price input[type="range"]::-moz-range-track {
	background: none;
}

.tb-price input[type="range"]::-webkit-slider-thumb {
	width: var(--tbf-thumb);
	height: var(--tbf-thumb);
	border: 2px solid var(--tbf-accent);
	border-radius: 999px;
	background: #fff;
	box-shadow: 0 2px 6px rgba(13, 53, 45, 0.25);
	cursor: grab;
	pointer-events: auto;
	-webkit-appearance: none;
}

.tb-price input[type="range"]::-moz-range-thumb {
	width: var(--tbf-thumb);
	height: var(--tbf-thumb);
	border: 2px solid var(--tbf-accent);
	border-radius: 999px;
	background: #fff;
	box-shadow: 0 2px 6px rgba(13, 53, 45, 0.25);
	cursor: grab;
	pointer-events: auto;
}

.tb-price input[type="range"]:focus-visible::-webkit-slider-thumb {
	outline: 2px solid var(--tbf-focus);
	outline-offset: 2px;
}

.tb-price input[type="range"]:focus-visible::-moz-range-thumb {
	outline: 2px solid var(--tbf-focus);
	outline-offset: 2px;
}

.tb-price__inputs {
	display: flex;
	align-items: flex-end;
	gap: 0.5rem;
}

.tb-price__inputs label {
	display: grid;
	flex: 1;
	grid-template-columns: minmax(0, 1fr);
	min-width: 0;
	gap: 0.2rem;
	color: var(--tbf-muted);
	font-size: 0.75rem;
}

.tb-price__inputs input {
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
	min-height: 40px;
	padding: 0 0.65rem;
	border: 1px solid var(--tbf-control);
	border-radius: 8px;
	background: #fff;
	color: var(--tbf-ink);
	font: inherit;
	font-size: 0.875rem;
	font-variant-numeric: tabular-nums;
	-moz-appearance: textfield;
}

/* Ekran na dodir: 16 px, da iOS ne zumira pri fokusu polja „Od“ i „Do“; polja su visoka 44 px. */
@media (pointer: coarse) {
	.tb-price__inputs input {
		min-height: 44px;
		font-size: 1rem;
	}
}

.tb-price__inputs input::-webkit-inner-spin-button,
.tb-price__inputs input::-webkit-outer-spin-button {
	margin: 0;
	-webkit-appearance: none;
}

.tb-price__inputs input:focus {
	border-color: var(--tbf-accent);
	outline: none;
	box-shadow: 0 0 0 1px var(--tbf-accent), 0 0 0 4px rgba(13, 53, 45, 0.12);
}

.tb-price__sep {
	display: grid;
	place-items: center;
	align-self: flex-end;
	height: 40px;
	color: var(--tbf-muted);
	line-height: 1;
}

@media (pointer: coarse) {
	.tb-price__sep {
		height: 44px;
	}
}

/* --------------------------------------------------------------------------
   Aktivni filteri iznad proizvoda
   -------------------------------------------------------------------------- */
.tb-chips {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
}

.tb-chips[hidden] {
	display: none;
}

.tb-chip {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	min-height: 34px;
	padding: 0 0.55rem 0 0.8rem;
	border-radius: 999px;
	background: var(--tbf-paper);
	box-shadow: inset 0 0 0 1px var(--tbf-line);
	color: var(--tbf-ink);
	font-size: 0.8125rem;
	font-weight: 500;
	text-decoration: none;
	transition: box-shadow 140ms ease, background-color 140ms ease;
}

.tb-chip:hover {
	background: #fff;
	box-shadow: inset 0 0 0 1px var(--tbf-accent);
	text-decoration: none;
}

.tb-chip__x {
	width: 0.95rem;
	height: 0.95rem;
	color: var(--tbf-muted);
}

.tb-chips__clear {
	margin-left: 0.25rem;
	color: var(--tbf-muted);
	font-size: 0.8125rem;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* --------------------------------------------------------------------------
   Dugme „Filteri“ (telefon i tablet)
   -------------------------------------------------------------------------- */
.tb-filters-open {
	display: none;
	align-items: center;
	gap: 0.5rem;
	min-height: 42px;
	padding: 0 1rem;
	border: 1px solid var(--tbf-ink);
	border-radius: 999px;
	background: #fff;
	color: var(--tbf-ink);
	font: inherit;
	font-size: 0.875rem;
	font-weight: 600;
	cursor: pointer;
}

.tb-filters-open__badge {
	display: inline-grid;
	place-items: center;
	min-width: 1.25rem;
	height: 1.25rem;
	padding: 0 0.3rem;
	border-radius: 999px;
	background: var(--tbf-accent);
	color: #fff;
	font-size: 0.6875rem;
}

@media (max-width: 1023px) {
	.tb-filters.is-enhanced {
		display: none;
	}

	.tb-filters-open {
		display: inline-flex;
	}
}

/* Prst: 44 px (na računaru ostaje 42 px). */
@media (pointer: coarse) {
	.tb-filters-open {
		min-height: 44px;
	}
}

/* --------------------------------------------------------------------------
   Donja fioka (telefon i tablet)
   -------------------------------------------------------------------------- */
.tb-sheet {
	position: fixed;
	inset: 0;
	width: 100%;
	max-width: none;
	height: 100%;
	max-height: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	overflow: clip; /* fokus unutar fioke ne sme da pomeri sadržaj u stranu */
	border: 0;
	background: transparent;
	color: var(--tbf-ink);
}

.tb-sheet::backdrop {
	background: rgba(10, 43, 36, 0.45);
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
	animation: tbf-fade-in 240ms ease;
}

.tb-sheet.is-closing {
	pointer-events: none;
}

.tb-sheet.is-closing::backdrop {
	animation: tbf-fade-out 200ms ease forwards;
}

.tb-sheet__panel {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	display: flex;
	flex-direction: column;
	max-height: min(88dvh, 88vh);
	/* Sigurna zona: vrh fioke ostaje ispod statusne trake (iPhone bez okvira Safarija). */
	max-height: min(88dvh, 88vh, calc(100dvh - var(--tb-sa-t, env(safe-area-inset-top, 0px)) - 0.75rem));
	margin-inline: auto;
	max-width: 640px;
	border-radius: 20px 20px 0 0;
	background: #fff;
	box-shadow: 0 -18px 50px rgba(10, 43, 36, 0.2);
	animation: tbf-sheet-in 320ms var(--tbf-ease);
}

.tb-sheet.is-closing .tb-sheet__panel {
	animation: tbf-sheet-out 200ms ease forwards;
}

.tb-sheet__handle {
	width: 40px;
	height: 4px;
	margin: 0.6rem auto 0;
	border-radius: 999px;
	background: var(--tbf-line);
}

.tb-sheet__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0.5rem 0.75rem 0.5rem 1.25rem;
	border-bottom: 1px solid var(--tbf-line);
}

.tb-sheet__title {
	margin: 0;
	font-size: 1.125rem;
	font-weight: 700;
	letter-spacing: -0.01em;
}

.tb-sheet__close {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border: 0;
	border-radius: 999px;
	background: var(--tbf-paper);
	color: var(--tbf-ink);
	cursor: pointer;
}

.tb-sheet__body {
	flex: 1;
	min-height: 0;
	padding: 0 1.25rem;
	overflow-y: auto;
	overscroll-behavior: contain;
}

.tb-sheet__body .tb-filters__head {
	display: none;
}

.tb-sheet__body .tb-facet:last-of-type {
	border-bottom: 0;
}

.tb-sheet__body .tb-option {
	min-height: 44px;
}

.tb-sheet__body .tb-swatches {
	--tbf-dot: 2.5rem;

	gap: 0.9rem 0;
}

.tb-sheet__foot {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0.75rem;
	padding: 0.85rem 1.25rem calc(0.85rem + var(--tb-sa-b, env(safe-area-inset-bottom, 0px)));
	border-top: 1px solid var(--tbf-line);
	background: #fff;
}

/* Dugmad kao u dizajn sistemu (A-050): verzal sa razmakom slova 0,04 em, težina 600, visina i zaobljenje kao .tb-btn. */
.tb-sheet__reset,
.tb-sheet__apply {
	min-height: var(--wp--custom--control--height, 48px);
	padding: 0 1.25rem;
	border-radius: var(--wp--custom--radius, 10px);
	font: inherit;
	font-size: var(--wp--preset--font-size--xs, 0.8125rem);
	font-weight: 600;
	letter-spacing: var(--wp--custom--letter-spacing--caps, 0.04em);
	line-height: 1.2;
	text-transform: uppercase;
	cursor: pointer;
}

.tb-sheet__reset {
	border: 1px solid var(--tbf-line);
	background: #fff;
	color: var(--tbf-ink);
}

.tb-sheet__apply {
	border: 0;
	background: var(--tbf-accent);
	color: #fff;
	transition: background-color 160ms ease, opacity 160ms ease;
}

.tb-sheet__apply:disabled {
	opacity: 0.55;
	cursor: not-allowed;
}

.tb-sheet__apply.is-loading {
	opacity: 0.7;
}

@keyframes tbf-sheet-in {
	from { transform: translateY(100%); }
}

@keyframes tbf-sheet-out {
	to { transform: translateY(100%); }
}

@keyframes tbf-fade-in {
	from { opacity: 0; }
}

@keyframes tbf-fade-out {
	to { opacity: 0; }
}

html:has(.tb-sheet[open]) {
	overflow: hidden;
}

/* Učitavanje posle promene filtera */
.tb-is-loading .tb-filters__form {
	opacity: 0.75;
	transition: opacity 160ms ease;
}

@media (prefers-reduced-motion: reduce) {
	.tb-sheet__panel,
	.tb-sheet::backdrop {
		animation: none !important;
	}
}