/* ============ Vignette Configurator — tollentrio style ============ */
.vc-app { --vc-green:#10b981; --vc-green-dark:#059669; --vc-green-soft:#d1fae5; --vc-green-bg:#ecfdf5;
  --vc-ink:#0f172a; --vc-ink-soft:#374151; --vc-muted:#6b7280; --vc-border:#e5e7eb; --vc-border-strong:#d1d5db;
  --vc-bg-soft:#f9fafb; --vc-eu-blue:#003399; --vc-eu-yellow:#ffcc00;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Arial,sans-serif;
  color:var(--vc-ink); max-width:820px; margin:0 auto; }
.vc-card { background:#fff; border:1px solid var(--vc-border); border-radius:18px; overflow:hidden; box-shadow:0 6px 24px -10px rgba(0,0,0,.08); }
.vc-header { display:flex; align-items:center; justify-content:space-between; padding:20px 28px; border-bottom:1px solid var(--vc-border); background:#fff; }
.vc-header h2 { margin:0; font-size:20px; font-weight:800; letter-spacing:-0.01em; }
.vc-steps { display:flex; gap:6px; }
.vc-dot { width:32px; height:6px; border-radius:999px; background:var(--vc-border); }
.vc-dot.active { background:var(--vc-green); }
.vc-body { padding:24px 28px 28px; }
/* Hide inactive panels/titles without using the HTML `hidden` attribute,
   which Google Translate and similar browser tools skip entirely. Using
   absolute off-screen positioning keeps the text in the DOM so it gets
   translated on initial page scan. */
.vc-is-hidden { position:absolute !important; left:-9999px !important; top:auto !important; width:1px !important; height:1px !important; overflow:hidden !important; pointer-events:none !important; opacity:0 !important; }

.vc-label { display:flex; align-items:center; gap:8px; font-weight:600; font-size:14px; color:var(--vc-ink); margin:22px 0 12px; }
.vc-label:first-child { margin-top:0; }
.vc-label svg { width:18px; height:18px; color:var(--vc-green); }

.vc-input { width:100%; padding:14px 16px; border:1px solid var(--vc-border-strong); border-radius:12px; font-size:15px; box-sizing:border-box; background:#fff; }
.vc-input:focus { outline:none; border-color:var(--vc-green); box-shadow:0 0 0 3px rgba(16,185,129,.15); }
.vc-hint { font-size:12px; color:var(--vc-muted); margin-top:6px; }
.vc-err { color:#b91c1c; background:#fee2e2; padding:10px 12px; border-radius:8px; font-size:14px; margin-top:8px; }

/* Vehicle grid — big square cards */
.vc-veh-grid { display:grid; gap:12px; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); }
.vc-veh { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; padding:22px 14px; border:2px solid var(--vc-border); border-radius:14px; background:#fff; cursor:pointer; font-size:14px; font-weight:600; transition:all .15s; color:var(--vc-ink); min-height:110px; }
.vc-veh input { position:absolute; opacity:0; pointer-events:none; }
.vc-veh:hover { border-color:#9ca3af; }
.vc-veh.selected { border-color:var(--vc-green); background:var(--vc-green-bg); }
.vc-veh.selected::after { content:"✓"; position:absolute; top:8px; right:10px; color:var(--vc-green); font-weight:800; font-size:14px; }
.vc-veh-icon { width:28px; height:28px; color:var(--vc-ink-soft); }
.vc-veh.selected .vc-veh-icon { color:var(--vc-green-dark); }

/* Vehicle description right under cards */
.vc-veh-desc { margin-top:12px; padding:12px 14px; background:var(--vc-green-bg); border:1px solid var(--vc-green-soft); border-radius:12px; display:flex; gap:10px; align-items:flex-start; }
.vc-veh-desc::before { content:"ⓘ"; color:var(--vc-green-dark); font-size:16px; line-height:1.2; flex-shrink:0; }
.vc-veh-desc strong { display:none; }
.vc-veh-desc p { margin:0; font-size:14px; color:var(--vc-ink); line-height:1.5; }

/* Duration grid — small cards with label + price */
.vc-dur-list { display:grid; gap:10px; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); }
.vc-dur { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; padding:16px 10px; border:2px solid var(--vc-border); border-radius:12px; background:#fff; cursor:pointer; transition:all .15s; color:var(--vc-ink); }
.vc-dur input { position:absolute; opacity:0; pointer-events:none; }
.vc-dur:hover { border-color:#9ca3af; }
.vc-dur.selected { border-color:var(--vc-green); background:var(--vc-green-bg); }
.vc-dur.selected::after { content:"✓"; position:absolute; top:6px; right:10px; color:var(--vc-green); font-weight:800; font-size:13px; }
.vc-dur-label { font-weight:600; font-size:14px; }
.vc-dur-label svg { display:none; }
.vc-dur-price { font-weight:700; color:var(--vc-green-dark); font-size:13px; }

/* Combobox */
.vc-combo { position:relative; }
.vc-combo-btn { width:100%; display:flex; align-items:center; gap:10px; padding:14px 16px; border:1px solid var(--vc-border-strong); border-radius:12px; background:#fff; font-size:15px; cursor:pointer; text-align:left; }
.vc-combo-btn:hover { border-color:#9ca3af; }
.vc-combo-btn img { width:26px; height:18px; border-radius:2px; object-fit:cover; flex-shrink:0; box-shadow:0 0 0 1px rgba(0,0,0,.08); }
.vc-combo-btn .vc-caret { margin-left:auto; color:var(--vc-muted); display:inline-flex; }
.vc-combo-btn .vc-caret svg { width:16px; height:16px; }
.vc-combo-btn .vc-code { color:var(--vc-muted); font-size:12px; font-weight:600; }
.vc-combo-pop { position:absolute; left:0; right:0; top:calc(100% + 4px); background:#fff; border:1px solid var(--vc-border); border-radius:12px; box-shadow:0 10px 30px -10px rgba(0,0,0,.18); max-height:300px; overflow:hidden; z-index:50; display:flex; flex-direction:column; }
.vc-combo-search { padding:10px 12px; border-bottom:1px solid var(--vc-border); }
.vc-combo-search input { width:100%; border:none; outline:none; font-size:14px; }
.vc-combo-list { overflow-y:auto; max-height:248px; }
.vc-combo-opt { display:flex; align-items:center; gap:10px; padding:10px 12px; cursor:pointer; font-size:14px; }
.vc-combo-opt:hover, .vc-combo-opt.active { background:var(--vc-green-bg); }
.vc-combo-opt img { width:24px; height:17px; border-radius:2px; object-fit:cover; flex-shrink:0; box-shadow:0 0 0 1px rgba(0,0,0,.08); }
.vc-combo-opt .vc-code { color:var(--vc-muted); margin-left:auto; font-size:12px; }

/* EU plate */
.vc-plate-wrap { display:flex; align-items:stretch; border:1px solid var(--vc-border-strong); border-radius:12px; overflow:hidden; background:#fff; }
.vc-plate-wrap:focus-within { outline:none; border-color:var(--vc-green); box-shadow:0 0 0 3px rgba(16,185,129,.15); }
.vc-plate-prefix { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; padding:6px 10px; background:var(--vc-eu-blue); color:#fff; min-width:48px; }
.vc-plate-prefix .vc-eu-stars { width:22px; height:22px; display:block; }
.vc-plate-prefix .vc-cc { font-size:13px; font-weight:800; letter-spacing:.03em; line-height:1; font-family:Arial,sans-serif; }
.vc-plate-wrap input { border:none; outline:none; flex:1; padding:14px 14px; font-family:"Arial Narrow",Arial,sans-serif; font-size:22px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; text-align:left; background:#fff; color:#111; min-width:0; }
.vc-plate-wrap input::placeholder { color:#cbd5e1; font-weight:600; letter-spacing:.3em; }

/* Selection summary at top of step 2 */
.vc-selection { padding:14px 18px; border:1px solid var(--vc-border); border-radius:12px; background:var(--vc-bg-soft); margin-bottom:18px; }
.vc-selection-label { font-size:12px; color:var(--vc-muted); margin-bottom:4px; }
.vc-selection-value { font-weight:700; font-size:15px; }

/* Validity-end note */
.vc-validity-note { margin-top:10px; padding:12px 14px; background:var(--vc-green-bg); border:1px solid var(--vc-green-soft); border-radius:12px; font-size:14px; color:var(--vc-ink); display:flex; align-items:center; gap:8px; }

/* Summary / price */
.vc-summary { margin-top:24px; padding-top:20px; border-top:1px solid var(--vc-border); display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.vc-summary-head { display:none; }
.vc-price-block { flex:1; min-width:160px; }
.vc-price-block .vc-price-label { font-size:13px; color:var(--vc-muted); }
.vc-price-block .vc-price-amount { font-size:32px; font-weight:800; line-height:1.1; letter-spacing:-0.02em; }
.vc-summary-row { display:flex; justify-content:space-between; gap:30px; font-size:13px; color:var(--vc-muted); padding:2px 0; }
.vc-summary-row span:last-child { color:var(--vc-ink-soft); }
.vc-summary-total { display:flex; justify-content:space-between; align-items:center; font-size:15px; font-weight:700; gap:30px; padding-top:4px; }
.vc-summary-meta { width:100%; font-size:12px; color:var(--vc-muted); display:flex; flex-direction:column; gap:2px; margin-top:6px; }
.vc-summary-meta .vc-instant { color:var(--vc-green-dark); font-weight:600; }
.vc-fee-details { margin-top:6px; }

/* Black caret next to Total (hide-service-fee mode) */
.vc-total-left { display:inline-flex; align-items:center; gap:6px; }
.vc-fee-caret { background:none; border:none; padding:2px; cursor:pointer; color:#111; display:inline-flex; align-items:center; line-height:0; }
.vc-fee-caret svg { width:16px; height:16px; transition:transform .15s; }
.vc-fee-caret.open svg { transform:rotate(180deg); }

/* Buttons */
.vc-actions { display:flex; gap:10px; margin-top:20px; align-items:center; }
.vc-btn { padding:14px 22px; border-radius:999px; font-size:15px; font-weight:700; cursor:pointer; border:1px solid transparent; transition:all .15s; display:inline-flex; align-items:center; justify-content:center; gap:10px; }
.vc-btn-primary { background:#0f172a; color:#fff; border-color:#0f172a; padding-right:8px; }
.vc-btn-primary:hover:not(.disabled):not([disabled]) { background:#1e293b; }
.vc-btn-primary svg { width:16px; height:16px; background:var(--vc-green); color:#0f172a; padding:6px; border-radius:999px; box-sizing:content-box; }
.vc-btn-primary.disabled, .vc-btn-primary[disabled] { opacity:.45; cursor:not-allowed; }
.vc-btn-ghost { background:transparent; color:var(--vc-ink-soft); border:none; padding:14px 8px; font-weight:600; }
.vc-btn-ghost:hover { color:var(--vc-ink); }
.vc-btn-ghost svg { width:16px; height:16px; background:none; padding:0; }

/* In step 1, Next sits on the right */
.vc-step1-actions { display:flex; justify-content:flex-end; margin-top:18px; }

/* Picker */
.vc-picker { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:12px; }
.vc-picker-card { display:flex; align-items:center; gap:12px; padding:16px; border:1px solid var(--vc-border-strong); border-radius:12px; text-decoration:none; color:inherit; background:#fff; font-weight:600; transition:all .15s; }
.vc-picker-card:hover { border-color:var(--vc-green); background:var(--vc-green-bg); }
.vc-picker-card img { width:36px; height:26px; border-radius:3px; object-fit:cover; box-shadow:0 0 0 1px rgba(0,0,0,.08); }
.vc-title { margin:0 0 16px; font-size:18px; font-weight:700; }

/* Plain server-rendered form — no JS required */
.vc-plain .vc-card { border-radius:16px; }
.vc-form { max-width:820px; margin:0 auto; }
.vc-option-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px; }
.vc-option-card { position:relative; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px; border:1px solid var(--vc-border-strong); border-radius:12px; background:#fff; cursor:pointer; transition:border-color .15s, background .15s, box-shadow .15s; }
.vc-option-card:hover { border-color:var(--vc-green); box-shadow:0 6px 18px -14px rgba(15,23,42,.5); }
.vc-option-card input { position:absolute; opacity:0; pointer-events:none; }
.vc-option-card:has(input:checked) { border-color:var(--vc-green); background:var(--vc-green-bg); box-shadow:inset 0 0 0 1px var(--vc-green); }
.vc-option-main { display:flex; flex-direction:column; gap:3px; min-width:0; }
.vc-option-main strong { font-size:14px; line-height:1.25; color:var(--vc-ink); }
.vc-option-main small { font-size:12px; color:var(--vc-muted); }
.vc-option-price { white-space:nowrap; font-size:15px; font-weight:800; color:var(--vc-green-dark); }
.vc-fields-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:20px; }
.vc-field { margin:0; }
.vc-field-wide { grid-column:1 / -1; }
.vc-field label { display:block; margin:0 0 7px; font-size:13px; font-weight:700; color:var(--vc-ink); }
.vc-field input[type="text"] { text-transform:uppercase; }
.vc-check { display:flex; align-items:flex-start; gap:10px; margin-top:18px; padding:12px 14px; border:1px solid var(--vc-border); border-radius:12px; background:var(--vc-bg-soft); font-size:14px; font-weight:600; color:var(--vc-ink); }
.vc-check input { margin-top:3px; accent-color:var(--vc-green); }
.vc-submit-row { display:flex; justify-content:flex-end; margin-top:22px; }
.vc-plain .vc-btn-primary { padding:14px 24px; background:#0f172a; color:#fff; border-color:#0f172a; }
.vc-plain .vc-btn-primary:hover { background:#1e293b; }

/* Cart thumb */

/* ---- Stepped form additions ---- */
.vc-option-break { display:block; margin-top:4px; font-size:11px; color:var(--vc-muted); font-weight:500; }
.vc-option-card:has(input:checked) .vc-option-break { color:var(--vc-green-dark); }

.vc-review { list-style:none; margin:0 0 22px; padding:0; border:1px solid var(--vc-border); border-radius:12px; background:#fff; overflow:hidden; }
.vc-review li { display:flex; justify-content:space-between; gap:16px; padding:12px 16px; border-bottom:1px solid var(--vc-border); font-size:14px; }
.vc-review li:last-child { border-bottom:none; }
.vc-review span { color:var(--vc-muted); }
.vc-review strong { color:var(--vc-ink); text-align:right; font-weight:700; }

.vc-breakdown { padding:16px 18px; border:1px solid var(--vc-border); border-radius:12px; background:var(--vc-bg-soft); }
.vc-breakdown h3 { margin:0 0 12px; font-size:14px; font-weight:700; color:var(--vc-ink); text-transform:uppercase; letter-spacing:.04em; }
.vc-bd-row { display:flex; justify-content:space-between; gap:16px; padding:6px 0; font-size:14px; color:var(--vc-ink-soft); }
.vc-bd-row em { font-style:normal; color:var(--vc-muted); font-size:12px; margin-left:4px; }
.vc-bd-total { margin-top:6px; padding-top:12px; border-top:1px dashed var(--vc-border-strong); font-size:18px; font-weight:800; color:var(--vc-ink); }

.vc-cart-thumb { display:inline-block; width:64px; height:64px; border-radius:8px; overflow:hidden; background:var(--vc-bg-soft); }
.vc-cart-thumb img { width:100%; height:100%; object-fit:cover; display:block; }

@media (max-width:540px) {
  .vc-body { padding:20px; }
  .vc-actions { flex-direction:column-reverse; align-items:stretch; }
  .vc-btn-primary, .vc-btn-ghost { width:100%; }
  .vc-fields-grid { grid-template-columns:1fr; }
  .vc-submit-row { display:block; }
  .vc-option-grid { grid-template-columns:1fr; }
  .vc-plate-wrap input { font-size:18px; padding:12px 10px; }
  .vc-price-block .vc-price-amount { font-size:26px; }
  .vc-veh { min-height:96px; padding:18px 10px; }
}

/* ============ Hero banner (auto-generated country page) ============ */
.vc-hero { position:relative; width:100%; max-width:1200px; margin:0 auto 24px; height:180px; border-radius:18px; overflow:hidden;
  background-color:#0f3a2e; background-size:cover; background-position:center;
  background-image:linear-gradient(135deg,#065f46 0%,#0f3a2e 50%,#0b2540 100%); }
.vc-hero[style*="background-image"] { background-blend-mode:normal; }
.vc-hero-overlay { position:absolute; inset:0; background:linear-gradient(180deg, rgba(15,23,42,.55) 0%, rgba(15,23,42,.35) 40%, rgba(15,23,42,.65) 100%); }
.vc-hero-inner { position:relative; z-index:1; height:100%; display:flex; flex-direction:column; justify-content:space-between; padding:18px 28px; max-width:820px; margin:0 auto; }
.vc-hero-back { display:inline-flex; align-items:center; gap:8px; color:rgba(255,255,255,.9); text-decoration:none; font-size:14px; font-weight:500; width:fit-content; }
.vc-hero-back:hover { color:#fff; }
.vc-hero-back svg { width:16px; height:16px; }
.vc-hero-title { display:flex; align-items:center; gap:14px; }
.vc-hero-flag { width:42px; height:auto; border-radius:4px; box-shadow:0 2px 6px rgba(0,0,0,.3); }
.vc-hero-title h1 { margin:0; color:#fff; font-size:32px; font-weight:800; letter-spacing:-0.01em; line-height:1.1; }
.vc-hero-title h1 span { font-weight:400; font-size:18px; color:rgba(255,255,255,.8); }
@media (max-width:600px) {
  .vc-hero { height:150px; border-radius:12px; }
  .vc-hero-inner { padding:14px 18px; }
  .vc-hero-title h1 { font-size:24px; }
  .vc-hero-title h1 span { font-size:14px; display:block; }
  .vc-hero-flag { width:32px; }
}

/* ===== Unified single-page configurator ===== */
.vc-unified { max-width:820px; }
.vc-unified-label { margin:0 0 10px; }
.vc-country-tabs { display:grid; grid-template-columns:repeat(auto-fit,minmax(108px,1fr)); gap:8px; margin-bottom:20px; }
.vc-country-tab { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; padding:10px 8px; border:2px solid var(--vc-border); border-radius:12px; background:#fff; cursor:pointer; font-size:12px; font-weight:600; color:var(--vc-ink); transition:all .15s; min-height:78px; }
.vc-country-tab:hover { border-color:#9ca3af; }
.vc-country-tab.selected { border-color:#2563eb; box-shadow:0 0 0 3px rgba(37,99,235,.15); }
.vc-country-tab img { width:32px; height:32px; border-radius:50%; object-fit:cover; box-shadow:0 1px 3px rgba(0,0,0,.12); }
.vc-country-panel .vc-app { max-width:none; margin:0; }

.vc-header-left { display:flex; align-items:center; gap:12px; flex-wrap:wrap; min-width:0; }
.vc-country-badge { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; background:var(--vc-bg-soft); border:1px solid var(--vc-border); border-radius:999px; font-size:13px; font-weight:600; color:var(--vc-ink-soft); }
.vc-country-badge img { width:18px; height:18px; border-radius:50%; object-fit:cover; }

@media (max-width:640px) {
  .vc-unified { padding:0 12px; }
  .vc-country-tabs { grid-template-columns:repeat(3, 1fr); gap:6px; margin-bottom:14px; }
  .vc-country-tab { padding:8px 4px; min-height:auto; font-size:11px; gap:4px; border-radius:10px; }
  .vc-country-tab img { width:24px; height:24px; }
  .vc-card { border-radius:12px; }
  .vc-header { padding:14px 16px; }
  .vc-header h2 { font-size:17px; }
  .vc-body { padding:16px; }
  .vc-veh-grid { grid-template-columns:repeat(2, 1fr); gap:8px; }
  .vc-veh { padding:14px 8px; min-height:86px; font-size:13px; gap:6px; }
  .vc-veh-icon { width:22px; height:22px; }
  .vc-dur-list { grid-template-columns:repeat(2, 1fr); gap:8px; }
  .vc-dur { padding:12px 8px; }
  .vc-dur-label { font-size:13px; }
  .vc-dur-price { font-size:12px; }
  .vc-input { padding:12px 14px; font-size:14px; }
  .vc-plate-wrap input { font-size:16px; padding:12px 10px; }
  .vc-price-block .vc-price-amount { font-size:24px; }
  .vc-btn { padding:12px 18px; font-size:14px; }
  .vc-country-badge { font-size:12px; padding:3px 8px; }
  .vc-country-badge img { width:16px; height:16px; }
}

/* Hide service fee toggle — ukrywa rozbicie ceny w panelu 1/2, pokazuje tylko Total */
.vc-hide-svc .vc-fee-details { display: none !important; }
.vc-hide-svc [data-vc-gov], .vc-hide-svc [data-vc-service] { display: none !important; }

/* HU annual county grouped tile */
.vc-dur-hidden-county { display: none !important; }
.vc-dur-county { cursor: default; }
.vc-dur-county.selected { border-color:#10b981; background:#ecfdf5; }
.vc-county-select { display:block; width:100%; margin-top:8px; padding:6px 8px; border:1px solid #d1d5db; border-radius:6px; font-size:13px; background:#fff; cursor:pointer; }
