/* Base layout */
.bpc { display: grid; gap: 24px; }
.bpc-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(0, 4fr);
  grid-template-columns: minmax(220px, calc(var(--bpc-left,1) * 1fr)) minmax(0, calc(var(--bpc-right,4) * 1fr));
  align-items: stretch;
  border: 1px solid #eee;
  border-radius: 14px;
  padding: 14px;
  background:#fff;
  box-shadow: 0 4px 14px rgba(0,0,0,.04);
}

.bpc-left { display:flex; align-items:center; justify-content:center; border-right:1px solid #f1f1f1; padding-right:14px; }
.bpc-left-inner { width:100%; display:grid; gap:12px; align-content:center; justify-items:center; }
.bpc-logo img { width: var(--bpc-logo,140px); height: var(--bpc-logo,140px); object-fit:contain; border-radius:50%; }
.bpc-logo--placeholder { width: var(--bpc-logo,140px); height: var(--bpc-logo,140px); display:flex; align-items:center; justify-content:center; background:#fafafa; border-radius:50%; font-weight:600; }

.bpc-banner { width:100%; max-width: 360px; height: var(--bpc-banner-h,220px); overflow:hidden; border-radius:10px; border:1px solid #eee; background:#fff; }

/* Product side */
.bpc-right { position:relative; padding-left:14px; }
.bpc-brand-title { font-size: 1.125rem; font-weight: 700; margin-bottom: 8px; }

.bpc-products { position:relative; }
.rail { --gap: 12px; overflow:hidden; }
.rail-track { display:flex; gap: var(--gap); will-change: transform; }
.rail-item { flex: 0 0 auto; }

.bpc-product { width: calc((100% - var(--gap) * (var(--bpc-view,4)-1)) / var(--bpc-view,4)); border:1px solid #eee; border-radius:12px; padding:10px; background:#fff; display:flex; flex-direction:column; justify-content:flex-start; }
.bpc-thumb img { width:100%; height: 150px; object-fit:contain; }
.bpc-title { display:block; margin-top:8px; font-size:.95rem; line-height:1.3; text-decoration:none; color:#222; }
.bpc-price { margin-top:6px; font-weight:700; font-size: 1rem; }
.bpc-sale { color: var(--bpc-sale, #d32f2f); margin-right:8px; }
.bpc-regular { color: var(--bpc-regular, #9e9e9e); font-weight:500; }

.bpc-prev, .bpc-next {
  position:absolute; top:50%; transform:translateY(-50%);
  border:none; background:#000; color:#fff; padding:8px 10px; border-radius:8px; opacity:.7; cursor:pointer;
}
.bpc-prev { left: 6px; } .bpc-next { right: 6px; }
.bpc-prev:hover, .bpc-next:hover { opacity:1; }

.bpc-empty { padding:12px; color:#888; }

@media (max-width: 992px) {
  .bpc-row { grid-template-columns: 1fr; }
  .bpc-left { border-right:none; border-bottom:1px solid #f1f1f1; padding-bottom:14px; margin-bottom:14px;}
  .bpc-product .bpc-thumb img { height: 120px; }
}