/* =========================================================
   Organska Farma 1.14.0 – moduli šablona (artikal, proizvod, objava, recept)
   ========================================================= */

/* artikal u šablonu: WooCommerce stilovi rade, ali raspored je iz sekcija */
.of-sab-woo div.product { display: block !important; }
.of-sab-woo div.product > * { grid-column: auto; }
.of-sab-woo .woocommerce-notices-wrapper:not(:empty) { max-width: 1200px; margin: 20px auto 0; padding: 0 24px; box-sizing: border-box; }
.of-sab-woo div.product div.images { width: auto !important; float: none !important; margin: 0 !important; }
.of-sab-woo div.product form.cart { margin-bottom: 18px !important; }

.ofp-naslov { margin: 0 0 12px; padding: 0; font-family: var(--of-font-naslov); font-size: clamp(28px, 3.4vw, 42px); line-height: 1.15; color: var(--b-naslov, var(--of-tekst)); }
h2.ofp-naslov { font-size: clamp(26px, 3vw, 36px); }
h3.ofp-naslov { font-size: 24px; }

.ofp-slika { margin: 0 0 22px; }
.ofp-slika img { display: block; width: 100%; height: auto; border-radius: 3px; }
.ofp-slika--omjer img { aspect-ratio: var(--omjer); object-fit: cover; }
.ofp-slika--okvir img { border: 6px solid #fff; box-shadow: 0 6px 22px rgba(43, 27, 19, .18); box-sizing: border-box; }
.ofp-slika figcaption { margin-top: 10px; font-family: var(--of-font-naslov); font-style: italic; font-size: 14px; color: var(--b-pod, #6b5646); }

.ofp-nsl { margin: 0 0 14px; font-family: var(--of-font-naslov); font-size: 26px; color: var(--b-naslov, var(--of-tekst)); }
.ofp-sadrzaj { font-size: 17px; line-height: 1.75; color: var(--b-tekst, var(--of-tekst)); }
.ofp-sadrzaj > :first-child { margin-top: 0; }
.ofp-sadrzaj h2, .ofp-sadrzaj h3 { font-family: var(--of-font-naslov); color: var(--b-naslov, var(--of-tekst)); margin: 1.4em 0 .5em; }
.ofp-sadrzaj img { max-width: 100%; height: auto; border-radius: 3px; }
.ofp-sadrzaj blockquote { margin: 1.5em 0; padding: 14px 22px; border-left: 3px solid var(--of-zelena); background: rgba(255, 255, 255, .55); font-family: var(--of-font-naslov); font-style: italic; }
.ofp-odlomak { margin: 0 0 18px; font-size: 16.5px; line-height: 1.7; color: color-mix(in srgb, var(--of-tekst) 85%, transparent); }
.ofp-odlomak p { margin: 0 0 .7em; }

.ofp-meta { display: flex; flex-wrap: wrap; gap: 6px 20px; margin: 0 0 20px; padding: 10px 0; border-top: 1px dashed #dccbb0; border-bottom: 1px dashed #dccbb0; font-size: 14px; color: color-mix(in srgb, var(--of-tekst) 70%, transparent); }
.ofp-meta span { display: inline-flex; align-items: center; gap: 6px; }
.ofp-meta svg { color: var(--of-zelena); flex: 0 0 auto; }
.ofp-meta a { color: inherit !important; text-decoration: none; }
.ofp-meta a:hover { color: var(--of-zelena) !important; }

.ofp-oznake { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 18px 0; }
.ofp-oznake strong { font-family: var(--of-font-naslov); margin-right: 4px; }
.ofp-oznake a { padding: 5px 12px; border-radius: 3px; background: #fff; border: 1px solid #e3d2b5; font-size: 13px; color: var(--of-tekst) !important; text-decoration: none !important; transition: background .2s, color .2s; }
.ofp-oznake a:hover { background: var(--of-zelena); border-color: var(--of-zelena); color: #fff !important; }

.ofp-dijeli { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 18px 0; }
.ofp-dijeli strong { font-family: var(--of-font-naslov); margin-right: 4px; }
.ofp-dijeli a { display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: var(--of-zelena-svijetla, #ead3a6); color: var(--of-tekst) !important; transition: background .2s, color .2s, transform .2s; }
.ofp-dijeli a:hover, .ofp-dijeli a.is-kopirano { background: var(--of-zelena); color: #fff !important; transform: translateY(-2px); }

.ofp-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 28px 0; }
.ofp-nav a { display: flex; align-items: center; gap: 12px; padding: 12px; background: #fff; border-radius: 6px; text-decoration: none !important; box-shadow: 0 2px 10px rgba(43, 27, 19, .08); transition: box-shadow .2s; }
.ofp-nav a:hover { box-shadow: 0 6px 18px rgba(43, 27, 19, .16); }
.ofp-nav-sl { flex-direction: row-reverse; text-align: right; }
.ofp-nav img { width: 64px; height: 64px; object-fit: cover; border-radius: 4px; flex: 0 0 auto; }
.ofp-nav small { display: block; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--of-zelena); }
.ofp-nav strong { font-family: var(--of-font-naslov); font-size: 15px; color: var(--of-tekst); line-height: 1.3; }
@media (max-width: 600px) { .ofp-nav { grid-template-columns: 1fr; } }

.ofp-komentari { margin-top: 32px; }
.ofp-komentari .comment-respond { padding: 22px; background: #fff; border-radius: 6px; box-shadow: 0 2px 10px rgba(43, 27, 19, .08); }
.ofp-komentari h2, .ofp-komentari h3 { font-family: var(--of-font-naslov); }

.ofp-mrvice { margin: 0 0 14px; font-size: 13px; letter-spacing: .04em; color: color-mix(in srgb, var(--of-tekst) 65%, transparent); }
.ofp-mrvice a { color: inherit !important; text-decoration: none; }
.ofp-mrvice a:hover { color: var(--of-zelena) !important; }
.ofp-mrvice > span[aria-hidden] { margin: 0 8px; }

/* bočna kolona (objava) */
.ofp-bocna { display: grid; gap: 22px; position: sticky; top: 110px; }
.ofp-kutija { padding: 20px; background: #fff; border-radius: 6px; box-shadow: 0 2px 4px rgba(43, 27, 19, .06), 0 8px 22px rgba(43, 27, 19, .1); }
.ofp-kutija h3 { margin: 0 0 14px; padding: 0 0 10px; border-bottom: 2px solid var(--of-zelena-svijetla, #ead3a6); font-family: var(--of-font-naslov); font-size: 19px; color: var(--of-tekst); }
.ofp-kutija .of-shop-kategorije { margin: 0 !important; }
.ofp-kutija .ofp-oznake { margin: 0; }
.ofp-trazi { display: flex; border: 1px solid #d9cbb4; border-radius: 4px; overflow: hidden; background: #fffdf9; }
.ofp-trazi input { flex: 1; min-width: 0; padding: 10px 12px; border: 0; background: none; font: inherit; }
.ofp-trazi button { padding: 0 14px; border: 0; background: var(--of-zelena); color: #fff; cursor: pointer; }
.ofp-najnovije { margin: 0; padding: 0; list-style: none; display: grid; gap: 12px; }
.ofp-najnovije li { margin: 0; padding: 0; }
.ofp-najnovije a { display: flex; gap: 12px; align-items: center; text-decoration: none !important; }
.ofp-najnovije img, .ofp-najnovije .of-kt-bez { width: 64px; height: 64px; object-fit: cover; border-radius: 4px; flex: 0 0 auto; }
.ofp-najnovije strong { display: block; font-family: var(--of-font-naslov); font-size: 14.5px; line-height: 1.35; color: var(--of-tekst); }
.ofp-najnovije a:hover strong { color: var(--of-zelena); }
.ofp-najnovije small { font-size: 12px; color: color-mix(in srgb, var(--of-tekst) 55%, transparent); }
@media (max-width: 980px) { .ofp-bocna { position: static; } }

/* artikal: cijena, dostava */
.ofp-cijena { margin: 0 0 16px; }
.ofp-cijena .price { margin: 0 !important; font-size: 28px !important; font-weight: 700; color: var(--of-zelena) !important; }
.ofp-cijena del { opacity: .55; font-size: .7em; margin-right: 8px; }
.ofp-cijena ins { text-decoration: none; }
.ofp-cijena .woocommerce-product-rating { margin-bottom: 6px; }
.ofp-cijena > strong { display: inline-block; margin-right: 14px; font-size: 28px; color: var(--of-zelena); }
.ofp-cijena .of-dugme { margin-top: 14px; display: table; }
.ofp-dost { display: inline-block; padding: 3px 10px; border-radius: 3px; font-size: 13px; font-weight: 600; background: #e3f2dc; color: #2f6b20; vertical-align: middle; }
.ofp-dost--nema, .ofp-dost--rasprodano { background: #f6dede; color: #a31d1d; }
.ofp-dostava { margin: 4px 0 18px; padding: 16px 18px; background: #fff; border-radius: 6px; box-shadow: 0 2px 10px rgba(43, 27, 19, .08); }
.ofp-dostava .of-dostava-traka { margin: 0 0 12px; }
.ofp-dostava ul { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ofp-dostava li { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 14.5px; color: var(--of-tekst); }
.ofp-dostava li > span { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: color-mix(in srgb, var(--of-zelena) 10%, transparent); color: var(--of-zelena); flex: 0 0 auto; }
.of-sab-woo .product_meta { font-size: 13px; color: color-mix(in srgb, var(--of-tekst) 65%, transparent); }
.of-sab-woo .product_meta > span { display: block; margin-bottom: 4px; }
.of-sab-woo .product_meta a { color: var(--of-zelena); }

/* recept u šablonu: sastojci ne trebaju lijepljivi okvir tabele recepta */
.of-sablon .of-rcp--info .of-rcp-meta { color: var(--of-tekst); }
.of-sablon .of-rcp-sastojci { position: sticky; top: 110px; }
@media (max-width: 980px) { .of-sablon .of-rcp-sastojci { position: static; } }

/* forma za komentar */
.ofp-komentari .comment-form { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; }
.ofp-komentari .comment-form > p { margin: 0; grid-column: 1 / -1; }
.ofp-komentari .comment-form-author, .ofp-komentari .comment-form-email { grid-column: auto !important; }
.ofp-komentari .comment-form label { display: block; margin-bottom: 4px; font-size: 14px; color: var(--of-tekst); }
.ofp-komentari .comment-form input[type=text], .ofp-komentari .comment-form input[type=email], .ofp-komentari .comment-form input[type=url], .ofp-komentari .comment-form textarea {
	width: 100%; box-sizing: border-box; padding: 10px 12px; border: 1px solid #d9cbb4; border-radius: 4px; background: #fffdf9; font: inherit;
}
.ofp-komentari .comment-form textarea { min-height: 130px; }
.ofp-komentari .comment-form-cookies-consent { display: flex; gap: 8px; align-items: center; font-size: 13px; }
.ofp-komentari .comment-form-cookies-consent label { margin: 0; }
.ofp-komentari .form-submit input[type=submit] { padding: 12px 26px; border: 0; border-radius: var(--of-dugme-radius, 4px); background: var(--of-zelena); color: #fff; font-weight: 700; cursor: pointer; }
.ofp-komentari .comment-list { margin: 0 0 24px; padding: 0; list-style: none; }
.ofp-komentari .comment-body { margin-bottom: 14px; padding: 16px; background: #fff; border-radius: 6px; }
@media (max-width: 600px) { .ofp-komentari .comment-form { grid-template-columns: 1fr; } }
