/* =========================================================
   DI-TAX BOOK FLOW V3.40 — 27.08.2026 · PHASE 4 COMPACT CHECKOUT / PRICE FUNCTION UNCHANGED
   POLAZIŠTE → ODREDIŠTE → RUTA → POTVRDA/NARUČI
   Ni jedno postojeće polje/podatak nije uklonjeno.
   ========================================================= */
body.ttBookFlowEnabled{overflow-x:hidden}
body.ttBookFlowEnabled .ttFastOrderBar{display:none!important}

/* =========================================================
   V3.42 — ČVRSTI GATE "BIRAM VOZILO"
   Prije stvarnog odabira vozila ništa iz koraka 1/4 ni procjene
   kategorija ne smije biti u prikazu, fokusu ili području skrolanja.
   Na nižim uređajima ostaje moguć samo nužan skrol do samog izbora.
   ========================================================= */
body.ttVehicleGatePending .card>#vehicleTypeGroup~*,
body.ttVehicleGatePending #ttBookFlow,
body.ttVehicleGatePending #ttCategoryEtaBox,
body.ttVehicleGatePending #ttFastOrderBar,
body.ttVehicleGatePending .footer{
  display:none!important
}

.ttBookFlowShell{
  margin:10px 0 14px;
  border:1px solid rgba(56,189,248,.30);
  border-radius:22px;
  background:linear-gradient(160deg,rgba(8,20,38,.66),rgba(15,23,42,.48));
  box-shadow:0 16px 36px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.05);
  overflow:hidden;
  perspective:1200px;
}
.ttBookTop{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:9px;
  align-items:center;
  padding:10px 11px;
  border-bottom:1px solid rgba(148,163,184,.16);
  background:rgba(4,14,28,.60);
}
.ttBookBack{
  width:42px;height:42px;border:1px solid rgba(125,211,252,.26);border-radius:13px;
  color:#7dd3fc;background:rgba(14,165,233,.08);font-size:20px;font-weight:1000;
}
.ttBookBack:disabled{opacity:.22}
.ttBookTitle{min-width:0}
.ttBookEyebrow{font-size:10px;color:#64748b;font-weight:1000;letter-spacing:.10em}
.ttBookName{font-size:17px;color:#f8fafc;font-weight:1000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ttBookCount{
  min-width:46px;text-align:center;padding:7px 9px;border-radius:999px;
  background:rgba(56,189,248,.12);border:1px solid rgba(56,189,248,.25);
  color:#7dd3fc;font-size:12px;font-weight:1000
}
.ttBookStage{position:relative;padding:12px;min-height:240px}
.ttBookPage{display:none;transform-origin:0 50%;backface-visibility:hidden}
.ttBookPage.ttBookActive{display:block}
.ttBookPage.ttBookForward{animation:ttBookForward .34s cubic-bezier(.18,.75,.2,1)}
.ttBookPage.ttBookBackward{animation:ttBookBackward .31s cubic-bezier(.18,.75,.2,1)}
@keyframes ttBookForward{
  0%{opacity:.12;transform:translateX(12%) rotateY(-10deg) scale(.985);filter:blur(1px)}
  100%{opacity:1;transform:none;filter:none}
}
@keyframes ttBookBackward{
  0%{opacity:.12;transform:translateX(-10%) rotateY(8deg) scale(.985);filter:blur(1px)}
  100%{opacity:1;transform:none;filter:none}
}
.ttBookPage .inp-group{margin-top:0}
.ttBookHint{
  margin:0 0 11px;padding:10px 12px;border-radius:14px;
  color:#cbd5e1;background:rgba(15,23,42,.38);border:1px solid rgba(148,163,184,.18);
  font-size:12px;font-weight:800;line-height:1.4
}
.ttBookActionRow{display:grid;grid-template-columns:1fr 1.35fr;gap:9px;margin-top:12px}
.ttBookBtn{
  border:0;border-radius:15px;padding:13px 12px;font-weight:1000;font-size:14px;
  min-height:48px;box-shadow:0 8px 18px rgba(0,0,0,.20)
}
.ttBookBtn.primary{background:linear-gradient(180deg,#22c55e,#16a34a);color:#052e16}
.ttBookBtn.blue{background:linear-gradient(180deg,#38bdf8,#0ea5e9);color:#082f49}
.ttBookBtn.dark{background:#1e293b;color:#e2e8f0;border:1px solid rgba(148,163,184,.20)}
.ttBookBtn:disabled{opacity:.45;filter:grayscale(.3)}
.ttBookSwap{
  width:100%;margin:8px 0 0;border:1px solid rgba(250,204,21,.26);border-radius:14px;
  background:rgba(250,204,21,.08);color:#fde68a;padding:10px 12px;font-weight:1000
}
.ttBookRouteMetrics{
  display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:0 0 10px
}
.ttBookMetric{
  border:1px solid rgba(56,189,248,.24);border-radius:15px;padding:10px 12px;
  background:rgba(14,165,233,.07)
}
.ttBookMetric b{display:block;color:#f8fafc;font-size:20px;line-height:1.1}
.ttBookMetric span{display:block;color:#94a3b8;font-size:10px;font-weight:900;margin-top:3px}
.ttBookRoutePage #routeStatus{margin:0 0 10px}
.ttBookRoutePage #ttRouteTechnicalDetails{display:block!important;margin:0!important;border:0!important;background:transparent!important}
.ttBookRoutePage #ttRouteTechnicalDetails>summary{display:none!important}
.ttBookRoutePage #ttRouteTechnicalDetails>.ttFastDetailsInner{padding:0!important}
.ttBookRoutePage #map{height:min(46vh,390px)!important;min-height:280px;border-radius:17px;overflow:hidden;border:1px solid rgba(56,189,248,.28)}
.ttBookRoutePage .ttCoordPanel{
  margin-top:9px!important;
  max-height:0;overflow:hidden;opacity:0;padding-top:0!important;padding-bottom:0!important;
  border-width:0!important;transition:max-height .22s ease,opacity .22s ease,padding .22s ease
}
.ttBookRoutePage.ttGpsOpen .ttCoordPanel{max-height:260px;opacity:1;padding-top:10px!important;padding-bottom:10px!important;border-width:1px!important}
.ttBookGpsToggle{width:100%;margin:9px 0 0;background:transparent;border:1px solid rgba(148,163,184,.18);border-radius:12px;color:#94a3b8;padding:9px 10px;font-weight:900}
.ttBookOrderPage .price-box{margin-top:0!important}
.ttBookOrderPage #preview{margin-top:10px}
.ttBookOrderPage #btnOrder{margin-top:12px;min-height:58px;font-size:19px}
.ttBookOrderPage #ttOptionalRideDetails{margin-top:10px}
.ttBookOrderPage #info-main{margin-top:10px}
.ttBookOrderPage #btn-call-taxi{margin-top:10px}
.ttBookOrderTopLabel{
  margin:0 0 8px;color:#7dd3fc;font-size:12px;font-weight:1000;letter-spacing:.04em
}
.ttBookReadyFlash{animation:ttBookReadyFlash .55s ease}
@keyframes ttBookReadyFlash{50%{box-shadow:0 0 0 4px rgba(34,197,94,.16),0 0 24px rgba(34,197,94,.25)}}
@media(max-width:430px){
  .ttBookStage{padding:10px}
  .ttBookActionRow{grid-template-columns:1fr}
  .ttBookRoutePage #map{height:40vh!important;min-height:250px}
}
@media(prefers-reduced-motion:reduce){
  .ttBookPage.ttBookForward,.ttBookPage.ttBookBackward{animation:none}
}

/* V3.2 exact-route viewport */
body.ttBookFlowEnabled .ttBookRouteMetrics{scroll-margin-top:180px}
body.ttBookFlowEnabled .ttBookOrderPage .price-box{scroll-margin-top:180px}
body.ttBookFlowEnabled .ttBookRoutePage{overflow-anchor:none}
body.ttBookFlowEnabled .ttBookOrderPage{overflow-anchor:none}

/* =========================================================
   DI-TAX BOOK FLOW V3.6 — ROUTE PANEL UP
   U koraku KARTA/RUTA prijavljeni-korisnik panel ostaje u DOM-u,
   ali se privremeno sklapa iz prikaza. Time se cijela ruta fizički
   pomiče gore bez povećavanja karte i bez scroll hackova.
   ========================================================= */
body.ttBookStepRoute #ttLoggedCustomerBar{
  display:none!important;
}
body.ttBookStepRoute #ttCategoryEtaBox{
  display:none!important;
}

/* Nema razvlačenja karte: zadržava V3.2/V3.5 normalnu veličinu. */
body.ttBookStepRoute .ttBookStage{
  padding:8px 10px 9px!important;
}
body.ttBookStepRoute .ttBookRouteMetrics{
  gap:7px!important;
  margin:0 0 7px!important;
}
body.ttBookStepRoute .ttBookMetric{
  padding:8px 10px!important;
  border-radius:13px!important;
}
body.ttBookStepRoute .ttBookMetric b{font-size:19px!important}
body.ttBookStepRoute .ttBookMetric span{margin-top:2px!important}
body.ttBookStepRoute #routeStatus{
  margin-bottom:7px!important;
  padding:7px 9px!important;
}
body.ttBookStepRoute .ttBookRoutePage #map{
  height:40vh!important;
  min-height:250px!important;
  max-height:390px!important;
}
body.ttBookStepRoute .ttBookGpsToggle{
  margin-top:7px!important;
  padding:7px 9px!important;
  min-height:42px!important;
}
body.ttBookStepRoute .ttBookActionRow{
  margin-top:7px!important;
  gap:6px!important;
}
body.ttBookStepRoute .ttBookBtn{
  min-height:44px!important;
  padding:9px 10px!important;
}


/* V3.8 — 90 s potvrda rute. Brojač je na karti i nikada sam ne mijenja rutu. */
#map{position:relative!important}
.ttRouteAutoCountdown{
  position:absolute;top:10px;right:10px;z-index:850;
  min-width:68px;height:38px;padding:0 10px;border-radius:13px;
  display:flex;align-items:center;justify-content:center;gap:4px;
  background:rgba(3,15,30,.88);border:1px solid rgba(56,189,248,.55);
  color:#e0f2fe;font-weight:1000;box-shadow:0 5px 16px rgba(0,0,0,.30);
  pointer-events:none;backdrop-filter:blur(5px);
}
.ttRouteAutoCountdown[hidden]{display:none!important}
.ttRouteAutoClock{font-size:15px}.ttRouteAutoNum{font-size:18px;line-height:1}.ttRouteAutoUnit{font-size:10px;color:#94a3b8;align-self:flex-end;margin-bottom:8px}
.ttRouteAutoCountdown.ttRouteAutoUrgent{border-color:rgba(248,113,113,.75);color:#fecaca;background:rgba(69,10,10,.90)}


/* V3.10 — profesionalni završni CTA ODREDIŠTE -> KARTA/RUTA. */
.ttDestinationNextRouteBtn{
  width:100%!important;margin:16px 0 2px!important;min-height:58px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;
  border-radius:16px!important;background:linear-gradient(180deg,#22c55e 0%,#16a34a 100%)!important;
  color:#052e16!important;border:1px solid rgba(134,239,172,.62)!important;
  box-shadow:0 9px 22px rgba(22,163,74,.22),inset 0 1px 0 rgba(255,255,255,.24)!important;
  font-size:17px!important;letter-spacing:.01em!important;font-weight:1000!important;
}
.ttDestinationNextRouteBtn[hidden]{display:none!important}
.ttDestinationNextRouteBtn .ttDestinationNextMain{font-weight:1000!important}
.ttDestinationNextRouteBtn .ttDestinationNextLabel{font-size:13px!important;font-weight:950!important;opacity:.88!important}
.ttDestinationNextRouteBtn .ttDestinationNextArrow{font-size:24px!important;line-height:1!important;margin-left:2px!important}
.ttDestinationNextRouteBtn:active{transform:translateY(1px)}
body.ttBookStepDestination #ttDestinationNextRouteBtn{order:9999!important}



/* FAZA 1: diskretni 4/4 pokazatelj napretka; samo UI, bez promjene toka. */
.ttBookProgress{display:flex;align-items:center;gap:5px;margin-top:5px;height:6px}
.ttBookProgressDot{display:block;width:18px;height:4px;border-radius:99px;background:rgba(100,116,139,.34);box-shadow:inset 0 0 0 1px rgba(148,163,184,.08);transition:width .2s ease,background .2s ease,box-shadow .2s ease}
.ttBookProgressDot.done{background:rgba(56,189,248,.48)}
.ttBookProgressDot.active{width:28px;background:#38bdf8;box-shadow:0 0 10px rgba(56,189,248,.42)}

/* =========================================================
   DI-TAX KORISNIK REDESIGN — FAZA 2B / ISPRAVAK
   Cilj: KORAK 2/4 mora fizički doći na vrh bez ručnog skrolanja.
   Ne mijenja funkcije, samo skriva sadržaj KORAKA 1 dok je aktivan KORAK 2.
   ========================================================= */
body.ttBookStepDestination .ttHeroHeader,
body.ttBookStepDestination #ttAiBox{
  display:none!important;
}
body.ttBookStepDestination .card>.modeRow,
body.ttBookStepDestination .card>#rezBox,
body.ttBookStepDestination .card>#vehicleTypeGroup,
body.ttBookStepDestination .card>.inp-group:not(#ttDestinationGroup):not(:has(#startCity)){
  display:none!important;
}
/* Ime i telefon su prva dva .inp-group prije vehicleTypeGroup; sakrij ih samo na 2/4. */
body.ttBookStepDestination .card>.inp-group:has(#userName),
body.ttBookStepDestination .card>.inp-group:has(#userPhone){display:none!important}
/* Pickup je već premješten u book-flow page i nije aktivan, pa ga display logika page-a skriva. */
body.ttBookStepDestination .card{padding-top:8px!important}
body.ttBookStepDestination #ttBookFlow{margin-top:8px!important}
body.ttBookStepDestination .ttBookStage{padding:8px 10px 10px!important}
body.ttBookStepDestination .ttBookFlowShell{scroll-margin-top:8px}
body.ttBookStepDestination .ttBookTop{padding:9px 10px!important}
body.ttBookStepDestination .ttBookName{font-size:18px!important}

/* 2/4 ostaje u jednom mobilnom viewportu koliko god visina uređaja dopušta. */
@media(max-width:600px){
  body.ttBookStepDestination .wrap{padding-top:0!important}
  body.ttBookStepDestination #ttLoggedCustomerBar{margin-bottom:6px!important}
  body.ttBookStepDestination .ttBookFlowShell{margin:6px 0 8px!important}
  body.ttBookStepDestination .ttBookStage{padding:7px 8px 8px!important}
  body.ttBookStepDestination .ttQuickDestinationBox{margin-bottom:6px!important}
  body.ttBookStepDestination #ttRecentDestinations{margin-top:6px!important}
  body.ttBookStepDestination #ttDestinationManualDetails{margin-top:6px!important}
  body.ttBookStepDestination #ttBookSwapBtn{margin-top:7px!important}
}

/* Stariji preglednici bez :has() — JS dodaje ovu pomoćnu klasu na elemente KORAKA 1. */
body.ttBookStepDestination .ttPhase1Only{display:none!important}


/* =========================================================
   DI-TAX KORISNIK REDESIGN — FAZA 2 FINAL v3.21
   BIRAM VOZILO gate + INFO unutar polja + povratna ➡ navigacija.
   Samo UI/tok između postojećih koraka; ruta/cijena/naručivanje nisu mijenjani.
   ========================================================= */
#vehicleTypeGroup .vehiclePickRow{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:10px!important;align-items:stretch!important}
#vehicleTypeGroup .vehicleSelectWrap{position:relative!important;width:100%!important;min-width:0!important}
#vehicleTypeGroup .vehicleSelectWrap>span:first-child{z-index:3!important}
#vehicleTypeGroup #vehicleType{padding-right:88px!important;font-weight:1000!important;letter-spacing:.015em!important}
#vehicleTypeGroup #vehicleType.ttVehiclePending{color:#050505!important;text-shadow:-1px -1px 0 #facc15,1px -1px 0 #facc15,-1px 1px 0 #facc15,1px 1px 0 #facc15,0 0 9px rgba(250,204,21,.38)!important}
#vehicleTypeGroup #vehicleType.ttVehicleChosen{color:#38bdf8!important;text-shadow:0 1px 1px rgba(0,0,0,.75)!important}
#vehicleTypeGroup #vehicleType option{color:#111!important;background:#fff!important;text-shadow:none!important;font-weight:800!important}
#vehicleTypeGroup .ttVehicleInfoInside{position:absolute!important;right:42px!important;top:50%!important;transform:translateY(-50%)!important;width:34px!important;height:34px!important;min-width:34px!important;margin:0!important;border-radius:11px!important;z-index:5!important;background:rgba(250,204,21,.10)!important;border:1px solid rgba(250,204,21,.48)!important;color:#fde68a!important;box-shadow:none!important;padding:0!important;font-size:20px!important;line-height:1!important}
#vehicleTypeGroup .vehicleForwardBtn{width:56px!important;min-width:56px!important;border-radius:14px!important;border:1px solid rgba(56,189,248,.42)!important;background:linear-gradient(180deg,rgba(14,165,233,.22),rgba(8,47,73,.62))!important;color:#7dd3fc!important;font-size:30px!important;font-weight:1000!important;box-shadow:0 8px 18px rgba(0,0,0,.22),0 0 14px rgba(56,189,248,.12)!important;padding:0!important}
#vehicleTypeGroup .vehicleForwardBtn[hidden]{display:none!important}
#vehicleTypeGroup.ttVehicleRequiredPulse .vehicleSelectWrap{animation:ttVehicleRequiredPulse .75s ease 2}
@keyframes ttVehicleRequiredPulse{50%{box-shadow:0 0 0 3px rgba(250,204,21,.28),0 0 20px rgba(250,204,21,.24);border-radius:14px}}
#rezBox.ttReservationRequiredPulse{animation:ttVehicleRequiredPulse .75s ease 2}
@media(max-width:600px){
  #vehicleTypeGroup .vehiclePickRow{gap:8px!important}
  #vehicleTypeGroup .vehicleForwardBtn{width:52px!important;min-width:52px!important}
  #vehicleTypeGroup #vehicleType{padding-right:82px!important}
  #vehicleTypeGroup .ttVehicleInfoInside{right:39px!important;width:32px!important;height:32px!important;min-width:32px!important;font-size:18px!important}
}

#vehicleTypeGroup .ttVehicleInfoInside[hidden]{display:none!important}


/* =========================================================
   DI-TAX KORISNIK REDESIGN — FAZA 3 / KARTA · RUTA 3/4
   Funkcionalnost postojeće karte, rute, GPS detalja, odbrojavanja
   i POTVRDI RUTU ostaje netaknuta. Samo uklanjamo sadržaj prethodnog
   koraka iz layouta dok je aktivna ruta, kako 3/4 radi kao samostalan
   mobilni ekran bez potrebe za ručnim skrolanjem.
   ========================================================= */
body.ttBookStepRoute .ttHeroHeader,
body.ttBookStepRoute #ttAiBox,
body.ttBookStepRoute .ttPhase1Only{display:none!important}
body.ttBookStepRoute .card{padding-top:6px!important}
body.ttBookStepRoute #ttBookFlow{margin-top:4px!important}
body.ttBookStepRoute .ttBookFlowShell{margin-top:4px!important;scroll-margin-top:4px}
@media(max-width:600px){
  body.ttBookStepRoute .wrap{padding-top:0!important}
  body.ttBookStepRoute .ttBookTop{padding:9px 10px!important}
  body.ttBookStepRoute .ttBookStage{padding:7px 8px 8px!important}
}

/* =========================================================
   DI-TAX KORISNIK REDESIGN — FAZA 4 / CIJENA · NARUČIVANJE 4/4
   ANIMIRANI informativni dio cijene ostaje funkcionalno i vizualno netaknut.
   Oko njega je kompaktni checkout; sekundarni podaci su sklopivi kako glavni
   tok na mobitelu ne bi tražio nepotrebno skrolanje.
   ========================================================= */
body.ttBookStepOrder .ttHeroHeader,
body.ttBookStepOrder #ttAiBox,
body.ttBookStepOrder .ttPhase1Only,
body.ttBookStepOrder #ttLoggedCustomerBar,
body.ttBookStepOrder #ttCategoryEtaBox{display:none!important}
body.ttBookStepOrder .card{padding-top:6px!important}
body.ttBookStepOrder #ttBookFlow{margin-top:4px!important}
body.ttBookStepOrder .ttBookFlowShell{margin:4px 0 8px!important;scroll-margin-top:4px}
body.ttBookStepOrder .ttBookStage{padding:8px 10px 10px!important}
body.ttBookStepOrder .ttBookTop{padding:9px 10px!important}

/* Ne dirati .price-box / ::before animaciju — samo ukloniti suvišan vanjski razmak u 4/4. */
body.ttBookStepOrder .ttBookOrderPage .price-box{margin:0 0 8px!important}

.ttBookOrderSummary{
  margin:0 0 7px;padding:9px 11px;border-radius:14px;
  border:1px solid rgba(56,189,248,.24);background:rgba(14,165,233,.07);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03)
}
.ttBookOrderRoute{color:#f8fafc;font-weight:1000;font-size:14px;line-height:1.28;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ttBookOrderMeta{margin-top:4px;color:#7dd3fc;font-weight:950;font-size:12px}
.ttBookOrderVehicle{margin-top:4px;color:#cbd5e1;font-weight:900;font-size:12px}
.ttBookOrderPillCompact{margin:0 0 7px!important;padding:5px 9px!important;font-size:10px!important;opacity:.82}

.ttBookOrderDetails{
  margin:7px 0 0!important;border:1px solid rgba(148,163,184,.16)!important;border-radius:12px!important;
  background:rgba(15,23,42,.32)!important;overflow:hidden
}
.ttBookOrderDetails>summary{
  list-style:none;cursor:pointer;padding:9px 11px;color:#cbd5e1;font-weight:1000;font-size:12px;
  display:flex;align-items:center;justify-content:space-between;gap:8px
}
.ttBookOrderDetails>summary::-webkit-details-marker{display:none}
.ttBookOrderDetails>summary::after{content:"⌄";color:#7dd3fc;font-size:16px;line-height:1;transition:transform .18s ease}
.ttBookOrderDetails[open]>summary::after{transform:rotate(180deg)}
.ttBookOrderDetailsInner{padding:0 8px 8px}
.ttBookOrderDetails #ttOptionalRideDetails{display:block!important;margin:0!important;border:0!important;background:transparent!important}
.ttBookOrderDetails #ttOptionalRideDetails>summary{display:none!important}
.ttBookOrderDetails #ttOptionalRideDetails>.ttFastDetailsInner{padding:0!important}
.ttBookOrderDetails #preview{margin:0!important;padding:12px!important;border-width:1px!important;border-radius:12px!important;font-size:13px!important;line-height:1.4!important}
.ttBookOrderDetails #preview .previewTitle{font-size:15px!important;margin-bottom:5px!important}
.ttBookOrderDetails #preview .previewLine{margin:3px 0!important}
.ttBookOrderDetails #preview .previewBig{font-size:14px!important}
.ttBookOrderExtra #btn-call-taxi,.ttBookOrderExtra #info-main{margin-top:7px!important}

body.ttBookStepOrder .ttBookOrderPage #btnOrder{margin-top:8px!important;min-height:54px!important;font-size:18px!important;border-radius:15px!important}
body.ttBookStepOrder .ttBookOrderPage .errorBox,
body.ttBookStepOrder .ttBookOrderPage .successBox{margin-top:7px!important;padding:8px 10px!important;font-size:12px!important}
body.ttBookStepOrder .ttBookOrderTopLabel{margin:0 0 6px!important;font-size:11px!important}

@media(max-width:600px){
  body.ttBookStepOrder .wrap{padding-top:0!important}
  body.ttBookStepOrder .ttBookStage{padding:7px 8px 8px!important}
  .ttBookOrderSummary{padding:8px 9px!important}
  .ttBookOrderRoute{font-size:13px!important}
  .ttBookOrderMeta,.ttBookOrderVehicle{font-size:11px!important}
  body.ttBookStepOrder .ttBookOrderPage #btnOrder{min-height:52px!important}
}