.gk-configurator {
	background: #F7F7F7;
	padding: 44px 40px;
	border-radius: 20px;
	/* Namjerno "inherit", ne konkretan font: konfigurator se prikazuje unutar
	   teme (WoodMart/Elementor) i preuzima font koji stranica već koristi,
	   umjesto da nameće vlastiti. Ovo je i dalje u skladu s ranijom GDPR
	   odlukom da plugin sam ne učitava Google Fonts — samo koristi ono što
	   je tema već učitala. */
	font-family: inherit;
	font-size: 17px;
	line-height: 1.5;
	color: #1A1A1A;
	max-width: 1120px;
	width: 100%;
	margin: 0 auto;
	box-sizing: border-box;
}
.gk-configurator * { box-sizing: border-box; }
/* Gumbi ne nasljeđuju font-family po defaultu u preglednicima (za razliku
   od ostalih elemenata), pa to eksplicitno postavljamo da i oni prate
   font stranice. */
.gk-configurator button { font-family: inherit; }
.gk-configurator .gk-fallback { color: #6B6B6B; text-align: center; }
.gk-step { display: flex; flex-direction: column; gap: 18px; margin-bottom: 36px; }
.gk-step h3 { font-size: 21px; font-weight: 700; margin: 0; }
.gk-row { display: flex; gap: 16px; }
.gk-wrap { flex-wrap: wrap; gap: 40px; }
.gk-panel { background: #FFFFFF; border: 1px solid #E5E5E5; border-radius: 16px; padding: 26px 28px; }

.gk-card {
	flex: 1;
	min-width: 190px;
	border: 1px solid #E5E5E5;
	background: #FFFFFF;
	border-radius: 16px;
	padding: 26px 22px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	text-align: left;
	cursor: pointer;
	font-family: inherit;
}
.gk-card span { font-size: 17px; font-weight: 700; }
.gk-card.is-active { border: 2px solid #F66013; background: rgba(246, 96, 19, 0.07); }

.gk-field { display: flex; flex-direction: column; gap: 12px; }
.gk-label { font-size: 15px; color: #6B6B6B; }
.gk-stepper { display: flex; align-items: center; gap: 18px; }
.gk-round-btn {
	width: 46px;
	height: 46px;
	border-radius: 50%;
	border: 1px solid #E5E5E5;
	background: #FFFFFF;
	color: #1A1A1A;
	cursor: pointer;
	font-size: 20px;
	line-height: 1;
}
.gk-round-btn.gk-small { width: 38px; height: 38px; font-size: 17px; }
.gk-count { font-size: 30px; font-weight: 700; min-width: 42px; text-align: center; display: inline-block; }
.gk-count.gk-small { font-size: 19px; font-weight: 700; min-width: 58px; }

.gk-pill {
	padding: 14px 26px;
	border-radius: 12px;
	font-weight: 700;
	font-size: 16px;
	border: 1px solid #E5E5E5;
	background: #FFFFFF;
	color: #1A1A1A;
	cursor: pointer;
}
.gk-pill.is-active { background: #F66013; color: #FFFFFF; border-color: #F66013; }

/* align-items: flex-start (ne stretch) — nužno da istaknuta (Plus) kartica
   može biti viša od ostalih bez da flex prisilno izjednači visine svih. */
.gk-tiers { align-items: flex-start; flex-wrap: wrap; }
.gk-tier-card {
	flex: 1;
	min-width: 260px;
	position: relative;
	border: 1px solid #E5E5E5;
	background: #FFFFFF;
	border-radius: 18px;
	padding: 30px 26px;
	display: flex;
	flex-direction: column;
	gap: 15px;
}
.gk-tier-card.is-active { border: 2px solid #F66013; box-shadow: 0 12px 30px rgba(246, 96, 19, 0.15); }
.gk-tier-card.is-disabled { opacity: 0.6; }
/* Srednji (Plus/"preporuceni") paket vizualno istaknut — viši od ostalih:
   bazni padding kartice je 30px, ovdje je +20px gore/dolje (50px ukupno) +
   negativna vanjska margina gore/dolje da kartica "izraste" iznad i ispod
   susjednih, uz flex-start iznad da ih ne povlači za sobom. */
.gk-tier-card.gk-tier-featured {
	padding-top: 50px;
	padding-bottom: 50px;
	margin-top: -14px;
	margin-bottom: -14px;
	z-index: 1;
	box-shadow: 0 14px 32px rgba(0, 0, 0, 0.08);
}
.gk-tier-card h4 { margin: 0; font-size: 19px; font-weight: 700; }
.gk-tagline { margin: 0; font-size: 14.5px; color: #6B6B6B; }
.gk-tier-price { font-size: 28px; font-weight: 700; }
.gk-tier-price.gk-tier-unavailable { font-size: 14px; font-weight: 500; color: #B3261E; }
.gk-features { display: flex; flex-direction: column; gap: 9px; }
.gk-feature { display: flex; align-items: flex-start; gap: 8px; font-size: 14.5px; color: #3A3A3A; }
.gk-feature svg { flex-shrink: 0; margin-top: 3px; width: 15px; height: 15px; }
.gk-badge {
	position: absolute;
	top: -14px;
	left: 50%;
	transform: translateX(-50%);
	background: #F66013;
	color: #FFFFFF;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .03em;
	text-transform: uppercase;
	padding: 5px 14px;
	border-radius: 999px;
	white-space: nowrap;
}
.gk-btn {
	margin-top: auto;
	border-radius: 12px;
	padding: 14px 18px;
	font-weight: 700;
	font-size: 15px;
	border: 1px solid #D8D8D8;
	background: #FFFFFF;
	color: #1A1A1A;
	cursor: pointer;
}
.gk-btn:disabled { cursor: not-allowed; opacity: 0.6; }
.gk-tier-card.is-active .gk-btn { background: #F66013; color: #FFFFFF; border: none; }

.gk-cable-len { align-items: center; gap: 16px; margin-top: 16px; flex-wrap: wrap; }
.gk-cable-price { margin-left: auto; font-size: 14.5px; color: #6B6B6B; }

.gk-total-bar {
	margin-top: 20px;
	background: #1A1A1A;
	border-radius: 18px;
	padding: 28px 30px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 18px;
}
.gk-total-label { color: #FFFFFF; font-size: 16.5px; font-weight: 600; }
.gk-total-right { display: flex; align-items: center; gap: 20px; }
.gk-total-amount { font-size: 30px; font-weight: 700; color: #F66013; }
/* Rabat iz konfiguratora (Alarm) — ušteda prikazana uz "Ukupno", i
   prekrižena cijena bez popusta uz stvarni (umanjeni) iznos. */
.gk-discount-savings { margin-top: 6px; font-size: 13px; font-weight: 600; color: #8BE0A5; }
.gk-total-original { font-size: 16px; color: #9A9A9A; text-decoration: line-through; }
/* Narančasta pozadina (#F66013, ista kao ostali akcentni elementi) s tamnim
   tekstom — v1.3.2 je pogrešno promijenio pozadinu u bijelu, ispravljeno
   nazad na narančastu u v1.3.3. Oblik (border-radius/padding) nepromijenjen. */
.gk-btn-primary {
	background: #F66013;
	color: #1A1A1A;
	border: none;
	border-radius: 12px;
	padding: 16px 26px;
	font-weight: 700;
	font-size: 15.5px;
	cursor: pointer;
}

/* Prvo (nenumerirano) polje: odabir usluge — video nadzor ili alarm. */
.gk-services { flex-wrap: wrap; }
.gk-service-card { min-width: 260px; }
.gk-service-card small { font-size: 13.5px; color: #6B6B6B; font-weight: 500; }

.gk-service-chosen {
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: #FFFFFF;
	border: 1px solid #E5E5E5;
	border-radius: 14px;
	padding: 16px 22px;
	margin-bottom: 30px;
	font-weight: 700;
	font-size: 15.5px;
}
.gk-link-btn {
	background: none;
	border: none;
	color: #F66013;
	font-weight: 700;
	font-size: 14.5px;
	cursor: pointer;
	padding: 0;
	font-family: inherit;
}

.gk-hint { font-size: 13.5px; color: #6B6B6B; }

/* Alarm — korak "Dodatna oprema": grupirani popis stavki s količinom po redu. */
.gk-equip-panel { display: flex; flex-direction: column; gap: 26px; }
.gk-equip-group { display: flex; flex-direction: column; gap: 4px; }
.gk-equip-group-label {
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: #F66013;
	margin-bottom: 6px;
}
.gk-equip-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 12px 0;
	border-bottom: 1px solid #EFEFEF;
	flex-wrap: wrap;
}
.gk-equip-row:last-child { border-bottom: none; }
.gk-equip-name { flex: 1; min-width: 200px; font-size: 15.5px; font-weight: 600; }
.gk-stepper-inline { gap: 12px; }
.gk-equip-price { min-width: 90px; text-align: right; font-size: 14.5px; color: #6B6B6B; }

@media (max-width: 640px) {
	.gk-configurator { padding: 30px 20px; }
	.gk-row.gk-types { flex-direction: column; }
	.gk-row.gk-services { flex-direction: column; }
	.gk-tiers { flex-direction: column; }
	.gk-equip-row { flex-direction: column; align-items: flex-start; gap: 8px; }
}