/* Strojna lopa — industrijski oglasnik. Barve iz znaka SL, rumena = plačana izpostavitev (TOP). */
:root {
  --ink: #1C1E20; --kab: #24272A; --kab2: #16181A; --kab-crt: #383C40;
  --zel: #2F7A33; --zel-t: #23602A; --list: #9FD48F; --zel-s: #E3EFDD;
  --beton: #F2F5EF; --bela: #fff; --crt: #D6D9D2; --crt2: #E6E8E3; --sivo: #5E635C; --sivo2: #8A8F87;
  --rum: #F5C400; --rdeca: #B3261E;
  --d: 'Big Shoulders Display', 'Arial Narrow', sans-serif;
  --b: 'Instrument Sans', system-ui, sans-serif;
  --m: 'JetBrains Mono', ui-monospace, monospace;
  --r: 14px; --sirina: 1320px;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font: 16px/1.5 var(--b); color: var(--ink); background: #fff; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--rum); outline-offset: 2px; }
.ovoj { max-width: var(--sirina); margin: 0 auto; padding: 0 28px; }
.skrito { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.mono { font-family: var(--m); }
svg.ik { width: 20px; height: 20px; flex: none; }

/* Gumbi */
.gumb { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 46px; padding: 0 20px; border-radius: 10px; font-weight: 700; font-size: 15px; border: 0; cursor: pointer; white-space: nowrap; transition: background .15s, transform .15s, box-shadow .15s; }
.gumb:active { transform: translateY(1px); }
.gumb-z { background: var(--zel); color: #fff; } .gumb-z:hover { background: var(--zel-t); }
.gumb-r { background: var(--rum); color: var(--ink); } .gumb-r:hover { box-shadow: inset 0 0 0 999px rgba(0,0,0,.06); }
.gumb-o { background: transparent; box-shadow: inset 0 0 0 2px var(--ink); } .gumb-o:hover { background: var(--ink); color: #fff; }
.gumb-t { background: var(--ink); color: #fff; } .gumb-t:hover { background: #000; }
.gumb-b { background: var(--bela); box-shadow: inset 0 0 0 1px var(--crt); } .gumb-b:hover { box-shadow: inset 0 0 0 2px var(--ink); }
.gumb-vel { height: 56px; padding: 0 26px; font-size: 16px; border-radius: 12px; }
.gumb-mal { height: 36px; padding: 0 14px; font-size: 14px; border-radius: 8px; }
.gumb[disabled] { opacity: .5; pointer-events: none; }

/* Glava */
.glava { background: #fff; color: var(--ink); position: sticky; top: 0; z-index: 40; border-bottom: 1px solid var(--crt2); }
.glava .ovoj { display: flex; align-items: center; gap: 26px; height: 74px; }
.znak { display: flex; align-items: center; flex: none; }
.znak img { height: 44px; width: auto; }
.glava nav { display: flex; gap: 2px; font-weight: 600; font-size: 15px; }
.glava nav a { padding: 8px 12px; border-radius: 8px; color: #33372F; }
.glava nav a:hover, .glava nav a[aria-current] { color: var(--zel-t); background: var(--zel-s); }
.glava .sp { flex: 1; }
.glava .ikonski { display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 12px; border-radius: 10px; color: #33372F; font-weight: 600; font-size: 15px; }
.glava .ikonski:hover { background: var(--zel-s); color: var(--zel-t); }
.glava .gumb-z { height: 44px; }
.meni-gumb { display: none; }

/* Uvod domače strani: svetla fotografija + iskalnik */
.uvod { position: relative; overflow: hidden; background: #DCE6EE url(/static/img/hero.jpg) 72% 42% / cover no-repeat; }
.uvod::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(255,255,255,.97) 0%, rgba(255,255,255,.9) 34%, rgba(255,255,255,.35) 58%, rgba(255,255,255,0) 72%); }
.uvod .ovoj { position: relative; z-index: 2; padding-top: 56px; padding-bottom: 64px; }
.uvod-stevci { display: flex; gap: 20px; font: 500 13px var(--m); color: var(--sivo); letter-spacing: .03em; margin-bottom: 16px; flex-wrap: wrap; }
.uvod-stevci b { color: var(--zel-t); font-weight: 700; }
.utrip { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--zel); margin-right: 8px; vertical-align: 1px; animation: utrip 1.8s infinite; }
@keyframes utrip { 50% { opacity: .25; } }
.uvod h1 { font: 900 clamp(52px, 7vw, 104px)/.88 var(--d); text-transform: uppercase; margin: 0 0 14px; letter-spacing: -.005em; }
.uvod h1 span { color: var(--zel); }
.uvod .vodilo { font-size: 19px; color: #3B4038; margin: 0 0 28px; max-width: 32em; }

.iskalnik { max-width: 760px; background: #fff; border-radius: 22px; box-shadow: 0 30px 70px -28px rgba(20, 40, 20, .45), 0 0 0 1px rgba(0,0,0,.05); overflow: hidden; }
.zav-i { display: flex; border-bottom: 1px solid var(--crt2); }
.zav-i button { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; border: 0; background: #fff; padding: 16px 12px; font-weight: 700; font-size: 16px; color: var(--sivo); cursor: pointer; border-bottom: 3px solid transparent; margin-bottom: -1px; }
.zav-i button svg { width: 18px; height: 18px; }
.zav-i button[aria-selected="true"] { color: var(--ink); border-bottom-color: var(--zel); }
.zav-i button[aria-selected="true"] svg { color: var(--zel); }
.zav-i button:hover { color: var(--ink); }
.plosca-i { padding: 18px; }
.plosca-i[hidden] { display: none; }

/* Opis z besedami */
.kabina { background: #fff; color: var(--ink); }
.zaslon { display: flex; gap: 12px; align-items: flex-start; background: #fff; border: 2px solid var(--crt); border-radius: 14px; padding: 12px 12px 12px 16px; transition: border-color .2s, box-shadow .2s; }
.zaslon:focus-within { border-color: var(--zel); box-shadow: 0 0 0 4px var(--zel-s); }
.zaslon textarea { flex: 1; min-width: 0; background: none; border: 0; outline: 0; resize: none; color: var(--ink); font: 500 19px/1.4 var(--b); height: 54px; }
.zaslon textarea::placeholder { color: #8C9289; }
.zaslon .gumb { flex: none; height: 52px; }
.razumel { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; align-items: center; }
.razumel:empty { display: none; }
.razumel .lbl { font: 500 12px var(--m); color: var(--sivo); margin-right: 4px; }
.cip-k { font: 600 12.5px var(--m); background: var(--zel-s); color: var(--zel-t); padding: 5px 9px; border-radius: 6px; animation: cip .35s both; }
@keyframes cip { from { opacity: 0; transform: translateY(5px); } }
.primeri { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; align-items: center; }
.primeri span { font: 500 12px var(--m); color: var(--sivo); }
.primeri button { background: #fff; border: 1px solid var(--crt); color: #3B4038; border-radius: 999px; padding: 6px 12px; font-size: 13.5px; cursor: pointer; }
.primeri button:hover { border-color: var(--zel); color: var(--zel-t); }

/* Klasičen iskalnik */
.kat-izbor { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; margin-bottom: 14px; }
.kat-izbor label { position: relative; }
.kat-izbor input { position: absolute; opacity: 0; }
.kat-izbor span { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 10px 4px 8px; border: 1px solid var(--crt2); border-radius: 12px; font-size: 12.5px; font-weight: 700; text-align: center; line-height: 1.15; cursor: pointer; transition: border-color .15s, background .15s; }
.kat-izbor span svg { width: 40px; height: 30px; transition: transform .3s; }
.kat-izbor span:hover { border-color: var(--zel); }
.kat-izbor span:hover svg { transform: translateX(3px); }
.kat-izbor input:checked + span { background: var(--zel); border-color: var(--zel); color: #fff; }
.kat-izbor input:focus-visible + span { outline: 3px solid var(--rum); }

.hitre { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; align-items: center; max-width: 760px; }
.hitre span { font: 500 12px var(--m); color: var(--sivo); letter-spacing: .04em; text-transform: uppercase; margin-right: 4px; }
.hitre a { border: 1px solid var(--crt); background: rgba(255,255,255,.85); color: #33372F; border-radius: 999px; padding: 6px 13px; font-size: 14px; font-weight: 600; }
.hitre a:hover { border-color: var(--zel); color: var(--zel-t); }

/* Rumen trak TOP oglasov */
.trak { background: var(--rum); border-block: 2px solid var(--ink); overflow: hidden; position: relative; z-index: 3; }
.trak-tir { display: flex; width: max-content; animation: trak 60s linear infinite; }
.trak:hover .trak-tir { animation-play-state: paused; }
@keyframes trak { to { transform: translateX(-50%); } }
.trak a { display: flex; align-items: center; gap: 14px; padding: 11px 24px; border-right: 2px solid var(--ink); white-space: nowrap; font-weight: 700; line-height: 1.2; }
.trak a:hover { background: rgba(0,0,0,.06); }
.trak img { width: 66px; height: 46px; object-fit: cover; border-radius: 6px; }
.trak small { display: block; font: 500 12px var(--m); }
.trak .cena { font: 900 24px var(--d); }
.trak .oznaka-top { font: 700 11px var(--m); background: var(--ink); color: var(--rum); padding: 2px 6px; border-radius: 4px; letter-spacing: .08em; }

/* Razdelki */
.razdelek { padding: 72px 0 0; }
.naslov-r { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 22px; }
.naslov-r h2 { font: 900 clamp(38px, 4.4vw, 58px)/.9 var(--d); text-transform: uppercase; margin: 0; }
.naslov-r a { font-weight: 700; border-bottom: 2px solid; white-space: nowrap; }
.naslov-r p { margin: 8px 0 0; color: var(--sivo); }

.kategorije { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.kat-ploscica { background: var(--bela); border: 1px solid var(--crt2); border-radius: 16px; padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 16px; position: relative; overflow: hidden; transition: background .2s, color .2s; min-height: 150px; }
.kat-ploscica svg { width: 82px; height: 60px; transition: transform .55s cubic-bezier(.2, .9, .3, 1.25); }
.kat-ploscica:hover { background: var(--zel-s); border-color: var(--zel); }
.kat-ploscica:hover svg { transform: translateX(14px); color: var(--zel); }
.kat-ploscica b { font: 800 24px/1 var(--d); text-transform: uppercase; margin-top: auto; }
.kat-ploscica small { font: 500 12px var(--m); color: var(--sivo); position: absolute; top: 16px; right: 18px; }


/* Kartica oglasa (mreža) */
.mreza { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.kartica { background: var(--bela); border: 1px solid var(--crt2); border-radius: var(--r); overflow: hidden; display: flex; flex-direction: column; position: relative; transition: transform .2s, box-shadow .2s; }
.kartica:hover { transform: translateY(-3px); box-shadow: 0 18px 36px -22px rgba(0,0,0,.45); }
.kartica .foto { aspect-ratio: 4 / 3; background: var(--crt2) center / cover; position: relative; }
.kartica .foto img { width: 100%; height: 100%; object-fit: cover; }
.kartica .telo { padding: 14px 16px 16px; display: flex; flex-direction: column; flex: 1; }
.kartica h3 { font: 700 17px/1.25 var(--b); margin: 0 0 10px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kartica .noga { display: flex; justify-content: space-between; align-items: end; gap: 8px; margin-top: auto; padding-top: 10px; }
.cena-v { font: 900 28px/1 var(--d); letter-spacing: .005em; }
.kraj { font-size: 13px; color: var(--sivo); text-align: right; line-height: 1.3; }
.spec { display: flex; flex-wrap: wrap; gap: 5px; }
.spec span { font: 500 12px var(--m); background: var(--beton); padding: 3px 7px; border-radius: 5px; }
.tablica { position: absolute; left: 10px; top: 10px; background: var(--rum); border: 2px solid var(--ink); border-radius: 5px; font: 700 12px var(--m); padding: 2px 8px; letter-spacing: .1em; z-index: 2; }
.tablica.najem { background: var(--ink); color: #fff; border-color: var(--ink); left: auto; right: 10px; }
.st-slik { position: absolute; right: 10px; bottom: 10px; background: rgba(28,30,32,.75); color: #fff; font: 500 11.5px var(--m); padding: 3px 7px; border-radius: 5px; display: flex; gap: 5px; align-items: center; }
.st-slik svg { width: 13px; height: 13px; }
.kartica.izp, .vrstica.izp { box-shadow: inset 0 0 0 3px var(--rum); }
.srce { position: absolute; top: 10px; right: 10px; width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,.92); border: 0; display: grid; place-items: center; cursor: pointer; z-index: 3; color: var(--ink); }
.srce svg { width: 18px; height: 18px; }
.srce[aria-pressed="true"] { color: var(--rdeca); }
.srce[aria-pressed="true"] path { fill: currentColor; }

/* Oglasni prostor */
.prostor { display: grid; grid-template-columns: 1.1fr 1fr; border-radius: 18px; overflow: hidden; background: var(--zel-t); color: #fff; min-height: 220px; position: relative; }
.prostor .t { padding: 30px 34px; display: flex; flex-direction: column; justify-content: center; gap: 8px; }
.prostor small, .prostor-oznaka { font: 500 11px var(--m); letter-spacing: .1em; opacity: .65; text-transform: uppercase; }
.prostor b { font: 900 clamp(30px, 3vw, 42px)/.95 var(--d); text-transform: uppercase; }
.prostor p { margin: 0 0 8px; opacity: .8; }
.prostor .slika { background: center / cover; }
.prostor .gumb { align-self: flex-start; }
.prostori { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.prostori .prostor { grid-template-columns: 1fr; }
.prostori .prostor .slika { position: absolute; inset: 0; opacity: .38; }
.prostori .prostor .t { position: relative; }

/* Poziv */
.poziv { margin: 72px 0 0; background: var(--zel); color: #fff; border-radius: 22px; padding: 56px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 30px; position: relative; overflow: hidden; }
.poziv h2 { font: 900 clamp(48px, 6vw, 84px)/.86 var(--d); text-transform: uppercase; margin: 0; }
.poziv h2 span { color: var(--rum); }
.poziv p { margin: 14px 0 0; color: #E3EFDD; font-size: 17px; }
.poziv img.znak-v { position: absolute; right: -40px; bottom: -40px; height: 260px; opacity: .1; }

/* Noga */
.noga-s { margin-top: 80px; background: #17331B; color: #C3D3C0; padding: 54px 0 34px; font-size: 14.5px; }
.noga-s .stolpci { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 30px; }
.noga-s h4 { font: 800 18px var(--d); text-transform: uppercase; color: #fff; margin: 0 0 12px; letter-spacing: .02em; }
.noga-s a { display: block; padding: 3px 0; } .noga-s a:hover { color: #fff; }
.noga-s .spodaj { border-top: 1px solid #2B4A2F; margin-top: 34px; padding-top: 20px; display: flex; justify-content: space-between; gap: 20px; font-size: 13px; }

/* Seznam oglasov */
.vrh-seznama { background: linear-gradient(180deg, #F2F7EE, #fff); border-bottom: 1px solid var(--crt2); padding: 26px 0 22px; }
.vrh-seznama h1 { font: 900 clamp(40px, 5vw, 64px)/.9 var(--d); text-transform: uppercase; margin: 0 0 4px; }
.vrh-seznama .pot { font: 500 13px var(--m); color: var(--sivo); margin-bottom: 10px; }
.vrh-seznama .pot a:hover { color: var(--ink); text-decoration: underline; }
.vrh-seznama .kabina { margin-top: 18px; background: none; max-width: 900px; }
.vrh-seznama .zaslon textarea { font-size: 17px; height: 28px; }
.vrh-seznama .zaslon { align-items: center; padding: 8px 8px 8px 16px; }
.vrh-seznama .zaslon .gumb { height: 44px; }
.podkat { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 16px; }
.podkat a { border: 1px solid var(--crt); background: #fff; color: #33372F; border-radius: 999px; padding: 6px 14px; font-size: 14px; font-weight: 600; }
.podkat a:hover { border-color: var(--zel); color: var(--zel-t); }
.podkat a[aria-current] { background: var(--zel); color: #fff; border-color: var(--zel); }
.podkat a small { font: 500 12px var(--m); opacity: .7; margin-left: 4px; }

.postavitev { display: grid; grid-template-columns: 290px 1fr; gap: 26px; align-items: start; padding-top: 26px; }
.filtri { background: var(--bela); border: 1px solid var(--crt2); border-radius: 16px; padding: 6px 18px 18px; position: sticky; top: 88px; max-height: calc(100vh - 104px); overflow: auto; }
.filtri fieldset { border: 0; border-bottom: 1px solid var(--crt2); padding: 16px 0; margin: 0; }
.filtri fieldset:last-of-type { border: 0; }
.filtri legend { font: 800 17px var(--d); text-transform: uppercase; letter-spacing: .02em; padding: 0; margin-bottom: 10px; float: left; width: 100%; }
.filtri legend + * { clear: both; }
.razpon { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.polje-v { width: 100%; height: 42px; border: 1px solid var(--crt); border-radius: 9px; padding: 0 12px; background: var(--bela); font-size: 15px; }
.polje-v:focus { outline: 0; border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink); }
select.polje-v { appearance: none; background: var(--bela) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%231C1E20' stroke-width='2'/%3E%3C/svg%3E") right 12px center no-repeat; padding-right: 32px; }
.kljukica { display: flex; align-items: center; gap: 10px; padding: 5px 0; cursor: pointer; font-size: 15px; }
.kljukica input { width: 18px; height: 18px; accent-color: var(--zel); margin: 0; }
.kljukica small { margin-left: auto; font: 500 12px var(--m); color: var(--sivo2); }
.gumbki { display: flex; flex-wrap: wrap; gap: 6px; }
.gumbki label { position: relative; }
.gumbki input { position: absolute; opacity: 0; }
.gumbki span { display: inline-block; padding: 6px 12px; border: 1px solid var(--crt); border-radius: 8px; font-size: 14px; font-weight: 600; cursor: pointer; }
.gumbki input:checked + span { background: var(--zel); color: #fff; border-color: var(--zel); }
.gumbki input:focus-visible + span { outline: 3px solid var(--rum); }
.filtri .akcije { position: sticky; bottom: 0; background: var(--bela); padding-top: 12px; display: flex; gap: 8px; }
.filtri .akcije .gumb { flex: 1; }
.filtri-zapri { display: none; }

.rezultati-glava { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; }
.rezultati-glava .st { font: 900 30px/1 var(--d); }
.rezultati-glava .st small { font: 600 15px var(--b); color: var(--sivo); margin-left: 6px; }
.rezultati-glava .sp { flex: 1; }
.rezultati-glava select { width: auto; }
.cipi { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 14px; }
.cip { display: inline-flex; align-items: center; gap: 6px; background: var(--bela); border: 1px solid var(--crt); border-radius: 999px; padding: 5px 8px 5px 12px; font-size: 14px; font-weight: 600; }
.cip svg { width: 14px; height: 14px; opacity: .6; } .cip:hover { border-color: var(--ink); } .cip:hover svg { opacity: 1; }
.cip-pocisti { font-size: 14px; font-weight: 600; color: var(--sivo); padding: 5px 8px; text-decoration: underline; }
.odpri-filtre { display: none; }

.vrstice { display: flex; flex-direction: column; gap: 12px; }
.vrstica { background: var(--bela); border: 1px solid var(--crt2); border-radius: var(--r); display: grid; grid-template-columns: 280px 1fr auto; overflow: hidden; position: relative; transition: box-shadow .2s, transform .2s; }
.vrstica:hover { box-shadow: 0 16px 34px -24px rgba(0,0,0,.5); transform: translateY(-2px); }
.vrstica .foto { position: relative; background: var(--crt2); min-height: 200px; }
.vrstica .foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.vrstica .telo { padding: 16px 20px; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.vrstica h3 { font: 700 19px/1.25 var(--b); margin: 0; }
.vrstica .opis { color: var(--sivo); font-size: 14px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin: 0; }
.vrstica .tabela { display: flex; flex-wrap: wrap; gap: 0; border: 1px solid var(--crt2); border-radius: 8px; overflow: hidden; align-self: flex-start; }
.vrstica .tabela div { padding: 6px 12px; border-right: 1px solid var(--crt2); font: 500 13px var(--m); }
.vrstica .tabela div:last-child { border: 0; }
.vrstica .tabela small { display: block; font: 600 10px var(--m); color: var(--sivo2); text-transform: uppercase; letter-spacing: .06em; }
.vrstica .desno { padding: 16px 20px; display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; gap: 10px; border-left: 1px solid var(--crt2); min-width: 190px; text-align: right; }
.vrstica .desno .cena-v { font-size: 34px; }
.vrstica .ddv { font: 500 11.5px var(--m); color: var(--sivo); }
.prodajalec-o { font-size: 13px; color: var(--sivo); line-height: 1.35; }
.prodajalec-o b { color: var(--ink); display: block; }
.oznaka-trg { display: inline-block; font: 700 10.5px var(--m); background: var(--zel-s); color: var(--zel-t); padding: 2px 6px; border-radius: 4px; letter-spacing: .06em; text-transform: uppercase; }
.prazno { background: var(--beton); border-radius: 16px; padding: 46px; text-align: center; }
.prazno h3 { font: 900 34px var(--d); text-transform: uppercase; margin: 0 0 8px; }
.prazno p { color: var(--sivo); margin: 0 0 20px; }
.strani { display: flex; gap: 6px; justify-content: center; margin-top: 28px; flex-wrap: wrap; }
.strani a, .strani span { min-width: 44px; height: 44px; display: grid; place-items: center; padding: 0 12px; border-radius: 10px; background: var(--bela); border: 1px solid var(--crt2); font-weight: 700; }
.strani a:hover { box-shadow: inset 0 0 0 2px var(--ink); }
.strani [aria-current] { background: var(--zel); border-color: var(--zel); color: #fff; }

/* Stran oglasa */
.oglas-pot { font: 500 13px var(--m); color: var(--sivo); padding: 20px 0 14px; display: flex; gap: 8px; flex-wrap: wrap; }
.oglas-pot a:hover { color: var(--ink); text-decoration: underline; }
.oglas-mreza { display: grid; grid-template-columns: 1fr 400px; gap: 26px; align-items: start; }
.galerija { background: var(--beton); border: 1px solid var(--crt2); border-radius: 18px; overflow: hidden; }
.galerija .glavna { position: relative; aspect-ratio: 4 / 3; background: #EEF1EB; cursor: zoom-in; }
.galerija .glavna img { width: 100%; height: 100%; object-fit: contain; }
.galerija .naprej, .galerija .nazaj { position: absolute; top: 50%; transform: translateY(-50%); width: 48px; height: 48px; border-radius: 50%; border: 0; background: rgba(255,255,255,.9); cursor: pointer; display: grid; place-items: center; }
.galerija .nazaj { left: 14px; } .galerija .naprej { right: 14px; }
.galerija .stevec { position: absolute; bottom: 14px; left: 14px; background: rgba(0,0,0,.6); color: #fff; font: 500 13px var(--m); padding: 4px 10px; border-radius: 6px; }
.slicice { display: flex; gap: 6px; padding: 8px; overflow-x: auto; scrollbar-width: thin; }
.slicice button { flex: none; width: 92px; height: 68px; border: 0; padding: 0; border-radius: 8px; overflow: hidden; cursor: pointer; opacity: .55; outline-offset: -2px; }
.slicice button[aria-current] { opacity: 1; outline: 2px solid var(--rum); }
.slicice img { width: 100%; height: 100%; object-fit: cover; }
.ploskev { background: var(--bela); border: 1px solid var(--crt2); border-radius: 18px; padding: 24px; }
.oglas-desno { position: sticky; top: 90px; display: flex; flex-direction: column; gap: 14px; }
.oglas-desno h1 { font: 800 30px/1.08 var(--b); margin: 6px 0 12px; letter-spacing: -.01em; }
.oglas-desno .cena-v { font-size: 52px; }
.kljucni { display: flex; flex-wrap: wrap; gap: 1px; background: var(--crt2); border: 1px solid var(--crt2); border-radius: 12px; overflow: hidden; margin: 18px 0; }
.kljucni div { flex: 1 1 30%; background: var(--bela); padding: 10px 12px; font: 700 15px var(--m); }
.kljucni small { display: block; font: 600 10.5px var(--m); color: var(--sivo2); text-transform: uppercase; letter-spacing: .06em; margin-bottom: 2px; }
.prodajalec { display: flex; gap: 14px; align-items: center; }
.prodajalec .ini { width: 52px; height: 52px; border-radius: 12px; background: var(--zel); color: #fff; display: grid; place-items: center; font: 900 24px var(--d); flex: none; }
.prodajalec b { display: block; font-size: 17px; }
.prodajalec span { color: var(--sivo); font-size: 14px; }
.telefon-gumb { width: 100%; margin-top: 16px; }
.opis-oglasa { white-space: pre-line; font-size: 16.5px; line-height: 1.65; }
.podatki-t { width: 100%; border-collapse: collapse; }
.podatki-t th, .podatki-t td { text-align: left; padding: 11px 0; border-bottom: 1px solid var(--crt2); }
.podatki-t th { color: var(--sivo); font-weight: 500; width: 46%; }
.podatki-t td { font: 600 15px var(--m); }
.h-ploskev { font: 900 30px var(--d); text-transform: uppercase; margin: 0 0 14px; }
.akcije-oglasa { display: flex; gap: 8px; flex-wrap: wrap; }
.statistika-o { font: 500 12.5px var(--m); color: var(--sivo); display: flex; gap: 14px; flex-wrap: wrap; }

/* Obrazci */
.obrazec label.oznaka, .oznaka { display: block; font-weight: 700; font-size: 14px; margin: 0 0 6px; }
.obrazec .vrsta { margin-bottom: 16px; }
.obrazec .dva { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.obrazec .trije { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
textarea.polje-v { height: auto; min-height: 140px; padding: 12px; line-height: 1.5; resize: vertical; }
.pomoc { font-size: 13px; color: var(--sivo); margin-top: 5px; }
.napaka { background: #FBE9E7; color: var(--rdeca); border-radius: 10px; padding: 12px 14px; font-weight: 600; margin-bottom: 16px; }
.uspeh { background: var(--zel-s); color: var(--zel-t); border-radius: 10px; padding: 12px 14px; font-weight: 600; margin-bottom: 16px; }
.ozka { max-width: 460px; margin: 56px auto 0; }
.ozka h1 { font: 900 56px/.9 var(--d); text-transform: uppercase; margin: 0 0 8px; }
.ozka .pod-naslov { color: var(--sivo); margin: 0 0 26px; }

/* Objava oglasa */
.objava { display: grid; grid-template-columns: 1fr 340px; gap: 26px; align-items: start; padding-top: 28px; }
.korak { background: var(--bela); border: 1px solid var(--crt2); border-radius: 18px; padding: 26px; margin-bottom: 16px; }
.korak h2 { display: flex; align-items: center; gap: 12px; font: 900 32px/1 var(--d); text-transform: uppercase; margin: 0 0 20px; }
.korak h2 .st-k { width: 38px; height: 38px; border-radius: 10px; background: var(--zel); color: #fff; display: grid; place-items: center; font: 700 17px var(--m); }
.izbor-kat { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.izbor-kat label { position: relative; }
.izbor-kat input { position: absolute; opacity: 0; }
.izbor-kat span { display: flex; align-items: center; gap: 12px; padding: 14px; border: 1px solid var(--crt); border-radius: 12px; font-weight: 700; cursor: pointer; min-height: 64px; }
.izbor-kat span svg { width: 46px; height: 34px; flex: none; }
.izbor-kat input:checked + span { background: var(--zel); color: #fff; border-color: var(--zel); }
.izbor-kat input:checked + span svg { color: #fff; }
.izbor-kat input:focus-visible + span { outline: 3px solid var(--rum); }
.nalagalnik { display: flex; flex-direction: column; align-items: center; gap: 6px; border: 2px dashed var(--crt); border-radius: 14px; padding: 30px; text-align: center; cursor: pointer; transition: border-color .2s, background .2s; }
.nalagalnik:hover, .nalagalnik.vleci { border-color: var(--zel); background: var(--zel-s); }
.nalagalnik b { font: 900 26px var(--d); text-transform: uppercase; display: block; }
.fotke { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 10px; margin-top: 14px; }
.fotka { position: relative; aspect-ratio: 4 / 3; border-radius: 10px; overflow: hidden; background: var(--crt2); }
.fotka img { width: 100%; height: 100%; object-fit: cover; }
.fotka .ukazi { position: absolute; inset: auto 6px 6px; display: flex; gap: 4px; justify-content: flex-end; }
.fotka button { width: 30px; height: 30px; border-radius: 8px; border: 0; background: rgba(255,255,255,.92); cursor: pointer; font-weight: 700; }
.fotka .prva { position: absolute; left: 6px; top: 6px; background: var(--rum); font: 700 10.5px var(--m); padding: 2px 6px; border-radius: 4px; }
.fotka.nalaga::after { content: ""; position: absolute; inset: 0; background: rgba(255,255,255,.6) linear-gradient(90deg, transparent, rgba(255,255,255,.8), transparent) 0 0 / 50% 100% no-repeat; animation: nalaga 1s infinite; }
@keyframes nalaga { to { background-position: 200% 0; } }
.predogled-oglasa { position: sticky; top: 90px; }
.predogled-oglasa .prostor-o { font: 500 12px var(--m); color: var(--sivo); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 8px; }

/* Moj račun */
.racun-glava { display: flex; justify-content: space-between; align-items: end; gap: 20px; padding: 36px 0 20px; flex-wrap: wrap; }
.racun-glava h1 { font: 900 56px/.9 var(--d); text-transform: uppercase; margin: 0; }
.zavihki { display: flex; gap: 4px; border-bottom: 2px solid var(--crt); margin-bottom: 20px; overflow-x: auto; }
.zavihki a { padding: 10px 16px; font-weight: 700; border-bottom: 3px solid transparent; margin-bottom: -2px; white-space: nowrap; }
.zavihki a[aria-current] { border-color: var(--ink); }
.zavihki a small { font: 500 12px var(--m); background: var(--rum); padding: 1px 6px; border-radius: 4px; margin-left: 4px; }
.moj-oglas { display: grid; grid-template-columns: 120px 1fr auto; gap: 16px; background: var(--bela); border: 1px solid var(--crt2); border-radius: 14px; padding: 12px; align-items: center; margin-bottom: 10px; }
.moj-oglas img, .moj-oglas .ni-slike { width: 120px; height: 90px; object-fit: cover; border-radius: 9px; background: var(--crt2); }
.moj-oglas h3 { margin: 0 0 4px; font-size: 17px; }
.moj-oglas .meta { font: 500 12.5px var(--m); color: var(--sivo); display: flex; gap: 12px; flex-wrap: wrap; }
.moj-oglas .ukazi { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.stanje-o { font: 700 11px var(--m); text-transform: uppercase; letter-spacing: .06em; padding: 2px 7px; border-radius: 4px; background: var(--zel-s); color: var(--zel-t); }
.stanje-o.prodan { background: var(--crt2); color: var(--sivo); } .stanje-o.skrit { background: #FDF3D0; color: #7A5B00; }
.sporocilo { background: var(--bela); border: 1px solid var(--crt2); border-radius: 14px; padding: 16px 18px; margin-bottom: 10px; }
.sporocilo.novo { box-shadow: inset 4px 0 0 var(--zel); }
.sporocilo .od { display: flex; justify-content: space-between; gap: 10px; font-size: 14px; color: var(--sivo); margin-bottom: 6px; flex-wrap: wrap; }
.sporocilo .od b { color: var(--ink); }
.sporocilo p { margin: 0; white-space: pre-line; }

/* Admin */
.tabela-a { width: 100%; border-collapse: collapse; background: var(--bela); border-radius: 14px; overflow: hidden; font-size: 14px; }
.tabela-a th, .tabela-a td { padding: 10px 12px; border-bottom: 1px solid var(--crt2); text-align: left; vertical-align: middle; }
.tabela-a th { font: 700 11px var(--m); text-transform: uppercase; letter-spacing: .06em; color: var(--sivo); background: #F6F7F4; }
.tabela-a form { display: inline; }

/* Pojavno okno */
dialog.okno { border: 0; border-radius: 18px; padding: 0; max-width: 520px; width: calc(100% - 32px); box-shadow: 0 40px 90px -30px rgba(0,0,0,.6); }
dialog.okno::backdrop { background: rgba(20,22,24,.6); backdrop-filter: blur(3px); }
dialog.okno .vsebina { padding: 26px; }
dialog.okno h2 { font: 900 34px/1 var(--d); text-transform: uppercase; margin: 0 0 16px; }
dialog.galerija-polno { max-width: none; width: 100vw; height: 100vh; max-height: none; background: #0B0C0D; border-radius: 0; margin: 0; }
dialog.galerija-polno img { width: 100%; height: calc(100vh - 70px); object-fit: contain; }
dialog.galerija-polno .zapri { position: absolute; top: 14px; right: 14px; z-index: 2; }

.obvestilo-t { position: fixed; bottom: 22px; left: 50%; transform: translateX(-50%); background: var(--ink); color: #fff; padding: 12px 20px; border-radius: 12px; font-weight: 600; z-index: 100; animation: cip .3s both; }

/* Odzivnost */
@media (max-width: 1180px) {
  .mreza { grid-template-columns: repeat(3, 1fr); }
  .kategorije { grid-template-columns: repeat(4, 1fr); }
  .glava nav { display: none; }
}
@media (max-width: 980px) {
  .postavitev { grid-template-columns: 1fr; }
  .filtri { position: fixed; inset: 0; z-index: 60; border-radius: 0; max-height: none; transform: translateX(-102%); transition: transform .25s; padding-top: 0; }
  .filtri.odprto { transform: none; }
  .filtri-zapri { display: flex; justify-content: space-between; align-items: center; position: sticky; top: 0; background: var(--bela); padding: 14px 0; z-index: 2; border-bottom: 1px solid var(--crt2); }
  .filtri-zapri b { font: 900 26px var(--d); text-transform: uppercase; }
  .odpri-filtre { display: inline-flex; }
  .oglas-mreza { grid-template-columns: 1fr; }
  .oglas-desno { position: static; }
  .objava { grid-template-columns: 1fr; }
  .predogled-oglasa { display: none; }
  .vrstica { grid-template-columns: 220px 1fr; }
  .vrstica .desno { grid-column: 1 / -1; flex-direction: row; align-items: center; border-left: 0; border-top: 1px solid var(--crt2); padding: 12px 20px; text-align: left; }
  .noga-s .stolpci { grid-template-columns: 1fr 1fr; }
  .prostor { grid-template-columns: 1fr; } .prostor .slika { min-height: 160px; order: -1; }
}
@media (max-width: 720px) {
  .ovoj { padding: 0 16px; }
  .glava .ovoj { height: 62px; gap: 10px; }
  .znak img { height: 36px; }
  .glava .ikonski span, .glava .gumb-z span { display: none; }
  .glava .gumb-z { padding: 0 14px; }
  .uvod-stevci { gap: 6px 16px; font-size: 12px; }
  .zaslon { flex-wrap: wrap; } .zaslon textarea { font-size: 17px; flex-basis: calc(100% - 40px); } .zaslon .gumb { width: 100%; }
  .uvod { background-size: auto 340px; background-position: 68% 0; background-color: #fff; }
  .uvod::before { background: linear-gradient(180deg, rgba(255,255,255,.55) 0, rgba(255,255,255,.75) 200px, #fff 330px); }
  .uvod .ovoj { padding-top: 34px; padding-bottom: 40px; }
  .uvod .vodilo { font-size: 16px; margin-bottom: 20px; }
  .zav-i button { font-size: 14px; padding: 14px 6px; }
  .plosca-i { padding: 12px; }
  .kat-izbor { grid-template-columns: repeat(5, 1fr); gap: 4px; } .kat-izbor span { font-size: 10.5px; padding: 8px 2px 6px; } .kat-izbor span svg { width: 30px; height: 22px; }
  .polja-i { grid-template-columns: 1fr 1fr; }   .hitre a:nth-child(n+6) { display: none; }
  .mreza { grid-template-columns: 1fr 1fr; gap: 10px; }
  .kartica .telo { padding: 10px 12px 12px; } .kartica h3 { font-size: 15px; } .cena-v { font-size: 23px; } .kartica .spec span:nth-child(n+3) { display: none; } .kartica .kraj { display: none; }
  .kategorije { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .kat-ploscica { min-height: 118px; padding: 14px; } .kat-ploscica svg { width: 60px; height: 44px; } .kat-ploscica b { font-size: 20px; }
  .prostori { grid-template-columns: 1fr; }
  .poziv { grid-template-columns: 1fr; padding: 30px; }
  .vrstica { grid-template-columns: 1fr; } .vrstica .foto { min-height: 0; aspect-ratio: 16 / 10; }
  .vrstica .tabela div:nth-child(n+4) { display: none; }
  .oglas-desno .cena-v { font-size: 42px; } .kljucni div { flex-basis: 40%; }
  .izbor-kat { grid-template-columns: 1fr 1fr; } .obrazec .dva, .obrazec .trije { grid-template-columns: 1fr; }
  .korak { padding: 18px; }
  .moj-oglas { grid-template-columns: 90px 1fr; } .moj-oglas img, .moj-oglas .ni-slike { width: 90px; height: 70px; } .moj-oglas .ukazi { grid-column: 1 / -1; justify-content: flex-start; }
  .noga-s .stolpci { grid-template-columns: 1fr; }
  .racun-glava h1, .ozka h1 { font-size: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .trak-tir { overflow-x: auto; }
}

.vrh-seznama .zaslon > svg { margin-top: 0; }

.oglas-levo { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.cena-v { white-space: nowrap; }
@media (max-width: 980px) {
  .oglas-mreza { display: flex; flex-direction: column; gap: 16px; }
  .oglas-levo { display: contents; }
  .oglas-levo .galerija { order: 1; }
  .oglas-desno { order: 2; }
  .oglas-levo > section { order: 3; }
}
@media (max-width: 720px) {
  .vrstica .desno { flex-wrap: wrap; gap: 8px 12px; }
  .vrstica .desno > div:first-child { flex-basis: 100%; display: flex; align-items: baseline; gap: 10px; }
  .vrstica .desno .prodajalec-o { flex: 1; }
  .vrstica .desno .cena-v { font-size: 30px; }
  .podatki-t th { width: 42%; }
}

.nalagalnik svg { width: 34px; height: 34px; color: var(--zel); }
.zaslon > svg { width: 22px; height: 22px; color: var(--zel); margin-top: 3px; flex: none; }
.zav-i .kratko { display: none; }
.hitre { max-width: none; }
@media (max-width: 720px) { .zav-i .dolgo { display: none; } .zav-i .kratko { display: inline; } }
.prostori .prostor .t { z-index: 1; } .prostori .prostor .slika { opacity: .3; }

.korak h2 svg { width: 34px; height: 34px; color: var(--zel); flex: none; }

/* Iskalnik kot na avto.net: polja zgoraj, kategorije spodaj (prenova 24.10.) */
.uvod .ovoj { padding-top: 54px; padding-bottom: 150px; }
.uvod .vodilo { margin-bottom: 0; }
.iskalnik-ovoj { position: relative; z-index: 5; margin-top: -118px; }
.iskalnik { max-width: none; border-radius: 18px; }
.zav-i { justify-content: flex-start; background: #F6F8F4; padding: 0 12px; }
.zav-i button { flex: none; padding: 15px 20px; background: none; font-size: 15px; }
.plosca-k[hidden], .plosca-ai[hidden] { display: none; }
.isk-naslov { grid-column: 1 / -1; font: 800 24px/1.15 var(--b); margin: 0 0 4px; letter-spacing: -.01em; }
.isk-naslov span { color: var(--zel-t); }
.polja-i { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 22px 24px 20px; }
.polja-i .polje-v { height: 52px; font-size: 16px; border-radius: 10px; }
.par { display: grid; grid-template-columns: 1fr 1fr; }
.par .polje-v:first-child { border-radius: 10px 0 0 10px; }
.par .polje-v:last-child { border-radius: 0 10px 10px 0; border-left: 0; }
.napredno { grid-column: span 1; display: flex; align-items: center; gap: 10px; height: 54px; border: 1px solid var(--crt); border-radius: 10px; background: #fff; padding: 0 16px; font-weight: 600; font-size: 16px; cursor: pointer; text-align: left; color: var(--ink); }
.napredno svg { width: 22px; height: 22px; color: var(--zel); }
.napredno:hover { border-color: var(--zel); }
.polja-i .isci { height: 54px; font-size: 17px; border-radius: 10px; }
.kat-trak { display: grid; grid-template-columns: repeat(8, 1fr); border-top: 1px solid var(--crt2); background: #F6F8F4; }
.kat-trak label { position: relative; }
.kat-trak input { position: absolute; opacity: 0; }
.kat-trak span { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 12px 4px 11px; font-size: 12.5px; font-weight: 700; color: var(--sivo); text-align: center; line-height: 1.15; border-right: 1px solid var(--crt2); border-top: 3px solid transparent; cursor: pointer; transition: color .15s, background .15s; height: 100%; }
.kat-trak label:last-child span { border-right: 0; }
.kat-trak span svg { width: 46px; height: 34px; transition: transform .3s; }
.kat-trak span:hover { color: var(--ink); }
.kat-trak span:hover svg { transform: translateX(3px); }
.kat-trak input:checked + span { background: #fff; color: var(--ink); border-top-color: var(--zel); }
.kat-trak input:checked + span svg { color: var(--zel); }
.kat-trak input:focus-visible + span { outline: 3px solid var(--rum); outline-offset: -3px; }
.plosca-ai { padding: 22px 24px; }

/* Izpostavljeno: vrtiljak */
.izpostavljeno .naslov-r { align-items: center; }
.vrt-ukazi { display: flex; gap: 8px; }
.vrt-ukazi .gumb { width: 48px; padding: 0; }
.vrtiljak { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 32px) / 3); gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; padding: 2px 0 6px; outline: 0; }
.vrtiljak::-webkit-scrollbar { display: none; }
.vrtiljak .kartica { scroll-snap-align: start; }
.vrtiljak .kartica:hover { transform: none; }
.vrtiljak .kartica .foto { aspect-ratio: 16 / 10; overflow: hidden; }
.vrtiljak .kartica .foto img { transition: transform .6s; }
.vrtiljak .kartica:hover .foto img { transform: scale(1.04); }
.vrtiljak .kartica h3 { font-size: 20px; }
.vrtiljak .kartica .telo { padding: 16px 18px 18px; }
.vrtiljak .cena-v { font-size: 34px; }
.vrtiljak .kartica.izp { box-shadow: none; }
.vrt-pike { display: flex; gap: 6px; justify-content: center; margin-top: 16px; }
.vrt-pike button { width: 8px; height: 8px; border-radius: 999px; border: 0; background: var(--crt); padding: 0; cursor: pointer; transition: width .25s, background .25s; }
.vrt-pike button[aria-current] { width: 26px; background: var(--zel); }

@media (max-width: 980px) {
  .polja-i { grid-template-columns: 1fr 1fr; }
  .napredno { grid-column: span 1; }
  .kat-trak { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 92px; overflow-x: auto; scrollbar-width: none; }
  .vrtiljak { grid-auto-columns: calc((100% - 16px) / 2); }
}
@media (max-width: 720px) {
  .uvod { background-size: cover; background-position: 70% 40%; }
  .uvod::before { background: linear-gradient(180deg, rgba(255,255,255,.92) 0, rgba(255,255,255,.7) 60%, rgba(255,255,255,.3)); }
  .uvod .ovoj { padding-top: 30px; padding-bottom: 104px; }
  .iskalnik-ovoj { margin-top: -84px; padding: 0 12px; }
  .zav-i { padding: 0 4px; } .zav-i button { padding: 13px 12px; font-size: 14px; }
  .polja-i { grid-template-columns: 1fr; padding: 16px; gap: 8px; }
  .isk-naslov { font-size: 20px; }
  .napredno { order: 9; height: 48px; font-size: 15px; }
  .plosca-ai { padding: 16px; }
  .vrtiljak { grid-auto-columns: 84%; gap: 12px; }
  .vrt-ukazi { display: none; }
}

.izpostavljeno { padding: 64px 28px 0; }
@media (max-width: 720px) { .izpostavljeno { padding: 44px 16px 0; } }

/* Področja (domača stran): ikona + naslov */
.podrocja { display: grid; grid-template-columns: repeat(8, 1fr); gap: 10px; }
.podrocje { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 18px 8px 16px; border: 1px solid var(--crt2); border-radius: 14px; background: #fff; text-align: center; transition: border-color .2s, background .2s; }
.podrocje svg { width: 58px; height: 44px; color: var(--ink); transition: transform .4s cubic-bezier(.2, .9, .3, 1.25), color .2s; }
.podrocje b { font: 800 19px/1.05 var(--d); text-transform: uppercase; }
.podrocje small { font: 500 11.5px var(--m); color: var(--sivo); }
.podrocje:hover { border-color: var(--zel); background: var(--zel-s); }
.podrocje:hover svg { transform: translateX(6px); color: var(--zel); }
@media (max-width: 1180px) { .podrocja { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 720px) { .podrocja { grid-template-columns: repeat(2, 1fr); gap: 8px; } }

.podkat { gap: 6px; } .podkat a { padding: 5px 12px; font-size: 13.5px; }
.podkat a.prazna { color: var(--sivo2); }
.uvod { background-color: #EAF3FA; background-size: auto 150%; background-position: right 78%; }
@media (max-width: 720px) { .uvod { background-size: cover; background-position: 80% 70%; } }
.uvod { background-color: #fff; }
.uvod::before { background: linear-gradient(90deg, #fff 0%, #fff 37%, rgba(255,255,255,.75) 47%, rgba(255,255,255,.2) 60%, rgba(255,255,255,0) 68%); }
@media (max-width: 720px) { .uvod::before { background: linear-gradient(180deg, rgba(255,255,255,.92) 0, rgba(255,255,255,.7) 60%, rgba(255,255,255,.3)); } }

/* Vrste strojev nad seznamom: ena vrstica, brez lomljenja */
.podkat { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; margin-top: 14px; -webkit-mask: linear-gradient(90deg, #000 92%, transparent); mask: linear-gradient(90deg, #000 92%, transparent); }
.podkat::-webkit-scrollbar { display: none; }
.podkat a { white-space: nowrap; flex: none; }
.vse-vrste-izb { flex: none; }
.vse-vrste-izb select { appearance: none; border: 1px dashed var(--crt); background: #fff; border-radius: 999px; padding: 5px 14px; font: 600 13.5px var(--b); color: var(--zel-t); cursor: pointer; height: 100%; }
.vse-vrste-izb select:hover { border-color: var(--zel); }
.vrh-seznama { padding: 22px 0 20px; }
.vrh-seznama h1 { font-size: clamp(36px, 4.2vw, 54px); }
.vse-vrste-izb select { width: 152px; }

/* ===== Prenova po vzoru Only Farmers: čopič, fotografija čez cel uvod, fotografske kartice ===== */
:root { --copic: 'Caveat Brush', 'Comic Sans MS', cursive; --sveza: #5DBB46; }
.znak-svetel { display: none; }
body[data-stran="domov"] .glava { position: fixed; left: 0; right: 0; background: transparent; border-color: transparent; transition: background .25s, border-color .25s; }
body[data-stran="domov"] .glava:not(.polna) .znak-temen { display: none; }
body[data-stran="domov"] .glava:not(.polna) .znak-svetel { display: block; }
body[data-stran="domov"] .glava:not(.polna) nav a, body[data-stran="domov"] .glava:not(.polna) .ikonski { color: #fff; }
body[data-stran="domov"] .glava:not(.polna) nav a:hover { background: rgba(255,255,255,.16); color: #fff; }
body[data-stran="domov"] .glava.polna { background: #fff; border-color: var(--crt2); }

.junak { position: relative; background: #2b2a1c url(/static/img/hero-zahod.jpg) center 62% / cover no-repeat; color: #fff; padding: 128px 0 56px; }
.junak::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(12,14,8,.6) 0%, rgba(12,14,8,.18) 30%, rgba(12,14,8,.28) 62%, rgba(12,14,8,.78) 100%); }
.junak > * { position: relative; }
.junak-glava { text-align: center; }
.junak h1 { font: 400 clamp(60px, 8.6vw, 132px)/.92 var(--copic); text-transform: uppercase; margin: 0; letter-spacing: .01em; text-shadow: 0 4px 30px rgba(0,0,0,.35); }
.poudarek { position: relative; display: inline-block; font-family: var(--copic); font-weight: 400; text-transform: uppercase; color: var(--zel); line-height: .95; }
.junak .poudarek { color: var(--sveza); }
.poudarek .crta { position: absolute; left: -3%; bottom: -.16em; width: 106%; height: .3em; color: var(--zel); pointer-events: none; }
.junak .poudarek .crta { color: #fff; }
.pripis { display: inline-flex; align-items: flex-end; gap: 6px; font: 400 clamp(26px, 2.6vw, 36px)/1 var(--copic); text-transform: uppercase; margin: 10px 0 0 22%; transform: rotate(-3deg); }
.pripis .puscica { width: 76px; height: 50px; margin-bottom: -18px; }
.junak .iskalnik-ovoj { margin-top: 26px; max-width: 1120px; }
.vprasanje { text-align: center; font: 400 clamp(34px, 3.6vw, 52px)/1 var(--copic); text-transform: uppercase; margin: 58px 0 22px; text-shadow: 0 2px 20px rgba(0,0,0,.4); }
.vprasanje .puscica { width: 80px; height: 44px; vertical-align: -4px; margin-left: 6px; }
.foto-podrocja { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.foto-podrocje { position: relative; aspect-ratio: 4 / 3; border-radius: 20px; border: 3px solid rgba(255,255,255,.9); background: center / cover no-repeat; overflow: hidden; box-shadow: 0 20px 40px -20px rgba(0,0,0,.6); transition: transform .3s cubic-bezier(.2,.9,.3,1.2); }
.foto-podrocje::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.6)); }
.foto-podrocje:hover { transform: translateY(-6px) rotate(-.6deg); }
.foto-podrocje .znacka { position: absolute; left: 14px; top: 14px; background: rgba(20,22,18,.6); backdrop-filter: blur(4px); color: #fff; font-size: 13.5px; font-weight: 600; padding: 4px 11px; border-radius: 999px; }
.foto-podrocje b { position: absolute; left: 18px; bottom: 12px; font: 400 clamp(32px, 2.8vw, 44px)/1 var(--copic); text-transform: uppercase; color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,.5); }
.foto-podrocje svg { position: absolute; right: 16px; bottom: 18px; width: 26px; height: 26px; color: #fff; transition: transform .25s; }
.foto-podrocje:hover svg { transform: translateX(4px); }
.za-trgovce { text-align: center; margin: 34px 0 0; }
.za-trgovce a { display: inline-flex; align-items: center; gap: 6px; color: #fff; font-size: 16px; opacity: .92; }
.za-trgovce a:hover { opacity: 1; text-decoration: underline; }
.za-trgovce svg { width: 18px; height: 18px; }

.uvod-razdelek { display: flex; justify-content: space-between; align-items: flex-end; gap: 30px; padding-top: 76px; flex-wrap: wrap; }
h2.mesan { font: 700 clamp(40px, 5vw, 66px)/1.05 var(--b); letter-spacing: -.025em; margin: 0 0 14px; text-transform: none; }
h2.mesan .poudarek { font-size: 1.2em; }
.uvod-razdelek p { font-size: 19px; color: var(--sivo); margin: 0; line-height: 1.55; }
.uvod-razdelek p b { color: var(--ink); }
.gumb-tz { background: #1F4D22; color: #fff; border-radius: 999px; } .gumb-tz:hover { background: #163a19; }
.gumb-tz svg, .vsi svg { width: 18px; height: 18px; }

.glava-r { display: flex; align-items: center; gap: 16px; margin-bottom: 20px; }
.glava-r h2 { font: 650 28px/1.15 var(--b); letter-spacing: -.01em; margin: 0; text-transform: none; }
.glava-r p { margin: 2px 0 0; color: var(--sivo); font-size: 16.5px; }
.glava-r .vsi, .glava-r .vrt-ukazi { margin-left: auto; }
.glava-r .vsi { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: var(--zel-t); white-space: nowrap; }
.krog { width: 54px; height: 54px; border-radius: 50%; background: var(--zel-s); color: var(--zel-t); display: grid; place-items: center; flex: none; }
.krog svg { width: 28px; height: 22px; }

.poziv h2.mesan { color: #fff; font-size: clamp(36px, 4.4vw, 58px); }
.poziv .poudarek { color: var(--rum); }
.poziv .poudarek .crta { color: #fff; }

/* Kartica oglasa: oznaka vrste na sliki, lokacija z bucikico */
.oznake-sl { position: absolute; left: 12px; top: 12px; display: flex; gap: 6px; z-index: 2; }
.o-vrsta, .o-top { background: rgba(255,255,255,.94); color: var(--ink); font-size: 13px; font-weight: 600; padding: 4px 11px; border-radius: 999px; box-shadow: 0 2px 8px rgba(0,0,0,.12); }
.o-top { background: var(--rum); font-weight: 800; letter-spacing: .04em; }
.kartica { border-radius: 18px; }
.kartica h3 { margin-bottom: 6px; }
.lokacija { display: flex; align-items: center; gap: 5px; color: var(--sivo); font-size: 14px; margin-bottom: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lokacija svg { width: 16px; height: 16px; color: var(--zel); flex: none; }

@media (max-width: 980px) { .foto-podrocja { grid-template-columns: 1fr 1fr; } }
@media (max-width: 720px) {
  .junak { padding: 96px 0 40px; background-position: 62% 60%; }
  .junak h1 { font-size: clamp(50px, 14vw, 72px); }
  .pripis { margin-left: 10%; } .pripis .puscica { width: 56px; }
  .foto-podrocja { gap: 10px; } .foto-podrocje { border-width: 2px; border-radius: 14px; } .foto-podrocje b { font-size: 28px; left: 12px; }
  .vprasanje { margin-top: 40px; font-size: 32px; }
  .glava-r h2 { font-size: 22px; } .glava-r p { font-size: 14px; } .krog { width: 44px; height: 44px; }
  .uvod-razdelek { padding-top: 52px; }
}
.junak .iskalnik { color: var(--ink); text-shadow: none; } .junak .iskalnik .polje-v { color: var(--ink); }
@media (max-width: 720px) { .foto-podrocje svg { display: none; } .foto-podrocje b { font-size: 26px; } }

/* Oprema in servis */
.oprema-skupina { margin-bottom: 14px; }
.oprema-skupina h3 { font: 700 13px var(--m); text-transform: uppercase; letter-spacing: .06em; color: var(--sivo); margin: 0 0 6px; }
.oprema-mreza { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px 16px; }
.oprema-izbira { display: flex; flex-direction: column; gap: 4px; font-size: 14.5px; padding: 4px 0; }
.oprema-izbira .polje-v { height: 38px; }
.nalagalnik-mali { padding: 18px; }
.nalagalnik-mali b { font-size: 21px; }
.oprema-oglas { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px 30px; }
.oprema-sk h3 { font: 700 13px var(--m); text-transform: uppercase; letter-spacing: .06em; color: var(--sivo); margin: 0 0 8px; }
.oprema-sk ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.oprema-sk li { display: flex; gap: 10px; align-items: flex-start; font-size: 16px; }
.oprema-sk li svg { width: 20px; height: 20px; color: var(--zel); flex: none; margin-top: 1px; }
.oprema-sk p { margin: 0; }
.servis-foto-naslov { font: 700 16px var(--b); margin: 18px 0 10px; } .servis-foto-naslov small { color: var(--sivo); font-weight: 500; margin-left: 6px; }
.servis-fotke { display: flex; gap: 8px; flex-wrap: wrap; }
.servis-fotke img { width: 120px; height: 90px; object-fit: cover; border-radius: 10px; border: 1px solid var(--crt2); }
.oprema-k { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--zel-t); font-weight: 600; margin-top: 8px; }
.oprema-k svg { width: 15px; height: 15px; flex: none; }
.vrstica .oprema-k { margin-top: 0; }
@media (max-width: 720px) { .oprema-mreza { grid-template-columns: 1fr 1fr; } .oprema-oglas { grid-template-columns: 1fr; } }
[data-za][hidden], [data-oprema-skupina][hidden], [data-za-kat][hidden] { display: none !important; }

/* ===== Profil, avatarji ===== */
.avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex: none; background: var(--zel-s); }
.avatar-crka { display: grid; place-items: center; background: var(--zel); color: #fff; font: 800 20px var(--b); }
.avatar-vel { width: 108px; height: 108px; font-size: 44px; }
.avatar-mal { width: 28px; height: 28px; }
.prodajalec .avatar { width: 52px; height: 52px; border-radius: 14px; font-size: 22px; }
a.prodajalec:hover b { text-decoration: underline; }
.prodajalec span svg { width: 14px; height: 14px; vertical-align: -2px; }
.profil-glava { display: flex; gap: 26px; align-items: center; padding: 40px 0 30px; }
.profil-glava h1 { font: 700 40px/1.1 var(--b); letter-spacing: -.02em; margin: 4px 0 8px; }
.profil-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; color: var(--sivo); margin: 0; }
.profil-meta span { display: inline-flex; align-items: center; gap: 5px; } .profil-meta svg { width: 16px; height: 16px; color: var(--zel); }
.profil-opis { margin: 12px 0 0; max-width: 46em; font-size: 16.5px; }
.profil-splet { display: inline-block; margin-top: 8px; color: var(--zel-t); font-weight: 600; text-decoration: underline; }
.profil-urejanje { display: grid; grid-template-columns: 1fr 320px; gap: 20px; align-items: start; }
.profil-slika { display: flex; gap: 18px; align-items: center; margin-bottom: 20px; }
.profil-slika .gumb { margin-right: 6px; }
.povezava-racun { display: flex; align-items: center; gap: 6px; margin: 6px 0; } .povezava-racun svg { width: 18px; height: 18px; }

/* Prijava z Google / Apple */
.oauth { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }
.oauth .gumb { width: 100%; gap: 12px; font-size: 16px; }
.oauth-apple { background: #000 !important; color: #fff !important; box-shadow: none !important; }
.ali { display: flex; align-items: center; gap: 12px; color: var(--sivo); font-size: 14px; margin: 6px 0 2px; }
.ali::before, .ali::after { content: ""; flex: 1; height: 1px; background: var(--crt); }

/* Glava: sporočila z značko */
.sporocila-ik { position: relative; }
.znacka-n { position: absolute; top: 4px; left: 24px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--rdeca); color: #fff; font: 700 11px/18px var(--b); font-style: normal; text-align: center; }
.znacka-n[hidden] { display: none; }
.glava .ikonski img.avatar { border: 2px solid #fff; }

/* ===== Pogovori ===== */
.pogovori { display: grid; grid-template-columns: 380px 1fr; gap: 0; border: 1px solid var(--crt2); border-radius: 18px; overflow: hidden; margin-top: 26px; height: calc(100vh - 160px); min-height: 520px; background: #fff; }
.pog-seznam { border-right: 1px solid var(--crt2); overflow-y: auto; }
.pog-seznam h1 { font: 700 26px var(--b); margin: 0; padding: 18px 18px 12px; position: sticky; top: 0; background: #fff; z-index: 1; }
.pog-vrstica { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: center; padding: 12px 18px; border-top: 1px solid var(--crt2); position: relative; }
.pog-vrstica:hover { background: #F7F9F5; }
.pog-vrstica.aktiven { background: var(--zel-s); }
.pog-tekst { min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.pog-tekst b { font-size: 15px; } .pog-tekst small { color: var(--sivo); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pog-tekst span { color: var(--sivo); font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pog-vrstica.novo .pog-tekst b, .pog-vrstica.novo .pog-tekst span { color: var(--ink); font-weight: 700; }
.pog-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; font-size: 12px; color: var(--sivo2); }
.pog-meta i { font-style: normal; background: var(--zel); color: #fff; border-radius: 999px; min-width: 20px; height: 20px; padding: 0 6px; font: 700 11.5px/20px var(--b); text-align: center; }
.pog-oglas { display: none; }
.pog-okno { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.pog-prazno { display: grid; place-items: center; color: var(--sivo); text-align: center; } .pog-prazno svg { width: 48px; height: 48px; color: var(--crt); }
.pog-glava { display: flex; align-items: center; gap: 12px; padding: 12px 18px; border-bottom: 1px solid var(--crt2); }
.pog-nazaj { display: none; }
.pog-oseba { display: flex; align-items: center; gap: 12px; } .pog-oseba span { display: flex; flex-direction: column; line-height: 1.25; } .pog-oseba small { color: var(--sivo); }
.pog-meni { margin-left: auto; position: relative; } .pog-meni summary { list-style: none; cursor: pointer; font-size: 22px; padding: 0 10px; border-radius: 8px; } .pog-meni summary::-webkit-details-marker { display: none; }
.pog-meni > div { position: absolute; right: 0; top: 34px; background: #fff; border: 1px solid var(--crt2); border-radius: 12px; box-shadow: 0 16px 30px -16px rgba(0,0,0,.3); padding: 6px; z-index: 5; min-width: 200px; }
.pog-meni button { display: block; width: 100%; text-align: left; border: 0; background: none; padding: 9px 12px; border-radius: 8px; cursor: pointer; font-size: 14.5px; } .pog-meni button:hover { background: var(--beton); }
.pog-oglas-kartica { display: flex; gap: 12px; align-items: center; padding: 10px 18px; border-bottom: 1px solid var(--crt2); background: #FAFBF9; }
.pog-oglas-kartica img { width: 64px; height: 48px; object-fit: cover; border-radius: 8px; }
.pog-oglas-kartica span { display: flex; flex-direction: column; min-width: 0; } .pog-oglas-kartica b { font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .pog-oglas-kartica small { color: var(--sivo); }
.pog-sporocila { flex: 1; overflow-y: auto; padding: 18px; display: flex; flex-direction: column; gap: 10px; background: #F7F9F5; }
.pog-varnost { align-self: center; max-width: 520px; text-align: center; font-size: 13px; color: var(--sivo); background: #fff; border: 1px solid var(--crt2); border-radius: 12px; padding: 8px 14px; margin: 0 0 6px; }
.pog-varnost svg { width: 14px; height: 14px; color: var(--zel); vertical-align: -2px; }
.msg { display: flex; flex-direction: column; align-items: flex-start; max-width: 74%; }
.msg.moje { align-self: flex-end; align-items: flex-end; }
.mehurcek { background: #fff; border: 1px solid var(--crt2); border-radius: 16px 16px 16px 4px; padding: 9px 14px; font-size: 15.5px; line-height: 1.45; overflow: hidden; }
.mehurcek p { margin: 0; white-space: pre-wrap; word-break: break-word; }
.mehurcek img { display: block; max-width: 280px; max-height: 280px; border-radius: 10px; margin: 2px 0 6px; }
.msg.moje .mehurcek { background: var(--zel); border-color: var(--zel); color: #fff; border-radius: 16px 16px 4px 16px; }
.msg time { font-size: 11.5px; color: var(--sivo2); margin: 3px 6px 0; }
.msg-opozorilo { background: #FFF4D6; color: #6B5100; border-radius: 10px; padding: 8px 12px; font-size: 13px; margin-bottom: 6px; max-width: 420px; }
.msg-opozorilo svg { width: 13px; height: 13px; vertical-align: -1px; }
.ponudba-msg { background: #fff; border: 2px solid var(--zel); border-radius: 16px; padding: 12px 16px; min-width: 220px; display: flex; flex-direction: column; gap: 2px; }
.ponudba-msg small { color: var(--sivo); font-size: 12.5px; } .ponudba-msg b { font: 900 30px/1.1 var(--d); }
.ponudba-stanje { font-size: 13px; font-weight: 700; color: var(--sivo); }
.st-sprejeta { border-color: var(--zel); background: var(--zel-s); } .st-sprejeta .ponudba-stanje { color: var(--zel-t); }
.st-zavrnjena, .st-preklicana { border-color: var(--crt); } .st-zavrnjena b, .st-preklicana b { text-decoration: line-through; color: var(--sivo); }
.ponudba-ukazi { display: flex; gap: 6px; margin-top: 8px; }
.pog-vnos { display: flex; align-items: flex-end; gap: 8px; padding: 12px 14px; border-top: 1px solid var(--crt2); background: #fff; }
.pog-vnos textarea { flex: 1; resize: none; border: 1px solid var(--crt); border-radius: 22px; padding: 11px 16px; font-size: 15.5px; line-height: 1.4; max-height: 160px; outline: 0; }
.pog-vnos textarea:focus { border-color: var(--zel); }
.pog-vnos .gumb { width: 46px; height: 46px; padding: 0; border-radius: 50%; }
.pog-slika, .pog-ponudi { width: 44px; height: 46px; display: grid; place-items: center; border-radius: 50%; cursor: pointer; color: var(--zel-t); border: 0; background: none; font: 800 20px var(--b); flex: none; }
.pog-slika:hover, .pog-ponudi:hover { background: var(--zel-s); } .pog-slika svg { width: 24px; height: 24px; }
.pog-blokiran { padding: 16px; text-align: center; color: var(--sivo); border-top: 1px solid var(--crt2); }

/* Način objave */
.nacin-objave { display: grid; grid-template-columns: 1.4fr 1fr; gap: 14px; margin-top: 4px; }
.nacin { display: flex; flex-direction: column; gap: 6px; border: 1px solid var(--crt2); border-radius: 18px; padding: 22px; cursor: pointer; background: #fff; transition: border-color .2s, background .2s; }
.nacin:hover { border-color: var(--zel); }
.nacin svg { width: 34px; height: 34px; color: var(--zel); } .nacin b { font: 700 21px var(--b); } .nacin span { color: var(--sivo); } .nacin small { color: var(--sivo2); font-size: 12.5px; margin-top: 4px; }
.nacin-ai { background: var(--zel-s); border-color: #CFE3C7; }
.dokument-stanje { margin-top: 14px; border-radius: 12px; padding: 12px 16px; }
.dokument-stanje.bere { background: var(--beton); } .dokument-stanje.ok { background: var(--zel-s); color: var(--zel-t); } .dokument-stanje.napaka { background: #FBE9E7; color: var(--rdeca); font-weight: 600; }
.polje-v.iz-dokumenta { border-color: var(--zel); background: #F3FAEF; }

@media (max-width: 980px) { .profil-urejanje { grid-template-columns: 1fr; } }
@media (max-width: 760px) {
  .pogovori { grid-template-columns: 1fr; height: calc(100vh - 90px); margin-top: 10px; border-radius: 14px; }
  .pogovori.ima-odprt .pog-seznam { display: none; }
  .pogovori:not(.ima-odprt) .pog-okno { display: none; }
  .pog-nazaj { display: grid; place-items: center; width: 34px; height: 34px; } .pog-nazaj svg { width: 22px; height: 22px; }
  .msg { max-width: 88%; }
  .profil-glava { flex-direction: column; align-items: flex-start; gap: 14px; } .profil-glava h1 { font-size: 30px; }
  .nacin-objave { grid-template-columns: 1fr; }
  .glava .sporocila-ik span { display: none; }
}

@media (max-width: 1500px) { .glava .ovoj { gap: 16px; } .glava nav a { padding: 8px 9px; } .glava .ikonski[href="/shranjeni"] span, .glava .sporocila-ik span { display: none; } }
@media (max-width: 720px) { .izbor-kat { grid-template-columns: repeat(2, minmax(0, 1fr)); } .izbor-kat span { padding: 10px; gap: 8px; font-size: 14px; } .izbor-kat span svg { width: 34px; height: 26px; } .objava { min-width: 0; } .objava > div { min-width: 0; } }

/* Cenik */
.cenik-glava { text-align: center; padding: 50px 0 30px; } .cenik-glava p { font-size: 19px; color: var(--sivo); max-width: 36em; margin: 0 auto; }
.paketi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; align-items: stretch; }
.paket { position: relative; border: 1px solid var(--crt2); border-radius: 22px; padding: 28px; display: flex; flex-direction: column; gap: 10px; background: #fff; }
.paket-glavni { border: 2px solid var(--zel); box-shadow: 0 24px 50px -30px rgba(31,77,34,.5); }
.paket-znacka { position: absolute; top: -14px; left: 28px; background: var(--rum); font-weight: 800; font-size: 13px; padding: 5px 12px; border-radius: 999px; }
.paket h2 { font: 700 26px var(--b); margin: 4px 0 0; }
.paket-cena { display: flex; flex-direction: column; margin: 0; } .paket-cena-2 { margin-top: -2px; }
.cen-znesek { font: 900 44px/1 var(--d); } .paket-cena small { color: var(--sivo); font-size: 14px; }
.paket ul { list-style: none; padding: 0; margin: 10px 0 18px; display: grid; gap: 9px; flex: 1; }
.paket li { display: flex; gap: 10px; align-items: flex-start; } .paket li svg { width: 20px; height: 20px; color: var(--zel); flex: none; margin-top: 2px; }
.paket .gumb { width: 100%; }
.cenik-opomba { text-align: center; color: var(--sivo); margin-top: 26px; } .cenik-opomba a { text-decoration: underline; }
.paket-trak { display: flex; align-items: center; gap: 12px; background: var(--zel-s); border-radius: 14px; padding: 12px 16px; margin-bottom: 14px; flex-wrap: wrap; }
.paket-trak > svg { width: 28px; height: 22px; color: var(--zel-t); } .paket-trak > div { flex: 1; min-width: 200px; }
.paket-trak.potekel { background: #FBE9E7; } .paket-trak.odprto { background: #FFF4D6; }
.izpostavi { position: relative; } .izpostavi summary { list-style: none; } .izpostavi summary::-webkit-details-marker { display: none; }
.izpostavi-izbira { position: absolute; right: 0; top: 40px; z-index: 5; background: #fff; border: 1px solid var(--crt2); border-radius: 12px; padding: 8px; display: flex; flex-direction: column; gap: 6px; box-shadow: 0 16px 30px -16px rgba(0,0,0,.3); min-width: 250px; }
.stanje-o.caka_placilo, .stanje-o.potekla_narocnina { background: #FFF4D6; color: #7A5B00; }
@media (max-width: 980px) { .paketi { grid-template-columns: 1fr; } }

/* Cenik 2: tabela, dodatki, paket */
.cenik-tabela { width: 100%; border-collapse: collapse; }
.cenik-tabela th, .cenik-tabela td { text-align: left; padding: 14px 10px; border-bottom: 1px solid var(--crt2); vertical-align: top; }
.cenik-tabela thead th { font: 700 12px var(--m); text-transform: uppercase; letter-spacing: .06em; color: var(--sivo); }
.cenik-tabela tbody th b { display: block; } .cenik-tabela tbody th span { color: var(--sivo); font-weight: 400; font-size: 14px; }
.cenik-tabela td:last-child { white-space: nowrap; }
.paket-stran { display: grid; gap: 16px; }
.dodatki-mreza { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.dodatek { border: 1px solid var(--crt2); border-radius: 14px; padding: 16px; display: flex; flex-direction: column; gap: 4px; }
.dodatek span { color: var(--sivo); font-size: 14px; } .dodatek small { margin: 6px 0 10px; display: flex; align-items: center; gap: 5px; } .dodatek small svg { width: 16px; height: 16px; color: var(--zel); }
.dodatek.vklopljen { border-color: var(--zel); background: #F5FAF2; } .dodatek .gumb { align-self: flex-start; }
.top-mesto { display: grid; grid-template-columns: auto auto 1fr auto auto; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--crt2); }
.top-mesto small { color: var(--sivo); } .top-mesto .polje-v { height: 38px; }
.pasice-seznam { padding-left: 18px; margin: 0 0 12px; } .pasica-obrazec summary { list-style: none; } .pasica-obrazec summary::-webkit-details-marker { display: none; }
.dodatki-oglasa { border: 1px dashed var(--crt); border-radius: 14px; padding: 16px; margin-bottom: 18px; }
.dodatki-oglasa h3 { font: 700 13px var(--m); text-transform: uppercase; letter-spacing: .06em; color: var(--sivo); margin: 0 0 10px; }
.dodatek-zaklenjen { margin: 6px 0; color: var(--sivo); font-size: 14px; } .dodatek-zaklenjen svg { width: 14px; height: 14px; color: var(--rum); vertical-align: -2px; } .dodatek-zaklenjen a { color: var(--zel-t); text-decoration: underline; font-weight: 600; }
.cena-akcija { display: inline-flex; flex-direction: column; line-height: 1.05; }
.cena-akcija s { color: var(--sivo); font-size: 14px; font-weight: 500; }
.akcija-oznaka { align-self: flex-start; background: var(--rdeca); color: #fff; font: 700 11px var(--b); padding: 2px 7px; border-radius: 5px; margin-bottom: 3px; text-transform: uppercase; letter-spacing: .03em; }
.cena-akcija .cena-v { color: var(--rdeca); }
.komentar-k { display: block; margin-top: 6px; font-size: 13.5px; font-weight: 600; color: #7A5B00; background: #FFF4D6; border-radius: 6px; padding: 3px 8px; align-self: flex-start; }
.video-okvir { position: relative; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: #000; } .video-okvir iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.stat-stevci { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 16px; }
.stat-stevci div { border: 1px solid var(--crt2); border-radius: 14px; padding: 16px; color: var(--sivo); } .stat-stevci b { display: block; font: 900 38px var(--d); color: var(--ink); }
@media (max-width: 720px) { .dodatki-mreza { grid-template-columns: 1fr; } .top-mesto { grid-template-columns: 1fr 1fr; } .top-mesto .polje-v { grid-column: 1 / -1; } .cenik-tabela td:nth-child(2) { display: none; } }

/* ===== Mirnejša stran oglasa (24.10.) ===== */
.oglas-pot { font: 400 13.5px var(--b); color: var(--sivo2); gap: 6px; }
.oglas-pot a { color: var(--sivo); }
.galerija { background: #fff; border: 0; border-radius: 16px; }
.galerija .glavna { border-radius: 16px; overflow: hidden; background: #F3F4F1; }
.slicice { padding: 10px 0 0; gap: 8px; }
.slicice button { border-radius: 10px; opacity: .6; }
.slicice button[aria-current] { outline: 2px solid var(--zel); outline-offset: 2px; }
.galerija .stevec { font: 500 12.5px var(--b); background: rgba(0,0,0,.5); }
.tablica { font: 700 11.5px var(--b); letter-spacing: .04em; border-width: 0; padding: 4px 10px; border-radius: 999px; }

.oglas-telo { background: #fff; border: 1px solid var(--crt2); border-radius: 18px; padding: 8px 32px; }
.odsek { padding: 26px 0; border-top: 1px solid #EEF0EC; }
.odsek:first-child { border-top: 0; }
.odsek h2 { font: 600 20px/1.2 var(--b); letter-spacing: -.01em; text-transform: none; margin: 0 0 16px; }
.opis-oglasa { font-size: 16px; line-height: 1.7; color: #33372F; max-width: 68ch; }
.podatki-dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; margin: 0; }
.podatki-dl > div { display: flex; justify-content: space-between; gap: 16px; padding: 9px 0; border-bottom: 1px solid #F1F2EF; font-size: 15px; }
.podatki-dl dt { color: var(--sivo); }
.podatki-dl dd { margin: 0; font-weight: 500; text-align: right; color: var(--ink); }
.oprema-oglas { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px 32px; }
.oprema-sk h3 { font: 500 13px var(--b); text-transform: none; letter-spacing: 0; color: var(--sivo2); margin: 0 0 8px; }
.oprema-sk ul { gap: 7px; }
.oprema-sk li { display: block; position: relative; padding-left: 20px; font-size: 15px; color: #33372F; }
.oprema-sk li::before { content: ""; position: absolute; left: 2px; top: .45em; width: 9px; height: 5px; border-left: 2px solid var(--zel); border-bottom: 2px solid var(--zel); transform: rotate(-45deg); }
.oprema-vr { color: var(--sivo); }
.servis-foto-naslov { font: 500 14px var(--b); color: var(--sivo); margin: 18px 0 10px; }

.oglas-desno .ploskev { padding: 26px; }
.oglas-desno h1 { font: 600 24px/1.25 var(--b); letter-spacing: -.01em; margin: 0 0 14px; }
.oglas-desno .cena-v { font: 700 38px/1 var(--b); letter-spacing: -.02em; }
.oglas-desno .mono { font: 400 13.5px var(--b) !important; }
.kljucni { background: none; border: 0; gap: 0; margin: 18px 0; border-top: 1px solid #F1F2EF; }
.kljucni div { flex: 1 1 45%; background: none; padding: 10px 0; font: 500 15px var(--b); border-bottom: 1px solid #F1F2EF; }
.kljucni small { font: 400 12.5px var(--b); text-transform: none; letter-spacing: 0; color: var(--sivo2); }
.oglas-desno .prodajalec b { font-size: 15.5px; font-weight: 600; }
.oglas-desno .oznaka-trg, .oznaka-trg { font: 600 11.5px var(--b); letter-spacing: 0; text-transform: none; }
.telefon-gumb { height: 50px; font-size: 15.5px; border-radius: 12px; }
.statistika-o { font: 400 13px var(--b); color: var(--sivo2); }
.komentar-k { font-weight: 500; }
.akcija-oznaka { font: 600 11px var(--b); text-transform: none; letter-spacing: 0; }

@media (max-width: 720px) {
  .oglas-telo { padding: 4px 18px; border-radius: 14px; }
  .podatki-dl { grid-template-columns: 1fr; }
  .oprema-oglas { grid-template-columns: 1fr 1fr; }
  .oglas-desno .cena-v { font-size: 32px; }
}
/* mirnejše: brez strojne pisave povsod, oprema v stolpcih, en poudarjen gumb */
:root { --m: 'Instrument Sans', system-ui, sans-serif; }
.oprema-oglas { display: block; columns: 3 220px; column-gap: 32px; }
.oprema-sk { break-inside: avoid; margin-bottom: 20px; }
.galerija .glavna { border-radius: 16px; }
.oglas-desno .gumb-t.telefon-gumb { background: #fff; color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--crt); }
.oglas-desno .gumb-t.telefon-gumb:hover { box-shadow: inset 0 0 0 1.5px var(--ink); }
.spec span, .vrstica .tabela div { font-weight: 500; }
.vrstica .tabela small, .kljucni small { text-transform: none; letter-spacing: 0; font-weight: 400; }
@media (max-width: 980px) { .oglas-levo > article { order: 3; } }
.filtri legend { font: 600 15px var(--b); text-transform: none; letter-spacing: 0; }

/* Osnove: veljavnost, prijava oglasa, profil, pravne strani, piškotki */
.velja-kmalu { color: #9A5B00; font-weight: 600; }
.stanje-o.potekel, .stanje-o.moderacija { background: #FBE9E7; color: var(--rdeca); }
.prijavi-oglas { background: none; border: 0; color: var(--sivo2); font-size: 13px; text-decoration: underline; cursor: pointer; margin: 4px 4px 0; padding: 0; align-self: flex-start; }
.prijavi-oglas:hover { color: var(--rdeca); }
.profil-stranski { display: flex; flex-direction: column; gap: 16px; }
.izbris summary { cursor: pointer; color: var(--rdeca); list-style: none; } .izbris summary::-webkit-details-marker { display: none; }
.pravno { max-width: 760px; margin: 40px auto 0; font-size: 16px; line-height: 1.7; color: #33372F; }
.pravno h1 { font: 700 38px/1.1 var(--b); letter-spacing: -.02em; margin: 0 0 6px; color: var(--ink); }
.pravno h2 { font: 600 19px var(--b); margin: 28px 0 8px; color: var(--ink); }
.pravno ul { padding-left: 20px; } .pravno li { margin-bottom: 6px; } .pravno a { color: var(--zel-t); text-decoration: underline; }
.pravno-datum { color: var(--sivo2); font-size: 14px; }
.piskotki { position: fixed; left: 16px; right: 16px; bottom: 16px; max-width: 640px; margin: 0 auto; background: #fff; border: 1px solid var(--crt2); border-radius: 16px; box-shadow: 0 20px 50px -20px rgba(0,0,0,.35); padding: 16px 18px; display: flex; gap: 14px; align-items: center; z-index: 90; flex-wrap: wrap; }
.piskotki[hidden] { display: none; } .piskotki p { margin: 0; flex: 1; min-width: 240px; font-size: 14.5px; } .piskotki a { text-decoration: underline; } .piskotki div { display: flex; gap: 8px; }
.moderacija .gumb { height: 30px; font-size: 12.5px; padding: 0 10px; }

/* ===== Sporočila v slogu WhatsAppa (25.10.) ===== */
body[data-stran="sporocila"] .noga-s { display: none; }
body[data-stran="sporocila"] main { background: #F2F5EF; }
.klepet { max-width: var(--sirina); margin: 0 auto; height: calc(100vh - 74px); padding: 18px 28px; display: grid; grid-template-columns: 370px minmax(0, 1fr); }
.klepet > * { background: #fff; min-height: 0; }
.kl-seznam { border: 1px solid var(--crt2); border-right: 0; border-radius: 20px 0 0 20px; display: flex; flex-direction: column; overflow: hidden; }
.kl-okno { border: 1px solid var(--crt2); border-radius: 0 20px 20px 0; display: flex; flex-direction: column; overflow: hidden; }
.kl-seznam-glava { padding: 18px 18px 10px; }
.kl-seznam-glava h1 { font: 700 24px var(--b); letter-spacing: -.01em; margin: 0 0 10px; }
.kl-isci { display: flex; align-items: center; gap: 8px; background: #F2F4F0; border-radius: 12px; padding: 0 12px; }
.kl-isci svg { width: 17px; height: 17px; color: var(--sivo2); }
.kl-isci input { border: 0; background: none; outline: 0; height: 40px; flex: 1; font-size: 15px; }
.kl-vrstice { overflow-y: auto; flex: 1; padding: 4px 8px 8px; }
.kl-vrstica { display: flex; gap: 12px; align-items: center; padding: 10px; border-radius: 14px; }
.kl-vrstica:hover { background: #F5F7F3; }
.kl-vrstica.aktiven { background: var(--zel-s); }
.kl-vrstica[hidden] { display: none; }
.kl-avatar { position: relative; flex: none; }
.kl-avatar .avatar { width: 52px; height: 52px; font-size: 21px; }
.kl-oglas-mini { position: absolute; right: -4px; bottom: -4px; width: 26px; height: 26px; border-radius: 8px; object-fit: cover; border: 2px solid #fff; }
.kl-tekst { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.kl-vrsta1, .kl-vrsta3 { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.kl-vrsta1 b { font-size: 15.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kl-vrsta1 time { font-size: 12px; color: var(--sivo2); flex: none; }
.kl-tekst small { font-size: 12.5px; color: var(--sivo2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kl-zadnje { font-size: 14px; color: var(--sivo); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kl-vrsta3 i { font-style: normal; background: var(--zel); color: #fff; min-width: 20px; height: 20px; border-radius: 999px; padding: 0 6px; font: 700 11.5px/20px var(--b); text-align: center; flex: none; }
.kl-vrstica.novo .kl-vrsta1 time { color: var(--zel); font-weight: 600; }
.kl-vrstica.novo .kl-zadnje { color: var(--ink); font-weight: 600; }
.kl-prazno { text-align: center; padding: 50px 20px; color: var(--sivo); } .kl-prazno svg { width: 40px; height: 40px; color: var(--crt); }

.kl-glava { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1px solid #EEF0EC; }
.kl-nazaj { display: none; width: 38px; height: 38px; place-items: center; border-radius: 50%; } .kl-nazaj svg { width: 22px; height: 22px; }
.kl-oseba { display: flex; align-items: center; gap: 12px; min-width: 0; }
.kl-oseba .avatar { width: 44px; height: 44px; font-size: 18px; }
.kl-oseba > span:not(.avatar) { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.kl-oseba b { font-size: 16px; font-weight: 600; }
.kl-oseba small { font-size: 13px; color: var(--sivo2); } .kl-oseba small.zdaj { color: var(--zel); }
.kl-meni { margin-left: auto; position: relative; }
.kl-meni summary { list-style: none; cursor: pointer; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; color: var(--sivo); } .kl-meni summary:hover { background: #F2F4F0; }
.kl-meni summary::-webkit-details-marker { display: none; }
.kl-meni > div { position: absolute; right: 0; top: 44px; background: #fff; border-radius: 14px; box-shadow: 0 16px 40px -14px rgba(0,0,0,.3); padding: 6px; z-index: 5; min-width: 200px; }
.kl-meni a, .kl-meni button { display: block; width: 100%; text-align: left; border: 0; background: none; padding: 10px 12px; border-radius: 10px; cursor: pointer; font-size: 15px; } .kl-meni a:hover, .kl-meni button:hover { background: #F2F4F0; }
.kl-oglas { display: flex; align-items: center; gap: 12px; padding: 8px 14px; background: #FAFBF9; border-bottom: 1px solid #EEF0EC; }
.kl-oglas img { width: 46px; height: 46px; border-radius: 10px; object-fit: cover; }
.kl-oglas span { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.kl-oglas b { font-size: 14.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .kl-oglas small { font-size: 13px; color: var(--sivo); }
.kl-oglas > svg { width: 18px; height: 18px; color: var(--sivo2); }

.kl-sporocila { flex: 1; overflow-y: auto; padding: 14px 6% 18px; display: flex; flex-direction: column; gap: 6px;
  background-color: #EEF2EA; background-image: radial-gradient(rgba(47,122,51,.07) 1px, transparent 1.5px); background-size: 22px 22px; }
.kl-varnost { align-self: center; max-width: 460px; text-align: center; font-size: 12.5px; color: #6B6A4E; background: #FFF6D8; border-radius: 10px; padding: 7px 12px; margin: 4px 0 10px; }
.dan-locilo { align-self: center; margin: 10px 0 4px; } .dan-locilo span { background: #fff; color: var(--sivo); font-size: 12.5px; font-weight: 500; padding: 5px 12px; border-radius: 10px; box-shadow: 0 1px 1px rgba(0,0,0,.06); }
.msg { display: flex; flex-direction: column; align-items: flex-start; max-width: 72%; margin-top: 4px; }
.msg.nadaljevanje { margin-top: -2px; }
.msg.moje { align-self: flex-end; align-items: flex-end; }
.msg .mehurcek { position: relative; background: #fff; border: 0; border-radius: 4px 14px 14px 14px; padding: 7px 10px 6px 11px; font-size: 15.5px; line-height: 1.4; box-shadow: 0 1px 1px rgba(0,0,0,.07); color: var(--ink); max-width: 100%; }
.msg.moje .mehurcek { background: #D9F4CE; color: var(--ink); border-radius: 14px 4px 14px 14px; }
.msg.nadaljevanje .mehurcek { border-radius: 14px; }
.msg:not(.nadaljevanje):not(.moje) .mehurcek::before { content: ""; position: absolute; left: -7px; top: 0; border: 7px solid transparent; border-top-color: #fff; border-right-color: #fff; border-width: 0 8px 10px 0; border-color: transparent #fff transparent transparent; }
.msg.moje:not(.nadaljevanje) .mehurcek::before { content: ""; position: absolute; right: -7px; top: 0; border-style: solid; border-width: 10px 8px 0 0; border-color: #D9F4CE transparent transparent transparent; }
.msg .mehurcek p { display: inline; margin: 0; white-space: pre-wrap; word-break: break-word; }
.msg-cas { float: right; margin: 6px 0 -3px 12px; font-size: 11.5px; color: #7C8478; display: inline-flex; align-items: center; gap: 3px; line-height: 1; white-space: nowrap; }
.klj { color: #8E968A; display: inline-flex; } .klj.prebrano { color: #34A853; }
.mehurcek.ima-sliko { padding: 4px 4px 6px; }
.msg-slika img { display: block; max-width: 300px; max-height: 320px; width: 100%; border-radius: 10px; margin-bottom: 4px; }
.mehurcek.ima-sliko p { padding: 0 6px; } .mehurcek.ima-sliko .msg-cas { margin-right: 6px; }
.msg-opozorilo { background: #FFF4D6; color: #6B5100; border-radius: 10px; padding: 7px 11px; font-size: 13px; margin-bottom: 4px; max-width: 420px; }
.msg .ponudba-msg { min-width: 220px; display: flex; flex-direction: column; gap: 2px; border: 0; padding: 12px 14px 8px; }
.ponudba-msg small { color: var(--sivo); font-size: 12.5px; } .ponudba-msg b { font: 700 26px/1.15 var(--b); letter-spacing: -.01em; }
.ponudba-stanje { font-size: 13px; font-weight: 600; color: var(--sivo); }
.msg .st-sprejeta { background: #E3F5DC !important; } .st-sprejeta .ponudba-stanje { color: var(--zel-t); }
.st-zavrnjena b, .st-preklicana b { text-decoration: line-through; color: var(--sivo); }
.ponudba-ukazi { display: flex; gap: 6px; margin: 8px 0 2px; }
.ponudba-msg .msg-cas { align-self: flex-end; float: none; margin: 4px 0 0; }

.kl-vnos { display: flex; align-items: flex-end; gap: 6px; padding: 10px 12px; background: #F7F8F5; border-top: 1px solid #EEF0EC; }
.kl-vnos textarea { flex: 1; resize: none; border: 0; background: #fff; border-radius: 22px; padding: 11px 16px; font-size: 15.5px; line-height: 1.4; max-height: 140px; outline: 0; box-shadow: 0 1px 1px rgba(0,0,0,.06); }
.kl-ikona { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; cursor: pointer; color: var(--sivo); border: 0; background: none; font: 700 19px var(--b); flex: none; }
.kl-ikona:hover { background: #E9ECE6; color: var(--zel-t); } .kl-ikona svg { width: 23px; height: 23px; }
.kl-poslji { width: 46px; height: 46px; border-radius: 50%; border: 0; background: var(--zel); color: #fff; display: grid; place-items: center; cursor: pointer; flex: none; transition: transform .15s, background .15s; }
.kl-poslji:hover { background: var(--zel-t); } .kl-poslji:active { transform: scale(.94); }
.kl-blokiran { padding: 16px; text-align: center; color: var(--sivo); background: #F7F8F5; }
.kl-prazno-okno { display: grid; place-items: center; text-align: center; color: var(--sivo); background: #F7F8F5; } .kl-prazno-okno svg { color: var(--crt); }

@media (max-width: 860px) {
  .klepet { grid-template-columns: 1fr; height: calc(100dvh - 62px); padding: 0; }
  .kl-seznam, .kl-okno { border: 0; border-radius: 0; }
  .klepet.ima-odprt .kl-seznam { display: none; }
  .klepet:not(.ima-odprt) .kl-okno { display: none; }
  .kl-nazaj { display: grid; }
  .msg { max-width: 86%; }
  .kl-sporocila { padding: 12px 10px 14px; }
  body[data-stran="sporocila"] .glava { display: none; }
  body[data-stran="sporocila"] .klepet { height: 100dvh; }
}

/* ===== Profil kot na družbenem omrežju (25.10.) ===== */
.profil { padding-top: 22px; }
.profil-kartica { background: #fff; border: 1px solid var(--crt2); border-radius: 22px; overflow: hidden; }
.profil-naslovnica { height: 240px; background: center / cover no-repeat; position: relative; }
.profil-naslovnica.privzeta { background: linear-gradient(120deg, rgba(31,77,34,.9), rgba(47,122,51,.75) 45%, rgba(159,212,143,.75)), url(/static/img/hero.jpg) center 60% / cover; }
.naslovnica-gumb { position: absolute; right: 16px; bottom: 16px; background: rgba(255,255,255,.92) !important; }
.profil-vrh { display: flex; align-items: flex-end; gap: 20px; padding: 0 28px; flex-wrap: wrap; }
.profil-avatar { margin-top: -64px; flex: none; }
.avatar-profil { width: 136px; height: 136px; font-size: 54px; border: 5px solid #fff; box-shadow: 0 6px 20px -8px rgba(0,0,0,.3); }
.profil-ime { flex: 1; min-width: 220px; padding-top: 14px; }
.profil-ime h1 { font: 700 30px/1.15 var(--b); letter-spacing: -.02em; margin: 0 0 6px; }
.profil-pod { display: flex; flex-wrap: wrap; gap: 6px 16px; color: var(--sivo); margin: 0; font-size: 14.5px; align-items: center; }
.profil-pod span { display: inline-flex; align-items: center; gap: 5px; } .profil-pod svg { width: 15px; height: 15px; color: var(--zel); }
.profil-tip { background: var(--zel-s); color: var(--zel-t); font-weight: 600; font-size: 12.5px; padding: 3px 10px; border-radius: 999px; }
.profil-aktiven::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #34A853; display: inline-block; }
.profil-gumbi { display: flex; gap: 8px; padding-bottom: 4px; }
.profil-bio { padding: 18px 28px 0; max-width: 760px; }
.profil-bio p { margin: 0; font-size: 16px; line-height: 1.6; color: #33372F; white-space: pre-line; }
.profil-prazno { color: var(--sivo2) !important; } .profil-prazno a { color: var(--zel-t); text-decoration: underline; }
.profil-splet { display: inline-block; margin-top: 6px; color: var(--zel-t); font-weight: 600; }
.profil-stevci { display: grid; grid-template-columns: repeat(4, 1fr); margin: 22px 28px 24px; border: 1px solid #EEF0EC; border-radius: 16px; }
.profil-stevci div { padding: 14px 16px; text-align: center; border-left: 1px solid #EEF0EC; display: flex; flex-direction: column; }
.profil-stevci div:first-child { border-left: 0; }
.profil-stevci b { font: 700 22px var(--b); letter-spacing: -.01em; } .profil-stevci span { font-size: 13px; color: var(--sivo); }
.profil-zavihki { display: flex; gap: 6px; margin: 22px 0 16px; border-bottom: 1px solid var(--crt2); }
.profil-zavihki a { padding: 12px 16px; font-weight: 600; color: var(--sivo); border-bottom: 2.5px solid transparent; margin-bottom: -1px; }
.profil-zavihki a[aria-current] { color: var(--ink); border-color: var(--zel); }
.profil-zavihki small { font-weight: 500; color: var(--sivo2); margin-left: 4px; }
.mreza-prodano .kartica { opacity: .75; } .mreza-prodano .kartica .foto::after { content: "Prodano"; position: absolute; left: 12px; bottom: 12px; background: var(--ink); color: #fff; font-size: 12.5px; font-weight: 600; padding: 4px 10px; border-radius: 999px; }
@media (max-width: 720px) {
  .profil { padding-top: 0; } .profil.ovoj { padding: 0; }
  .profil-kartica { border-radius: 0; border-left: 0; border-right: 0; }
  .profil-naslovnica { height: 150px; }
  .profil-vrh { padding: 0 16px; gap: 10px; } .profil-avatar { margin-top: -52px; }
  .avatar-profil { width: 104px; height: 104px; font-size: 42px; border-width: 4px; }
  .profil-ime { padding-top: 6px; min-width: 100%; } .profil-ime h1 { font-size: 24px; }
  .profil-gumbi { width: 100%; } .profil-gumbi .gumb { flex: 1; }
  .profil-bio { padding: 14px 16px 0; }
  .profil-stevci { margin: 16px; grid-template-columns: repeat(2, 1fr); } .profil-stevci div:nth-child(3) { border-left: 0; } .profil-stevci div:nth-child(n+3) { border-top: 1px solid #EEF0EC; }
  .profil-zavihki, .profil > .mreza, .profil > .prazno { margin-left: 16px; margin-right: 16px; }
}
.avatar-crka { background: hsl(var(--hue, 125), 34%, 40%); font-weight: 700; }
@media (max-width: 860px) {
  body[data-stran="sporocila"] .glava { display: block; }
  body[data-stran="sporocila"]:has(.klepet.ima-odprt) .glava { display: none; }
  body[data-stran="sporocila"] .klepet:not(.ima-odprt) { height: calc(100dvh - 62px); }
}
.avatar-crka { display: grid !important; place-items: center; line-height: 1; text-align: center; }
.profil-avatar { position: relative; z-index: 2; }

/* --- Zvestoba: lokacija, shranjena iskanja, ocene, zaupanje, statistika --- */
.lokacija-vnos { display: flex; gap: 6px; }
.lokacija-vnos .polje-v { flex: 1; min-width: 0; }
.lokacija-moja { width: 46px; padding: 0; flex: none; }
.lokacija-moja svg.ik { color: var(--zel); }
.shrani-iskanje-f { margin: 0; }
.shrani-iskanje-f .gumb svg.ik { color: var(--zel); width: 18px; height: 18px; }
@media (max-width: 640px) { .shrani-iskanje-f .gumb span { display: none; } .shrani-iskanje-f .gumb { width: 40px; padding: 0; } }

.iskanja-seznam { display: grid; gap: 10px; margin-top: 18px; }
.iskanje-v { display: flex; align-items: center; gap: 8px; padding: 14px 16px; border: 1px solid var(--crt2); border-radius: var(--r); background: #fff; }
.iskanje-v form { margin: 0; }
.iskanje-t { flex: 1; min-width: 0; display: grid; gap: 3px; }
.iskanje-t b { font-size: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.iskanje-t span { font-size: 13.5px; color: var(--sivo2); }
.iskanje-t:hover b { color: var(--zel-t); }
.novih { font-style: normal; font-weight: 700; color: #fff; background: var(--zel); border-radius: 999px; padding: 1px 9px; margin-right: 2px; }
.zvonec-vkl svg.ik { color: var(--zel); }
@media (max-width: 640px) { .iskanje-v .gumb span { display: none; } .iskanje-v .gumb { width: 40px; padding: 0; } }

.zvezdice { display: inline-flex; gap: 1px; vertical-align: -3px; }
.zvezdice svg.ik { width: 16px; height: 16px; color: #DADDD6; }
.zvezdice svg.ik.polna { color: #E9A800; }
.profil-ocena { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; font-size: 14px; color: var(--sivo); }
.profil-ocena b { color: var(--ink); }
.prodajalec-ocena { display: flex !important; align-items: center; gap: 5px; margin-top: 3px; font-size: 13px; color: var(--sivo); }

.zaupanje { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13.5px; color: var(--sivo); }
.zaupanje li { display: inline-flex; align-items: center; gap: 6px; }
.zaupanje svg.ik { width: 16px; height: 16px; color: var(--zel); }
.zaupanje li.glavna { color: var(--zel-t); font-weight: 700; }
.profil-zaupanje { padding: 0 28px 4px; }
.profil-zaupanje .zaupanje { margin-top: 4px; }
@media (max-width: 640px) { .profil-zaupanje { padding: 0 18px 4px; } }

.ocene { display: grid; gap: 12px; max-width: 760px; }
.ocena { border: 1px solid var(--crt2); border-radius: var(--r); padding: 16px 18px; background: #fff; }
.ocena header { display: flex; align-items: center; gap: 12px; }
.ocena header .avatar { width: 40px; height: 40px; }
.ocena header b { display: block; }
.ocena header span { font-size: 13px; color: var(--sivo2); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ocena p { margin: 10px 0 0; line-height: 1.55; }
.ocena-odgovor { margin-top: 12px; padding: 10px 14px; border-left: 3px solid var(--zel); background: var(--beton); border-radius: 0 10px 10px 0; font-size: 14.5px; }
.ocena-odgovor b { font-size: 13px; color: var(--zel-t); }
.ocena-odgovor p { margin: 4px 0 0; }
.ocena-odgovori { display: flex; gap: 8px; margin-top: 12px; }
.ocena-odgovori .polje-v { flex: 1; }

.oceni-trak { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 16px 6px; padding: 10px 14px; border-radius: 12px; background: #FFF8DC; font-size: 14.5px; }
.oceni-trak > span { display: inline-flex; align-items: center; gap: 8px; }
.oceni-trak svg.ik { color: #E9A800; width: 18px; height: 18px; }
.oceni-trak.hvala { background: var(--zel-s); color: var(--zel-t); justify-content: flex-start; gap: 8px; }
.oceni-trak.hvala svg.ik { color: var(--zel); }
.izberi-zvezdice { display: inline-flex; flex-direction: row-reverse; gap: 4px; margin: 6px 0 16px; }
.izberi-zvezdice input { position: absolute; opacity: 0; pointer-events: none; }
.izberi-zvezdice label { cursor: pointer; color: #DADDD6; transition: transform .12s; }
.izberi-zvezdice label svg.ik { width: 38px; height: 38px; }
.izberi-zvezdice label:hover, .izberi-zvezdice label:hover ~ label, .izberi-zvezdice input:checked ~ label { color: #E9A800; }
.izberi-zvezdice label:active { transform: scale(.92); }
.izberi-zvezdice input:focus-visible + label { outline: 3px solid var(--rum); border-radius: 6px; }

.teden-povzetek { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 0 0 16px; }
.teden-povzetek div { padding: 14px 16px; border-radius: var(--r); background: var(--beton); }
.teden-povzetek b { display: block; font: 700 28px/1.1 var(--d); }
.teden-povzetek span { font-size: 13.5px; color: var(--sivo); }
@media (max-width: 640px) { .teden-povzetek b { font-size: 22px; } .teden-povzetek span { font-size: 12px; } .teden-povzetek div { padding: 10px 12px; } }
/* skrit napis v vrstici vrst ne sme razširiti strani na telefonu */
.podkat, .vse-vrste-izb { position: relative; }
.ocena .avatar-crka { color: #fff !important; font-weight: 700; font-size: 17px; }

/* --- Razpisi in sofinanciranje --- */
.rz-uvod { max-width: 62em; color: var(--sivo); margin: 6px 0 0; }
.rz-postavitev { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 28px; align-items: start; padding-top: 26px; padding-bottom: 50px; }
@media (max-width: 980px) { .rz-postavitev { grid-template-columns: 1fr; } }
.rz-seznam { display: grid; gap: 14px; }
.rz-seznam-3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 980px) { .rz-seznam-3 { grid-template-columns: 1fr; } }
.rz-kartica { display: flex; flex-direction: column; gap: 8px; padding: 18px 20px; border: 1px solid var(--crt2); border-radius: var(--r); background: #fff; transition: border-color .15s, box-shadow .15s; }
.rz-kartica:hover { border-color: var(--zel); box-shadow: 0 10px 30px -18px rgba(28,30,32,.35); }
.rz-kartica h3 { margin: 0; font-size: 18px; line-height: 1.3; }
.rz-kartica p { margin: 0; color: var(--sivo); font-size: 14.5px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.rz-vrh { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.rz-izd { font-size: 13px; color: var(--sivo2); }
.rz-rok { display: inline-block; font-size: 12.5px; font-weight: 700; padding: 3px 10px; border-radius: 999px; background: var(--zel-s); color: var(--zel-t); }
.rz-rok.kmalu { background: #FFF3C4; color: #7A5B00; }
.rz-rok.potekel { background: #F1F1EF; color: var(--sivo); }
.rz-noga { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: auto; padding-top: 6px; font-size: 13.5px; }
.rz-noga b { color: var(--zel-t); }
.rz-noga span { color: var(--sivo2); }
.rz-opomba { font-size: 13px; color: var(--sivo2); margin: 16px 0 0; line-height: 1.5; }
.rz-narocnina .h-ploskev { display: flex; align-items: center; gap: 8px; font-size: 17px; }
.rz-narocnina .h-ploskev svg.ik { color: var(--zel); }
.rz-podrobno { padding-top: 22px; padding-bottom: 50px; }
.rz-podrobno .pot { font: 500 13px var(--m); color: var(--sivo); margin-bottom: 12px; }
.rz-glava h1 { font: 800 clamp(28px, 3.4vw, 40px)/1.15 var(--b); margin: 10px 0 10px; max-width: 26em; }
.rz-povzetek { font-size: 17px; color: #33372F; max-width: 46em; margin: 0 0 22px; line-height: 1.6; }
.rz-mreza { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 24px; align-items: start; }
@media (max-width: 980px) { .rz-mreza { grid-template-columns: 1fr; } }
.rz-dl { grid-template-columns: 1fr !important; }
.rz-dl dd small { color: var(--sivo2); }
.rz-oglasi { display: grid; gap: 12px; }
.rz-oglas { margin: 14px 0 0; padding: 14px 16px; border-radius: var(--r); background: var(--zel-s); display: grid; gap: 8px; }
.rz-oglas > b { display: flex; align-items: center; gap: 8px; color: var(--zel-t); font-size: 15px; }
.rz-oglas > b svg.ik { color: var(--zel); width: 18px; height: 18px; }
.rz-oglas a { display: grid; gap: 2px; padding: 8px 10px; border-radius: 10px; background: #fff; }
.rz-oglas a span { font-weight: 700; font-size: 14.5px; line-height: 1.35; }
.rz-oglas a small { color: var(--sivo); font-size: 13px; }
.rz-oglas a:hover span { color: var(--zel-t); text-decoration: underline; }
.rz-oglas-op { font-size: 12px; color: var(--sivo); }
.rz-znacka { display: inline-block; font-size: 11.5px; font-weight: 700; color: var(--zel-t); background: var(--zel-s); border-radius: 999px; padding: 2px 9px; margin-left: 8px; vertical-align: 3px; white-space: nowrap; }
.vrstica .desno .rz-znacka { margin: 6px 0 0; }
.rz-trak { display: flex; align-items: center; gap: 10px; margin-top: 14px; padding: 10px 14px; border-radius: 12px; background: var(--zel-s); color: var(--zel-t); font-size: 14.5px; max-width: 900px; }
.rz-trak svg.ik { color: var(--zel); flex: none; }
.rz-trak span { flex: 1; }
.rz-trak:hover span b { text-decoration: underline; }
.rz-seznam-3 { grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); }
.rz-dl > div { display: grid !important; grid-template-columns: 190px 1fr; gap: 14px; align-items: baseline; }
.rz-dl dd { text-align: left !important; margin: 0; }
@media (max-width: 640px) { .rz-seznam-3 { grid-template-columns: 1fr; } .rz-dl > div { grid-template-columns: 1fr; gap: 2px; } }

/* --- Glavni meni: Iskanje · Prodaja · Informacije (spustne plošče) --- */
.mn { display: flex; gap: 4px; margin-left: 8px; }
.mn-gumb { display: inline-flex; align-items: center; gap: 7px; height: 42px; padding: 0 14px; border: 0; border-radius: 10px; background: none; color: #33372F; font: 650 16px var(--b); cursor: pointer; }
.mn-gumb:hover, .mn-gumb[aria-expanded="true"] { background: var(--zel-s); color: var(--zel-t); }
.mn-gumb.aktiven { color: var(--zel-t); }
.mn-puscica { width: 11px; height: 8px; transition: transform .18s; }
.mn-gumb[aria-expanded="true"] .mn-puscica { transform: rotate(180deg); }
.mn-plosca { position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-top: 1px solid var(--crt2); border-bottom: 1px solid var(--crt2); box-shadow: 0 30px 60px -30px rgba(28,30,32,.35); animation: mn-v .16s ease-out; }
@keyframes mn-v { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.mn-stolpci { max-width: var(--sirina); margin: 0 auto; padding: 28px 28px 32px; display: grid; grid-template-columns: 1.6fr 1fr 1fr 280px; gap: 36px; }
.mn-stolpec h3, .mn-predal h3 { margin: 0 0 10px; font: 600 13px var(--b); color: var(--sivo2); }
.mn-povezave { display: grid; gap: 2px; }
.mn-stolpec.siroko .mn-povezave, .mn-povezave.siroko { grid-template-columns: 1fr 1fr; column-gap: 10px; }
.mn-povezave a { display: flex; align-items: center; gap: 12px; padding: 9px 10px; margin: 0 -10px; border-radius: 10px; font-size: 16px; font-weight: 550; color: var(--ink); }
.mn-povezave a:hover { background: var(--beton); color: var(--zel-t); }
.mn-povezave a svg.ik { width: 26px; height: 26px; color: var(--zel); }
.mn-povezave a span { display: grid; gap: 1px; }
.mn-povezave a small { font-size: 13px; font-weight: 400; color: var(--sivo2); }
.mn-stolpci:has(.mn-stolpec:nth-child(2):last-of-type) { grid-template-columns: 1fr 1fr 280px; }
.mn-kartica { display: grid; gap: 4px; align-content: start; }
.mn-slika { display: block; aspect-ratio: 16/10; border-radius: 14px; background: center/cover var(--beton); margin-bottom: 8px; transition: transform .25s; }
.mn-kartica:hover .mn-slika { transform: scale(1.02); }
.mn-kartica b { font-size: 16px; }
.mn-kartica small { color: var(--sivo); font-size: 14px; }
.mn-kartica:hover b { color: var(--zel-t); }
body[data-stran="domov"] .glava:not(.polna) .mn-gumb { color: #fff; }
body[data-stran="domov"] .glava:not(.polna) .mn-gumb:hover { background: rgba(255,255,255,.16); }
.glava.mn-odprt { background: #fff !important; border-color: var(--crt2) !important; }
.glava.mn-odprt .znak-temen { display: block !important; } .glava.mn-odprt .znak-svetel { display: none !important; }
.glava.mn-odprt .mn-gumb, .glava.mn-odprt .ikonski { color: #33372F !important; }

/* telefon in tablica: predal */
.mn-burger { display: none !important; }
.mn-predal { position: fixed; inset: 0; z-index: 60; background: #fff; overflow-y: auto; padding: 14px 20px 40px; }
.mn-predal[hidden] { display: none; }
.mn-predal-glava { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.mn-predal-glava b { font: 900 30px/1 var(--d); text-transform: uppercase; }
.mn-predal-sklop { border-bottom: 1px solid var(--crt2); padding: 6px 0 12px; }
.mn-predal-sklop summary { list-style: none; cursor: pointer; font: 700 20px var(--b); padding: 12px 0; display: flex; justify-content: space-between; }
.mn-predal-sklop summary::-webkit-details-marker { display: none; }
.mn-predal-sklop summary::after { content: '+'; color: var(--zel); font-weight: 400; }
.mn-predal-sklop[open] summary::after { content: '–'; }
.mn-predal h3 { margin: 12px 0 4px; }
.mn-predal .mn-povezave a { margin: 0; padding: 10px 6px; }
@media (max-width: 1180px) {
  .mn { display: none; }
  .mn-burger { display: inline-flex !important; padding: 0 10px; }
}
@media (max-width: 1500px) { .glava .ikonski span { display: none; } }
@media (max-width: 640px) { .mn-predal .mn-povezave.siroko { grid-template-columns: 1fr 1fr; } }
@media (max-width: 1180px) { .mn-predal .mn-povezave { grid-template-columns: 1fr 1fr; column-gap: 8px; } .mn-predal .mn-povezave a { font-size: 15.5px; } }
.mn-burger { border: 0; background: none; cursor: pointer; font: inherit; }
/* pripis »iz vse Slovenije« pod črto pod »DELO!«, ne čez njo */
.junak .pripis { margin-top: clamp(26px, 2.4vw, 38px); position: relative; z-index: 1; }