:root{
  --brand:#3e5962;
  --orange:#FF9C00;
  --red:#E62E2E;
}

/* wrapper */
.pbc-bulk-buy{display:flex;flex-direction:column;gap:18px}

/* card */
.pbc-row{
  background:#fff;
  border:2px solid var(--brand);
  border-radius:18px;
  padding:14px;
  display:grid;
  grid-template-columns:120px 1fr;
  gap:14px;
}

.pbc-img-link{display:block}
.pbc-img img{width:100%;height:auto;display:block;border-radius:14px}

/* head */
.pbc-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.pbc-title{min-width:0;flex:1}
.pbc-title a{color:#111;text-decoration:none;font-weight:900;font-size:18px;line-height:1.5}

/* badge */
.pbc-badge-slot{display:flex;align-items:center}
.pbc-badge-img{display:block;height:34px;width:auto}

/* subtitle */
.pbc-subtitle{margin-top:4px;font-size:13px;color:#000;line-height:1.7;text-align:justify}
.pbc-read-more{display:none;margin-right:6px;color:var(--brand);font-weight:900;text-decoration:none}

/* controls */
.pbc-controls{display:flex;flex-direction:column;gap:10px;margin-top:6px}

/* Make discount and qty bars start from same point and have identical length */
.pbc-discount-scale,
.pbc-qty-box{
  width:100%;
  display:grid;
  grid-template-columns:44px 1fr 44px;
  column-gap:10px;
  align-items:center;
}

.pbc-discount-scale{direction:rtl}

/* discount scale */
.pbc-disc-min,.pbc-disc-max{
  font-size:12px;font-weight:900;color:var(--brand);white-space:nowrap;text-align:center;
}
.pbc-disc-bar{
  position:relative;height:8px;border-radius:999px;background:rgba(62,89,98,.18);
  overflow:visible;
}
.pbc-disc-fill{
  position:absolute;top:0;bottom:0;right:0;width:0%;
  background:var(--brand);border-radius:999px;
}

/* taller red pill for percent */
.pbc-disc-bubble{
  position:absolute;top:50%;transform:translateY(-50%);
  background:var(--red);color:#fff;padding:4px 10px;border-radius:999px;
  font-weight:900;font-size:12px;line-height:1;white-space:nowrap;
  box-shadow:0 2px 6px rgba(0,0,0,.18);
  height:24px;display:flex;align-items:center;justify-content:center;
}

/* qty box */
.pbc-qty-box .max,.pbc-qty-box .pbc-current{
  background:var(--brand);color:#fff;padding:4px 10px;border-radius:10px;
  font-size:12px;font-weight:800;min-width:44px;text-align:center;
}
.pbc-range{width:100%;accent-color:var(--brand);margin:0}

/* bottom row */
.pbc-bottom{
  display:flex;align-items:stretch;justify-content:space-between;
  gap:12px;flex-wrap:wrap;
}

.pbc-total{
  background:var(--orange);border-radius:14px;padding:10px 12px;
  display:flex;align-items:center;gap:8px;
  box-shadow:0 2px 6px rgba(0,0,0,.10);
  white-space:nowrap;
}
.pbc-total-label{font-weight:900;color:#111;font-size:13px}
.pbc-total-price{font-weight:900;color:#111;font-size:14px}

.pbc-savings{
  display:flex;align-items:center;gap:8px;white-space:nowrap;
  font-weight:900;color:#111;
}
.pbc-savings-label{font-size:12px;color:#111}
.pbc-savings-price{font-size:12px;color:#111}

/* buttons */
.pbc-actions{display:flex;align-items:stretch;gap:10px;margin-right:auto;flex-wrap:wrap}
.pbc-btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:10px 14px;border-radius:14px;text-decoration:none;
  font-weight:900;font-size:14px;white-space:nowrap;
  box-shadow:0 2px 7px rgba(0,0,0,.14);
}
.pbc-btn-brand{background:var(--brand);color:#fff !important}
.pbc-btn-outline{
  background:transparent;color:var(--brand) !important;border:2px solid var(--brand);
  box-shadow:0 2px 7px rgba(0,0,0,.10);
}
.pbc-btn-text-mobile{display:none}
.pbc-btn-text-desktop{display:inline}

/* Mobile */
@media (max-width: 640px){
  .pbc-row{grid-template-columns:92px 1fr;padding:12px;border-radius:14px;gap:10px;box-sizing:border-box}
  .pbc-title a{font-size:12.5px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .pbc-badge-img{height:17px}
  .pbc-subtitle{font-size:11.5px;line-height:1.65;color:#000;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
  .pbc-read-more{display:inline-block}

  .pbc-discount-scale,.pbc-qty-box{grid-template-columns:34px 1fr 34px;column-gap:8px}

  .pbc-disc-min,.pbc-disc-max{font-size:11px}
  .pbc-disc-bar{height:7px}
  .pbc-disc-bubble{font-size:10px;padding:3px 8px;height:22px}

  .pbc-qty-box .max,.pbc-qty-box .pbc-current{font-size:10.5px;padding:3px 7px;min-width:34px;border-radius:9px}

  .pbc-total{padding:8px 10px;border-radius:12px;min-height:40px}
  .pbc-total-label{font-size:11px}
  .pbc-total-price{font-size:11.5px}
  .pbc-savings-label,.pbc-savings-price{font-size:11px}

  .pbc-btn{padding:8px 10px;border-radius:12px;font-size:12px;min-height:40px;box-shadow:0 2px 6px rgba(0,0,0,.12)}
  .pbc-btn-text-desktop{display:none}
  .pbc-btn-text-mobile{display:inline}

  .pbc-main{padding-inline:4px;box-sizing:border-box}
  .pbc-controls{padding-inline:2px;box-sizing:border-box}

}

/* Modal (bulk order form) */
.pbc-modal{position:fixed;inset:0;z-index:999999;display:none;align-items:center;justify-content:center;padding:16px}
.pbc-modal.is-open{display:flex}
.pbc-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55)}
.pbc-modal__panel{position:relative;background:#fff;border-radius:16px;max-width:520px;width:100%;box-shadow:0 18px 60px rgba(0,0,0,.35);padding:16px 16px 14px}
.pbc-modal__close{position:absolute;top:10px;left:10px;border:0;background:transparent;font-size:20px;line-height:1;cursor:pointer}
.pbc-modal__title{font-size:16px;font-weight:700;margin:0 0 8px}
.pbc-modal__meta{font-size:13px;line-height:1.6;margin:0 0 10px;color:#1e1e1e}
.pbc-modal__grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.pbc-modal__field label{display:block;font-size:12px;margin:0 0 6px;color:#333}
.pbc-modal__field input{width:100%;border:1px solid #d6d6d6;border-radius:12px;padding:10px 12px;font-size:13px;outline:0}
.pbc-modal__actions{display:flex;gap:10px;justify-content:flex-end;margin-top:12px}
.pbc-modal__btn{border:0;border-radius:12px;padding:10px 14px;font-size:13px;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.pbc-modal__btn--primary{background:#3E5962;color:#fff}
.pbc-modal__btn--ghost{background:#f3f5f6;color:#111}
.pbc-modal__success{display:none;text-align:center;padding:10px 6px}
.pbc-modal__success p{margin:0 0 12px;line-height:1.8;color:#111}

@media (max-width:640px){
  .pbc-modal__panel{border-radius:14px;padding:14px}
  .pbc-modal__grid{grid-template-columns:1fr}
}


/* ===== Modal form (order request) polish ===== */
.pbc-modal__summary{display:flex;gap:12px;align-items:flex-start;margin:10px 0 12px}
.pbc-modal__product{font-weight:700;color:#111;line-height:1.6}
.pbc-modal__meta{display:grid;gap:6px;font-size:13px;color:#111}
.pbc-modal__meta span{color:#555;font-weight:600;margin-left:4px}
.pbc-modal__meta strong{font-weight:900;color:#111}

#pbc-order-form{margin-top:6px}
#pbc-order-form .pbc-field{display:block;margin:0 0 10px}
#pbc-order-form .pbc-field span{display:block;font-size:12px;font-weight:700;color:#333;margin:0 0 6px}
#pbc-order-form .pbc-field input{
  width:100%;
  border:1px solid #d6dde0;
  background:#fafbfb;
  border-radius:12px;
  padding:11px 12px;
  font-size:13px;
  outline:0;
  transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
  box-sizing:border-box;
}
#pbc-order-form .pbc-field input:focus{
  border-color: var(--brand);
  background:#fff;
  box-shadow: 0 0 0 3px rgba(62,89,98,.14);
}
#pbc-order-form .pbc-modal__actions{margin-top:12px;justify-content:flex-end}
#pbc-order-form .pbc-modal__actions .pbc-btn{min-height:44px}

.pbc-modal__success{padding:14px 6px;text-align:center}
.pbc-modal__success p{font-size:14px;font-weight:700;color:#111;margin:0 0 12px;line-height:1.9}

@media (max-width:640px){
  .pbc-modal__panel{width:100%;max-width:420px}
  .pbc-modal__summary{flex-direction:column;gap:8px}
  #pbc-order-form .pbc-modal__actions{justify-content:stretch}
  #pbc-order-form .pbc-modal__actions .pbc-btn{width:100%}
}


/* Modal summary extras */
.pbc-modal__summary{direction:rtl;text-align:right}
.pbc-modal__meta div{justify-content:space-between;gap:10px}
.pbc-modal__disc_amount{font-size:12px;color:#111;font-weight:700}



/* ===== Success modal modern styling ===== */
.pbc-modal__success{
  background:#f6faf8;
  border:1px solid #d9ebe4;
  border-radius:16px;
  padding:16px 14px;
  margin-top:14px;
  text-align:right;
}

.pbc-modal__success-text{
  background:#3e5962; /* brand */
  color:#fff;
  border-radius:12px;
  padding:14px 12px;
  font-size:14px;
  font-weight:800;
  line-height:1.9;
  margin-bottom:14px;
}

.pbc-modal__success .pbc-btn{
  width:100%;
  border-radius:14px;
  font-weight:800;
}

/* Order summary boxed */
.pbc-modal__summary{
  border:1px solid #e3e8ea;
  background:#fafbfb;
  border-radius:16px;
  padding:12px 14px;
}

.pbc-modal__meta{
  background:#fff;
  border-radius:14px;
  padding:10px 12px;
}

/* Mobile refinements */
@media (max-width:640px){
  .pbc-modal__success-text{
    font-size:13px;
    padding:12px 10px;
  }
}

/* Mobile: make the whole card 1-column so controls take full width */
@media (max-width: 640px){

  /* کارت تک‌ستونه شود */
  .pbc-row{
    grid-template-columns: 1fr !important;
  }

  /* تصویر و محتوا هر دو تمام‌عرض */
  .pbc-row .pbc-img,
  .pbc-row .pbc-main{
    width: 100% !important;
  }

  /* کنترل‌ها هم تمام عرض */
  .pbc-row .pbc-controls{
    width: 100% !important;
    max-width: 100% !important;
  }
}

