/*
 * provjera-forma.css - izgled dijeljene forme za provjeru cestice (.nc-*).
 *
 * Istu formu koriste naslovnica i landing /provjera-cestice/ (markup:
 * katastor-shared/dijelovi/provjera-forma.php). Ovo je mjesto za izmjene izgleda -
 * datoteka se ucitava POSLIJE v4.css i v4-stranice.css, pa nadglasava stare kopije
 * istih pravila koje su ondje ostale.
 */
/* --- preneseno iz katastor-shared/assets/v4.css --- */
.nc-hero{position:relative;overflow:hidden;background:linear-gradient(180deg,#0c1a2b 0%,#0e1d2e 55%,#132741 100%);padding:70px 0 84px;text-align:center;margin-top:-92px;padding-top:150px}
.nc-hero::before{content:"";position:absolute;left:50%;top:-280px;transform:translateX(-50%);width:1100px;height:640px;border-radius:50%;background:radial-gradient(closest-side,rgba(59,130,246,.35) 0%,transparent 75%);filter:blur(30px)}
.nc-hero .container{position:relative}
.nc-hero h1{font-size:clamp(2.1rem,5vw,3.3rem);font-weight:600;letter-spacing:-.025em;line-height:1.14;color:#fff;margin:16px auto 12px;max-width:820px}
.nc-hero .sub{color:#a9bbd4;max-width:620px}
.nc-karte{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:880px;margin:38px auto 0;text-align:left}
.nc-k{position:relative;background:#fff;border-radius:20px;padding:26px;box-shadow:0 30px 70px -24px rgba(0,0,0,.55);display:grid;gap:10px;align-content:start}
.nc-tab{position:absolute;top:-12px;left:22px;background:var(--kat-green);color:#fff;font-size:.72rem;font-weight:600;letter-spacing:.04em;border-radius:999px;padding:4px 14px;box-shadow:0 4px 12px rgba(59,181,74,.4)}
.nc-tabovi{display:flex;gap:4px;background:var(--mist);border-radius:999px;padding:4px}
.nc-tabovi button{flex:1;border:none;background:transparent;font:inherit;font-size:.78rem;font-weight:500;color:var(--muted);padding:7px 4px;border-radius:999px;cursor:pointer;white-space:nowrap}
.nc-tabovi button.aktivan{background:#fff;color:var(--ink);box-shadow:0 2px 6px rgba(20,24,31,.1)}
.nc-k h3{font-size:1.15rem;font-weight:600;color:var(--ink);display:flex;align-items:center;gap:9px}
.nc-k h3 svg{color:var(--kat-green)}
.nc-k p{font-size:.88rem;color:var(--muted)}
.nc-k .btn{justify-content:center;margin-top:6px}
.nc-k input,.nc-k select{width:100%;padding:11px 13px;font:inherit;font-size:.93rem;border:1px solid var(--line);border-radius:11px;background:#fbfcfe}
.nc-lociraj{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;border:1px solid rgba(59,181,74,.38);background:rgba(59,181,74,.10);border-radius:11px;padding:12px 16px;font:inherit;font-size:.88rem;font-weight:600;color:#1f6b2c;cursor:pointer;transition:background .2s,border-color .2s,color .2s;margin:0 0 4px}
.nc-lociraj svg{color:var(--kat-green);flex:none}
.nc-lociraj:hover{background:rgba(59,181,74,.18);border-color:var(--kat-green);color:#14501f}
.nc-k .nc-red{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.nc-opis{font-size:.78rem;color:var(--muted);background:var(--mist);border:1px solid var(--line-soft);border-radius:10px;padding:9px 12px;display:grid;gap:4px;line-height:1.45}
.nc-opis span{display:flex;gap:7px;align-items:flex-start}
.nc-opis span::before{content:"";flex:none;width:5px;height:5px;border-radius:50%;background:var(--kat-green);margin-top:6px}
@media(max-width:820px){.nc-karte{grid-template-columns:1fr}}
@media(max-width:560px){.nc-k .nc-red{grid-template-columns:1fr}}
/* --- preneseno iz shoptimizer-child/assets/v4-stranice.css --- */
.nc-auto{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:30;background:#fff;border:1px solid var(--line-soft);border-radius:12px;box-shadow:var(--shadow-lift);padding:6px;display:grid;gap:2px;max-height:240px;overflow:auto}
.nc-auto button{all:unset;display:block;cursor:pointer;padding:9px 11px;border-radius:8px;font:inherit;font-size:.9rem;color:var(--ink);text-align:left}
.nc-auto button:hover,.nc-auto button:focus{background:var(--mist)}
.nc-greska{font-size:.84rem;color:#b42318;margin-top:8px}
.nc-ceka{opacity:.6;pointer-events:none}
.nc-red{position:relative}
.nc-opis .var-sazetak{margin:0}
.nc-opis p{margin:0 0 8px}
.nc-opis p:last-child{margin-bottom:0}
.nc-opis .var-uvjeti{margin-top:8px}
.nc-opis .var-uvjeti > summary{display:inline-flex;align-items:center;gap:6px;cursor:pointer;list-style:none;font-weight:600;color:var(--kat-green);font-size:.84rem}
.nc-opis .var-uvjeti > summary::-webkit-details-marker{display:none}
.nc-opis .var-uvjeti > summary::after{content:"\25BE";font-size:.7em;transition:transform .18s ease}
.nc-opis .var-uvjeti[open] > summary::after{transform:rotate(180deg)}
.nc-opis .var-uvjeti-tijelo{margin-top:8px;padding-top:8px;border-top:1px solid var(--line-soft);display:grid;gap:7px}
@media(max-width:600px){.nc-k select{font-size:.9rem;padding-right:34px}}

/* Kraci natpis taba na uskim ekranima. Pravilo je zivjelo samo u temi (v4-dopune.css),
   pa se na landingu prikazivao i dugi i kratki natpis (Google Maps linkMaps link). */
.nc-tabovi .tab-kratki{display:none}
@media(max-width:560px){
  .nc-tabovi .tab-dugi{display:none}
  .nc-tabovi .tab-kratki{display:inline}
}

/* NALAZ 19 (Petra 17.08.): forma je bila "box unutar boxa" i uža od omotača -
   .search-card je bijela kartica sa sjenom, a dijeljena .nc-k je i sama kartica.
   Omotač postaje proziran, a forma dobiva punu širinu. */
.search-card.pc-hero-nexsas {
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
}
.search-card.pc-hero-nexsas > .nc-k {
  width: 100%;
}

/* NALAZ 18: na mobitelu je hero imao 96 px odmaka od zaglavlja, pa je ispod
   izbornika zjapila praznina prije nego se vidi išta korisno. */
.hero.pc-hero-odmak { padding-top: 96px; }
@media (max-width: 900px) {
  .hero.pc-hero-odmak { padding-top: 40px; }
}
@media (max-width: 600px) {
  .hero.pc-hero-odmak { padding-top: 24px; }
}

/* NALAZ 39 / Petra 18.08.: G logo u tabu "Maps link" ispadao je IZNAD natpisa i tab
   se lomio u dva reda - gumb nije bio flex kontejner. Pravilo je postojalo samo u
   ns.css, dakle samo na landingu; na naslovnici i ostalim WP stranicama nije vrijedilo.
   Sada stoji u dijeljenom obrascu, pa vrijedi na oba okruzenja. */
.nc-tabovi button{display:inline-flex;align-items:center;justify-content:center;gap:6px;line-height:1.2}
.nc-tabovi button svg{flex:none;display:block}

/* PETRIN NALAZ 18.08.: nakon klika na "Lociraj me" nije se vidjelo da se ista dogadja -
   jedini znak bio je `.nc-ceka` (gumb prigusen na 60%). Sada gumb vrti spinner i mijenja
   natpis, a ispod njega tece traka statusa koja kaze na sto se ceka. */
.nc-lociraj[aria-busy="true"]{opacity:1;cursor:progress}
.nc-spinner{width:15px;height:15px;flex:none;border:2px solid rgba(31,107,44,.28);border-top-color:#1f6b2c;border-radius:50%;display:inline-block;animation:nc-vrti .8s linear infinite}
@keyframes nc-vrti{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.nc-spinner{animation-duration:2.4s}}
.nc-lociraj-status{margin:6px 0 2px;font-size:.8rem;line-height:1.45;color:var(--muted)}
/* Izlaz iz grube lokacije: karta na tom podrucju, korisnik sam klikne cesticu. */
.nc-lociraj-karta{display:inline-block;margin:8px 0 2px;font-size:.83rem;font-weight:600;color:#1f6b2c;text-decoration:underline;text-underline-offset:2px}
.nc-lociraj-karta:hover{color:#14501f}

/* PETRIN NALAZ 31.08.: u padajucem izborniku "Naruci vlasnicki list" najduzi nazivi
   ("Komplet vlasnicke dokumentacije 38 €", "Povijesni list - Digitalni + Arhivski 48 €")
   nisu stajali u zatvoreni select na mobitelu - izmjereno na 390 px: tekst 238 px,
   prostor 232 px. Select NEMA text-overflow, pa nema ni tri tockice: naziv se jednostavno
   odsijece na pola rijeci i kupac ne vidi sto bira. Manji font i tjesnji razmak do
   strelice vracaju sve nazive u okvir. Nazivi dolaze iz WooCommercea pa se ne krate. */
@media(max-width:560px){
  .nc-k select{font-size:.82rem;padding-left:11px;padding-right:28px}
}
@media(max-width:380px){
  .nc-k select{font-size:.78rem;padding-right:26px}
}
