/* Bookotravel.com: vizuelni identitet. Tamna smreka, žeravica i planinski papir. */
:root {
  --smreka: #082D68;
  --smreka-2: #0756B8;
  --zeravica: #FF7900;
  --zeravica-2: #FF9233;
  --na-naglasku: #082D68;
  --greska: #B3261E;
  --oker: #FFC48A;
  --papir: #F5F8FC;
  --snijeg: #FFFFFF;
  --tekst: #172B4D;
  --siv: #52627A;
  --linija: #DCE5F1;
  --plus: #1f6b4f;
  --radius: 14px;
  --sjena: 0 1px 2px rgba(8, 45, 104, .06), 0 10px 28px rgba(8, 45, 104, .09);
  --naslovni: "Segoe UI Variable Display", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --tekstni: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 72px; }
body { margin: 0; background: var(--papir); color: var(--tekst); font: 16px/1.5 var(--tekstni); }
body.bez-skrola { overflow: hidden; }
body.ima-traku { padding-bottom: 84px; }
h1, h2, h3 { font-family: var(--naslovni); line-height: 1.2; margin: 0; color: var(--smreka); font-weight: 700; }
h1 { font-size: clamp(1.6rem, 3vw, 2.2rem); }
h2 { font-size: clamp(1.35rem, 2.4vw, 1.7rem); }
h3 { font-size: 1.15rem; }
p { margin: 0 0 .6em; }
a { color: var(--smreka-2); }
img, svg { display: block; max-width: 100%; }
ul, ol { margin: 0; padding: 0; list-style: none; }
main:focus { outline: none; }
:focus-visible { outline: 3px solid var(--smreka-2); outline-offset: 2px; }
[hidden] { display: none !important; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sadrzaj { width: min(1180px, 100%); margin-inline: auto; padding-inline: 20px; }
.preskoci { position: absolute; left: 8px; top: 8px; transform: translateY(-300%); background: var(--snijeg); padding: 8px 14px; z-index: 900; }
.preskoci:focus { transform: none; }

/* uzorak izohipsi */
.topo { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='480' height='240' viewBox='0 0 480 240' fill='none' stroke='%23ffffff' stroke-opacity='.07' stroke-width='1.2'%3E%3Cpath d='M-20 200C70 140 150 170 240 120S400 40 500 80'/%3E%3Cpath d='M-20 230C80 170 160 200 250 150S410 70 500 110'/%3E%3Cpath d='M-20 170C60 110 140 140 230 90S390 10 500 50'/%3E%3Cpath d='M-20 130C50 80 130 110 215 60S370-20 500 15'/%3E%3Cpath d='M60 260C130 215 190 235 270 190S420 120 500 150'/%3E%3Cpath d='M170 270C220 240 270 250 320 225S440 175 500 190'/%3E%3C/svg%3E"); }

/* traka i zaglavlje */
.demo-traka { background: var(--oker); color: #172B4D; font-size: .875rem; padding: 6px 20px; text-align: center; }
.zaglavlje { background: var(--smreka); color: var(--snijeg); }
.zaglavlje-red { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 62px; }
.logo { display: inline-flex; align-items: center; gap: 10px; color: var(--snijeg); text-decoration: none; font: 700 1.5rem/1 var(--naslovni); letter-spacing: .01em; }
.logo svg { width: 34px; height: 28px; }
.logo-malo { font-size: 1.25rem; margin-bottom: .5em; }
.glavni-meni { display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.glavni-meni a { color: var(--snijeg); text-decoration: none; padding: 8px 10px; border-radius: 6px; font-size: .95rem; white-space: nowrap; }
.glavni-meni a:hover { background: rgba(255, 255, 255, .1); }
.broj { display: inline-block; background: var(--zeravica); color: var(--na-naglasku); border-radius: 99px; min-width: 20px; padding: 0 5px; font-size: .75rem; text-align: center; line-height: 20px; }

/* dugmad */
.dugme { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 10px 18px; border-radius: 8px; border: 1px solid transparent; font: 600 .975rem/1.2 var(--tekstni); cursor: pointer; text-decoration: none; text-align: center; }
.dugme-glavno { background: var(--zeravica); color: var(--na-naglasku); }
.dugme-glavno:hover { background: var(--zeravica-2); }
.dugme-glavno:disabled { background: #A3B1C6; cursor: not-allowed; }
.dugme-sekundarno { background: var(--snijeg); color: var(--smreka); border-color: var(--smreka-2); }
.dugme-sekundarno:hover { background: #E9EFF8; }
.dugme-sekundarno[aria-pressed="true"], .sacuvano { background: var(--smreka); color: var(--snijeg); }
.tekst-dugme { background: none; border: 0; color: var(--smreka-2); font: 600 .9rem var(--tekstni); cursor: pointer; padding: 6px; text-decoration: underline; }

/* heroj */
.heroj { position: relative; background: #051B40; color: var(--snijeg); overflow: hidden; }
.heroj-slika { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% 40%; }
.heroj::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4, 22, 54, .86) 0%, rgba(4, 22, 54, .55) 45%, rgba(4, 22, 54, .05) 75%), linear-gradient(0deg, rgba(4, 22, 54, .5), transparent 40%); }
.heroj-sadrzaj { position: relative; z-index: 1; padding-block: clamp(48px, 9vw, 110px) clamp(84px, 11vw, 130px); }
.heroj h1 { color: var(--snijeg); font-size: clamp(2.1rem, 5.2vw, 3.7rem); max-width: 15ch; line-height: 1.08; }
.heroj-uvod { font-size: clamp(1.02rem, 1.6vw, 1.2rem); max-width: 34em; margin: 16px 0 0; color: #E3EBF6; }
.nadnaslov { font-size: .85rem; letter-spacing: .08em; text-transform: uppercase; font-weight: 600; margin-bottom: 12px; color: inherit; }
.heroj .nadnaslov { color: #f0c98a; }

/* pretraga */
.pretraga-omot { position: relative; z-index: 3; margin-top: -48px; }
.pretraga { position: relative; display: grid; grid-template-columns: 1.2fr 1fr 1fr 1.4fr auto; gap: 8px; background: var(--snijeg); padding: 10px; border-radius: 14px; box-shadow: var(--sjena); border: 1px solid var(--linija); }
.obj-pretraga .pretraga { grid-template-columns: 1fr 1fr 1.4fr auto; }
.polje { position: relative; display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: .78rem; font-weight: 600; color: var(--siv); }
.polje > span, .polje > label { padding-left: 11px; }
.datum-omot { position: relative; }
.polje .datum-tekst { padding-right: 42px; }
.datum-kalendar { position: absolute; right: 1px; top: 1px; bottom: 1px; width: 42px; display: grid; place-items: center; background: none; border: 0; border-radius: 8px; color: var(--smreka); cursor: pointer; }
.datum-kalendar:hover { background: var(--papir); }
.dp { position: absolute; z-index: 40; top: calc(100% + 6px); left: 0; width: 280px; padding: 10px; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 10px; box-shadow: var(--sjena); color: var(--tekst); }
.dp-glava { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; font-size: .95rem; }
.dp-glava button { width: 40px; height: 40px; background: none; border: 0; border-radius: 8px; font-size: 1.3rem; color: var(--smreka); cursor: pointer; }
.dp-glava button:hover { background: var(--papir); }
.dp-mreza { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; text-align: center; }
.dp-mreza span { padding: 4px 0; font-size: .74rem; color: var(--siv); }
.dp-mreza button { height: 36px; padding: 0; background: none; border: 0; border-radius: 7px; font: 500 .9rem var(--tekstni); color: var(--tekst); cursor: pointer; }
.dp-mreza button:hover:not(:disabled) { background: #f6e8c9; }
.dp-mreza button:disabled { color: #5B6B82; text-decoration: line-through; cursor: default; }
.dp-mreza .dp-izabran { background: var(--smreka); color: #fff; }
.dp-mreza .dp-izabran:hover:not(:disabled) { background: var(--smreka); }
@media (max-width: 600px) { .polje-datum .dp { width: min(280px, calc(100vw - 48px)); } .polje-datum + .polje-datum .dp { left: auto; right: 0; } }
.polje select, .polje input, .gosti-dugme { width: 100%; min-height: 44px; border: 1px solid var(--linija); border-radius: 8px; background: #fff; padding: 8px 10px; font: 500 .96rem var(--tekstni); color: var(--tekst); }
.gosti-dugme { text-align: left; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pretraga-dugme { align-self: end; min-width: 120px; }
.pretraga-greska { grid-column: 1 / -1; margin: 0; color: var(--greska); font-weight: 600; font-size: .92rem; }
.gosti-panel { position: absolute; z-index: 20; top: 100%; left: 0; right: 0; min-width: 280px; margin-top: 6px; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 10px; box-shadow: var(--sjena); padding: 12px; color: var(--tekst); font-size: .95rem; font-weight: 400; }
.gosti-panel .dugme { width: 100%; margin-top: 8px; }
.stepper { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 8px 0; }
.stepper small { display: block; color: var(--siv); }
.stepper-kontrole { display: flex; align-items: center; gap: 8px; }
.stepper-kontrole button { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--smreka-2); background: #fff; color: var(--smreka); font-size: 1.2rem; cursor: pointer; }
.stepper-kontrole output { min-width: 26px; text-align: center; font-weight: 600; }
.traka-pretrage { background: var(--smreka); padding-block: 14px; }
.traka-pretrage .pretraga { box-shadow: none; }

/* ponuda */
.ponuda-traka { display: flex; justify-content: space-between; align-items: center; gap: 28px; flex-wrap: wrap; margin-top: 36px; background-color: var(--smreka); color: #E9F0F9; padding-block: 28px; border-radius: 14px; width: min(1140px, calc(100% - 40px)); padding-inline: 28px; }
.ponuda-traka h2 { color: var(--snijeg); max-width: 26em; margin-bottom: 8px; }
.ponuda-traka p { margin: 0; }
.ponuda-tekst { flex: 1 1 420px; }
.ponuda-tekst .nadnaslov { margin-bottom: 10px; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; color: #f0c98a; }
.ponuda-cijena { display: grid; justify-items: start; gap: 2px; }
.ponuda-cijena strong { font: 700 2.6rem/1 var(--naslovni); color: var(--snijeg); }
.ponuda-cijena small { margin-bottom: 10px; }

/* oznake */
.oznaka { display: inline-block; padding: 3px 8px; border-radius: 5px; font: 700 .72rem/1.3 var(--tekstni); letter-spacing: .03em; text-transform: uppercase; }
.oznaka-primjer { background: var(--oker); color: #172B4D; }
.oznaka-stvarno { background: #d6efe0; color: #0e4a33; }
.znacka-ponuda { display: inline-block; background: var(--zeravica); color: var(--na-naglasku); padding: 3px 8px; border-radius: 5px; font-size: .75rem; font-weight: 700; }

/* odjeljci */
.odjeljak { margin-top: 48px; }
.odjeljak > h2 { margin-bottom: 16px; }
.zone { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.zona[hidden] { display: none; }
.zona-tekst em { font-style: normal; font-size: .8rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #f0c98a; }
.vrste { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.vrste .dugme[aria-pressed="true"] { background: var(--smreka); border-color: var(--smreka); color: var(--snijeg); }
.drzave { margin-top: 16px; }
.objave { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.blog { padding-top: 16px; padding-bottom: 40px; }
/* ---------- moderni paneli: bočni meni, kartice i pregled ---------- */
.panel:has(> .panel-meni) { grid-template-columns: 252px minmax(0, 1fr); column-gap: 28px; align-items: start; }
.panel:has(> .panel-meni) > :not(.panel-meni) { grid-column: 2; }
.panel-meni { grid-column: 1; grid-row: 1 / span 80; position: sticky; top: 80px; max-height: calc(100vh - 100px); overflow-y: auto; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 18px; padding: 12px 10px; box-shadow: var(--sjena); }
.panel-meni-dugme { display: none; }
.pm-korisnik { display: flex; align-items: center; gap: 10px; padding: 6px 8px 12px; border-bottom: 1px solid var(--linija); }
.pm-korisnik strong { display: block; line-height: 1.2; overflow-wrap: anywhere; }
.pm-korisnik small { color: var(--siv); font-size: .8rem; }
.pm-avatar { flex: none; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, var(--smreka), var(--smreka-2)); color: #fff; font: 700 .95rem var(--naslovni); }
.pm-grupa { margin: 14px 10px 4px; font-size: .7rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--siv); }
.pm-veza { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px; border: 0; border-radius: 10px; background: none; color: var(--tekst); font: 500 .93rem var(--tekstni); text-align: start; text-decoration: none; cursor: pointer; }
.pm-veza:hover { background: var(--papir); }
.pm-veza.aktivna { background: #EAF1FB; color: var(--smreka); font-weight: 700; box-shadow: inset 3px 0 0 var(--zeravica); }
[dir="rtl"] .pm-veza.aktivna { box-shadow: inset -3px 0 0 var(--zeravica); }
.pm-veza .znacka { margin-inline-start: auto; }
.pm-ikona { flex: none; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; color: var(--smreka-2); }
.pm-dno { margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--linija); }
.panel-glava { padding-bottom: 4px; }
.panel-glava h1 { margin: 0; font-size: 1.75rem; letter-spacing: -.01em; }
.panel .upit-forma, .panel .panel-objekat, .panel .panel-upit, .panel .panel-soba { border-radius: 16px; box-shadow: 0 1px 2px rgba(8, 45, 104, .05); }
.panel-kartice { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
.panel-karta { display: flex; align-items: center; gap: 12px; padding: 14px 16px; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 16px; color: inherit; text-decoration: none; transition: box-shadow .15s, border-color .15s; }
.panel-karta:hover { border-color: var(--smreka-2); box-shadow: var(--sjena); }
.panel-karta .pm-ikona { width: 42px; height: 42px; padding: 10px; border-radius: 12px; background: #EAF1FB; }
.panel-karta.vazno .pm-ikona { background: #FFF1E5; color: var(--zeravica); }
.panel-karta strong { display: block; font: 700 1.55rem/1.1 var(--naslovni); color: var(--smreka); }
.panel-karta small { color: var(--siv); }
.pm-savjet { margin: 8px 0 0 !important; padding: 6px 10px; border-radius: 8px; background: #FFF7EF; color: #7a4200 !important; font-size: .9rem; }
.za-uraditi { margin-bottom: 8px; }
.za-uraditi ul { list-style: none; padding: 0; margin: 8px 0 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 10px; }
.za-uraditi a { display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: #FFF7EF; border: 1px solid #FFD9B5; border-radius: 14px; color: var(--tekst); text-decoration: none; }
.za-uraditi a:hover { border-color: var(--zeravica); }
.za-uraditi strong { font: 700 1.4rem var(--naslovni); color: #B85600; }
.panel .admin-tabovi { gap: 6px; padding: 6px; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 14px; border-bottom-width: 1px; }
.panel .admin-tabovi a { border-radius: 10px; margin: 0; border-bottom: 0; }
.panel .admin-tabovi a[aria-current="page"] { background: var(--smreka); color: #fff; }
.panel a.admin-karta { border-radius: 14px; }
.panel .admin-brojke > div { border-radius: 14px; }
@media (max-width: 1199px) { .panel-meni { top: 16px; } }
@media (max-width: 900px) {
  .panel:has(> .panel-meni) { grid-template-columns: minmax(0, 1fr); }
  .panel:has(> .panel-meni) > :not(.panel-meni) { grid-column: 1; }
  .panel-meni { grid-row: auto; position: static; max-height: none; padding: 6px; }
  .panel-meni-dugme { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 12px; border: 0; border-radius: 12px; background: none; color: var(--smreka); font: 700 1rem var(--tekstni); cursor: pointer; }
  .panel-meni:not(.otvoren) .panel-meni-lista { display: none; }
  .panel-meni.otvoren .panel-meni-dugme { border-bottom: 1px solid var(--linija); border-radius: 12px 12px 0 0; }
}
/* ---------- društvene mreže u podnožju ---------- */
.drustvene { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 18px; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .18); }
.drustvene[hidden] { display: none; }
.drustvene span { color: #fff; font-weight: 600; margin-inline-end: 4px; }
.drustvene a { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: rgba(255, 255, 255, .12); color: #fff; transition: background .15s, transform .15s; }
.drustvene a:hover, .drustvene a:focus-visible { background: var(--zeravica); transform: translateY(-2px); }
.drustvene svg { width: 21px; height: 21px; }
.vodic { margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--linija); }
.vodic h2 { margin-top: 22px; }
.vodic p { line-height: 1.6; }
.vodic-pitanje { border-bottom: 1px solid var(--linija); padding: 10px 0; }
.vodic-pitanje summary { cursor: pointer; font-weight: 700; color: var(--smreka); }
.vodic-veze { display: flex; flex-wrap: wrap; gap: 8px 18px; padding: 0; list-style: none; }
.blog h1 { margin-bottom: 6px; }
.blog .objava-uvod { margin-bottom: 18px; }
.objava-datum { margin: 0 0 8px; color: var(--smreka-2); font-weight: 600; }
.objava-karta { display: grid; grid-template-rows: 170px auto; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 12px; overflow: hidden; color: inherit; text-decoration: none; }
.objava-karta:hover { border-color: var(--smreka-2); }
.objava-karta .slika { height: 170px; }
.objava-tekst { display: grid; gap: 6px; padding: 14px 16px 16px; align-content: start; }
.objava-tekst small { color: var(--smreka-2); font-weight: 700; }
.objava-tekst strong { font: 700 1.25rem var(--naslovni); color: var(--smreka); }
.planine { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.planine a { display: grid; gap: 2px; padding: 12px 14px; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 10px; color: inherit; text-decoration: none; }
.planine a:hover { border-color: var(--smreka-2); }
.planine strong { font: 700 1.1rem var(--naslovni); color: var(--smreka); }
.planine span { color: var(--siv); font-size: .9rem; }
.planine small { font-weight: 600; }
.prednosti { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
.prednosti li { display: grid; gap: 4px; padding: 14px 16px; background: var(--snijeg); border-left: 4px solid var(--oker); border-radius: 6px; }
.prednosti strong { color: var(--smreka); }
.objava { padding-block: 16px 40px; }
.objava-uvod { font-size: 1.1rem; max-width: 720px; }
.objava-dio { margin-top: 32px; }
.objava-dio > p { max-width: 720px; }
.zona { position: relative; display: block; min-height: 250px; border-radius: 12px; overflow: hidden; color: var(--snijeg); text-decoration: none; background: var(--smreka); }
.zona .slika { position: absolute; inset: 0; }
.zona::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(4, 22, 54, .94) 40%, rgba(4, 22, 54, .1) 88%); }
.zona-tekst { position: absolute; z-index: 1; left: 18px; right: 18px; bottom: 16px; display: grid; gap: 3px; }
.zona-tekst strong { font: 700 1.5rem var(--naslovni); }
.zona-tekst small { color: #f0c98a; font-weight: 600; }
.zona:hover .slika > * { transform: scale(1.03); }
.slika { display: block; overflow: hidden; background: #0F3D80; }
.slika > img, .slika > svg { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.zbirke { display: flex; flex-wrap: wrap; gap: 10px; }
.zbirka { display: inline-block; padding: 10px 16px; border: 1px solid var(--smreka-2); border-radius: 99px; color: var(--smreka); background: var(--snijeg); text-decoration: none; font-weight: 500; }
.zbirka:hover { background: var(--smreka); color: var(--snijeg); }
.kako { margin-top: 56px; background: #E9F0F9; padding-block: 40px; }
.kako h2 { margin-bottom: 20px; }
.koraci-pocetna { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; counter-reset: k; }
.koraci-pocetna li { counter-increment: k; display: grid; gap: 4px; }
.koraci-pocetna li::before { content: counter(k); font: 700 2rem/1 var(--naslovni); color: var(--zeravica); }
.koraci-pocetna strong { font-size: 1.06rem; }

/* rezultati */
.rezultati { padding-block: 16px 56px; }
.mrvice { display: flex; flex-wrap: wrap; gap: 6px; font-size: .875rem; color: var(--siv); margin-bottom: 14px; }
.rezultati-raspored { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 24px; align-items: start; }
.filteri { background: var(--snijeg); border: 1px solid var(--linija); border-radius: 12px; padding: 14px 16px; }
.filteri-glava { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.filteri-glava h2 { font-size: 1.15rem; }
.filteri-zatvori, .filteri-dno { display: none; }
.filter-grupa { border: 0; border-top: 1px solid var(--linija); margin: 12px 0 0; padding: 12px 0 0; min-width: 0; }
.filter-grupa legend { float: left; width: 100%; font-weight: 700; font-size: .92rem; margin-bottom: 6px; color: var(--smreka); padding: 0; }
.filter-red { clear: both; display: grid; grid-template-columns: 20px 1fr auto; align-items: center; gap: 8px; padding: 5px 0; font-size: .93rem; cursor: pointer; }
.filter-red input { width: 18px; height: 18px; accent-color: var(--smreka-2); margin: 0; }
.filter-red small { color: var(--siv); }
.klizac { clear: both; display: block; }
.klizac input { width: 100%; accent-color: var(--zeravica); }
.klizac-vrijednost { font-size: .9rem; font-weight: 600; }
.lista-glava { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.lista-podnaslov { color: var(--siv); margin: 4px 0 0; font-size: .92rem; }
.lista-kontrole { display: flex; gap: 8px; flex-wrap: wrap; align-items: flex-end; }
#otvori-filtere { display: none; }
.sortiranje { display: flex; flex-direction: column; font-size: .78rem; font-weight: 600; color: var(--siv); gap: 2px; }
.sortiranje select { min-height: 44px; border: 1px solid var(--linija); border-radius: 8px; padding: 8px; font: 500 .94rem var(--tekstni); background: #fff; color: var(--tekst); }
.lista { display: grid; gap: 14px; }
.kartica { position: relative; display: grid; grid-template-columns: 240px minmax(0, 1fr) 190px; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 12px; overflow: hidden; }
.kartica:hover { box-shadow: var(--sjena); }
.kartica-zauzeto { opacity: .78; }
.kartica-slika { position: relative; display: block; min-height: 190px; }
.kartica-slika .slika { position: absolute; inset: 0; }
.kartica-slika .oznaka { position: absolute; top: 10px; left: 10px; }
.srce { position: absolute; top: 8px; left: 196px; z-index: 2; width: 36px; height: 36px; display: grid; place-items: center; background: rgba(255, 255, 255, .94); border: 0; border-radius: 50%; cursor: pointer; }
.srce svg { width: 20px; height: 20px; fill: none; stroke: var(--smreka); stroke-width: 2; }
.srce-puno svg { fill: var(--zeravica); stroke: var(--zeravica); }
.kartica-tijelo { padding: 14px 16px; min-width: 0; }
.kartica-glava { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; flex-wrap: wrap; }
.kartica-tip { color: var(--siv); font-size: .85rem; margin: 0 0 3px; }
.kartica h3 { font-size: 1.28rem; }
.kartica h3 a { color: var(--smreka); text-decoration: none; }
.kartica h3 a:hover { text-decoration: underline; }
.kartica-opis { margin: 8px 0; font-size: .95rem; }
.kartica-soba { font-size: .9rem; margin: 0 0 6px; }
.kartica-uslovi { display: flex; flex-wrap: wrap; gap: 3px 14px; font-size: .875rem; color: var(--siv); }
.kartica-uslovi .plus { color: var(--plus); font-weight: 600; }
.kartica-cijena { padding: 14px 16px; display: flex; flex-direction: column; justify-content: space-between; gap: 12px; border-left: 1px solid var(--linija); text-align: right; }
.cijena-blok { display: grid; gap: 2px; justify-items: end; }
.cijena-blok small { color: var(--siv); font-size: .8rem; line-height: 1.3; }
.cijena { font: 700 1.55rem/1.1 var(--naslovni); color: var(--smreka); }
.cijena-upit { font-size: 1.25rem; }
.ocjena { display: inline-flex; align-items: center; gap: 8px; }
.ocjena-broj { width: 40px; height: 40px; flex: none; display: grid; place-items: center; background: var(--smreka); color: var(--snijeg); border-radius: 50%; font: 700 .95rem var(--tekstni); }
.ocjena-tekst { display: grid; font-size: .9rem; line-height: 1.25; text-align: left; }
.ocjena-tekst small { color: var(--siv); font-size: .78rem; }
.bez-ocjene { font-size: .82rem; color: var(--siv); }
.prazno { background: var(--snijeg); border: 1px dashed var(--linija); padding: 32px; border-radius: 12px; text-align: center; }
.prazno .dugme { margin-top: 10px; }
.shema { margin: 0 0 14px; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 12px; overflow: hidden; }
.shema figcaption { font-size: .82rem; color: var(--siv); padding: 8px 12px; }
.shema-natpis text { font: 700 18px var(--naslovni); fill: #52627A; }
.pin path { fill: var(--smreka-2); stroke: #fff; stroke-width: 2; }
.pin circle { fill: #fff; }
.pin-stvarno path, .pin-aktivan path { fill: var(--zeravica); }

/* objekat */
.objekat { padding-block: 16px 56px; }
.objekat-glava { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; align-items: flex-start; margin-bottom: 14px; }
.objekat-glava h1 { margin-top: 4px; }
.adresa { color: var(--siv); margin: 4px 0 0; }
.objekat-akcije { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.galerija { display: grid; grid-template-columns: 2fr 1fr 1fr; grid-auto-rows: 180px; gap: 8px; }
.galerija-stavka { padding: 0; border: 0; border-radius: 10px; overflow: hidden; cursor: zoom-in; background: #0F3D80; }
.galerija-stavka .slika { width: 100%; height: 100%; }
.galerija-prva { grid-row: span 2; }
.galerija-napomena { grid-column: 1 / -1; font-size: .84rem; color: var(--siv); }
.tabovi { position: sticky; top: 0; z-index: 5; display: flex; gap: 2px; overflow-x: auto; background: var(--papir); border-bottom: 1px solid var(--linija); margin-top: 18px; scrollbar-width: none; }
.tabovi a { flex: none; padding: 12px 14px; color: var(--smreka); text-decoration: none; font-weight: 600; font-size: .94rem; }
.tabovi a:hover { box-shadow: inset 0 -3px 0 var(--zeravica); }
.objekat-opis { display: grid; grid-template-columns: minmax(0, 2fr) minmax(240px, 1fr); gap: 24px; margin-top: 24px; }
.opis-tekst h2 { margin-bottom: 10px; }
.istaknuto { background: #E9F0F9; border-radius: 12px; padding: 16px; }
.istaknuto h3 { margin-bottom: 8px; }
.istaknuto li { padding: 3px 0 3px 20px; position: relative; font-size: .94rem; }
.istaknuto li::before { content: ""; position: absolute; left: 3px; top: .72em; width: 8px; height: 8px; background: var(--zeravica); transform: rotate(45deg); }
.kontakt { display: grid; gap: 8px; margin-top: 12px; justify-items: start; }
.tekst-veza { font-weight: 600; }
.napomena-primjer { background: #f6e8c9; color: #4a370d; border-radius: 6px; padding: 6px 10px; font-size: .875rem; }
.objekat-sobe, .odjeljak-uzak { margin-top: 36px; scroll-margin-top: 60px; }
.objekat-opis { scroll-margin-top: 60px; }
.objekat-sobe > h2, .odjeljak-uzak > h2 { margin-bottom: 12px; }
.obj-pretraga { margin-bottom: 12px; }
.poruka { background: #E8F0FA; border-left: 4px solid var(--smreka-2); padding: 10px 12px; border-radius: 4px; font-size: .94rem; }
.poruka-demo { background: #f6e8c9; border-color: var(--oker); color: #4a370d; }
.sobe-lista:not(.sobe-tabela) { display: grid; gap: 10px; }
.soba { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.3fr) 150px 120px; gap: 16px; padding: 14px 16px; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 10px; align-items: start; }
.soba-ponuda { border: 2px solid var(--zeravica); }
.soba h3 { margin: 4px 0; }
.soba p { margin: 0; font-size: .92rem; color: var(--siv); }
.soba .preostalo { color: var(--smreka-2); font-weight: 600; }
.soba-uslovi li { font-size: .9rem; padding-left: 16px; position: relative; }
.soba-uslovi li::before { content: "✓"; position: absolute; left: 0; color: var(--plus); font-weight: 700; }
.soba-cijena { display: grid; gap: 2px; justify-items: end; text-align: right; }
.soba-cijena small { color: var(--siv); font-size: .8rem; }
.soba-izbor label { display: grid; gap: 2px; font-size: .78rem; font-weight: 600; color: var(--siv); }
.soba-izbor select { min-height: 44px; border: 1px solid var(--smreka-2); border-radius: 8px; background: #fff; padding: 6px 10px; font: 600 1rem var(--tekstni); }
.soba-izbor select:disabled { border-color: var(--linija); background: #eee; }
.razlog { display: block; color: var(--siv); font-size: .78rem; margin-top: 4px; line-height: 1.3; }
.sadrzaji-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px 16px; }
.sadrzaji-lista li { padding-left: 22px; position: relative; }
.sadrzaji-lista li::before { content: "✓"; position: absolute; left: 0; color: var(--plus); font-weight: 700; }
.recenzije-raspored { display: grid; grid-template-columns: minmax(240px, 1fr) minmax(0, 2fr); gap: 24px; }
.podocjene { display: grid; gap: 8px; align-content: start; }
.podocjena { display: grid; grid-template-columns: 1fr; gap: 3px; font-size: .9rem; position: relative; }
.podocjena b { position: absolute; right: 0; top: 0; }
.traka { display: block; height: 7px; border-radius: 9px; background: #D6E1F0; overflow: hidden; }
.traka i { display: block; height: 100%; background: var(--smreka-2); }
.recenzije-lista { display: grid; gap: 10px; align-content: start; }
.recenzija { margin: 0; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 10px; padding: 12px 14px; }
.recenzija p { margin-bottom: 6px; }
.recenzija footer { color: var(--siv); font-size: .85rem; }
.pravila { margin: 0; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 10px; }
.pravila > div { display: grid; grid-template-columns: 130px 1fr; padding: 10px 14px; border-top: 1px solid var(--linija); gap: 10px; }
.pravila > div:first-child { border-top: 0; }
.pravila dt { font-weight: 700; }
.pravila dd { margin: 0; }
.izbor-traka { position: fixed; z-index: 15; left: 0; right: 0; bottom: 0; background: var(--smreka); color: var(--snijeg); padding-block: 10px; box-shadow: 0 -6px 20px rgba(0, 0, 0, .2); }
.izbor-traka-red { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.izbor-traka strong { font: 700 1.2rem var(--naslovni); display: block; }
.izbor-traka small { color: #DAE3EF; }

/* svjetlo */
.svjetlo { border: 0; padding: 0; background: transparent; width: 100vw; max-width: 100vw; height: 100dvh; max-height: 100dvh; }
.svjetlo[open] { display: grid; place-items: center; }
.svjetlo::backdrop { background: rgba(3, 17, 42, .92); }
.svjetlo figure { margin: 0; width: min(1100px, 86vw); color: #EEF3FA; text-align: center; }
.svjetlo figure .slika { aspect-ratio: 16 / 10; max-height: 78dvh; width: 100%; border-radius: 8px; background: #051B40; }
.svjetlo figure img { object-fit: contain; }
.svjetlo figcaption { margin-top: 10px; font-size: .92rem; }
.svjetlo button { position: absolute; background: rgba(255, 255, 255, .14); color: #fff; border: 0; border-radius: 50%; width: 48px; height: 48px; font-size: 1.8rem; line-height: 1; cursor: pointer; }
.svjetlo-zatvori { top: 14px; right: 14px; }
.svjetlo-pret { left: 10px; top: calc(50% - 24px); }
.svjetlo-sljed { right: 10px; top: calc(50% - 24px); }

/* upit */
.upit { padding-block: 22px 56px; }
.koraci { display: flex; gap: 8px; margin-bottom: 22px; flex-wrap: wrap; }
.koraci li { display: flex; align-items: center; gap: 8px; color: var(--siv); font-size: .92rem; }
.koraci li + li::before { content: ""; width: 26px; height: 2px; background: var(--linija); }
.koraci span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: #D6E1F0; font-weight: 700; color: var(--tekst); }
.koraci .gotovo span { background: var(--smreka-2); color: #fff; }
.koraci .trenutni { color: var(--tekst); font-weight: 700; }
.koraci .trenutni span { background: var(--zeravica); color: var(--na-naglasku); }
.upit-raspored { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr); gap: 24px; align-items: start; }
.upit-forma { background: var(--snijeg); border: 1px solid var(--linija); border-radius: 12px; padding: 20px; min-width: 0; }
.upit-forma:focus { outline: none; }
.upit-forma h1 { margin-bottom: 12px; font-size: 1.6rem; }
.unos { display: grid; gap: 4px; margin-top: 12px; font-weight: 600; font-size: .92rem; }
.unos input, .unos textarea { width: 100%; min-height: 44px; border: 1px solid #AAB8CC; border-radius: 8px; padding: 10px; font: 400 1rem var(--tekstni); background: #fff; }
.lozinka-polje { position: relative; display: block; }
.lozinka-polje input { width: 100%; padding-right: 46px; }
.lozinka-oko { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; background: none; border: 0; cursor: pointer; color: #55637A; border-radius: 8px; }
.lozinka-oko:hover { color: var(--smreka, #082D68); background: rgba(8,45,104,.07); }
.lozinka-oko svg { width: 20px; height: 20px; fill: currentColor; }
.lozinka-oko.otvoreno::after { content: ""; position: absolute; width: 26px; height: 2px; background: currentColor; transform: rotate(-45deg); border-radius: 2px; }
.greska { color: var(--greska); font-weight: 600; margin: 12px 0 0; }
.upit-dugmad { display: flex; justify-content: space-between; gap: 10px; margin-top: 18px; }
.sazetak { background: var(--snijeg); border: 1px solid var(--linija); border-radius: 12px; overflow: hidden; }
.sazetak > .slika { height: 150px; }
.sazetak-tijelo { padding: 14px 16px; }
.sazetak h2 { font-size: 1.25rem; margin: 6px 0 8px; }
.sazetak dl { margin: 0; }
.sazetak dl > div { display: flex; justify-content: space-between; gap: 10px; padding: 4px 0; font-size: .92rem; }
.sazetak dt { color: var(--siv); }
.sazetak dd { margin: 0; font-weight: 600; text-align: right; }
.sazetak-sobe { margin: 8px 0; border-top: 1px solid var(--linija); padding-top: 8px; font-size: .92rem; }
.sazetak-ukupno { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; border-top: 1px solid var(--linija); padding-top: 8px; margin: 0 0 8px; }
.sazetak-ukupno strong { font: 700 1.15rem var(--naslovni); text-align: right; }
.kontakt-dugmad { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; }
.tekst-naslov { font-size: 1.05rem; margin-top: 18px; }
.tekst-upita { white-space: pre-wrap; overflow-wrap: anywhere; background: #EEF3FA; border-radius: 8px; padding: 12px; font: .9rem/1.5 ui-monospace, Consolas, monospace; margin: 8px 0 0; }

/* vlasnici, nalog i panel */
.nav-nalog { border: 1px solid rgba(255, 255, 255, .55); margin-left: 6px; }
.vlasnici { display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; padding-block: 34px; }
.vlasnici p { margin: 6px 0 0; }
.vlasnici-dugmad { display: flex; gap: 8px; flex-wrap: wrap; }
.nalog { padding-block: 36px 60px; }
.nalog-forma { max-width: 440px; margin-inline: auto; }
.nalog-dugme { width: 100%; margin-top: 16px; }
.nalog-veza { margin: 14px 0 0; text-align: center; font-size: .94rem; }
.unos select { width: 100%; min-height: 44px; border: 1px solid #AAB8CC; border-radius: 8px; padding: 10px; font: 400 1rem var(--tekstni); background: #fff; }
.panel { padding-block: 22px 60px; display: grid; gap: 18px; }
.panel > * { min-width: 0; }
.panel-glava { display: flex; justify-content: space-between; align-items: flex-end; gap: 14px; flex-wrap: wrap; }
.panel-glava-desno { display: flex; align-items: center; gap: 12px; }
.panel-nazad { display: inline-block; margin-bottom: 4px; font-size: .92rem; }
.panel-akcije { display: flex; gap: 8px; flex-wrap: wrap; }
.panel-lista { display: grid; gap: 12px; }
.panel-objekat { display: flex; justify-content: space-between; gap: 16px; align-items: center; flex-wrap: wrap; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 12px; padding: 16px; }
.panel-objekat p { margin: 4px 0 0; color: var(--siv); }
.panel-objekat-dugmad { display: flex; gap: 8px; flex-wrap: wrap; }
.pretraga .polje-fleks select { min-width: 0; }
@media (max-width: 1100px) {
  .pretraga { grid-template-columns: repeat(3, 1fr); }
  .pretraga .pretraga-dugme { grid-column: span 2; }
  .obj-pretraga .pretraga .pretraga-dugme { grid-column: span 1; }
}
@media (max-width: 860px) { .polje-fleks { grid-column: 1 / -1; } }
.znacka-popust { display: inline-block; margin-top: 3px; padding: 1px 7px; border-radius: 5px; background: #d6efe0; color: #0e4a33; font-size: .78rem; font-weight: 700; }
.oznaka-odmah { background: #1f6b4f; color: #fff; }
.karta-okvir { margin: 0 0 14px; }
.karta { height: 360px; border-radius: 10px; border: 1px solid var(--linija); background: #E9EFF8; z-index: 0; }
.karta-izbor { height: 340px; cursor: crosshair; }
.lokacija-blok { margin: 4px 0 14px; }
.adresa-red { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: end; }
.adresa-red .unos { margin-bottom: 0; }
.adresa-red .dugme { min-height: 44px; }
.adresa-rezultati { margin: 8px 0 0; padding: 4px 10px; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 8px; }
.adresa-rezultati[hidden], .adresa-veze[hidden] { display: none; }
.adresa-rezultati li { padding: 6px 0; border-bottom: 1px solid var(--linija); }
.adresa-rezultati li:last-child { border-bottom: 0; }
.adresa-rezultati .tekst-dugme { text-align: left; }
#adresa-status { margin: 8px 0; }
.adresa-veze { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; margin: 8px 0 0; font-size: .92rem; }
.igla-omot { background: none; border: 0; cursor: grab; }
.igla { display: block; width: 26px; height: 26px; margin: 1px; background: var(--zeravica); border: 3px solid #fff; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); box-shadow: 0 2px 6px rgba(0, 0, 0, .45); }
.igla::after { content: ""; display: block; width: 8px; height: 8px; margin: 6px; background: #fff; border-radius: 50%; }
.karta a { color: var(--smreka); font-weight: 600; }
.nav-jezik { background: none; border: 1px solid rgba(255, 255, 255, .45); border-radius: 6px; color: inherit; font: 600 .82rem var(--tekstni); padding: 4px 7px; min-height: 32px; cursor: pointer; }
.traka-potvrde { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.panel-ical { margin: -4px 0 12px; padding: 12px 16px; background: var(--snijeg); border: 1px dashed var(--linija); border-radius: 12px; }
.panel-ical h4 { margin: 0 0 6px; }
.ical-lista { list-style: none; margin: 0 0 8px; padding: 0; overflow-wrap: anywhere; }
.ical-lista li { padding: 6px 0; border-bottom: 1px solid var(--linija); }
.ical-forma { align-items: end; }
.prijava-blok { margin-top: 8px; }
.prijava-blok summary { cursor: pointer; font-weight: 600; padding: 6px 0; }
.razgovor-detalji { padding: 8px 10px; background: var(--papir); border-radius: 8px; }
.razgovor-detalji p { margin: 0 0 4px; }
.pravni-tekst { max-width: 760px; }
.pravni-tekst h2 { font-size: 1.1rem; margin: 18px 0 4px; }
.panel-glava-desno { flex-wrap: wrap; }
.znacka { display: inline-block; min-width: 20px; padding: 0 6px; border-radius: 10px; background: var(--zeravica); color: var(--na-naglasku); font-size: .78rem; font-weight: 700; line-height: 20px; text-align: center; text-decoration: none; }
.znacka[hidden] { display: none; }
.razgovor { display: grid; gap: 10px; max-width: 760px; margin: 16px auto 0; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 12px; padding: 16px; }
.razgovor-glava h1, .razgovor-glava h2 { font-size: 1.3rem; margin: 0 0 2px; overflow-wrap: anywhere; }
.razgovor-glava p { margin: 0; color: var(--siv); font-size: .92rem; }
.razgovor-pravilo { margin: 0; padding: 8px 10px; background: #f6e8c9; color: #4a370d; border-radius: 8px; font-size: .88rem; }
.razgovor-lista { display: flex; flex-direction: column; gap: 8px; height: min(52vh, 460px); overflow-y: auto; padding: 10px; background: var(--papir); border: 1px solid var(--linija); border-radius: 8px; }
.razgovor-prazno { margin: auto; }
.poruka-red { display: flex; }
.poruka-red.moja { justify-content: flex-end; }
.oblacic { max-width: 80%; padding: 8px 12px; background: #fff; border: 1px solid var(--linija); border-radius: 10px; overflow-wrap: anywhere; }
.moja .oblacic { background: var(--smreka); border-color: var(--smreka); color: #fff; }
.oblacic p { margin: 0 0 2px; white-space: pre-wrap; }
.oblacic small { color: var(--siv); font-size: .76rem; }
.moja .oblacic small { color: #D3DFEE; }
.razgovor-forma .greska { margin: 6px 0; }
.razgovor-forma[hidden], .razgovor-zatvoren[hidden] { display: none; }
.status-da { color: var(--plus); }
.status-ne { color: var(--greska); }
/* Mijenja se samo nijansa crvene, jednom u sekundi, pa tekst ostaje čitljiv i bez bljeskanja */
@keyframes treptanje { 0%, 100% { background-color: #b3261e; } 50% { background-color: #6f120d; } }
.trepti { background-color: #b3261e; color: #fff !important; animation: treptanje 1s ease-in-out infinite; }
a.trepti { border-radius: 6px; }
.panel-glava-desno a.trepti { padding: 2px 8px; }
#nav-nalog.trepti { border-color: #b3261e; }
.upozorenje-uplata { display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: baseline; margin: 10px 0 14px; padding: 12px 14px; text-decoration: none; font-size: 1rem; }
.upozorenje-uplata strong { font-size: 1.08rem; }
.razgovor-dug { padding: 8px 10px; background: #f6dfd9; border-radius: 8px; }
.razgovor-dug h3 { font-size: .98rem; margin: 0 0 4px; }
.razgovor-dug ul { margin: 0; display: grid; gap: 4px; }
.razgovor-dug li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; font-size: .92rem; }
#plat-dug:empty { display: none; }
@media (prefers-reduced-motion: reduce) { .trepti { animation: none; } }
.panel-dva { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
.panel-tri { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 12px; }
.panel-grupa { margin-bottom: 4px; }
.panel-cekovi { clear: both; display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 0 16px; }
.panel-cek { grid-template-columns: 20px 1fr; }
.upit-forma > .dugme { margin-top: 14px; }
.sacuvano-poruka { color: var(--plus); font-weight: 600; margin: 0 0 0 10px; }
.panel-sobe { display: grid; gap: 12px; }
.panel-sobe-lista { display: grid; gap: 12px; }
.panel-soba { background: var(--snijeg); border: 1px solid var(--linija); border-radius: 12px; padding: 4px 16px 14px; }
.panel-soba-polja { display: grid; grid-template-columns: 2fr 1fr 1fr 1.4fr; gap: 0 12px; }
.panel-soba-polja .unos:nth-child(5) { grid-column: span 3; }
.panel-soba-dugmad { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.panel-obrisi { justify-self: start; }
.panel-preuzmi { max-width: 520px; }
.panel-preuzmi .dugme { margin-top: 12px; }
.panel-upit { background: var(--snijeg); border: 1px solid var(--linija); border-radius: 12px; padding: 14px 16px; overflow-wrap: anywhere; }
.panel-upit h2 { font-size: 1.15rem; margin-bottom: 6px; }
.panel-upit p { margin: 0 0 4px; }
.panel-upit small { color: var(--siv); }
.panel-napomena { background: #EEF3FA; border-radius: 6px; padding: 8px 10px; margin-top: 6px !important; white-space: pre-wrap; }
.kal-kontrole { display: flex; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.kal-kontrole .unos { margin: 0; min-width: min(320px, 100%); }
.kal-osnovna { margin: 0 0 10px; color: var(--siv); font-size: .94rem; }
.kal-raspored { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(270px, 1fr); gap: 20px; align-items: start; }
.kal-mjesec { background: var(--snijeg); border: 1px solid var(--linija); border-radius: 12px; padding: 14px; }
.kal-nav { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 10px; }
.kal-nav h2 { text-transform: capitalize; font-size: 1.25rem; }
.kal-nav .dugme { width: 44px; padding: 0; font-size: 1.4rem; }
.kal-nav .dugme:disabled { opacity: .4; cursor: not-allowed; }
.kal-sedmica, .kal-mreza { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.kal-sedmica { font-size: .78rem; font-weight: 700; color: var(--siv); text-align: center; margin-bottom: 4px; }
.kal-dan { min-height: 58px; display: grid; align-content: center; justify-items: center; gap: 1px; padding: 4px 2px; background: #fff; border: 1px solid var(--linija); border-radius: 8px; font-family: var(--tekstni); color: var(--tekst); cursor: pointer; }
.kal-dan:hover:not(:disabled) { border-color: var(--smreka-2); }
.kal-dan:disabled { opacity: .38; cursor: not-allowed; background: #EEF3FA; }
.kal-dan b { font-size: .95rem; }
.kal-dan small { font-size: .72rem; color: var(--siv); white-space: nowrap; }
.kal-posebna { background: #f6e8c9; border-color: var(--oker); }
.kal-zatvoreno { background: #e9d3cb; border-color: var(--zeravica); }
.kal-zatvoreno small { color: var(--greska); font-weight: 700; }
.kal-odabran, .kal-odabran.kal-posebna, .kal-odabran.kal-zatvoreno { background: var(--smreka); border-color: var(--smreka); color: var(--snijeg); }
.kal-odabran small { color: #E3EAF4; }
.kal-legenda { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 12px; font-size: .84rem; color: var(--siv); }
.kal-legenda li { display: flex; align-items: center; gap: 6px; }
.kal-legenda i { width: 14px; height: 14px; border-radius: 4px; display: block; }
.l-posebna { background: #f6e8c9; border: 1px solid var(--oker); }
.l-zatvoreno { background: #e9d3cb; border: 1px solid var(--zeravica); }
.l-odabrano { background: var(--smreka); }
.kal-period { font-weight: 600; font-size: .94rem; min-height: 2.8em; }
.kal-akcije .unos { margin-top: 4px; }
.kal-akcije > .dugme { width: 100%; margin-top: 10px; }
.kal-dugmad { display: grid; gap: 8px; margin-top: 8px; }
.kal-akcije .sacuvano-poruka { margin: 10px 0 0; }
.panel-grupa > .unos, .panel-grupa > .vidzet-uputa { clear: both; }
.kal-prikazi { display: flex; gap: 6px; margin: 4px 0 12px; flex-wrap: wrap; }
.kal-prikazi .dugme[aria-pressed="true"] { background: var(--smreka); border-color: var(--smreka); color: var(--snijeg); }
.kal-ogranicen { box-shadow: inset 0 -3px 0 var(--smreka-2); }
.kal-min { font-weight: 700; }
.kal-odabran .kal-min { color: #E3EAF4; }
.l-ogranicenje { background: #fff; border: 1px solid var(--linija); box-shadow: inset 0 -3px 0 var(--smreka-2); }
.kal-godina { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 16px; }
.kal-mali h3 { text-transform: capitalize; font-size: .98rem; margin-bottom: 6px; }
.kal-mali .kal-sedmica { font-size: .66rem; margin-bottom: 2px; }
.kal-mali .kal-sedmica, .kal-mali .kal-mreza { gap: 2px; }
.kal-mali .kal-dan { min-height: 28px; padding: 0; border-radius: 5px; }
.kal-mali .kal-dan b { font-size: .74rem; font-weight: 600; }
.kal-red-odabran td { background: #DFE9F5; }
.tabela .tekst-dugme:disabled { color: var(--siv); text-decoration: none; cursor: not-allowed; }
.kal-pravila { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: start; margin-top: 20px; }
.kal-pravila h2 { font-size: 1.2rem; }
.promo-red { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: end; }
.promo-red .unos { margin-bottom: 0; }
.promo-poruka { margin: 8px 0 0; font-weight: 600; }
.promo-akcije { display: flex; flex-wrap: wrap; gap: 12px; flex-shrink: 0; }
.kal-planovi { margin: 10px 0 14px; display: grid; gap: 8px; }
.kal-planovi li { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--linija); }
.panel-dva { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 12px; margin-bottom: 10px; }
.panel-pregled { margin: 14px 0 20px; }
.panel-pregled h2 { font-size: 1.15rem; margin-bottom: 8px; }
.tabela-zbir td { font-weight: 700; }
.upiti-pretraga { margin-bottom: 18px; }
.upiti-polja { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 12px; }
.upiti-pretraga .upit-akcije { display: flex; gap: 8px; flex-wrap: wrap; }

/* istaknuti objekti i automatski niz */
.oznake { position: absolute; top: 10px; left: 10px; right: 52px; display: flex; flex-wrap: wrap; gap: 4px; }
.kartica-slika .oznake .oznaka { position: static; }
.objekat-oznake .oznake { position: static; display: inline-flex; margin-right: 4px; vertical-align: middle; }
.oznaka-istaknuto { background: var(--zeravica); color: var(--na-naglasku); }
.oznaka-omiljeno { background: var(--smreka); color: var(--snijeg); }
.odjeljak-glava { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 14px; }
.odjeljak > .odjeljak-glava h2 { margin: 0; }
.mala-mreza { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.mala { display: flex; flex-direction: column; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 12px; overflow: hidden; color: var(--tekst); text-decoration: none; }
.mala:hover { box-shadow: var(--sjena); }
.mala-slika { position: relative; display: block; height: 170px; }
.mala-slika .slika { position: absolute; inset: 0; }
.mala-slika .oznake { right: 10px; }
.mala-tijelo { display: grid; gap: 5px; padding: 12px 14px 14px; }
.mala-tijelo > strong { font: 700 1.12rem var(--naslovni); color: var(--smreka); }
.mala-tijelo > small { color: var(--siv); }
.mala-cijena { font-weight: 700; margin-top: 2px; }
.mala-cijena small { font-weight: 400; color: var(--siv); }
.mala .ocjena-broj { width: 32px; height: 32px; font-size: .82rem; }
.placeno-napomena { color: var(--siv); font-size: .82rem; margin: 8px 0 0; }
.niz { overflow-x: auto; scrollbar-width: thin; padding-bottom: 8px; }
.niz-traka { display: flex; gap: 14px; width: max-content; }
.niz .mala { width: 270px; flex: none; }
.niz-omot { padding-bottom: 44px; }
.recenzija-odgovor { margin: 8px 0 0 !important; padding: 8px 10px; background: #EEF3FA; border-radius: 6px; font-size: .92rem; }
.link-recenzije { display: block; overflow-wrap: anywhere; background: #EEF3FA; border-radius: 6px; padding: 6px 8px; margin-top: 4px; color: var(--tekst); font-family: ui-monospace, Consolas, monospace; }
.odgovor-forma .dugme { margin-top: 8px; }
.tabela-tekst { white-space: normal !important; min-width: 220px; }

/* rezervacije, fakture, administracija */
.panel-glava-desno { flex-wrap: wrap; }
.panel-uzak { max-width: 560px; }
.upit-status { display: inline-block; font-size: .78rem; font-weight: 700; padding: 2px 8px; border-radius: 5px; background: #D6E1F0; margin-bottom: 6px !important; }
.status-novi { background: #f6e8c9; color: #4a370d; }
.status-potvrdjeno { background: #d6efe0; color: #0e4a33; }
.upit-potvrda { border-top: 1px solid var(--linija); margin: 10px 0 8px; padding-top: 2px; max-width: 420px; }
.upit-racun { font-weight: 700; color: var(--smreka); margin: 8px 0 !important; min-height: 1.4em; }
.upit-akcije { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.upit-obracun { margin: 10px 0 8px; border-top: 1px solid var(--linija); max-width: 420px; }
.upit-obracun > div { display: flex; justify-content: space-between; gap: 12px; padding: 5px 0; border-bottom: 1px solid var(--linija); }
.upit-obracun dd { margin: 0; font-weight: 700; text-align: right; }
.tabela-omot { overflow-x: auto; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 10px; }
.tabela { width: 100%; border-collapse: collapse; font-size: .92rem; }
.tabela th, .tabela td { padding: 9px 12px; text-align: left; border-bottom: 1px solid var(--linija); white-space: nowrap; }
.tabela tr:last-child td { border-bottom: 0; }
.tabela .brojka { text-align: right; }
.admin-brojke { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.admin-brojke > div { background: var(--snijeg); border: 1px solid var(--linija); border-radius: 10px; padding: 12px 14px; display: grid; gap: 2px; }
.admin-brojke small { color: var(--siv); }
.admin-brojke strong { font: 700 1.4rem var(--naslovni); color: var(--smreka); }
.tabela-grupa th, .tabela-grupa td { background: #E9F0F9; font-weight: 700; color: var(--smreka); }
.tabela-grupa th { font: 700 1.05rem var(--naslovni); }
.tabela-grupa small { font-weight: 400; }
.seo-koraci { list-style: decimal; padding-left: 20px; display: grid; gap: 6px; margin: 10px 0 14px; }
.seo-koraci code, .seo-red code { overflow-wrap: anywhere; }
#seo-pocetak { margin-bottom: 16px; }
.seo-red { background: var(--snijeg); border: 1px solid var(--linija); border-radius: 8px; padding: 10px 14px; margin-bottom: 8px; }
.seo-red summary { cursor: pointer; overflow-wrap: anywhere; }
.seo-pregled { display: grid; gap: 2px; margin: 10px 0; padding: 10px 12px; background: #fff; border: 1px solid var(--linija); border-radius: 8px; font-family: Arial, sans-serif; font-size: .9rem; color: #4d5156; overflow-wrap: anywhere; }
.seo-naslov { color: #1a0dab; font-size: 1.1rem; }
.seo-adresa { color: #188038; font-size: .82rem; }
#f-ponuda { margin-top: 14px; }
.stampa-lista { display: none; }
@media print {
  body.stampanje > *:not(.stampa-lista) { display: none !important; }
  body.stampanje .stampa-lista { display: block; font: 11px/1.35 Arial, sans-serif; color: #000; }
  .stampa-lista h1 { font-size: 16px; color: #000; }
  .stampa-lista table { width: 100%; border-collapse: collapse; }
  .stampa-lista th, .stampa-lista td { border: 1px solid #888; padding: 3px 5px; text-align: left; vertical-align: top; overflow-wrap: anywhere; }
  .stampa-lista tr { break-inside: avoid; }
  .stampa-lista thead { display: table-header-group; }
  @page { size: landscape; margin: 10mm; }
}
.izvjestaj-dio { margin-top: 22px; }
.izvjestaj-dio > h2 { margin-bottom: 8px; }
.izvjestaj-alati { justify-content: space-between; }
#dio-kod, #dio-sesije { margin-bottom: 16px; }
.dvaf-koraci { padding-left: 20px; list-style: decimal; display: grid; gap: 14px; margin-top: 12px; }
.dvaf-qr { width: 220px; margin: 10px 0; background: #fff; padding: 4px; border-radius: 8px; }
.dvaf-qr svg { width: 100%; height: auto; }
.dvaf-kljuc { display: block; margin-top: 4px; padding: 8px 10px; background: var(--papir); border-radius: 6px; overflow-wrap: anywhere; font-size: .92rem; }
.rezervni-kodovi ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 6px 14px; margin: 12px 0; font-size: 1.05rem; }
@media print { .zaglavlje, .podnozje, .demo-traka, .panel-glava, #dio-sesije, .urednik-dugme, #rez-stampaj, #rez-gotovo { display: none !important; } }
.obavijest-traka { background: var(--smreka-2); color: #fff; padding: 8px 20px; text-align: center; font-size: .94rem; }
.demo-traka[hidden] { display: none; }
.boje-mreza { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px 16px; margin: 10px 0; }
.boja-polje { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.boja-polje input { width: 48px; height: 40px; padding: 2px; border: 1px solid var(--linija); border-radius: 8px; background: #fff; cursor: pointer; flex: none; }
#f-sviVlasnici, #f-opste + .upit-forma, #f-opste { margin-bottom: 16px; }
.urednik-dugme { position: fixed; right: 16px; bottom: 16px; z-index: 900; padding: 12px 18px; border: 0; border-radius: 99px; background: var(--zeravica); color: var(--na-naglasku); font: 600 .95rem var(--tekstni); cursor: pointer; box-shadow: var(--sjena); }
.urednik-dugme[hidden] { display: none; }
.urednik-dugme[aria-pressed="true"] { background: var(--smreka); }
.uredjivanje #app *:hover, .uredjivanje .zaglavlje *:hover, .uredjivanje .podnozje *:hover { outline: 2px dashed var(--zeravica); outline-offset: 2px; cursor: text; }
.urednik-dijalog { width: min(560px, calc(100vw - 32px)); border: 1px solid var(--linija); border-radius: 12px; padding: 20px; background: var(--snijeg); color: var(--tekst); }
.urednik-dijalog::backdrop { background: rgba(4, 22, 54, .55); }
.urednik-izvor { padding: 8px 10px; background: var(--papir); border-radius: 8px; font-weight: 600; overflow-wrap: anywhere; }
.logo-slika { display: block; height: 40px; max-width: 200px; width: auto; object-fit: contain; }
.sadrzaj-kolone { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; margin-bottom: 16px; align-items: start; }
.sadrzaj-slika { display: grid; gap: 8px; margin: 8px 0 12px; }
.sadrzaj-slika img { display: block; width: 100%; max-height: 220px; object-fit: cover; border-radius: 8px; border: 1px solid var(--linija); }
.sadrzaj-slika img[hidden] { display: none; }
.logo-pregled .sadrzaj-slika img { width: auto; max-width: 100%; height: 70px; object-fit: contain; padding: 8px; background: var(--smreka); }
.sadrzaj-oznaka { font-weight: 600; font-size: .94rem; }
.slika-greska:empty { display: none; }
.tekst-red { padding: 12px 0; border-bottom: 1px solid var(--linija); }
.tekst-izvor { margin: 0 0 6px; font-weight: 600; overflow-wrap: anywhere; }
.objava-slika { display: block; width: 100%; max-height: 380px; object-fit: cover; border-radius: 12px; margin-bottom: 14px; }
.objava-tijelo { max-width: 720px; margin-bottom: 18px; }
.admin-tabovi { display: flex; flex-wrap: wrap; gap: 4px; margin: 12px 0 16px; border-bottom: 2px solid var(--linija); }
.admin-tabovi a { padding: 10px 14px; border-radius: 8px 8px 0 0; color: var(--smreka); text-decoration: none; font-weight: 600; margin-bottom: -2px; border-bottom: 2px solid transparent; }
.admin-tabovi a:hover { background: var(--snijeg); }
.admin-tabovi a[aria-current="page"] { background: var(--snijeg); border-bottom-color: var(--zeravica); }
a.admin-karta { background: var(--snijeg); border: 1px solid var(--linija); border-radius: 10px; padding: 12px 14px; display: grid; gap: 2px; text-decoration: none; color: inherit; }
a.admin-karta:hover { border-color: var(--smreka-2); }
.admin-karta small { color: var(--siv); }
.admin-karta strong { font: 700 1.4rem var(--naslovni); color: var(--smreka); }
section[data-kartica] > h2 { margin: 18px 0 8px; }
.admin-alati { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 4px 12px; margin-bottom: 10px; }
.admin-alati .unos { margin: 0; flex: 1 1 200px; max-width: 320px; }
.admin-alati .admin-broj { margin: 0 0 10px; }
#reg-vlasnik[hidden], [data-kartica][hidden] { display: none; }
.admin-naslov { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; }
.panel section > h2 { margin-bottom: 8px; }
.admin-podnaslov { margin-top: 20px; }
@media (max-width: 600px) { .admin-brojke { grid-template-columns: 1fr; } }

/* fotografije */
.galerija-stavka { position: relative; }
.galerija-vise { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(4, 22, 54, .58); color: #fff; font: 700 1.3rem var(--tekstni); }
.galerija-n1 { grid-template-columns: 1fr; grid-auto-rows: clamp(220px, 40vw, 440px); }
.galerija-n1 .galerija-prva { grid-row: auto; grid-column: auto; }
.galerija-n2 { grid-template-columns: 2fr 1fr; }
.galerija-n2 .galerija-stavka:not(.galerija-prva) { grid-row: span 2; }
.galerija-n3 { grid-template-columns: 2fr 1fr; }
.galerija-n4 { grid-template-columns: 2fr 1fr 1fr; }
.galerija-n4 .galerija-stavka:nth-child(2) { grid-column: span 2; }
.soba-slike { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; margin-bottom: 8px; max-width: 300px; }
.soba-slika { position: relative; aspect-ratio: 4 / 3; padding: 0; border: 0; border-radius: 6px; overflow: hidden; cursor: zoom-in; background: #0F3D80; }
.soba-slika .slika { width: 100%; height: 100%; }
.soba-slika .galerija-vise { font-size: 1rem; }
.panel-fotografije h2 { margin-bottom: 6px; }
.panel-fotografije > p { color: var(--siv); font-size: .94rem; }
.panel-soba .vidzet { border-top: 1px solid var(--linija); margin-top: 14px; padding-top: 12px; }
.panel-soba > .vidzet-prazno { margin-top: 10px; }
.vidzet-glava { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.vidzet-dodaj { position: relative; cursor: pointer; }
.vidzet-dodaj:focus-within { outline: 3px solid var(--smreka-2); outline-offset: 2px; }
.vidzet-radi { opacity: .55; cursor: progress; }
.vidzet-mreza { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 10px; }
.vidzet-slika { position: relative; background: #fff; border: 1px solid var(--linija); border-radius: 8px; overflow: hidden; }
.vidzet-slika img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.vidzet-naslovna { position: absolute; top: 6px; left: 6px; background: var(--smreka); color: #fff; border-radius: 5px; padding: 2px 7px; font-size: .74rem; font-weight: 700; }
.vidzet-dugmad { display: grid; justify-items: start; padding: 4px 6px; }
.vidzet-dugmad .tekst-dugme { font-size: .82rem; font-weight: 500; text-align: left; min-height: 32px; padding: 4px 2px; }
.vidzet-slika[draggable="true"] { cursor: grab; }
.vidzet-vuce { opacity: .45; }
.vidzet-cilj { outline: 3px solid var(--zeravica); outline-offset: 1px; }
.vidzet-uputa { color: var(--siv); font-size: .88rem; margin: 0 0 8px; }
.vidzet-redni { position: absolute; top: 6px; left: 6px; min-width: 24px; text-align: center; background: rgba(255, 255, 255, .94); color: var(--smreka); border-radius: 5px; padding: 2px 6px; font-size: .78rem; font-weight: 700; }
.vidzet-pomak { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--linija); border-bottom: 1px solid var(--linija); }
.vidzet-pomak button { min-height: 40px; border: 0; background: #fff; color: var(--smreka); font-size: 1.3rem; line-height: 1; cursor: pointer; }
.vidzet-pomak button:hover:not(:disabled) { background: #E9EFF8; }
.vidzet-pomak button:disabled { color: #AAB8CC; cursor: default; }
.vidzet-prazno { color: var(--siv); font-size: .92rem; margin: 0; }
.vidzet-status { margin: 8px 0 0; font-size: .9rem; color: var(--plus); font-weight: 600; min-height: 1.3em; }
.vidzet-greska { color: var(--greska); }

/* podnožje */
.podnozje { margin-top: 0; background-color: var(--smreka); color: #E3EBF6; padding-block: 34px; font-size: .92rem; }
.podnozje-red { display: grid; grid-template-columns: 1.2fr 1fr 1fr 1fr 1.2fr; gap: 24px; }
@media (max-width: 1100px) { .podnozje-red { grid-template-columns: repeat(3, 1fr); } }
.podnozje a { color: #f0c98a; }

/* tablet i mobitel */
@media (max-width: 1000px) {
  .kartica { grid-template-columns: 200px minmax(0, 1fr); }
  .srce { left: 156px; }
  .kartica-cijena { grid-column: 1 / -1; flex-direction: row; align-items: center; border-left: 0; border-top: 1px solid var(--linija); text-align: left; }
  .cijena-blok { justify-items: start; }
  .soba { grid-template-columns: minmax(0, 1fr) 150px; }
  .soba-cijena { grid-column: 2; grid-row: 1; }
  .soba-uslovi { grid-column: 1; }
  .soba-izbor { grid-column: 2; }
}
@media (max-width: 860px) {
  .pretraga, .obj-pretraga .pretraga { grid-template-columns: 1fr 1fr; }
  .polje-mjesto, .polje-gosti, .pretraga-dugme { grid-column: 1 / -1; }
  .pretraga-omot { margin-top: -40px; }
  .rezultati-raspored { grid-template-columns: minmax(0, 1fr); }
  #otvori-filtere { display: inline-flex; }
  .filteri { display: none; }
  .filteri.otvoreno { display: flex; flex-direction: column; position: fixed; inset: 0; z-index: 40; border-radius: 0; border: 0; padding: 14px 16px 0; overflow-y: auto; }
  .filteri-zatvori { display: block; background: none; border: 0; width: 44px; height: 44px; font-size: 1.8rem; cursor: pointer; color: var(--smreka); }
  .filteri-glava h2 { flex: 1; }
  .filteri-dno { display: block; position: sticky; bottom: 0; margin: 14px -16px 0; padding: 12px 16px; background: var(--snijeg); border-top: 1px solid var(--linija); }
  .filteri-dno .dugme { width: 100%; }
  .zone { grid-template-columns: minmax(0, 1fr); }
  .zona { min-height: 210px; }
  .koraci-pocetna { grid-template-columns: 1fr; gap: 14px; }
  .podnozje-red { grid-template-columns: 1fr; }
  .objekat-opis, .recenzije-raspored, .upit-raspored { grid-template-columns: minmax(0, 1fr); }
  .upit-raspored .sazetak { order: -1; }
  .sazetak > .slika { height: 110px; }
  .galerija { grid-template-columns: repeat(4, 1fr); grid-auto-rows: 64px; }
  .galerija-prva { grid-column: 1 / -1; grid-row: span 3; }
  .kal-raspored { grid-template-columns: minmax(0, 1fr); }
  .panel-soba-polja { grid-template-columns: 1fr 1fr; }
  .panel-soba-polja .unos:first-child { grid-column: 1 / -1; }
  .panel-soba-polja .unos:nth-child(5) { grid-column: auto; }
}
@media (max-width: 600px) {
  .sadrzaj { padding-inline: 14px; }
  .glavni-meni { flex-wrap: nowrap; gap: 0; }
  .glavni-meni a { padding: 8px 6px; font-size: .86rem; }
  .nav-nalog { margin-left: 3px; }
  .kal-mjesec { padding: 10px 8px; }
  .kal-sedmica, .kal-mreza { gap: 2px; }
  .kal-dan { min-height: 50px; }
  .kal-dan small { font-size: .66rem; }
  .panel-tri { grid-template-columns: 1fr; }
  .kal-pravila, .upiti-polja, .adresa-red { grid-template-columns: minmax(0, 1fr); }
  .panel-dva { grid-template-columns: 1fr; }
  .samo-desktop { display: none; }
  .koraci li:not(.trenutni) { font-size: 0; gap: 0; }
  .koraci li + li::before { margin-right: 8px; }
  .koraci span { font-size: .85rem; }
  .upit-raspored .sazetak > .slika { display: none; }
  .logo { font-size: 1.25rem; }
  .logo svg { width: 28px; height: 24px; }
  .ponuda-traka { width: calc(100% - 28px); padding-inline: 18px; }
  .kartica { grid-template-columns: minmax(0, 1fr); }
  .kartica-slika { min-height: 190px; }
  .srce { left: auto; right: 10px; }
  .kartica-cijena .dugme { flex: none; }
  .soba { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .soba-cijena, .soba-uslovi, .soba-izbor { grid-column: 1; grid-row: auto; }
  .soba-cijena { justify-items: start; text-align: left; }
  .lista-kontrole { width: 100%; }
  .sortiranje { flex: 1; min-width: 150px; }
  .izbor-traka-red .dugme { flex: none; padding-inline: 12px; }
  .izbor-traka strong { font-size: 1.05rem; }
  .pravila > div { grid-template-columns: 90px 1fr; }
  .koraci li + li::before { width: 14px; }
  .svjetlo figure { width: 100vw; }
  .svjetlo-pret, .svjetlo-sljed { top: auto; bottom: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; scroll-behavior: auto !important; }
}

/* ---------- stranica objekta: raspored i izgled ---------- */
.ikona { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; color: var(--smreka-2); }
.objekat { padding-block: 10px 64px; }
.objekat .mrvice { margin-bottom: 6px; }
.objekat .mrvice a { color: var(--smreka-2); }
.objekat .tabovi { top: 0; margin: 0 0 18px; background: var(--papir); justify-content: space-between; }
.objekat .tabovi a { flex: 1 0 auto; text-align: center; padding: 14px 12px; color: var(--tekst); }
.objekat .tabovi a[aria-current] { color: var(--smreka); box-shadow: inset 0 -3px 0 var(--zeravica); }
#pregled, .objekat section { scroll-margin-top: 64px; }
#pregled:focus, .objekat section:focus { outline: none; }
.objekat-glava { align-items: flex-start; margin-bottom: 16px; }
.objekat-glava h1 { font-size: clamp(1.6rem, 3.2vw, 2.3rem); }
.adresa { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; font-size: .94rem; }
.adresa a, .tekst-veza { color: var(--smreka-2); font-weight: 600; }
.objekat-akcije { gap: 8px; }
.objekat-akcije .dugme { min-height: 44px; }

.objekat-vrh { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 14px; align-items: start; }
.objekat-galerija { min-width: 0; }
.objekat-galerija .galerija { grid-template-columns: 2fr 1fr; grid-auto-rows: 214px; gap: 8px; }
.objekat-galerija .galerija-prva { grid-row: span 2; grid-column: auto; }
.objekat-galerija .galerija-n1 { grid-template-columns: 1fr; grid-auto-rows: clamp(260px, 42vw, 436px); }
.objekat-galerija .galerija-n1 .galerija-prva { grid-row: auto; }
.objekat-galerija .galerija-n2 .galerija-stavka:not(.galerija-prva) { grid-row: span 2; }
.galerija-male { display: flex; gap: 8px; margin-top: 8px; }
.galerija-male .galerija-stavka { flex: 1 1 0; min-width: 0; height: 92px; }
.galerija-stavka { transition: filter .2s ease; }
.galerija-stavka:hover { filter: brightness(1.06); }
.galerija-napomena { margin: 6px 0 0; font-size: .84rem; color: var(--siv); }

.objekat-bocno { display: grid; gap: 10px; grid-template-columns: minmax(0, 1fr); min-width: 0; }
.objekat .bocni-citat { display: block; }
.bocna-karta { background: var(--snijeg); border: 1px solid var(--linija); border-radius: 12px; padding: 14px; box-shadow: 0 1px 3px rgba(8, 45, 104, .06); display: grid; gap: 8px; }
.bocna-ocjena { display: flex; justify-content: space-between; align-items: center; gap: 10px; color: inherit; text-decoration: none; }
.bocna-ocjena span:first-child { display: grid; text-align: right; flex: 1; }
.bocna-ocjena small, .bocna-prazno small { color: var(--siv); font-size: .82rem; }
.ocjena-pločica { display: inline-grid; place-items: center; min-width: 40px; height: 40px; padding: 0 6px; background: var(--smreka); color: var(--snijeg); border-radius: 10px 10px 10px 2px; font-weight: 700; }
.ocjena-mala { min-width: 34px; height: 30px; font-size: .88rem; background: var(--snijeg); color: var(--smreka); border: 1px solid var(--smreka-2); }
.ocjena-velika { min-width: 56px; height: 56px; font-size: 1.3rem; }
.bocni-citat { margin: 0; padding-top: 8px; border-top: 1px solid var(--linija); font-size: .9rem; }
.bocni-citat p { margin: 0 0 4px; }
.bocni-citat footer { color: var(--siv); font-size: .82rem; }
.bocna-lokacija { display: flex; justify-content: space-between; align-items: center; margin: 0; padding-top: 8px; border-top: 1px solid var(--linija); font-weight: 600; font-size: .92rem; }
.bocna-prazno { display: grid; gap: 2px; margin: 0; }
.bocni-opis { margin: 0; font-size: .9rem; }
.bocna-cijena { justify-items: start; gap: 2px; }
.bocna-cijena small { color: var(--siv); font-size: .82rem; }
.bocna-cijena .dugme { width: 100%; margin-top: 8px; }

.objekat-opis { margin-top: 28px; gap: 28px; }
.opis-tekst { font-size: 1.02rem; }
.istaknuto { background: var(--snijeg); border: 1px solid var(--linija); border-left: 4px solid var(--oker); box-shadow: 0 1px 3px rgba(8, 45, 104, .06); }
.istaknuto .dugme { width: 100%; margin-top: 12px; }
.popularni { margin-top: 24px; }
.popularni h3 { margin-bottom: 10px; }
.popularni ul { display: flex; flex-wrap: wrap; gap: 8px; }
.popularni li { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 99px; font-size: .92rem; }

.objekat-sobe, .odjeljak-uzak { margin-top: 44px; }
.objekat-sobe > h2, .odjeljak-uzak > h2 { padding-bottom: 8px; border-bottom: 2px solid var(--linija); margin-bottom: 16px; }
.sobe-raspored { display: grid; grid-template-columns: minmax(0, 1fr) 210px; gap: 12px; align-items: start; }
.sobe-tabela { width: 100%; border-collapse: separate; border-spacing: 0; background: var(--snijeg); border: 1px solid var(--linija); border-radius: 12px; overflow: hidden; }
.sobe-tabela thead th { padding: 11px 12px; background: var(--smreka); color: var(--snijeg); text-align: left; font-size: .9rem; font-weight: 600; }
.sobe-tabela td { padding: 14px 12px; border-top: 1px solid var(--linija); vertical-align: top; }
.sobe-tabela tbody tr:first-child td { border-top: 0; }
.sobe-tabela .soba-ponuda td { background: #FFF4E8; }
.sobe-tabela h3 { margin: 2px 0 4px; font-size: 1.05rem; color: var(--smreka); }
.sobe-tabela .soba-info p { margin: 0; font-size: .9rem; color: var(--siv); }
.st-gosti { white-space: nowrap; }
.gosti-broj { display: inline-flex; align-items: center; gap: 4px; font-weight: 600; }
.sobe-tabela .soba-cijena { justify-items: start; text-align: left; }
.sobe-tabela .soba-izbor select { width: 72px; }
.sobe-tabela .razlog { display: block; margin-top: 4px; max-width: 150px; font-size: .78rem; color: var(--siv); }
.izbor-panel { position: sticky; top: 64px; display: grid; gap: 6px; padding: 14px; background: #E9F0F9; border: 1px solid var(--linija); border-radius: 12px; }
.izbor-panel strong { font: 700 1.15rem var(--naslovni); color: var(--smreka); }
.izbor-panel small { color: var(--siv); font-size: .82rem; }
.izbor-panel .dugme { width: 100%; margin: 6px 0 2px; }
.izbor-panel .dugme:disabled { opacity: .5; cursor: not-allowed; }

.recenzije-zaglavlje { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.recenzije-zaglavlje span:last-child { display: grid; }
.recenzije-zaglavlje small { color: var(--siv); }
.objekat .podocjene { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px 24px; margin-bottom: 18px; }
#recenzije .recenzije-lista { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.recenzija { box-shadow: 0 1px 3px rgba(8, 45, 104, .06); }
.lokacija-tekst { max-width: 70ch; }
.objekat .sadrzaji-lista li { display: flex; align-items: center; gap: 8px; padding-left: 0; }
.objekat .sadrzaji-lista li::before { content: none; }
.objekat .pravila > div { grid-template-columns: 170px 1fr; padding: 12px 16px; }
.pitanja { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 8px 16px; align-items: start; }
.pitanje { background: var(--snijeg); border: 1px solid var(--linija); border-radius: 10px; padding: 12px 14px; }
.pitanje summary { cursor: pointer; font-weight: 600; color: var(--smreka); }
.pitanje p { margin: 8px 0 0; }

/* Na velikom ekranu izbor je u koloni pored tabele, a traka na dnu ostaje za manje ekrane */
@media (min-width: 1001px) { .izbor-traka { display: none; } body.ima-traku { padding-bottom: 0; } }
@media (max-width: 1000px) {
  .objekat-vrh { grid-template-columns: minmax(0, 1fr); }
  .objekat-bocno { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
  .sobe-raspored { grid-template-columns: minmax(0, 1fr); }
  .izbor-panel { display: none; }
}
@media (max-width: 760px) {
  .objekat .tabovi { justify-content: flex-start; }
  .objekat .tabovi a { flex: none; }
  .obj-pretraga .pretraga-dugme { grid-column: 1 / -1; width: 100%; }
  .obj-pretraga .pretraga-dugme .dugme, .obj-pretraga button.pretraga-dugme { width: 100%; }
  .objekat-akcije { width: 100%; }
  .objekat-akcije .dugme { flex: 1; padding-inline: 10px; }
  .objekat-galerija .galerija { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 104px; gap: 6px; }
  .objekat-galerija .galerija-prva { grid-column: 1 / -1; grid-row: span 2; }
  .objekat-galerija .galerija-n2 .galerija-stavka:not(.galerija-prva) { grid-column: 1 / -1; grid-row: span 1; }
  .objekat-galerija .galerija-n1 { grid-template-columns: 1fr; grid-auto-rows: 240px; }
  .objekat-galerija .galerija-n1 .galerija-prva { grid-row: auto; }
  .galerija-male { gap: 6px; }
  .objekat-opis { grid-template-columns: minmax(0, 1fr); }
  /* Tabela soba postaje kartice */
  .sobe-tabela, .sobe-tabela tbody, .sobe-tabela tr, .sobe-tabela td { display: block; width: auto; }
  .sobe-tabela { border: 0; background: none; overflow: visible; }
  .sobe-tabela thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .sobe-tabela tr { background: var(--snijeg); border: 1px solid var(--linija); border-radius: 12px; margin-bottom: 10px; overflow: hidden; }
  .sobe-tabela td { padding: 10px 14px; border-top: 1px solid var(--linija); }
  .sobe-tabela td:first-child { border-top: 0; }
  .sobe-tabela td:not(:first-child)::before { content: attr(data-oznaka); display: block; margin-bottom: 2px; color: var(--siv); font-size: .78rem; font-weight: 600; }
  .sobe-tabela .soba-izbor select { width: 100%; }
  .sobe-tabela .razlog { max-width: none; }
  .objekat .pravila > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .pitanja { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- Bookotravel.com: zaglavlje, tipografija, kartice ---------- */
h1, h2, h3 { letter-spacing: -.012em; }
h2 { font-weight: 700; }
.zaglavlje { position: sticky; top: 0; z-index: 800; background: #fff; color: var(--smreka); box-shadow: 0 1px 0 var(--linija), 0 4px 16px rgba(8, 45, 104, .05); }
.logo { color: var(--smreka); }
.logo-natpis { font: 800 1.4rem/1 var(--naslovni); letter-spacing: -.02em; color: var(--smreka); }
.logo-natpis span { color: var(--zeravica); }
.logo-slika { height: 42px; max-width: 240px; }
.logo-pregled .sadrzaj-slika img { background: #fff; }
.glavni-meni { align-items: center; }
.glavni-meni a { color: var(--smreka); font-weight: 600; }
.glavni-meni a:hover { background: var(--papir); }
.nav-nalog { border: 1px solid var(--smreka); }
.nav-jezik { border-color: var(--linija); color: var(--smreka); }
.podnozje .logo-natpis { color: #fff; font-size: 1.3rem; }
.podnozje .logo-natpis span { color: #FFC48A; }
.podnozje a { color: #fff; }
.slogan { margin: 0 0 .75em; font-weight: 600; color: #FFC48A; }
.demo-traka { color: var(--tekst); }

.dugme { border-radius: 10px; font-weight: 700; }
.dugme-glavno { color: var(--na-naglasku); box-shadow: 0 2px 8px rgba(255, 121, 0, .28); }
.dugme-sekundarno { color: var(--smreka); border-color: var(--smreka); background: #fff; }
.dugme-sekundarno:hover { background: var(--papir); }
.dugme-glavno:disabled { color: #fff; box-shadow: none; }

.heroj { background: var(--smreka); }
.heroj h1 { font-weight: 800; max-width: 18ch; }
.heroj-uvod { color: #E9F0F9; }
.pretraga { border-radius: 18px; box-shadow: 0 16px 44px rgba(8, 45, 104, .16); border: 1px solid var(--linija); }
.pretraga-dugme { min-height: 52px; font-size: 1.02rem; }
.odjeljak > h2, .odjeljak-glava h2 { color: var(--smreka); }

.zona, .objava-karta, .mala-kartica, .kartica, .planine a, .recenzija, .soba { border-radius: var(--radius); }
.zona, .objava-karta { box-shadow: var(--sjena); transition: transform .18s ease, box-shadow .18s ease; }
.zona:hover, .objava-karta:hover { transform: translateY(-3px); box-shadow: 0 14px 34px rgba(8, 45, 104, .16); }
.zbirka { border-radius: 99px; }
.oznaka-primjer { color: var(--tekst); }
.ponude-odjeljak .ponuda-traka { margin-top: 12px; width: auto; color: #E9F0F9; }
.ponude-odjeljak .ponuda-traka h3 { color: #fff; font-size: 1.35rem; margin: 6px 0 8px; }
.ponuda-cijena strong { color: #fff; }
.kako { background: #E9F0F9; }
.koraci-pocetna li::before { color: var(--smreka-2); }
.sobe-tabela .soba-ponuda td { background: #FFF4E8; }
.izbor-panel { background: #E9F0F9; }
.objekat .tabovi { top: 62px; z-index: 6; }
#pregled, .objekat section { scroll-margin-top: 126px; }
.izbor-panel { top: 126px; }
@media (prefers-reduced-motion: reduce) { .zona, .objava-karta { transition: none; } .zona:hover, .objava-karta:hover { transform: none; } }
@media (max-width: 760px) {
  .zaglavlje { position: static; }
  .objekat .tabovi { top: 0; }
  #pregled, .objekat section { scroll-margin-top: 56px; }
  .logo-natpis { font-size: 1.12rem; }
  .logo-slika { height: 34px; max-width: 150px; }
}

@media (max-width: 760px) {
  .heroj::after { background: linear-gradient(0deg, rgba(4, 22, 54, .78), rgba(4, 22, 54, .55)); }
}
/* Google Translate radi bez svoje trake i oblačića, a napomena o prijevodu je u podnožju */
#google_translate_element, body > .skiptranslate, .goog-te-banner-frame, #goog-gt-tt, .goog-te-balloon-frame { display: none !important; }
body { top: 0 !important; }
.goog-text-highlight { background: none !important; box-shadow: none !important; }
/* Meni s tipovima: na velikom ekranu u istom redu, a inače u svom redu koji se može povlačiti */
.tipovi-meni { display: flex; flex-wrap: wrap; justify-content: flex-end; min-width: 0; align-items: center; gap: 2px; margin-inline-start: auto; }
.meni-lista { display: grid; gap: 10px; margin: 10px 0 14px; padding: 0; list-style: none; }
.meni-red { display: grid; grid-template-columns: minmax(120px, 1fr) minmax(160px, 1.4fr) auto; gap: 8px; align-items: center; padding-bottom: 10px; border-bottom: 1px solid var(--linija); }
.meni-red input, .meni-red select { width: 100%; min-height: 40px; border: 1px solid var(--linija); border-radius: 8px; padding: 6px 8px; font: 500 .94rem var(--tekstni); background: #fff; color: var(--tekst); }
.meni-red input[data-polje="adresa"] { grid-column: 1 / -1; }
.meni-dugmad { display: flex; gap: 6px; align-items: center; }
@media (max-width: 600px) { .meni-red { grid-template-columns: minmax(0, 1fr); } }
.tipovi-meni a { color: var(--smreka); font-weight: 600; text-decoration: none; padding: 8px 10px; border-radius: 6px; font-size: .95rem; white-space: nowrap; }
.tipovi-meni a:hover { background: var(--papir); }
@media (max-width: 1199px) {
  .zaglavlje-red { flex-wrap: wrap; row-gap: 0; padding-top: 6px; }
  .tipovi-meni { order: 3; width: 100%; flex-wrap: nowrap; justify-content: flex-start; margin-inline-start: 0; overflow-x: auto; scrollbar-width: none; border-top: 1px solid var(--linija); }
  .tipovi-meni::-webkit-scrollbar { display: none; }
  .glavni-meni { margin-inline-start: auto; }
}
@media (max-width: 480px) {
  .tipovi-meni { gap: 0; }
  .tipovi-meni a { padding: 8px 5px; font-size: .86rem; }
  .logo-natpis { font-size: 1.12rem; }
  .zaglavlje-red { gap: 4px; }
}
/* Zaglavlje prati skrolanje samo na velikom ekranu, gdje je uvijek u jednom redu */
@media (max-width: 1199px) {
  .zaglavlje { position: static; }
  .objekat .tabovi { top: 0; }
  #pregled, .objekat section { scroll-margin-top: 56px; }
}
/* ---------- izbor jezika i pisanje zdesna ulijevo ---------- */
select.nav-jezik { max-width: 112px; padding: 4px 4px; background: #fff; }
[dir="rtl"] #lokacija-karta, [dir="rtl"] #karta-balkan, [dir="rtl"] .leaflet-container, [dir="rtl"] input[type="email"], [dir="rtl"] input[type="tel"] { direction: ltr; }
[dir="rtl"] .nav-nalog { margin-left: 0; margin-right: 6px; }
[dir="rtl"] .istaknuto { border-left: 1px solid var(--linija); border-right: 4px solid var(--oker); }
[dir="rtl"] .prednosti li { border-left: 0; border-right: 4px solid var(--oker); }
[dir="rtl"] .sobe-tabela thead th, [dir="rtl"] .sobe-tabela .soba-cijena { text-align: right; }
[dir="rtl"] .bocna-ocjena span:first-child { text-align: left; }
[dir="rtl"] .soba-uslovi, [dir="rtl"] .istaknuto ul { padding-right: 0; }

/* Dugi spiskovi na početnoj: prvih 12, ostalo na dugme */
.zone.skraceno .zona:nth-child(n+13), .planine.skraceno li:nth-child(n+13) { display: none; }
.prikazi-sve { text-align: center; margin: 18px 0 0; }