/* ==========================================================================
   Bottom mobile navigacija - fiksna traka na dnu ekrana, samo mobile/tablet.
   4 dugmeta: Nazad / Pretraga (overlay) / Postavi oglas (FAB) / Moj nalog.
   Redizajnirano iz LIVE sajta (#sn-bottom-nav) u JE-stilu V2 teme.
   ========================================================================== */

.sn-bottom-nav {
	display: none;
}

@media (max-width: 1023px) {
	.sn-footer {
		padding-bottom: calc(56px + env(safe-area-inset-bottom));
	}

	.sn-bottom-nav {
		display: flex;
		align-items: stretch;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 500;
		height: calc(56px + env(safe-area-inset-bottom));
		padding-bottom: env(safe-area-inset-bottom);
		transform: translate3d(0, 0, 0);
		-webkit-transform: translate3d(0, 0, 0);
		-webkit-backface-visibility: hidden;
		background: var(--sn-white);
		border-top: var(--sn-border-width) solid var(--sn-border-color);
		box-shadow: 0 -4px 16px rgba(15, 23, 42, 0.06);
	}

	.sn-bn-item {
		position: relative;
		flex: 1 1 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 3px;
		text-decoration: none;
		color: var(--sn-ink-400);
		font-family: var(--sn-font-sans);
		font-size: 10px;
		font-weight: 500;
		letter-spacing: 0.01em;
		background: none;
		border: none;
		cursor: pointer;
		-webkit-tap-highlight-color: transparent;
		transition: color .15s ease;
	}

	.sn-bn-item svg {
		width: 21px;
		height: 21px;
		stroke: currentColor;
		fill: none;
		stroke-width: 1.8;
		stroke-linecap: round;
		stroke-linejoin: round;
	}

	.sn-bn-item.is-active {
		color: var(--sn-primary);
	}

	.sn-bn-item:focus-visible {
		outline: 2px solid var(--sn-primary);
		outline-offset: -2px;
	}

	/* Postavi oglas - istaknuti FAB, podignut iznad linije trake. Ikonica "plus-bare"
	   (samo krst, bez sopstvenog kruga) da bi se cisto centrirala unutar CSS kruga ispod. */
	.sn-bn-postavi .sn-bn-item__icon {
		background: var(--sn-primary);
		border-radius: var(--sn-radius-accent, 999px);
		width: 42px;
		height: 42px;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-top: -18px;
		box-shadow: 0 4px 12px rgba(88, 143, 112, 0.4);
		transition: transform .15s ease;
	}

	.sn-bn-postavi svg {
		stroke: var(--sn-white);
		stroke-width: 2.4;
		width: 18px;
		height: 18px;
	}

	.sn-bn-postavi span:last-child {
		color: var(--sn-primary);
		font-weight: 600;
	}

	.sn-bn-postavi:active .sn-bn-item__icon {
		transform: scale(0.93);
	}

	/* Pretraga - overlay panel koji kliza odozgo, iznad donje trake */
	.sn-bn-search-overlay {
		position: fixed;
		inset: 0;
		z-index: 600;
	}

	.sn-bn-search-overlay[hidden] {
		display: none;
	}

	.sn-bn-search-overlay__backdrop {
		position: absolute;
		inset: 0;
		background: rgba(15, 23, 42, 0.45);
	}

	.sn-bn-search-overlay__panel {
		position: absolute;
		left: 0;
		right: 0;
		bottom: calc(56px + env(safe-area-inset-bottom));
		background: var(--sn-white);
		padding: var(--sn-space-4) var(--sn-space-4) var(--sn-space-5);
		border-top-left-radius: 16px;
		border-top-right-radius: 16px;
		box-shadow: 0 -8px 24px rgba(15, 23, 42, 0.12);
		display: flex;
		flex-direction: column;
		gap: var(--sn-space-3);
	}

	.sn-bn-search-overlay__head {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.sn-bn-search-overlay__title {
		font-family: var(--sn-font-serif);
		font-size: var(--sn-text-lg);
		color: var(--sn-ink-900);
	}

	.sn-bn-search-overlay__close {
		background: none;
		border: none;
		cursor: pointer;
		color: var(--sn-ink-500);
		padding: 4px;
		line-height: 0;
	}

	.sn-bn-search-overlay__close svg {
		width: 20px;
		height: 20px;
		stroke: currentColor;
		fill: none;
		stroke-width: 1.8;
	}

	.sn-bn-search-overlay__row {
		display: flex;
		align-items: center;
		gap: var(--sn-space-2);
		border: var(--sn-border-width) solid var(--sn-border-color);
		border-radius: var(--sn-radius, 0);
		padding: 0 var(--sn-space-3);
		height: 48px;
	}

	.sn-bn-search-overlay__icon {
		width: 18px;
		height: 18px;
		flex: none;
		stroke: var(--sn-ink-400);
		fill: none;
		stroke-width: 1.8;
	}

	.sn-bn-search-overlay__row input {
		flex: 1;
		border: none;
		outline: none;
		font-family: var(--sn-font-sans);
		font-size: var(--sn-text-base);
		color: var(--sn-ink-900);
		background: none;
	}

	.sn-bn-search-overlay__submit {
		width: 100%;
		justify-content: center;
	}

	.sn-bn-search-overlay.is-open .sn-bn-search-overlay__panel {
		animation: sn-bn-search-slide-up .2s ease;
	}

	@keyframes sn-bn-search-slide-up {
		from { transform: translateY(16px); opacity: 0; }
		to { transform: translateY(0); opacity: 1; }
	}
}
@media (max-width: 1023px) {
	.sn-bn-postavi .sn-bn-item__icon svg { display: block; margin: 0; flex: 0 0 auto; }
}