/* Sirok ekran u CRM-u (vlasnik, 10. 11. 2026.: "pogled u wide screenu na svim stranicama CRM budu sto vidljiviji").
   Samo @media (min-width:1500px) i (min-width:2000px); uze ekrane ne dira. Sve je ogranceno na osoblje (.app .main).
   Ucitava se iza v6.css (index.html), pa dopunjuje pravila iz v6.css za sirok ekran. */

@media (min-width:1500px){
  /* obrasci (talent, klijent, referenca): sekcije u dva stupca; fotografije, galerija, video, kalendar dostupnosti i traka za spremanje preko cijele sirine */
  .app .main>form[data-form]{max-width:1900px}
  .app .main>form[data-form=talent],.app .main>form[data-form=client],.app .main>form[data-form=ref],.app .main>form[data-form=call]{column-count:2;column-gap:18px}
  .app .main>form[data-form=talent]>*,.app .main>form[data-form=client]>*,.app .main>form[data-form=ref]>*,.app .main>form[data-form=call]>*{break-inside:avoid}
  .app .main>form[data-form=talent]>.form-sect:nth-child(-n+3),
  .app .main>form[data-form]>.form-sect:has(.minical,.pc-grid,.imged),
  .app .main>form[data-form]>details.form-sect,
  .app .main>form[data-form]>.savebar{column-span:all}

  /* postavke i ostale stranice sa sekcijama izravno u .main: dva stupca, naslov preko cijele sirine */
  .app .main:has(>.form-sect){column-count:2;column-gap:18px}
  .app .main:has(>.form-sect)>*{break-inside:avoid}
  .app .main:has(>.form-sect)>.topbar,.app .main:has(>.form-sect)>.denied,.app .main:has(>.form-sect)>.note{column-span:all}
  .app .main>.form-sect{max-width:none}

  /* vidljivost (cvg): kartice pravila u dva stupca, naslovi sekcija preko cijele sirine */
  .app .main:has(>.cvg){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px;align-items:start}
  .app .main:has(>.cvg)>*{grid-column:1/-1}
  .app .main:has(>.cvg)>.cvg{grid-column:auto;margin-bottom:0}
  .app .main:has(>.cvg){row-gap:14px}

  /* reference: kartice u vise stupaca umjesto tri goleme s bannerom od 700+ px */
  .reflist{grid-template-columns:repeat(auto-fill,minmax(340px,1fr))}

  /* ponude: dokument ponude je A4-like, ne rasteze se preko cijelog stupca */
  .offers .offerdoc{max-width:1000px;margin-left:auto;margin-right:auto}

  /* poruke: polja ne trebaju biti sirine pola ekrana */
  .msggrid select,.msggrid input:not([type=checkbox]):not([type=radio]){max-width:720px}
  .msggrid textarea{max-width:900px}

  /* GDPR: filtri dnevnika ne smiju se razvuci preko cijelog ekrana */
  .gdlogf input{max-width:420px}
  .gdlogf select{max-width:260px}

  /* razni prazni/odbijeni ekrani */
  .main>.denied{max-width:900px}
}

@media (min-width:2000px){
  /* nadzorna ploca: tri srednja widgeta u retku (12 stupaca umjesto 6) */
  .dboard{grid-template-columns:repeat(12,minmax(0,1fr))}
  .dboard .dw{grid-column:span 6}
  .dboard .dw-s{grid-column:span 4}
  .dboard .dw-m{grid-column:span 4}
  .dboard .dw-l{grid-column:span 8}
  .dboard .dw-f{grid-column:span 12}

  /* tablice s malo stupaca ne idu preko 1800 px */
  .app .main>.panel:has(>table:not(.attable)),.app .main>.panel:has(>.matrix){max-width:1800px}

  /* vidljivost: tri stupca */
  .app .main:has(>.cvg){grid-template-columns:repeat(3,minmax(0,1fr))}

  /* obrasci: do 2200 px, tri stupca nisu potrebni */
  .app .main>form[data-form]{max-width:2200px}
}

@media (min-width:1500px){
  /* obrazac klijenta: podaci o tvrtki lijevo, provjere (VIES, registar) desno uz njih, preko cijele sirine */
  .app .main>form[data-form]>.form-sect:has(>.fmchk){column-span:all;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:22px;align-items:start}
  .app .main>form[data-form]>.form-sect:has(>.fmchk)>h3{grid-column:1/-1}
  .app .main>form[data-form]>.form-sect:has(>.fmchk)>.fgrid,.app .main>form[data-form]>.form-sect:has(>.fmchk)>.pzlook{grid-column:1}
  .app .main>form[data-form]>.form-sect:has(>.fmchk)>.fmchk{grid-column:2;grid-row:2/span 4}
}

@media (min-width:2000px){
  /* popis registara u provjerama klijenta u dva stupca (inace 1100 px visoka lista) */
  .fmrls{column-count:2;column-gap:22px}
  .fmrls>li{break-inside:avoid}
}

@media (min-width:2000px){
  /* GDPR: matrica privola lijevo, dnevnik promjena (280+ redaka) desno u okviru koji se pomice, umjesto 12 000 px visoke stranice */
  .app .main:has(>.gdlogp){display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);column-gap:16px;align-items:start}
  .app .main:has(>.gdlogp)>*{grid-column:1/-1}
  .app .main:has(>.gdlogp)>.panel:not(.gdlogp):not(.dlog){grid-column:1;grid-row:2}
  .app .main:has(>.gdlogp)>.gdlogp{grid-column:2;grid-row:2;margin-top:0}
  .app .main:has(>.gdlogp) .gdlogw{max-height:calc(100vh - 220px);overflow:auto}
  .app .main:has(>.gdlogp) .gdlog thead th{position:sticky;top:0;z-index:1;background:var(--card,#fff)}
}

@media (min-width:1500px){
  /* javni profil talenta (agent ga otvara iz CRM-a): siri okvir, galerija fiksne sirine uz podatke */
  .wrap:has(>.profile){max-width:1560px}
  .profile{grid-template-columns:minmax(0,560px) minmax(0,1fr)}
}
@media (min-width:2000px){
  /* profil: iza zaglavlja (ime, chipovi, gumbi, statistika) sekcije teku u dva stupca */
  .wrap:has(>.profile){max-width:2000px}
  .profile>.pinfo{column-count:2;column-gap:36px}
  .profile>.pinfo>*{break-inside:avoid}
  .profile>.pinfo>:not(.sect):not(.agentbox){column-span:all}
}

@media (min-width:2500px){
  /* 21:9 i šire: okvir profila do 2400 px; "Svi podaci" (js/profile-more.js) tada ima tri stupca kartica i sadržaj sa strane (širina se prati kontejnerom, ne zaslonom) */
  .wrap:has(>.profile){max-width:2400px}
}


@media (min-width:1500px){
  /* GDPR dnevnik promjena (280+ redaka): okvir koji se pomice sa zaglavljem koje ostaje, umjesto 12 000 px visoke stranice */
  .gdlogp .gdlogw{max-height:75vh;overflow:auto}
  .gdlogp .gdlog thead th{position:sticky;top:0;z-index:1;background:var(--card,#fff)}
}

@media (min-width:2000px){
  /* brojevi telefona: kartice ispod pokazatelja u dva stupca */
  .app .main:has(>.phfix){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px;align-items:start}
  .app .main:has(>.phfix)>*{grid-column:1/-1}
  .app .main:has(>.phfix)>.panel,.app .main:has(>.phfix)>details.panel{grid-column:auto}
}

@media (min-width:1500px){
  /* popis talenata (#/talenti, javni i za osoblje): stranica se siri s ekranom umjesto 1240 px, kartice ostaju otprilike iste
     velicine, pa ih u red stane vise (vlasnik, 10. 11. 2026.: "nemam problema ako je slika sira da se popis talenata siri dalje") */
  .page>.wrap:has(>.search){max-width:none}
  .search .grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
}