/* Organska Farma – redovi, kolone i moduli (v2). Dizajn pojedinačnih modula dolazi iz urednika (CSS u <head>). */

/* ---------- red i kolone ---------- */
.ofr { display: grid; grid-template-columns: var(--ofr-k, minmax(0, 1fr)); gap: var(--ofr-g, 28px); }
.ofr + .ofr { margin-top: var(--ofr-g, 28px); }
.ofk { min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.ofk > .ofm { margin: 0; }
@media (max-width: 980px) {
	.ofr--3, .ofr--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
	.ofr { grid-template-columns: minmax(0, 1fr); }
	.ofr--obrni { display: flex; flex-direction: column-reverse; }
}
.ofm { min-width: 0; position: relative; }
.ofm--puna { margin-left: calc(-1 * var(--of-pad-x, 0px)); margin-right: calc(-1 * var(--of-pad-x, 0px)); }
.ofm-prazan, .ofk-prazno { margin: 0; padding: 18px; border: 2px dashed rgba(140, 90, 30, .35); border-radius: 10px; text-align: center; font-size: 14px; opacity: .75; }
@media (min-width: 981px) { .ofm-sakrij-d { display: none !important; } }
@media (min-width: 601px) and (max-width: 980px) { .ofm-sakrij-t { display: none !important; } }
@media (max-width: 600px) { .ofm-sakrij-m { display: none !important; } }

/* ---------- Tekst ---------- */
.ofm-tekst { color: var(--b-tekst); line-height: 1.7; }
.ofm-tekst > :first-child { margin-top: 0; }
.ofm-tekst > :last-child { margin-bottom: 0; padding-bottom: 0; }
.ofm-tekst h2, .ofm-tekst h3, .ofm-tekst h4 { color: var(--b-naslov); font-family: var(--of-font-naslov); }

/* ---------- Naslov ---------- */
.ofm-nsl { color: var(--b-naslov); }
.ofm-nad { margin: 0 0 8px; padding: 0; font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--b-pod); }
.ofm-naslov { margin: 0; padding: 0; font-family: var(--of-font-naslov); font-size: var(--b-nsl, 34px); line-height: 1.2; color: var(--b-naslov); }
.ofm-pod { margin: 10px 0 0; padding: 0; font-family: var(--of-font-naslov); font-style: italic; font-size: 17px; color: var(--b-pod); }
.ofm-nsl--linija .ofm-naslov::after { content: ""; display: block; width: 56px; height: 3px; margin: 14px auto 0; background: var(--b-ukras); border-radius: 2px; }
.ofm-nsl--linija[style*="left"] .ofm-naslov::after { margin-left: 0; }
.ofm-nsl--ukras .ofm-naslov { display: inline-flex; align-items: center; gap: 16px; }
.ofm-nsl--ukras .ofm-naslov::before, .ofm-nsl--ukras .ofm-naslov::after { content: ""; width: 48px; height: 1px; background: var(--b-ukras); box-shadow: 0 0 0 0 transparent; }

/* ---------- Blurb ---------- */
.ofm-br { display: flex; flex-direction: column; gap: 12px; color: var(--b-tekst); text-decoration: none !important; }
.ofm-br--gore[style*="center"] { align-items: center; }
.ofm-br--lijevo { flex-direction: row; align-items: flex-start; gap: 16px; }
.ofm-br-ikona { flex: none; display: inline-grid; place-items: center; width: 1em; height: 1em; font-size: 56px; color: var(--of-zelena); }
.ofm-br-ikona svg { width: .5em; height: .5em; }
.ofm-br-ikona:not([style]) { border-radius: 50%; background: color-mix(in srgb, currentColor 10%, transparent); border: 1px solid color-mix(in srgb, currentColor 30%, transparent); }
.ofm-br-slika { display: block; max-width: 100%; }
.ofm-br-slika img { display: block; max-width: 100%; height: auto; border-radius: var(--of-radius); }
.ofm-br-tijelo { display: flex; flex-direction: column; gap: 6px; }
.ofm-br-naslov { font-family: var(--of-font-naslov); font-size: 19px; font-weight: 700; line-height: 1.3; color: var(--b-naslov); }
.ofm-br-tekst { font-size: 15.5px; line-height: 1.6; opacity: .92; }

/* ---------- Dugme ---------- */
.ofm-dugme-red { line-height: 1; }
.ofm-dugme { display: inline-flex; align-items: center; justify-content: center; gap: 8px; transition: background .2s, color .2s; }
.ofm-dugme--puna { display: flex; width: 100%; }

/* ---------- Slika ---------- */
.ofm-sl { margin: 0; }
.ofm-sl-okvir { display: block; overflow: hidden; border-radius: var(--of-radius); }
.ofm-sl-okvir img { display: block; width: 100%; height: auto; aspect-ratio: var(--ofm-omjer, auto); object-fit: cover; }
.ofm-sl--foto .ofm-sl-okvir { background: #fff; padding: 10px 10px 34px; border-radius: 2px; box-shadow: 0 10px 30px rgba(40, 25, 10, .25); transform: rotate(-1.2deg); }
.ofm-sl-opis { margin-top: 10px; font-size: 14px; font-style: italic; text-align: center; color: var(--b-pod); }

/* ---------- Blog ---------- */
.ofm-bp { display: grid; grid-template-columns: repeat(var(--k, 3), minmax(0, 1fr)); gap: 24px; }
.ofm-bp--lista, .ofm-bp--tekst { grid-template-columns: minmax(0, 1fr); gap: 18px; }
@media (max-width: 980px) { .ofm-bp--mreza { grid-template-columns: repeat(min(2, var(--k, 3)), minmax(0, 1fr)); } }
@media (max-width: 600px) { .ofm-bp--mreza { grid-template-columns: minmax(0, 1fr); } }
.ofm-bp-k { display: flex; flex-direction: column; background: #fbf5ea; border-radius: var(--of-radius); overflow: hidden; box-shadow: 0 1px 2px rgba(0, 0, 0, .05), 0 10px 24px rgba(60, 40, 20, .08); transition: transform .2s ease, box-shadow .2s ease; color: var(--of-tekst); }
.ofm-bp-k:hover { transform: translateY(-3px); box-shadow: 0 2px 4px rgba(0, 0, 0, .06), 0 16px 34px rgba(60, 40, 20, .14); }
.ofm-bp--lista .ofm-bp-k { flex-direction: row; }
.ofm-bp--lista .ofm-bp-slika { flex: 0 0 min(34%, 280px); }
@media (max-width: 600px) { .ofm-bp--lista .ofm-bp-k { flex-direction: column; } }
.ofm-bp--tekst .ofm-bp-k { background: transparent; box-shadow: none; border-bottom: 1px solid rgba(140, 90, 30, .2); border-radius: 0; }
.ofm-bp--tekst .ofm-bp-k:hover { transform: none; box-shadow: none; }
.ofm-bp-slika { display: block; overflow: hidden; }
.ofm-bp-slika img, .ofm-bp-bez { display: block; width: 100%; height: 100%; aspect-ratio: var(--ofm-omjer, 4/3); object-fit: cover; }
.ofm-bp-bez { background: linear-gradient(135deg, #e4d2b2, #c9b597); }
.ofm-bp-tijelo { display: flex; flex-direction: column; gap: 8px; padding: 16px 18px 20px; flex: 1; }
.ofm-bp--tekst .ofm-bp-tijelo { padding: 0 0 18px; }
.ofm-bp-meta { margin: 0; padding: 0; font-size: 12.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--of-zemlja, #8c5a1e); }
.ofm-bp-naslov { margin: 0; padding: 0; font-family: var(--of-font-naslov); font-size: 19px; line-height: 1.3; }
.ofm-bp-naslov a { color: inherit; text-decoration: none; }
.ofm-bp-naslov a:hover { text-decoration: underline; }
.ofm-bp-odl { margin: 0; padding: 0; font-size: 15px; line-height: 1.6; opacity: .9; }
.ofm-bp-vise { margin-top: auto; padding-top: 4px; align-self: flex-start; font-weight: 700; font-size: 14.5px; color: var(--of-zelena); text-decoration: none; }
.ofm-bp-vise:hover { text-decoration: underline; }
.ofm-bp-pag { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; margin-top: 28px; }
.ofm-bp-pag .page-numbers { display: inline-grid; place-items: center; min-width: 40px; height: 40px; padding: 0 10px; border-radius: 8px; background: #fff; color: var(--of-tekst); font-weight: 700; text-decoration: none; box-sizing: border-box; }
.ofm-bp-pag .page-numbers.current { background: var(--of-zelena); color: #fff; }
.ofm-bp-prazno { margin: 0; text-align: center; opacity: .8; }

/* ---------- Pregled u uredniku ---------- */
.of-pregled-blokova [data-of-m] { cursor: pointer; }
.of-pregled-blokova [data-of-m]:hover { outline: 2px dashed rgba(163, 29, 29, .55); outline-offset: 3px; }
.of-pregled-blokova [data-of-m].is-of-izabran { outline: 3px solid #a31d1d; outline-offset: 3px; }
.of-pregled-blokova [data-of-s].is-of-izabran { outline: 3px solid #2271b1; outline-offset: -3px; }
