/* Stari vrh — vozovnica (QR + šifra) v Moj račun → naročilo in na zahvalni strani. */
.sv-ticket {
  display: flex;
  align-items: center;
  gap: clamp(16px, 3vw, 32px);
  margin: 0 0 2rem;
  padding: clamp(16px, 3vw, 24px);
  border: 2px solid var(--navy-900, #041f33);
  border-radius: var(--r-xl, 20px);
  background: #fff;
  color: var(--ink, #0b2233);
}
.sv-ticket__qr { flex: none; width: 200px; max-width: 100%; }
.sv-ticket__svg { display: block; width: 100%; height: auto; }
.sv-ticket__eyebrow { margin: 0; font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-muted, #4d6a80); }
.sv-ticket__code { margin: 4px 0 6px; font: 700 clamp(24px, 4vw, 30px)/1.15 ui-monospace, "Courier New", monospace; letter-spacing: .1em; }
.sv-ticket__state { display: inline-block; margin: 0 0 8px; padding: 4px 12px; border-radius: 999px; font-size: 14px; font-weight: 700; color: #fff; background: var(--ok, #1f9d63); }
.sv-ticket--unpaid .sv-ticket__state,
.sv-ticket--redeemed .sv-ticket__state { background: var(--warn, #d08a1c); }
.sv-ticket--invalid .sv-ticket__state { background: var(--bad, #d4462f); }
.sv-ticket--unpaid .sv-ticket__qr,
.sv-ticket--redeemed .sv-ticket__qr,
.sv-ticket--invalid .sv-ticket__qr { opacity: .35; }
.sv-ticket__note { margin: 0; color: var(--ink-soft, #274b64); }

.sv-ticket-code { font-family: ui-monospace, "Courier New", monospace; font-weight: 700; white-space: nowrap; }

@media (max-width: 560px) {
  .sv-ticket { flex-direction: column; text-align: center; }
  .sv-ticket__qr { width: min(240px, 100%); }
}