/* === Linkovi "Dostupni štofovi" na single proizvodu === */
.bro-stof-available{border:1px solid #e5e7eb;padding:12px;margin:18px 0;border-radius:12px;background:#fff}
.bro-stof-label{font-weight:600;margin:0 0 8px}
.bro-stof-fabric-list{display:flex;flex-wrap:wrap;gap:8px}
.bro-stof-fabric-list .chip{display:flex;align-items:center;gap:8px;border:1px solid #e5e7eb;border-radius:999px;padding:8px 12px;text-decoration:none;background:#fafafa;transition:background .15s, box-shadow .15s}
.bro-stof-fabric-list .chip img{width:22px;height:22px;border-radius:4px;object-fit:cover}
.bro-stof-fabric-list .chip:hover{background:#f3f4f6;box-shadow:0 1px 0 rgba(0,0,0,.03)}

/* === Single Stof === */
.bro-stof-public{max-width:1200px;margin:24px auto;padding:0 12px}
.bro-stof-title{display:flex;align-items:baseline;gap:8px;margin:0 0 12px}
.bro-stof-title .code{color:#6b7280;font-weight:400}

.bro-stof-layout{display:grid;grid-template-columns:1fr 280px;gap:20px}
.bro-stof-layout .viewer{border:1px solid #e5e7eb;border-radius:16px;overflow:hidden;background:#fff;display:flex;align-items:center;justify-content:center;min-height:520px}
.bro-stof-layout .viewer img{width:100%;height:auto;display:block} /* normalizacija širine uvek 100% */

/* Varijante — 3 u redu + naziv ispod */
.variants .v-label{font-weight:600;margin-bottom:8px}
.variants .v-grid{display:grid;grid-template-columns:repeat(3, 1fr);gap:10px}
.v-swatch{border:1px solid #e5e7eb;border-radius:12px;background:#fff;cursor:pointer;padding:8px;text-align:center;transition:box-shadow .15s, transform .06s}
.v-swatch:hover{box-shadow:0 0 0 2px rgba(0,0,0,.04)}
.v-swatch:active{transform:scale(.98)}
.v-swatch.selected{outline:2px solid #111;outline-offset:0;border-color:#111}
.v-swatch .thumb{width:100%;aspect-ratio:1/1;border-radius:8px;overflow:hidden;border:1px solid #eee}
.v-swatch .thumb img{width:100%;height:100%;object-fit:cover;display:block}
.v-swatch .v-name{font-size:12px;color:#4b5563;margin-top:6px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

@media (max-width: 980px){
  .bro-stof-layout{grid-template-columns:1fr}
  .variants .v-grid{grid-template-columns:repeat(3, 1fr)}
}

/* (opciono) Archive */
.bro-stof-archive{max-width:1200px;margin:24px auto;padding:0 12px}
.bro-stof-archive-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.bro-stof-archive-card{display:block;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden;background:#fff;text-decoration:none}
.bro-stof-archive-card .thumb img{width:100%;height:200px;object-fit:cover;display:block}
.bro-stof-archive-card .title{padding:10px;font-weight:600;color:#111}
/* ===== Proizvodi dostupni u ovom štofu ===== */
.bro-stof-related{margin-top:28px}
.bro-stof-related-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px
}
.bro-stof-related-head h2{margin:0;font-size:20px}
.bro-stof-related .view-all{
  text-decoration:none;border:1px solid #e5e7eb;border-radius:10px;padding:8px 12px;background:#fff
}
.bro-stof-related .view-all:hover{background:#f8f9fb}

/* Fallback grid (ako Woo loop nije dostupan) */
.bro-stof-fallback-grid{
  display:grid;grid-template-columns:repeat(auto-fill, minmax(200px,1fr));gap:16px
}
.bro-stof-fallback-grid .fallback-card{
  display:block;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden;background:#fff;text-decoration:none;padding-bottom:8px
}
.bro-stof-fallback-grid .fallback-card img{width:100%;height:220px;object-fit:cover;display:block}
.bro-stof-fallback-grid .fallback-card .ttl{padding:10px 10px 0;font-weight:600;color:#111}
.bro-stof-fallback-grid .fallback-card .price{padding:4px 10px 10px;color:#111}