/* zajednica (druga faza) */
.podmeni { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin: -6px 0 16px; padding-bottom: 2px; }
.podmeni::-webkit-scrollbar { display: none; }
.podmeni a { white-space: nowrap; padding: 7px 13px; border-radius: 999px; background: var(--karta); box-shadow: var(--senka); color: var(--tekst2) !important; font-weight: 650; font-size: 14px; text-decoration: none !important; }
.podmeni a:hover { color: var(--tekst) !important; }
.podmeni a.akt { background: var(--preliv); color: #fff !important; }
.plocice { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.plocice a { display: grid; gap: 2px; background: var(--karta); border-radius: 14px; box-shadow: var(--senka); padding: 14px; color: var(--tekst) !important; text-decoration: none !important; height: 100%; transition: transform .12s, box-shadow .12s; }
.plocice a:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(124, 58, 237, .16); }
.plocice span { font-size: 26px; }
.plocice small { color: var(--tekst3); font-size: 12.5px; line-height: 1.3; }
.siroka { max-width: 760px; }
details.novo { margin: 12px 0; }
details.novo > summary { list-style: none; cursor: pointer; display: inline-flex; }
details.novo > summary::-webkit-details-marker { display: none; }
details.novo[open] > summary.dugme { background: var(--poz); color: var(--tekst2) !important; }
.teme { display: grid; gap: 2px; margin: 12px 0; }
.teme li a { display: flex; align-items: center; gap: 14px; padding: 11px 10px; border-radius: 12px; color: var(--tekst) !important; text-decoration: none !important; border-bottom: 1px solid var(--linija); }
.teme li a:hover { background: var(--hover); }
.teme li a > div { flex: 1; min-width: 0; }
.teme b { overflow-wrap: anywhere; }
.teme small { display: block; color: var(--tekst3); font-size: 13px; }
.tema-br { color: var(--tekst3); font-size: 13px; white-space: nowrap; text-align: center; }
.tema-br b { display: block; color: var(--tekst); font-size: 16px; }
.tema-posl { width: 120px; font-size: 13.5px; text-align: right; flex: none; font-weight: 650; overflow: hidden; text-overflow: ellipsis; }
.postovi > li { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--linija); }
.post-autor { display: flex; gap: 10px; align-items: center; align-self: start; }
.post-autor small { display: block; color: var(--tekst3); font-size: 12.5px; }
.post-tekst { overflow-wrap: anywhere; line-height: 1.6; }
.post-tekst.stih { font-style: italic; border-left: 3px solid var(--roze); padding-left: 14px; }
.kratka-lista li { padding: 8px 0; border-bottom: 1px solid var(--linija); }
.kratka-lista li:last-child { border-bottom: 0; }
.kratka-lista a { font-weight: 650; display: block; overflow-wrap: anywhere; }
.kratka-lista small { color: var(--tekst3); font-size: 13px; }
.objave { display: grid; gap: 4px; }
.objave > li { padding: 16px 0; border-bottom: 1px solid var(--linija); }
.objave > li:last-child { border-bottom: 0; }
.objave h2 { margin: 6px 0; font-size: 19px; }
.objava-glava { display: flex; gap: 10px; align-items: center; margin-bottom: 8px; }
.objava-naslov { font-weight: 700; color: var(--tekst2); margin-bottom: 6px; }
.objava-dno { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; margin-top: 10px; }
.glas { display: inline; }
.srce { background: var(--poz); border: 1.5px solid var(--linija); border-radius: 999px; padding: 5px 13px; cursor: pointer; font-weight: 700; font-size: 14px; }
.srce:hover { border-color: var(--roze); }
.srce.moj { border-color: var(--roze); background: color-mix(in srgb, var(--roze) 12%, var(--karta)); }
.blog-tekst .post-tekst { font-size: 17px; color: var(--tekst); margin: 16px 0; }
.mreza-slika { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; }
.mreza-slika a { display: block; position: relative; border-radius: 14px; overflow: hidden; aspect-ratio: 1; background: var(--hover); }
.mreza-slika img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .25s; }
.mreza-slika a:hover img { transform: scale(1.05); }
.mreza-slika a span { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: space-between; gap: 8px; padding: 22px 10px 8px; background: linear-gradient(transparent, rgba(0, 0, 0, .7)); font-size: 13px; }
.mreza-slika a span b { color: #fff !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mreza-slika a span i { color: #fff; font-style: normal; white-space: nowrap; }
.velika-slika { display: block; max-width: 100%; max-height: 75vh; margin: 8px auto 12px; border-radius: 14px; }
.opcija-unos { margin-bottom: 6px; }
.glasanje { display: grid; gap: 8px; margin: 10px 0; }
.glasanje button { text-align: left; padding: 11px 15px; border: 1.5px solid var(--linija); border-radius: 12px; background: var(--poz); cursor: pointer; font-weight: 600; }
.glasanje button:hover { border-color: var(--lj); background: var(--moja); }
.rezultati { display: grid; gap: 7px; margin: 10px 0; }
.rezultati li { position: relative; display: flex; justify-content: space-between; gap: 12px; padding: 10px 14px; border-radius: 12px; background: var(--poz); overflow: hidden; }
.rezultati .traka { position: absolute; left: 0; top: 0; bottom: 0; background: color-mix(in srgb, var(--lj) 20%, transparent); border-radius: 12px; }
.rezultati .moj .traka { background: color-mix(in srgb, var(--roze) 30%, transparent); }
.rezultati .rez-tekst, .rezultati b { position: relative; }
.rezultati .rez-tekst { overflow-wrap: anywhere; font-weight: 600; }
.kvote { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 10px 0; }
.kvota { display: inline-flex; gap: 12px; align-items: center; padding: 9px 14px; border: 1.5px solid var(--linija); border-radius: 12px; background: var(--poz); font-weight: 600; }
.kvota b { color: var(--lj); }
[data-tema="tamna"] .kvota b { color: #c4b0ff; }
label.kvota { cursor: pointer; }
label.kvota input { accent-color: var(--lj); }
label.kvota:has(input:checked), .kvota.moj { border-color: var(--lj); background: var(--moja); }
.kvota.pobednik { border-color: var(--zeleno); background: color-mix(in srgb, var(--zeleno) 14%, var(--karta)); }
.kvote .red-forma { width: 100%; }
.kratko { width: 90px !important; flex: none !important; min-width: 0 !important; }
.ekipa-red { margin-top: 8px; padding-top: 10px; border-top: 1px dashed var(--linija); }
.moje-upoznavanje { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; background: var(--poz); border-radius: 14px; padding: 12px 14px; margin: 12px 0; }
.moje-upoznavanje input[type=text] { flex: 1; min-width: 220px; width: auto; background: var(--karta); }
.filteri { margin-bottom: 16px; }
.filteri label { display: inline-flex; align-items: center; gap: 6px; font-size: 14.5px; }
.filteri input[type=text] { max-width: 180px; }
.upoznavanja { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; }
.upoznavanja li { background: var(--poz); border-radius: 16px; padding: 14px 10px; display: grid; gap: 8px; justify-items: center; text-align: center; }
.upoznavanja li > a:first-child { display: grid; justify-items: center; gap: 3px; text-decoration: none !important; }
.upoznavanja small { display: block; color: var(--tekst3); font-size: 13px; }
.upoznavanja .trazim { font-style: italic; color: var(--tekst2); overflow-wrap: anywhere; }
@media (max-width: 600px) {
  .postovi > li { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .tema-posl { display: none; }
  .mreza-slika { grid-template-columns: repeat(2, 1fr); }
  .upoznavanja { grid-template-columns: repeat(2, 1fr); }
}