/* BYD Distributeri */
.bydd {
	--bydd-ink: #1a1d21;
	--bydd-muted: #5f6670;
	--bydd-line: #e2e5e9;
	--bydd-soft: #f4f5f7;
	--bydd-blue: #2b6cf6;
	--bydd-radius: 20px;
	color: var(--bydd-ink);
	font: inherit;
}
.bydd *, .bydd *::before, .bydd *::after { box-sizing: border-box; }
.bydd [hidden] { display: none !important; }
.bydd-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Filter traka */
.bydd-bar {
	position: sticky;
	top: var(--bydd-sticky-top, 0px);
	z-index: 20;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 16px;
	padding: 14px 0;
	margin-bottom: 8px;
	background: var(--bydd-bg, #fff);
}
.bydd-tabs { display: inline-flex; gap: 4px; padding: 4px; border-radius: 999px; background: var(--bydd-soft); }
.bydd-tabs button {
	appearance: none; border: 0; margin: 0;
	padding: 10px 20px;
	border-radius: 999px;
	background: transparent;
	color: var(--bydd-ink);
	font: inherit; font-size: 15px; line-height: 1.2;
	cursor: pointer;
}
.bydd-tabs button[aria-pressed="true"] { background: var(--bydd-ink); color: #fff; }
.bydd-tabs button:not([aria-pressed="true"]):hover { background: #e7e9ec; }

.bydd-city select {
	appearance: none;
	-webkit-appearance: none;
	margin: 0;
	height: 44px;
	padding: 0 40px 0 18px;
	border: 1px solid var(--bydd-line);
	border-radius: 999px;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%231a1d21' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 16px center;
	color: var(--bydd-ink);
	font: inherit; font-size: 15px;
	cursor: pointer;
}
.bydd-count { margin: 0 0 0 auto; font-size: 14px; color: var(--bydd-muted); }

/* Lista */
.bydd-list { display: flex; flex-direction: column; gap: 20px; }
.bydd-co {
	border: 1px solid var(--bydd-line);
	border-radius: var(--bydd-radius);
	padding: 24px;
	background: #fff;
}
.bydd-co__name { margin: 0 0 16px; font-size: 22px; line-height: 1.25; font-weight: 600; }
.bydd-co__locs {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
	gap: 16px;
}
.bydd-loc {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 18px 20px;
	border-radius: 14px;
	background: var(--bydd-soft);
	transition: box-shadow .2s, background .2s;
	scroll-margin: 120px;
}
.bydd-loc.is-active { background: #fff; box-shadow: 0 0 0 2px var(--bydd-ink); }
.bydd-loc.is-flash { box-shadow: 0 0 0 2px var(--bydd-blue); }

.bydd-loc__types { display: flex; gap: 6px; }
.bydd-tag {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 13px; line-height: 1.3; font-weight: 500;
	background: #fff;
}
.bydd-tag::before { content: ""; width: 8px; height: 8px; border-radius: 50%; }
.bydd-tag--sales::before { background: var(--bydd-ink); }
.bydd-tag--service::before { background: var(--bydd-blue); }

.bydd-loc__addr { margin: 0; font-size: 16px; line-height: 1.45; font-weight: 500; }
.bydd-loc__addr--tbd { color: var(--bydd-muted); font-weight: 400; }

.bydd-loc__contact { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; font-size: 15px; }
.bydd-loc__contact li { margin: 0; }
.bydd-loc__contact a { color: var(--bydd-ink); text-decoration: none; overflow-wrap: anywhere; }
.bydd-loc__contact a:hover { text-decoration: underline; }

.bydd-loc__hours { display: flex; flex-direction: column; font-size: 14px; color: var(--bydd-muted); line-height: 1.5; }
.bydd-loc__label { color: var(--bydd-ink); font-weight: 500; }

.bydd-loc__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 4px; }
.bydd-btn {
	appearance: none;
	display: inline-flex; align-items: center; justify-content: center;
	min-height: 40px;
	margin: 0;
	padding: 8px 16px;
	border: 1px solid var(--bydd-ink);
	border-radius: 999px;
	background: transparent;
	color: var(--bydd-ink) !important;
	font: inherit; font-size: 14px; font-weight: 500; line-height: 1.2;
	text-decoration: none !important;
	cursor: pointer;
	transition: background .15s, color .15s;
}
.bydd-btn:hover { background: var(--bydd-ink); color: #fff !important; }
.bydd-btn--dark { background: var(--bydd-ink); color: #fff !important; }
.bydd-btn--dark:hover { background: #3a3f46; border-color: #3a3f46; }

.bydd-empty { margin: 0; padding: 32px; text-align: center; color: var(--bydd-muted); border: 1px dashed var(--bydd-line); border-radius: var(--bydd-radius); }

.bydd button:focus-visible, .bydd a:focus-visible, .bydd select:focus-visible { outline: 2px solid var(--bydd-blue); outline-offset: 2px; }

/* Mapa */
.bydd-mapwrap { position: relative; margin-top: 32px; }
.bydd-legend {
	position: absolute; z-index: 500; top: 16px; left: 16px;
	display: flex; flex-wrap: wrap; gap: 6px 16px;
	padding: 10px 16px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .92);
	box-shadow: 0 4px 18px rgba(20, 30, 45, .12);
	font-size: 13px;
}
.bydd-legend span { display: inline-flex; align-items: center; gap: 6px; }
.bydd-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.bydd-dot--sales { background: var(--bydd-ink); }
.bydd-dot--service { background: var(--bydd-blue); }
.bydd-dot--both { background: var(--bydd-ink); box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--bydd-blue); }

.bydd-map {
	height: var(--bydd-map-h, 560px);
	min-height: 360px;
	border-radius: var(--bydd-radius);
	overflow: hidden;
	background: #e8eef0;
	z-index: 0;
}

.bydd .leaflet-tile-pane { filter: saturate(.8); } /* smirenije boje podloge, da se pinovi ističu */
.bydd-pin { background: none; border: 0; }
.bydd-pin svg { display: block; filter: drop-shadow(0 3px 4px rgba(0, 0, 0, .3)); transform-origin: 50% 100%; transition: transform .15s; }
.bydd-pin circle { fill: #fff; }
.bydd-pin--sales path { fill: #1a1d21; }
.bydd-pin--service path { fill: #2b6cf6; }
.bydd-pin--both path { fill: #1a1d21; stroke: #2b6cf6; stroke-width: 2.5; }
.bydd-pin.is-active svg { transform: scale(1.3); }

.bydd .leaflet-popup-content-wrapper { border-radius: 16px; box-shadow: 0 8px 30px rgba(0, 0, 0, .16); }
.bydd .leaflet-popup-content { margin: 16px 18px; font: inherit; font-size: 14px; line-height: 1.45; }
.bydd-pop { display: flex; flex-direction: column; gap: 3px; font-family: var(--bydd-font, inherit); font-size: 14px; line-height: 1.45; color: var(--bydd-ink); }
.bydd .gm-style .gm-style-iw-c { border-radius: 16px; }
.bydd .gm-style div.bydd-pin { cursor: pointer; }
.bydd-pop__co { font-size: 16px; }
.bydd-pop__type { color: var(--bydd-muted); margin-bottom: 6px; }
.bydd-pop a { color: var(--bydd-ink); }
.bydd-pop__hours { color: var(--bydd-muted); margin-top: 4px; }
.bydd-pop__actions { display: flex; gap: 8px; margin-top: 12px; }
.bydd-pop__actions .bydd-btn { min-height: 34px; padding: 6px 14px; font-size: 13px; }

.bydd .leaflet-control-zoom { border: 0; box-shadow: 0 4px 16px rgba(0, 0, 0, .15); border-radius: 12px; overflow: hidden; }
.bydd .leaflet-control-zoom a { width: 40px; height: 40px; line-height: 40px; color: var(--bydd-ink); }

@media (max-width: 767px) {
	.bydd-bar { gap: 10px; }
	.bydd-tabs { width: 100%; }
	.bydd-tabs button { flex: 1; padding: 10px 8px; }
	.bydd-city { flex: 1; }
	.bydd-city select { width: 100%; }
	.bydd-co { padding: 18px; }
	.bydd-co__name { font-size: 19px; }
	.bydd-map { height: 62vh; }
	.bydd-legend { position: static; margin-bottom: 10px; box-shadow: none; padding: 0; background: none; border-radius: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.bydd *, .bydd *::before, .bydd *::after { transition: none !important; }
}
