/* ===================== Termin – javna stranica salona (telefon na prvom mjestu) ===================== */
.jv { --s-boja: #7C2D5B; --s-akcent: #C9A227; --jv-tekst: #1F1720; --jv-siva: #6B6170; --jv-linija: #ECE4E2; --jv-pozadina: #FBF8F6;
    min-height: 100vh; background: var(--jv-pozadina); color: var(--jv-tekst); font-family: Inter, system-ui, sans-serif; padding-bottom: 110px; overflow-x: clip; }
.jv * { box-sizing: border-box; }
.jv button { font-family: inherit; }
.jv-ucitavanje, .jv-prazno { min-height: 70vh; display: grid; place-items: center; align-content: center; gap: 8px; text-align: center; padding: 24px; color: #6B6170; }
.jv-prazno h1 { font-family: "Cormorant Garamond", Georgia, serif; font-size: 2rem; margin: 6px 0 0; color: #1F1720; }
.jv-spiner { width: 38px; height: 38px; border-radius: 50%; border: 3px solid rgba(0, 0, 0, .08); border-top-color: var(--s-boja, #7C2D5B); animation: tmVrti .8s linear infinite; display: inline-block; }
.jv-spiner.mali { width: 18px; height: 18px; border-width: 2px; border-color: rgba(255, 255, 255, .35); border-top-color: #fff; vertical-align: middle; }
@keyframes tmVrti { to { transform: rotate(360deg); } }

/* Zaglavlje salona */
.jv-hero { position: relative; color: #fff; padding: 28px 18px 18px; overflow: hidden; }
.jv-hero-pozadina { position: absolute; inset: 0; z-index: 0;
    background: radial-gradient(520px 260px at 100% 0%, color-mix(in srgb, var(--s-akcent) 55%, transparent), transparent 70%),
                radial-gradient(420px 260px at 0% 100%, rgba(255, 255, 255, .14), transparent 70%),
                linear-gradient(140deg, color-mix(in srgb, var(--s-boja) 80%, #000) 0%, var(--s-boja) 55%, color-mix(in srgb, var(--s-boja) 70%, var(--s-akcent)) 100%); }
.jv-hero-pozadina::after { content: ""; position: absolute; inset: 0; opacity: .12;
    background-image: radial-gradient(circle at 1px 1px, #fff 1px, transparent 0); background-size: 18px 18px; mask-image: linear-gradient(180deg, #000, transparent 85%); }
.jv-hero-sadrzaj { position: relative; z-index: 1; display: flex; gap: 14px; align-items: center; max-width: 760px; margin: 0 auto; }
.jv-logo { width: 74px; height: 74px; border-radius: 50%; object-fit: cover; flex-shrink: 0; border: 3px solid rgba(255, 255, 255, .85); box-shadow: 0 12px 28px -10px rgba(0, 0, 0, .5); background: #fff; }
.jv-hero-tekst { min-width: 0; }
.jv-naziv { font-family: "Cormorant Garamond", Georgia, serif; font-weight: 600; font-size: clamp(1.9rem, 6vw, 2.8rem); line-height: 1; margin: 0; letter-spacing: -.005em; }
.jv-podnaslov { font-size: .88rem; opacity: .9; margin-top: 4px; }
.jv-ocjena-dugme { margin-top: 8px; display: inline-flex; align-items: center; gap: 6px; border: 0; cursor: pointer; color: #fff; background: rgba(255, 255, 255, .16); backdrop-filter: blur(6px); padding: 5px 10px; border-radius: 999px; font-size: .8rem; }
.jv-ocjena-dugme span { opacity: .85; }
.jv-ocjena-dugme .tm-zvijezda { color: rgba(255, 255, 255, .35); }
.jv-ocjena-dugme .tm-zvijezda-puna { color: #FFD480; }
.jv-kontakt { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 6px 14px; max-width: 760px; margin: 16px auto 0; font-size: .8rem; }
.jv-kontakt a { color: #fff; opacity: .92; text-decoration: none; display: inline-flex; align-items: center; gap: 4px; }
.jv-kontakt a:hover { opacity: 1; text-decoration: underline; }

.jv-tabovi { position: sticky; top: 0; z-index: 20; display: flex; gap: 2px; padding: 6px 8px; background: rgba(251, 248, 246, .92); backdrop-filter: blur(10px); border-bottom: 1px solid var(--jv-linija); overflow-x: auto; scrollbar-width: none; justify-content: safe center; }
.jv-tabovi::-webkit-scrollbar { display: none; }
.jv-tabovi button { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; border: 0; background: transparent; padding: 9px 14px; border-radius: 999px; font-size: .86rem; font-weight: 600; color: var(--jv-siva); cursor: pointer; transition: all .2s; }
.jv-tabovi button.aktivan { background: var(--s-boja); color: #fff; box-shadow: 0 6px 16px -8px var(--s-boja); }

.jv-widget-glava { display: flex; align-items: center; gap: 12px; padding: 14px 16px; background: #fff; border-bottom: 1px solid var(--jv-linija); position: sticky; top: 0; z-index: 20; }
.jv-widget-glava img { width: 40px; height: 40px; border-radius: 50%; }
.jv-widget-glava b { display: block; font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.3rem; line-height: 1.05; }
.jv-widget-glava span { font-size: .74rem; color: var(--jv-siva); }
.jv-mala-glava { border-top: 4px solid var(--s-boja); }

.jv-sadrzaj { max-width: 760px; margin: 0 auto; padding: 18px 16px 0; }
.jv-opis { color: #4E4552; font-size: .92rem; line-height: 1.6; margin: 2px 0 16px; }
.jv-h2 { font-family: "Cormorant Garamond", Georgia, serif; font-weight: 600; font-size: 1.85rem; margin: 4px 0 4px; line-height: 1.1; }
.jv-pomoc { color: var(--jv-siva); font-size: .86rem; margin: 0 0 14px; line-height: 1.5; }
.jv-sitno { color: var(--jv-siva); font-size: .76rem; margin-top: 12px; line-height: 1.5; }
.jv-link { border: 0; background: none; padding: 0; color: var(--s-boja); font-weight: 600; font-size: .84rem; cursor: pointer; display: inline-flex; gap: 4px; align-items: center; text-align: left; }
.jv-link:hover { text-decoration: underline; }
.jv-korak { animation: jvUlaz .32s ease both; }
@keyframes jvUlaz { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* Koraci */
.jv-koraci { list-style: none; display: flex; gap: 6px; padding: 0; margin: 0 0 18px; }
.jv-koraci li { flex: 1; display: flex; align-items: center; gap: 6px; padding: 8px 4px 0; border-top: 3px solid var(--jv-linija); font-size: .74rem; color: var(--jv-siva); cursor: default; min-width: 0; transition: border-color .3s; }
.jv-koraci li.gotov { border-color: color-mix(in srgb, var(--s-boja) 45%, transparent); cursor: pointer; }
.jv-koraci li.aktivan { border-color: var(--s-boja); color: var(--jv-tekst); font-weight: 600; }
.jv-korak-broj { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; font-size: .66rem; font-weight: 700; background: var(--jv-linija); color: var(--jv-siva); flex-shrink: 0; }
.jv-koraci li.aktivan .jv-korak-broj, .jv-koraci li.gotov .jv-korak-broj { background: var(--s-boja); color: #fff; }
.jv-korak-naziv { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.jv-greska { display: flex; gap: 8px; align-items: center; background: #FEF2F2; color: #991B1B; border: 1px solid #FECACA; border-radius: 12px; padding: 10px 12px; font-size: .86rem; margin-bottom: 14px; }
.jv-info { display: flex; gap: 12px; align-items: flex-start; background: color-mix(in srgb, var(--s-boja) 7%, #fff); border: 1px solid color-mix(in srgb, var(--s-boja) 20%, transparent); border-radius: 14px; padding: 12px 14px; margin: 14px 0; font-size: .86rem; }
.jv-info > .mud-icon-root { color: var(--s-boja); flex-shrink: 0; }
.jv-info b { display: block; } .jv-info span { color: #4E4552; }
.jv-vjernost { display: flex; gap: 10px; align-items: center; border-radius: 14px; padding: 12px 14px; margin: 14px 0; font-size: .88rem; color: #14532D; background: linear-gradient(120deg, #DCFCE7, #F0FDF4); border: 1px solid #BBF7D0; }
.jv-vjernost.blago { color: #4E4552; background: color-mix(in srgb, var(--s-akcent) 14%, #fff); border-color: color-mix(in srgb, var(--s-akcent) 35%, transparent); }

/* Kategorije i usluge */
.jv-kategorije { display: flex; gap: 8px; overflow-x: auto; padding: 2px 2px 10px; margin: 0 -16px 6px; padding-left: 16px; padding-right: 16px; scrollbar-width: none; position: sticky; top: 52px; z-index: 10; background: linear-gradient(180deg, var(--jv-pozadina) 80%, transparent); }
.jv-widget .jv-kategorije { top: 68px; }
.jv-kategorije::-webkit-scrollbar { display: none; }
.jv-kat-chip { --k-boja: var(--s-boja); flex: 0 0 auto; border: 1px solid var(--jv-linija); background: #fff; color: var(--jv-tekst); border-radius: 999px; padding: 8px 14px; font-size: .84rem; font-weight: 600; cursor: pointer; transition: all .2s; }
.jv-kat-chip:hover { border-color: var(--k-boja); }
.jv-kat-chip.aktivan { background: var(--k-boja); border-color: var(--k-boja); color: #fff; }
.jv-kat-sekcija { margin-bottom: 18px; scroll-margin-top: 110px; }
.jv-kat-naslov { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin: 16px 0 8px; }
.jv-kat-naslov span { font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--k-boja); }
.jv-mini-galerija { display: flex; gap: 6px; margin-bottom: 10px; overflow-x: auto; scrollbar-width: none; }
.jv-mini-galerija::-webkit-scrollbar { display: none; }
.jv-mini-rad { flex: 0 0 72px; height: 72px; border-radius: 12px; overflow: hidden; cursor: pointer; transition: transform .2s; }
.jv-mini-rad:hover { transform: scale(1.03); }
.jv-usluga { background: #fff; border: 1px solid var(--jv-linija); border-radius: 16px; margin-bottom: 8px; transition: border-color .2s, box-shadow .2s; overflow: hidden; }
.jv-usluga.odabrana { border-color: var(--s-boja); box-shadow: 0 0 0 1px var(--s-boja), 0 10px 24px -14px var(--s-boja); }
.jv-usluga-red { display: flex; gap: 12px; align-items: center; padding: 14px; cursor: pointer; }
.jv-usluga-tekst { flex: 1; min-width: 0; }
.jv-usluga-naziv { font-weight: 600; font-size: .95rem; line-height: 1.3; }
.jv-usluga-opis { font-size: .78rem; color: var(--jv-siva); margin-top: 2px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.jv-usluga-meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 6px; font-size: .76rem; color: var(--jv-siva); }
.jv-usluga-meta > span { display: inline-flex; align-items: center; gap: 3px; }
.jv-usluga-meta .mud-icon-root { font-size: .95rem; }
.jv-oznaka { font-size: .68rem !important; padding: 2px 8px; border-radius: 999px; background: color-mix(in srgb, var(--s-akcent) 22%, #fff); color: #5B4636; font-weight: 600; }
.jv-usluga-cijena { font-weight: 700; font-size: .92rem; white-space: nowrap; text-align: right; }
.jv-plus { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; flex-shrink: 0; border: 1.5px solid var(--jv-linija); color: var(--s-boja); transition: all .2s; }
.jv-usluga.odabrana .jv-plus { background: var(--s-boja); border-color: var(--s-boja); color: #fff; transform: rotate(360deg); }
.jv-varijante { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 8px; padding: 0 14px 14px; animation: jvUlaz .25s ease both; }
.jv-varijanta { border: 1.5px solid var(--jv-linija); background: #fff; border-radius: 12px; padding: 10px; text-align: left; cursor: pointer; display: flex; flex-direction: column; gap: 2px; transition: all .15s; color: var(--jv-tekst); }
.jv-varijanta b { font-size: .86rem; } .jv-varijanta span { font-size: .74rem; color: var(--jv-siva); }
.jv-varijanta.aktivan { border-color: var(--s-boja); background: color-mix(in srgb, var(--s-boja) 7%, #fff); }

/* Radnice */
.jv-radnice { display: grid; gap: 10px; }
.jv-radnica { display: flex; align-items: center; gap: 14px; padding: 14px; border-radius: 16px; border: 1.5px solid var(--jv-linija); background: #fff; cursor: pointer; text-align: left; transition: all .2s; color: var(--jv-tekst); width: 100%; }
.jv-radnica:hover:not(:disabled) { border-color: color-mix(in srgb, var(--s-boja) 50%, transparent); transform: translateY(-1px); }
.jv-radnica.aktivan { border-color: var(--s-boja); box-shadow: 0 0 0 1px var(--s-boja); background: color-mix(in srgb, var(--s-boja) 5%, #fff); }
.jv-radnica:disabled { opacity: .5; cursor: not-allowed; }
.jv-avatar { width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center; color: #fff; font-weight: 700; flex-shrink: 0; font-size: .9rem; box-shadow: 0 6px 14px -6px rgba(0, 0, 0, .35); }
.jv-avatar.mali { width: 36px; height: 36px; font-size: .72rem; box-shadow: none; }
.jv-avatar-bilo { background: linear-gradient(135deg, var(--s-boja), var(--s-akcent)); }
.jv-radnica-tekst { display: flex; flex-direction: column; min-width: 0; }
.jv-radnica-tekst b { font-size: .98rem; } .jv-radnica-tekst span { font-size: .8rem; color: var(--jv-siva); }
.jv-radnica-ocjena { color: #9A6A00 !important; font-weight: 600; }

/* Dani i termini */
.jv-dani { display: flex; gap: 8px; overflow-x: auto; padding: 4px 2px 12px; margin: 0 -16px; padding-left: 16px; padding-right: 16px; scroll-snap-type: x proximity; scrollbar-width: thin; }
.jv-dan { flex: 0 0 66px; scroll-snap-align: start; border: 1.5px solid var(--jv-linija); background: #fff; border-radius: 16px; padding: 8px 4px; display: flex; flex-direction: column; align-items: center; gap: 1px; cursor: pointer; color: var(--jv-tekst); transition: all .2s; }
.jv-dan-naziv { font-size: .7rem; font-weight: 600; color: var(--jv-siva); text-transform: capitalize; }
.jv-dan-broj { font-size: 1.35rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.1; }
.jv-dan-mjesec { font-size: .66rem; color: var(--jv-siva); }
.jv-dan-tacka { font-size: .56rem; color: #15803D; font-weight: 600; margin-top: 2px; white-space: nowrap; }
.jv-dan.pun { background: #F6F2F0; } .jv-dan.pun .jv-dan-broj { color: #A8A0A4; } .jv-dan.pun .jv-dan-tacka { color: #A8A0A4; }
.jv-dan.aktivan { background: var(--s-boja); border-color: var(--s-boja); color: #fff; box-shadow: 0 10px 22px -10px var(--s-boja); }
.jv-dan.aktivan .jv-dan-naziv, .jv-dan.aktivan .jv-dan-mjesec, .jv-dan.aktivan .jv-dan-tacka, .jv-dan.aktivan .jv-dan-broj { color: #fff; }
.jv-dio-dana { font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--jv-siva); margin: 14px 0 8px; }
.jv-slotovi, .jv-iznosi { display: grid; grid-template-columns: repeat(auto-fill, minmax(78px, 1fr)); gap: 8px; }
.jv-slot { border: 1.5px solid var(--jv-linija); background: #fff; border-radius: 12px; padding: 11px 4px; font-size: .92rem; font-weight: 700; font-variant-numeric: tabular-nums; cursor: pointer; color: var(--jv-tekst); transition: all .15s; }
.jv-slot:hover { border-color: var(--s-boja); color: var(--s-boja); }
.jv-slot.aktivan { background: var(--s-boja); border-color: var(--s-boja); color: #fff; transform: scale(1.03); }
.jv-slotovi-skeleton { display: grid; grid-template-columns: repeat(auto-fill, minmax(78px, 1fr)); gap: 8px; margin-top: 16px; }
.jv-slotovi-skeleton span { height: 44px; border-radius: 12px; background: linear-gradient(90deg, #F1EBE8, #F8F4F2, #F1EBE8); background-size: 200% 100%; animation: jvSkelet 1.2s infinite; }
@keyframes jvSkelet { from { background-position: 200% 0; } to { background-position: -200% 0; } }
.jv-nema { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; padding: 26px 16px; border: 1.5px dashed var(--jv-linija); border-radius: 16px; background: #fff; margin-top: 8px; color: var(--jv-siva); }
.jv-nema b { color: var(--jv-tekst); }
.jv-dugme { background: var(--s-boja) !important; color: #fff !important; border-radius: 999px !important; box-shadow: 0 10px 22px -12px var(--s-boja) !important; }
.jv-dugme-obris { border-color: color-mix(in srgb, var(--s-boja) 45%, transparent) !important; color: var(--s-boja) !important; border-radius: 999px !important; }
.jv-dugme-tekst { color: var(--s-boja) !important; }

/* Forma */
.jv-forma { display: grid; gap: 12px; }
.jv-dvije { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 480px) { .jv-dvije { grid-template-columns: 1fr; } }
.jv .mud-input-outlined-border { border-radius: 12px; }
.jv .mud-input-control { background: transparent; }
.jv .mud-input.mud-input-outlined { background: #fff; border-radius: 12px; }
.jv .mud-checkbox .mud-icon-root { color: var(--s-boja); }
.jv-saglasnost { margin-top: 6px; }
.jv-saglasnost .mud-typography { font-size: .84rem; }
.jv .mud-input-label { font-size: .92rem; }

/* Donja traka */
.jv-traka { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .94); backdrop-filter: blur(12px); border-top: 1px solid var(--jv-linija); box-shadow: 0 -10px 30px -18px rgba(0, 0, 0, .3); animation: jvTraka .3s ease both; }
@keyframes jvTraka { from { transform: translateY(100%); } to { transform: none; } }
.jv-traka-sadrzaj { max-width: 760px; margin: 0 auto; display: flex; align-items: center; gap: 10px; }
.jv-traka-tekst { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.jv-traka-tekst b { font-size: .9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.jv-traka-tekst span { font-size: .8rem; color: var(--jv-siva); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.jv-traka-tekst span b { color: var(--jv-tekst); }
.jv-nazad { width: 46px; height: 46px; border-radius: 50%; border: 1.5px solid var(--jv-linija); background: #fff; display: grid; place-items: center; cursor: pointer; color: var(--jv-tekst); flex-shrink: 0; }
.jv-dalje { height: 48px; padding: 0 22px; border: 0; border-radius: 999px; background: var(--s-boja); color: #fff; font-weight: 700; font-size: .95rem; cursor: pointer; box-shadow: 0 10px 24px -10px var(--s-boja); transition: transform .15s, opacity .2s; flex-shrink: 0; min-width: 116px; }
.jv-dalje:hover:not(:disabled) { transform: translateY(-1px); }
.jv-dalje:disabled { opacity: .45; cursor: not-allowed; box-shadow: none; }
@media (max-width: 400px) { .jv-dalje { padding: 0 16px; min-width: 96px; font-size: .9rem; } }

.jv-podnozje { max-width: 760px; margin: 40px auto 0; padding: 18px 16px; border-top: 1px solid var(--jv-linija); display: flex; justify-content: space-between; flex-wrap: wrap; gap: 6px; font-size: .74rem; color: var(--jv-siva); }

/* Galerija i ocjene */
.jv-galerija { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
@media (min-width: 640px) { .jv-galerija { grid-template-columns: repeat(3, 1fr); } }
.jv-rad { margin: 0; background: #fff; border-radius: 16px; overflow: hidden; border: 1px solid var(--jv-linija); }
.jv-rad .tm-rad-slika { aspect-ratio: 1; }
.jv-rad figcaption { padding: 8px 10px 10px; }
.jv-rad figcaption b { display: block; font-size: .84rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.jv-rad figcaption span { font-size: .72rem; color: var(--jv-siva); }
.tm-rad-slika { width: 100%; height: 100%; display: block; object-fit: cover; }
.jv-ocjene-sazetak { display: flex; gap: 20px; align-items: center; background: #fff; border: 1px solid var(--jv-linija); border-radius: 16px; padding: 16px; margin-bottom: 14px; flex-wrap: wrap; }
.jv-ocjene-prosjek { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 110px; }
.jv-ocjene-prosjek b { font-size: 2.8rem; font-weight: 800; letter-spacing: -.04em; line-height: 1; }
.jv-ocjene-prosjek span { font-size: .76rem; color: var(--jv-siva, #6B6170); }
.jv-ocjene-trake { flex: 1; min-width: 180px; display: grid; gap: 4px; }
.jv-ocjena-traka { display: grid; grid-template-columns: 34px 1fr 30px; gap: 8px; align-items: center; font-size: .76rem; color: var(--jv-siva, #6B6170); }
.jv-ocjena-traka div { height: 8px; border-radius: 99px; background: #F1EBE8; overflow: hidden; }
.jv-ocjena-traka i { display: block; height: 100%; background: #E2A93B; border-radius: 99px; }
.jv-recenzija { background: #fff; border: 1px solid var(--jv-linija, #ECE4E2); border-radius: 16px; padding: 14px; margin-bottom: 10px; }
.jv-recenzija-glava { display: flex; gap: 10px; align-items: center; }
.jv-recenzija-glava b { display: block; font-size: .9rem; } .jv-recenzija-glava span { font-size: .74rem; color: var(--jv-siva, #6B6170); }
.jv-recenzija-glava > div:nth-child(2) { flex: 1; min-width: 0; }
.jv-recenzija-desno { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; flex-shrink: 0; }
.jv-recenzija p { margin: 10px 0 0; font-size: .9rem; line-height: 1.5; color: #3A3140; }
.jv-odgovor { margin-top: 10px; padding: 10px 12px; border-radius: 12px; background: #F8F4F2; font-size: .82rem; color: #4E4552; }

/* Potvrda */
.jv-uspjeh { text-align: center; padding-top: 10px; }
.jv-uspjeh-znak { width: 76px; height: 76px; margin: 0 auto 10px; border-radius: 50%; display: grid; place-items: center; background: color-mix(in srgb, var(--s-boja) 12%, #fff); color: var(--s-boja); }
.jv-uspjeh-znak svg { width: 52px; height: 52px; }
.jv-uspjeh-znak circle { stroke: var(--s-boja); stroke-width: 3; stroke-dasharray: 160; stroke-dashoffset: 160; animation: jvCrtaj .7s ease forwards; }
.jv-uspjeh-znak path { stroke: var(--s-boja); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 40; stroke-dashoffset: 40; animation: jvCrtaj .4s .55s ease forwards; }
.jv-uspjeh-znak.ceka { background: #FFF7ED; color: #C2410C; }
.jv-uspjeh-znak.ceka circle, .jv-uspjeh-znak.ceka path { stroke: #C2410C; }
@keyframes jvCrtaj { to { stroke-dashoffset: 0; } }
.jv-uspjeh .jv-pomoc { max-width: 460px; margin-left: auto; margin-right: auto; }
.jv-akcije { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 16px; }
.jv-termin-kartica { display: flex; gap: 14px; text-align: left; background: #fff; border: 1px solid var(--jv-linija); border-radius: 18px; padding: 14px; margin: 14px 0 0; box-shadow: 0 14px 30px -24px rgba(0, 0, 0, .4); }
.jv-termin-datum { width: 64px; flex-shrink: 0; border-radius: 14px; background: var(--s-boja); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 8px 0; }
.jv-termin-dan { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; opacity: .85; }
.jv-termin-broj { font-size: 1.7rem; font-weight: 800; line-height: 1; }
.jv-termin-mj { font-size: .7rem; opacity: .85; }
.jv-termin-detalji { min-width: 0; flex: 1; }
.jv-termin-vrijeme { font-weight: 800; font-size: 1.1rem; font-variant-numeric: tabular-nums; }
.jv-termin-usluga { font-size: .9rem; font-weight: 600; margin-top: 2px; }
.jv-termin-meta { font-size: .8rem; color: var(--jv-siva); margin-top: 3px; display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; }
.jv-termin-meta s { color: #A8A0A4; }
.jv-status { display: inline-flex; gap: 6px; align-items: center; font-size: .78rem; font-weight: 700; padding: 5px 12px; border-radius: 999px; margin-bottom: 8px; }
.jv-status-0 { background: #FFF7ED; color: #C2410C; } .jv-status-1 { background: #ECFDF5; color: #047857; } .jv-status-2 { background: #EEF2FF; color: #4338CA; }
.jv-status-3 { background: #F5F5F4; color: #57534E; } .jv-status-4 { background: #F5F5F4; color: #78716C; }
.jv-cekanje { background: #fff; border: 1.5px solid color-mix(in srgb, var(--s-boja) 30%, transparent); border-radius: 18px; padding: 14px; margin-top: 16px; box-shadow: 0 16px 34px -26px rgba(0, 0, 0, .5); }
.jv-ocjena-kartica { margin-top: 18px; padding: 16px; border-radius: 18px; background: linear-gradient(140deg, color-mix(in srgb, var(--s-akcent) 18%, #fff), #fff); border: 1px solid var(--jv-linija); display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.jv-ocjena-kartica p { margin: 0; font-style: italic; color: #4E4552; }
.jv-zvjezdice-izbor { display: flex; gap: 4px; }
.jv-zvjezdice-izbor button { border: 0; background: none; font-size: 2.2rem; line-height: 1; cursor: pointer; color: #E5DCD9; transition: transform .15s, color .15s; padding: 0 2px; }
.jv-zvjezdice-izbor button.puna { color: #E2A93B; }
.jv-zvjezdice-izbor button:hover { transform: scale(1.15); }
.jv-ponovo { display: flex; gap: 12px; align-items: center; justify-content: space-between; flex-wrap: wrap; margin-top: 16px; padding: 14px; border-radius: 18px; background: #fff; border: 1px solid var(--jv-linija); }
.jv-ponovo b { display: block; } .jv-ponovo span { font-size: .8rem; color: var(--jv-siva); }

/* Poklon bon */
.tm-bon { --s-boja: #7C2D5B; --s-akcent: #C9A227; position: relative; overflow: hidden; border-radius: 22px; padding: 20px; color: #fff; min-height: 220px; display: flex; flex-direction: column; gap: 6px;
    background: linear-gradient(140deg, color-mix(in srgb, var(--s-boja) 85%, #000), var(--s-boja) 55%, color-mix(in srgb, var(--s-boja) 65%, var(--s-akcent))); box-shadow: 0 24px 50px -26px color-mix(in srgb, var(--s-boja) 80%, #000); max-width: 440px; margin: 0 auto 14px; }
.tm-bon-ukras { position: absolute; inset: 0; pointer-events: none; opacity: .5;
    background: radial-gradient(circle at 85% 15%, color-mix(in srgb, var(--s-akcent) 70%, transparent) 0 60px, transparent 61px), radial-gradient(circle at 100% 100%, rgba(255, 255, 255, .18) 0 110px, transparent 111px); }
.tm-bon-zlato { background: linear-gradient(140deg, #3A2A16, #8C6A34 50%, #D8B26E); }
.tm-bon-mint { background: linear-gradient(140deg, #0F4C45, #1F8A7A 55%, #8ED8C4); }
.tm-bon-noc { background: linear-gradient(140deg, #0E0B14, #2B1F3D 55%, color-mix(in srgb, var(--s-boja) 60%, #2B1F3D)); }
.tm-bon > * { position: relative; }
.tm-bon-glava { display: flex; align-items: center; gap: 10px; }
.tm-bon-glava img { width: 38px; height: 38px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .7); background: #fff; }
.tm-bon-salon { font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.2rem; font-weight: 600; line-height: 1; }
.tm-bon-vrsta { font-size: .68rem; text-transform: uppercase; letter-spacing: .14em; opacity: .8; }
.tm-bon-iznos { font-size: 2.6rem; font-weight: 800; letter-spacing: -.03em; margin-top: 10px; line-height: 1; }
.tm-bon-za { font-size: .9rem; opacity: .92; }
.tm-bon-poruka { font-family: "Cormorant Garamond", Georgia, serif; font-style: italic; font-size: 1.15rem; opacity: .95; }
.tm-bon-dno { display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; margin-top: auto; padding-top: 8px; }
.tm-bon-oznaka { font-size: .62rem; text-transform: uppercase; letter-spacing: .12em; opacity: .75; }
.tm-bon-kod { font-family: ui-monospace, Consolas, monospace; font-weight: 700; font-size: 1rem; letter-spacing: .06em; }
.tm-bon-qr { width: 86px; height: 86px; background: #fff; border-radius: 10px; padding: 4px; }
.jv-dizajni { display: flex; gap: 10px; justify-content: center; margin-bottom: 12px; }
.jv-dizajn { width: 46px; height: 30px; border-radius: 8px; border: 2px solid #fff; box-shadow: 0 0 0 1px var(--jv-linija); cursor: pointer; padding: 0; min-height: 0; max-width: none; margin: 0; }
.jv-dizajn.tm-bon { display: block; }
.jv-dizajn.aktivan { box-shadow: 0 0 0 2px var(--jv-tekst); }
.jv-iznosi { margin-bottom: 14px; }
.jv-bon-stranica { padding-top: 26px; }
.jv-bon-info { text-align: center; max-width: 440px; margin: 0 auto; }

/* Ugradnja (iframe) */
.jv-widget { padding-bottom: 96px; }
.jv-widget .jv-sadrzaj { padding-top: 14px; }
.bo-mini.tm-bon-ruze, .jv-dizajn.tm-bon-ruze { background: linear-gradient(140deg, color-mix(in srgb, var(--s-boja) 85%, #000), var(--s-boja), color-mix(in srgb, var(--s-boja) 65%, var(--s-akcent))); }