.product-detail-wrap { min-height: calc(100vh - 140px); }
.product-main-card { border: 1px solid rgba(15, 23, 42, .06) !important; }
.product-main-img-wrap, .product-no-img-detail { height: 480px; min-height: 320px; background: linear-gradient(135deg, #f8fbff, #eef7ff); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.product-main-img-wrap img { width: 100%; height: 100%; object-fit: cover; }
.product-no-img-detail { color: #0d6efd; flex-direction: column; }
.product-no-img-detail i { font-size: 4.5rem; opacity: .88; }
.product-no-img-detail span { margin-top: .5rem; color: #64748b; }
.product-thumb { width: 74px; height: 74px; border: 1px solid rgba(13, 110, 253, .18); background: #fff; cursor: pointer; overflow: hidden; padding: 2px; }
.product-thumb.active { border-color: #0d6efd; box-shadow: 0 0 0 .15rem rgba(13, 110, 253, .14); }
.product-thumb img { width: 100%; height: 100%; object-fit: cover; }
.price-box { background: linear-gradient(135deg, #eff6ff, #fff); border: 1px solid rgba(13, 110, 253, .08); }
.qty-input { max-width: 120px; }
.product-desc { line-height: 1.75; }
.variant-option-grid, .quote-variant-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(138px, 1fr)); gap: .65rem; }
.variant-outline-btn, .quote-variant-btn { border: 1px solid rgba(13, 110, 253, .35); background: #fff; color: #0d6efd; border-radius:.25rem; padding: .55rem; text-align: left; width: 100%; transition: .16s ease; min-height: 76px; }
.variant-outline-btn:hover, .quote-variant-btn:hover { border-color: #0d6efd; background: #f3f8ff; transform: translateY(-1px); }
.variant-outline-btn.active, .quote-variant-btn.active { border-color: #0d6efd; background: linear-gradient(135deg, #eaf3ff, #fff); box-shadow: 0 0 0 .16rem rgba(13, 110, 253, .15); }
.variant-outline-img { width: 42px; height: 42px; border-radius:.25rem; object-fit: cover; border: 1px solid #e5e7eb; background: #f8fafc; flex: 0 0 auto; }
.variant-outline-no-img { width: 42px; height: 42px; border-radius:.25rem; border: 1px solid #e5e7eb; background: #f8fafc; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; color: #0d6efd; }
.product-video-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: .75rem; }
.product-video-box { background: #fff; border: 1px solid #e5e7eb; border-radius:.25rem; overflow: hidden; }
.product-video-box video, .product-video-box iframe { width: 100%; aspect-ratio: 16 / 9; display: block; border: 0; background: #000; }
.quote-modal-header { background: linear-gradient(135deg, #fff7ed, #fff); border-bottom: 1px solid rgba(255, 87, 34, .12); }
.quote-title { color: #ff5722; }
.captcha-box { display: inline-flex; align-items: center; min-height: 34px; padding: .35rem .8rem; background: linear-gradient(135deg, #6f42c1, #5b2fc0); color: #fff; font-weight: 800; letter-spacing: .04em; border-radius:.25rem; user-select: none; transition: .2s ease; }
.captcha-box.captcha-refreshing { transform: scale(1.04); box-shadow: 0 .35rem 1rem rgba(111, 66, 193, .25); }
.captcha-hint { display: inline-flex; align-items: center; padding: .25rem .55rem; border-radius:.25rem; background: #ffc107; color: #111827; font-size: .78rem; font-weight: 700; }
.variant-hint { background: #f8fafc; border: 1px dashed #cbd5e1; }
.quote-summary-box { background: linear-gradient(135deg, #eff6ff, #fff); border: 1px solid rgba(13, 110, 253, .12); }
.quote-address-card,.quote-tax-card{background:linear-gradient(135deg,#f8fbff 0%,#fff 100%);border-color:#dbeafe!important}.quote-zipcode-box{border-color:#e5e7eb!important}.quote-address-card .input-group-text,.quote-tax-card .input-group-text{background:#f8fbff;color:#0d6efd}.quote-tax-card.is-active{border-color:#bcd3ff!important;box-shadow:0 .35rem 1rem rgba(13,110,253,.06)}#quoteZipStatus.text-success{color:#198754!important}#quoteZipStatus.text-danger{color:#dc3545!important}@media(max-width:575.98px){.quote-address-card,.quote-tax-card,.quote-zipcode-box{padding:.75rem!important}.quote-zipcode-box .input-group-text{min-width:42px;justify-content:center}}
.wholesale-pill { display: inline-flex; align-items: center; gap: .25rem; border-radius:.25rem; padding: .2rem .5rem; background: #e8fff3; color: #198754; font-size: .78rem; font-weight: 700; }
#mainWholesaleHint.text-success { font-weight: 700; }
#mainTotalWrap { background: rgba(25, 135, 84, .04); border-radius:.25rem; padding-left: .25rem; padding-right: .25rem; }
.review-star { color: #ffc107; letter-spacing: .06em; }
.review-card { border: 1px solid #e5e7eb; border-radius:.25rem; background: #fff; }
.review-form-card { background: linear-gradient(135deg, #f8fbff, #ffffff); border: 1px solid rgba(13, 110, 253, .12); }
.rating-choice { display: flex; flex-direction: row-reverse; justify-content: flex-end; gap: .35rem; }
.rating-choice input { display: none; }
.rating-choice label { font-size: 1.6rem; color: #cbd5e1; cursor: pointer; transition: .15s ease; }
.rating-choice label:hover, .rating-choice label:hover ~ label, .rating-choice input:checked ~ label { color: #ffc107; transform: translateY(-1px); }
.review-image-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(82px, 1fr)); gap: .5rem; }
.review-image-grid img { width: 100%; height: 82px; object-fit: cover; border-radius:.25rem; border: 1px solid #e5e7eb; background: #f8fafc; }
.review-upload-preview { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: .5rem; }
.review-upload-preview img { width: 100%; height: 72px; object-fit: cover; border-radius:.25rem; border: 1px solid #dbeafe; }
.review-video-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: .5rem; }
.review-video-grid video { width: 100%; aspect-ratio: 16 / 9; border-radius:.25rem; border: 1px solid #e5e7eb; background: #000; }
.review-right-box { background: linear-gradient(135deg, #eff6ff, #ffffff); border: 1px dashed rgba(13, 110, 253, .28); border-radius:.25rem; }
.product-action-grid { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: .5rem; align-items: start; }
.product-action-grid .qty-input { width: 100%; max-width: 104px; height: 44px; font-weight: 800; text-align: center; }
.product-action-grid .btn { min-height: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; }
.product-action-hint { grid-column: 1 / -1; margin-top: -.2rem; }
.product-mini-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.product-mini-actions .btn { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; }
.review-order-status{border:1px solid #e2e8f0;background:#f8fafc;border-radius:.25rem;padding:.55rem .7rem;line-height:1.45}
.review-order-status.is-checking{border-color:#bfdbfe;background:#eff6ff;color:#1d4ed8}
.review-order-status.is-ok{border-color:#a7f3d0;background:#ecfdf5;color:#047857;font-weight:700}
.review-order-status.is-warning{border-color:#fed7aa;background:#fff7ed;color:#b45309;font-weight:700}
.review-order-status.is-danger{border-color:#fecaca;background:#fef2f2;color:#b91c1c;font-weight:700}
.review-right-box { transition: .16s ease; }
.review-order-fields.is-hidden { display: none; }
.review-submit-row { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.review-submit-row .btn { min-height: 42px; font-weight: 800; }
.review-upload-preview video { width: 100%; height: 72px; object-fit: cover; border-radius:.25rem; border: 1px solid #dbeafe; background: #000; }

/* ===== Premium review trust section ===== */
.review-trust-section{border:1px solid #dbeafe;background:linear-gradient(135deg,#f8fbff 0%,#ffffff 100%);border-radius:.5rem;padding:1rem;box-shadow:0 .45rem 1.05rem rgba(15,23,42,.045)}
.review-trust-head{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:.85rem;margin-bottom:1rem}
.review-trust-title{font-weight:900;color:#0f172a;letter-spacing:-.02em;margin:0}
.review-trust-subtitle{color:#64748b;font-size:.92rem;line-height:1.55;margin-top:.18rem}
.review-score-card{border:1px solid #bfdbfe;background:#ffffff;border-radius:.5rem;padding:1rem;height:100%;box-shadow:0 .35rem .9rem rgba(15,23,42,.035)}
.review-score-number{font-size:2.35rem;line-height:1;font-weight:950;color:#0d6efd;letter-spacing:-.04em}
.review-score-stars{color:#ffc107;font-size:1.1rem;letter-spacing:.04em;white-space:nowrap}
.review-trust-badges{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}
.review-trust-badge{display:flex;align-items:center;gap:.45rem;border:1px solid #e2e8f0;background:#fff;border-radius:.45rem;padding:.55rem .65rem;color:#0f172a;font-weight:800;font-size:.86rem;min-height:42px}
.review-trust-badge i{color:#0d6efd;font-size:1rem}
.review-rating-row{display:grid;grid-template-columns:42px minmax(0,1fr) 42px;gap:.5rem;align-items:center;font-size:.82rem;color:#64748b;margin:.28rem 0}
.review-rating-track{height:8px;background:#eef2f7;border-radius:999px;overflow:hidden}
.review-rating-bar{height:100%;background:linear-gradient(90deg,#ffc107,#ffda6a);border-radius:999px}
.review-list-modern{display:grid;gap:.75rem;margin-top:1rem}
.review-card-modern{border:1px solid #e2e8f0;background:#fff;border-radius:.5rem;padding:.9rem;box-shadow:0 .35rem .9rem rgba(15,23,42,.035)}
.review-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:.75rem;margin-bottom:.55rem}
.review-avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#e0f2fe,#dbeafe);color:#0d6efd;display:inline-flex;align-items:center;justify-content:center;font-weight:950;border:1px solid #bfdbfe;flex:0 0 auto}
.review-avatar-img{width:42px;height:42px;border-radius:50%;object-fit:cover;border:1px solid #bfdbfe;background:#eff6ff;flex:0 0 auto}

/* ===== Review media modal viewer ===== */
.review-media-btn{border:0;background:transparent;padding:0;width:100%;display:block;position:relative;cursor:pointer;border-radius:.25rem;overflow:hidden;text-align:left}
.review-media-btn img{width:100%;height:82px;object-fit:cover;border-radius:.25rem;border:1px solid #e5e7eb;background:#f8fafc;display:block;transition:.16s ease}
.review-media-btn:hover img{transform:scale(1.025);filter:brightness(.92)}
.review-media-btn::after{content:'\F341';font-family:'bootstrap-icons';position:absolute;right:.35rem;top:.35rem;width:28px;height:28px;border-radius:999px;background:rgba(15,23,42,.72);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.9rem;opacity:0;transition:.16s ease}
.review-media-btn:hover::after{opacity:1}
.review-video-thumb{height:120px;background:#000;border:1px solid #e5e7eb;border-radius:.25rem}
.review-video-thumb video{width:100%;height:100%;object-fit:cover;border:0!important;border-radius:.25rem;display:block;pointer-events:none;background:#000}
.review-video-thumb .review-video-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.34));font-weight:900}
.review-video-thumb .review-video-play span{width:46px;height:46px;border-radius:999px;background:rgba(13,110,253,.92);display:inline-flex;align-items:center;justify-content:center;box-shadow:0 .5rem 1.2rem rgba(0,0,0,.28)}
.review-video-thumb .review-video-play i{font-size:1.35rem;margin-left:.1rem}
.review-media-modal .modal-content{border:0;border-radius:.5rem;overflow:hidden;background:#0f172a}
.review-media-modal .modal-header{background:#ffffff;color:#0f172a;border-bottom:1px solid #e2e8f0}
.review-media-modal .modal-body{background:#0f172a;padding:0;min-height:220px;display:flex;align-items:center;justify-content:center}
.review-media-modal-img{width:100%;max-height:82vh;object-fit:contain;background:#0f172a;display:block}
.review-media-modal-video{width:100%;max-height:82vh;background:#000;display:block}
.review-media-open-link{font-size:.82rem;font-weight:800}
@media(max-width:575.98px){.review-media-btn img{height:74px}.review-video-thumb{height:96px}.review-media-modal .modal-dialog{margin:.5rem}.review-media-modal-img,.review-media-modal-video{max-height:76vh}}

.review-customer-name{font-weight:900;color:#0f172a;line-height:1.25}
.review-verified{display:inline-flex;align-items:center;gap:.25rem;background:#ecfdf5;color:#047857;border:1px solid #a7f3d0;border-radius:999px;padding:.15rem .45rem;font-size:.72rem;font-weight:800;margin-top:.22rem}
.review-title-modern{font-weight:900;color:#0f172a;margin:.35rem 0 .15rem}
.review-text-modern{color:#475569;line-height:1.7;word-break:break-word;overflow-wrap:anywhere}
.review-seller-reply-box{margin-top:.75rem;border:1px solid #bfdbfe;background:linear-gradient(135deg,#eff6ff 0%,#f8fafc 100%);border-radius:.5rem;padding:.75rem .85rem;color:#0f172a}
.review-seller-reply-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.35rem;margin-bottom:.35rem}
.review-seller-reply-name{display:inline-flex;align-items:center;gap:.35rem;font-weight:900;color:#1d4ed8}
.review-seller-reply-date{color:#64748b;font-size:.78rem;font-weight:700}
.review-seller-reply-text{color:#334155;line-height:1.7;word-break:break-word;overflow-wrap:anywhere}
.review-media-title{font-size:.78rem;font-weight:900;color:#64748b;margin-top:.75rem;margin-bottom:.35rem}
.review-empty-modern{border:1px dashed #bfdbfe;background:#fff;border-radius:.5rem;padding:1.35rem;text-align:center;color:#64748b}
.review-empty-modern i{font-size:2.4rem;color:#0d6efd;display:block;margin-bottom:.45rem}
.review-pagination-wrap{border-top:1px dashed #dbeafe;margin-top:1rem;padding-top:1rem}
.review-pagination-wrap .pagination{margin-bottom:0;gap:.25rem;flex-wrap:wrap}
.review-pagination-wrap .page-link{border-radius:.25rem!important;font-weight:800;color:#0d6efd;border-color:#dbeafe;min-width:40px;text-align:center}
.review-pagination-wrap .page-item.active .page-link{background:#0d6efd;border-color:#0d6efd;color:#fff;box-shadow:0 .35rem .8rem rgba(13,110,253,.18)}
.review-pagination-wrap .page-item.disabled .page-link{color:#94a3b8;background:#f8fafc}
.review-page-info{color:#64748b;font-size:.86rem;font-weight:700}
@media(max-width:575.98px){.review-trust-section{padding:.85rem}.review-score-number{font-size:2rem}.review-trust-badges{grid-template-columns:1fr}.review-card-head{display:block}.review-score-stars{font-size:.95rem}.review-avatar,.review-avatar-img{width:38px;height:38px}.review-card-modern{padding:.8rem}.review-rating-row{grid-template-columns:38px minmax(0,1fr) 34px}.review-pagination-wrap .page-link{min-width:36px;padding:.35rem .55rem}.review-page-info{width:100%;text-align:center}}


/* ===== Product responsive image carousel ===== */
.product-gallery-card {
  background: #ffffff;
}

.product-image-carousel {
  position: relative;
  background: linear-gradient(135deg, #f8fbff, #eef7ff);
}

.product-image-carousel .carousel-inner {
  border-radius: .25rem;
}

.product-main-img-wrap,
.product-no-img-detail {
  aspect-ratio: 1 / 1;
  height: auto !important;
  min-height: 320px;
}

.product-main-img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #ffffff;
}

.product-gallery-control {
  width: 42px;
  height: 42px;
  top: 50%;
  bottom: auto;
  transform: translateY(-50%);
  opacity: 1;
  z-index: 10;
  border-radius: .25rem;
}

.product-gallery-control.carousel-control-prev {
  left: .65rem;
}

.product-gallery-control.carousel-control-next {
  right: .65rem;
}

.product-gallery-control .carousel-control-prev-icon,
.product-gallery-control .carousel-control-next-icon {
  width: 32px;
  height: 32px;
  border-radius: .25rem;
  background-color: #eff6ff;
  background-size: 56% 56%;
  border: 1px solid #bfdbfe;
  box-shadow: 0 .28rem .75rem rgba(13,110,253,.12);
  filter: none;
}

/* Bootstrap icon default is white SVG, override เป็นลูกศรสีฟ้าพาสเทล */
.product-gallery-control .carousel-control-prev-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230d6efd'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
}

.product-gallery-control .carousel-control-next-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230d6efd'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.product-gallery-control:hover .carousel-control-prev-icon,
.product-gallery-control:hover .carousel-control-next-icon {
  background-color: #dbeafe;
  border-color: #93c5fd;
  box-shadow: 0 .35rem .9rem rgba(13,110,253,.18);
}

.product-gallery-counter {
  position: absolute;
  right: .75rem;
  bottom: .75rem;
  z-index: 12;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  min-height: 28px;
  padding: .18rem .55rem;
  border-radius: .25rem;
  background: rgba(255,255,255,.92);
  color: #0f172a;
  border: 1px solid #dbeafe;
  font-size: .78rem;
  font-weight: 900;
  box-shadow: 0 .25rem .8rem rgba(15,23,42,.08);
}

.product-thumb-scroll {
  display: flex;
  gap: .55rem;
  overflow-x: auto;
  overflow-y: hidden;
  padding: .15rem .15rem .45rem;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}

.product-thumb-scroll::-webkit-scrollbar {
  height: 6px;
}

.product-thumb-scroll::-webkit-scrollbar-thumb {
  background: #bfdbfe;
  border-radius: 999px;
}

.product-thumb {
  flex: 0 0 auto;
  scroll-snap-align: start;
}

@media (max-width: 575.98px) {
  .product-main-img-wrap,
  .product-no-img-detail {
    min-height: 290px;
  }

  .product-gallery-control {
    width: 36px;
    height: 36px;
  }

  .product-gallery-control.carousel-control-prev {
    left: .45rem;
  }

  .product-gallery-control.carousel-control-next {
    right: .45rem;
  }

  .product-gallery-control .carousel-control-prev-icon,
  .product-gallery-control .carousel-control-next-icon {
    width: 28px;
    height: 28px;
  }

  .product-gallery-counter {
    right: .55rem;
    bottom: .55rem;
    min-height: 26px;
    min-width: 44px;
    font-size: .72rem;
  }

  .product-thumb-scroll {
    gap: .45rem;
  }

  .product-thumb {
    width: 62px;
    height: 62px;
  }
}

@media (min-width: 576px) and (max-width: 991.98px) {
  .product-main-img-wrap,
  .product-no-img-detail {
    min-height: 390px;
  }
}

@media (min-width: 992px) {
  .product-main-img-wrap,
  .product-no-img-detail {
    min-height: 420px;
  }
}

@media (max-width: 575.98px) { .product-main-img-wrap, .product-no-img-detail { height: 290px; min-height: 290px; } .product-no-img-detail i { font-size: 3.3rem; } .product-title { font-size: 1.35rem; } .product-price-text { font-size: 1.6rem !important; } .product-thumb { width: 62px; height: 62px; } .variant-option-grid, .quote-variant-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .variant-outline-btn, .quote-variant-btn { min-height: 86px; padding: .45rem; } .product-action-grid { grid-template-columns: 88px minmax(0, 1fr); gap: .45rem; } .product-action-grid .qty-input { max-width: 88px; height: 42px; } .product-action-grid .btn { height: 42px; min-height: 42px; padding-left: .5rem; padding-right: .5rem; } .product-mini-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); } .product-mini-actions .btn { min-height: 38px; font-size: .92rem; } .quote-modal-actions { display: grid !important; grid-template-columns: 1fr; gap: .5rem; } .quote-modal-actions .btn { width: 100%; } }
@media (min-width: 576px) and (max-width: 991.98px) { .product-main-img-wrap, .product-no-img-detail { height: 390px; min-height: 390px; } }

.flash-sale-countdown {
  border: 1px solid rgba(220, 53, 69, .16);
  background: linear-gradient(135deg, #fff5f5, #ffffff);
  padding: .6rem .7rem;
}

.flash-sale-countdown-label {
  color: #64748b;
  font-size: .82rem;
  font-weight: 700;
}

.flash-sale-countdown-value {
  color: #dc3545;
  font-size: 1rem;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.flash-sale-countdown.is-waiting .flash-sale-countdown-value {
  color: #0d6efd;
}

.flash-sale-countdown.is-ended {
  background: #f8fafc;
  border-color: #e5e7eb;
}

.flash-sale-countdown.is-ended .flash-sale-countdown-value {
  color: #64748b;
}

@media (max-width: 575.98px) {
  .flash-sale-countdown {
    padding: .5rem .55rem;
  }

  .flash-sale-countdown-value {
    font-size: .9rem;
  }
}


#quoteFlashHint {
  padding-top: .15rem;
}


/* ===== Variant button size fix ===== */
.variant-option-grid,
.quote-variant-grid {
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important;
  gap: .75rem !important;
}

.variant-outline-btn,
.quote-variant-btn {
  min-height: 150px !important;
  height: auto !important;
  padding: .75rem !important;
  overflow: hidden;
}

.variant-outline-btn .d-flex,
.quote-variant-btn .d-flex {
  align-items: flex-start !important;
}

.variant-outline-img,
.variant-outline-no-img {
  width: 54px !important;
  height: 54px !important;
}

.variant-outline-btn .min-w-0,
.quote-variant-btn .min-w-0 {
  min-width: 0;
  width: 100%;
}

.variant-outline-btn .fw-bold,
.quote-variant-btn .fw-bold {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  line-height: 1.25;
}

.variant-outline-btn .small,
.quote-variant-btn .small {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  line-height: 1.35;
}

.variant-outline-btn .text-danger.fw-bold,
.quote-variant-btn .text-danger.fw-bold {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  flex-wrap: wrap;
  margin-top: .15rem;
}

@media (max-width: 575.98px) {
  .variant-option-grid,
  .quote-variant-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .55rem !important;
  }

  .variant-outline-btn,
  .quote-variant-btn {
    min-height: 168px !important;
    padding: .55rem !important;
  }

  .variant-outline-btn .d-flex,
  .quote-variant-btn .d-flex {
    flex-direction: column;
    align-items: flex-start !important;
    gap: .45rem !important;
  }

  .variant-outline-img,
  .variant-outline-no-img {
    width: 48px !important;
    height: 48px !important;
  }

  .variant-outline-btn .small,
  .quote-variant-btn .small {
    font-size: .78rem;
  }
}

@media (min-width: 576px) and (max-width: 991.98px) {
  .variant-option-grid,
  .quote-variant-grid {
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)) !important;
  }

  .variant-outline-btn,
  .quote-variant-btn {
    min-height: 155px !important;
  }
}


/* ===== Product detail image 1:1 modern layout ===== */
.product-main-img-wrap,
.product-no-img-detail {
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  height: auto !important;
  min-height: unset !important;
  max-height: unset !important;
  border-radius:.25rem;
  background: linear-gradient(135deg, #f8fbff, #eef7ff);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.product-main-img-wrap img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block;
}

.product-no-img-detail {
  color: #0d6efd;
  flex-direction: column;
}

.product-no-img-detail i {
  font-size: 4rem;
  opacity: .88;
}

.product-no-img-detail span {
  margin-top: .5rem;
  color: #64748b;
  font-weight: 700;
}

.product-main-card {
  border-radius:.25rem;
}

.product-thumb {
  width: 72px !important;
  height: 72px !important;
  aspect-ratio: 1 / 1;
  border-radius:.25rem;
}

.product-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block;
}

@media (max-width: 575.98px) {
  .product-main-img-wrap,
  .product-no-img-detail {
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
  }

  .product-no-img-detail i {
    font-size: 3rem;
  }

  .product-thumb {
    width: 58px !important;
    height: 58px !important;
  }
}

@media (min-width: 576px) and (max-width: 991.98px) {
  .product-thumb {
    width: 66px !important;
    height: 66px !important;
  }
}


/* ===== Modern product action area: clean Bootstrap responsive ===== */
.product-action-grid,
.product-action-modern {
  display: grid !important;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: .65rem;
  align-items: stretch;
}

.product-action-grid .qty-input,
.product-action-modern .qty-input,
#qty {
  width: 100% !important;
  min-height: 46px;
  border-radius:.25rem;
  font-weight: 900;
  text-align: center;
  font-size: 1.05rem;
}

#btnAdd {
  min-height: 46px;
  border-radius:.25rem;
  font-weight: 900;
  box-shadow: 0 .35rem .9rem rgba(13, 110, 253, .16);
}

.product-action-hint,
.product-cart-hint {
  grid-column: 1 / -1;
}

.product-mini-actions .btn,
.product-detail-wrap .btn {
  border-radius:.25rem;
}

@media (max-width: 575.98px) {
  .product-action-grid,
  .product-action-modern {
    grid-template-columns: 92px minmax(0, 1fr);
    gap: .5rem;
  }

  #qty,
  #btnAdd {
    min-height: 44px;
  }

  .variant-option-grid,
  .quote-variant-grid {
    grid-template-columns: 1fr 1fr !important;
  }

  .product-title {
    line-height: 1.35;
  }
}

@media (min-width: 576px) and (max-width: 991.98px) {
  .product-action-grid,
  .product-action-modern {
    grid-template-columns: 120px minmax(0, 1fr);
  }
}


/* ===== Product.php Premium Simple Responsive UI ===== */
.product-detail-wrap{
  max-width:1480px;
  margin:0 auto;
}

.product-main-card,
.product-info-card,
.product-related-card,
.review-form-card,
.review-card{
  border:1px solid #e5e7eb!important;
  border-radius:.25rem;
  box-shadow:0 .55rem 1.4rem rgba(15,23,42,.055)!important;
}

.product-main-img-wrap,
.product-no-img-detail{
  border-radius:.25rem;
}

.product-title{
  font-weight:900;
  color:#0f172a;
  letter-spacing:-.02em;
}

.product-price-text{
  font-weight:900;
  color:#0d6efd;
}

.price-box{
  border-radius:.25rem;
  background:linear-gradient(135deg,#eff6ff 0%,#ffffff 100%)!important;
  border:1px solid #dbeafe!important;
}

.product-action-grid,
.product-action-modern{
  display:grid!important;
  grid-template-columns:116px minmax(0,1fr);
  gap:.65rem;
  align-items:stretch;
}

.product-action-grid .qty-input,
.product-action-modern .qty-input,
#qty{
  width:100%!important;
  min-height:46px;
  border-radius:.25rem;
  font-weight:900;
  text-align:center;
  font-size:1.05rem;
  border-color:#dbe4f0;
}

#qty:focus{
  border-color:#86b7fe;
  box-shadow:0 0 0 .18rem rgba(13,110,253,.12);
}

#btnAdd{
  min-height:46px;
  border-radius:.25rem;
  font-weight:900;
  box-shadow:0 .35rem .9rem rgba(13,110,253,.16);
}

.product-action-hint,
.product-cart-hint{
  grid-column:1 / -1;
}

.product-mini-actions{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.55rem;
}

.product-mini-actions .btn,
.product-detail-wrap .btn{
  border-radius:.25rem;
}

.variant-option-grid,
.quote-variant-grid{
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr))!important;
  gap:.75rem!important;
}

.variant-outline-btn,
.quote-variant-btn{
  min-height:142px!important;
  height:auto!important;
  padding:.75rem!important;
  border-radius:.25rem;
  overflow:hidden;
}

.variant-outline-btn:hover,
.quote-variant-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 .35rem .9rem rgba(13,110,253,.09);
}

.variant-outline-btn.active,
.quote-variant-btn.active{
  border-color:#0d6efd!important;
  background:linear-gradient(135deg,#eaf3ff,#fff)!important;
  box-shadow:0 0 0 .16rem rgba(13,110,253,.15)!important;
}

.variant-outline-img,
.variant-outline-no-img{
  width:54px!important;
  height:54px!important;
  border-radius:.25rem;
}

.product-thumb{
  border-radius:.25rem;
}

.product-thumb.active{
  border-color:#0d6efd!important;
  box-shadow:0 0 0 .16rem rgba(13,110,253,.16)!important;
}

.product-video-box{
  border-radius:.25rem;
}

.review-upload-preview img,
.review-upload-preview video,
.review-image-grid img,
.review-video-grid video{
  border-radius:.25rem;
}

.product-sticky-buybar{
  display:none;
}

@media(max-width:991.98px){
  .product-detail-wrap{
    padding-left:.75rem!important;
    padding-right:.75rem!important;
  }

  .product-main-img-wrap,
  .product-no-img-detail{
    aspect-ratio:1/1!important;
    height:auto!important;
    min-height:unset!important;
  }

  .product-action-grid,
  .product-action-modern{
    grid-template-columns:120px minmax(0,1fr);
  }
}

@media(max-width:575.98px){
  .product-detail-wrap{
    padding-left:.65rem!important;
    padding-right:.65rem!important;
    padding-top:.75rem!important;
  }

  .breadcrumb{
    flex-wrap:nowrap;
    overflow-x:auto;
    white-space:nowrap;
    padding-bottom:.25rem;
  }

  .product-title{
    font-size:1.35rem!important;
    line-height:1.35;
  }

  .product-price-text{
    font-size:1.65rem!important;
  }

  .product-main-card,
  .product-info-card,
  .product-related-card,
  .review-form-card,
  .review-card{
    border-radius:.25rem;
  }

  .product-thumb{
    width:58px!important;
    height:58px!important;
  }

  .product-action-grid,
  .product-action-modern{
    grid-template-columns:94px minmax(0,1fr);
    gap:.5rem;
  }

  #qty,
  #btnAdd{
    min-height:44px;
  }

  .product-mini-actions{
    grid-template-columns:1fr 1fr;
    gap:.5rem;
  }

  .product-mini-actions .btn{
    min-height:40px;
    font-size:.92rem;
  }

  .variant-option-grid,
  .quote-variant-grid{
    grid-template-columns:1fr 1fr!important;
    gap:.55rem!important;
  }

  .variant-outline-btn,
  .quote-variant-btn{
    min-height:162px!important;
    padding:.55rem!important;
  }

  .variant-outline-btn .d-flex,
  .quote-variant-btn .d-flex{
    flex-direction:column;
    align-items:flex-start!important;
    gap:.45rem!important;
  }

  .variant-outline-img,
  .variant-outline-no-img{
    width:48px!important;
    height:48px!important;
  }

  .quote-modal-actions{
    display:grid!important;
    grid-template-columns:1fr;
    gap:.5rem;
  }

  .quote-modal-actions .btn{
    width:100%;
  }

  .product-sticky-buybar{
    display:block;
    position:sticky;
    bottom:0;
    z-index:1020;
    background:rgba(255,255,255,.96);
    border:1px solid #e5e7eb;
    border-radius:.25rem;
    box-shadow:0 -.7rem 1.5rem rgba(15,23,42,.1);
    backdrop-filter:blur(10px);
    padding:.75rem;
    margin-top:1rem;
  }
}


/* ===== Product qty +/- and compact action buttons ===== */
.product-action-grid,
.product-action-modern{
  display:flex!important;
  flex-wrap:wrap;
  align-items:center;
  gap:.65rem;
}

.product-qty-stepper{
  width:150px;
  max-width:150px;
  flex:0 0 150px;
  border-radius:.25rem;
  box-shadow:0 .25rem .75rem rgba(15,23,42,.05);
}

.product-qty-stepper .product-qty-btn{
  width:42px;
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  border-color:#dbe4f0;
  background:#fff;
}

.product-qty-stepper .product-qty-btn:hover{
  background:#f8fbff;
  border-color:#0d6efd;
  color:#0d6efd;
}

.product-qty-stepper .product-qty-input{
  min-width:56px;
  height:44px;
  font-weight:900;
  color:#0f172a;
  border-color:#dbe4f0;
  padding-left:.25rem;
  padding-right:.25rem;
}

.product-qty-stepper .product-qty-input:focus{
  border-color:#86b7fe;
  box-shadow:none;
}

.product-qty-stepper input[type=number]::-webkit-inner-spin-button,
.product-qty-stepper input[type=number]::-webkit-outer-spin-button{
  -webkit-appearance:none;
  margin:0;
}

.product-qty-stepper input[type=number]{
  -moz-appearance:textfield;
}

.product-add-cart-btn,
#btnAdd{
  width:auto!important;
  min-width:190px;
  max-width:260px;
  flex:0 0 auto;
  padding-left:1.25rem!important;
  padding-right:1.25rem!important;
  border-radius:.25rem;
  min-height:44px;
  font-weight:900;
}

.product-action-hint,
.product-cart-hint{
  flex:0 0 100%;
  width:100%;
}

@media(max-width:991.98px){
  .product-qty-stepper{
    width:146px;
    max-width:146px;
    flex-basis:146px;
  }

  .product-add-cart-btn,
  #btnAdd{
    min-width:180px;
    max-width:240px;
  }
}

@media(max-width:575.98px){
  .product-action-grid,
  .product-action-modern{
    display:grid!important;
    grid-template-columns:136px minmax(0,1fr);
    gap:.5rem;
  }

  .product-qty-stepper{
    width:100%;
    max-width:136px;
    flex-basis:auto;
  }

  .product-qty-stepper .product-qty-btn{
    width:38px;
    min-height:42px;
    padding:.35rem;
  }

  .product-qty-stepper .product-qty-input{
    height:42px;
    min-width:48px;
    font-size:.95rem;
  }

  .product-add-cart-btn,
  #btnAdd{
    width:100%!important;
    min-width:0;
    max-width:none;
    min-height:42px;
    padding-left:.75rem!important;
    padding-right:.75rem!important;
  }

  .product-action-hint,
  .product-cart-hint{
    grid-column:1 / -1;
  }
}


/* ===== FIX: Product buttons normal size + qty horizontal ===== */
.product-action-grid,
.product-action-modern{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:.65rem!important;
}

.product-qty-stepper{
  display:flex!important;
  flex-wrap:nowrap!important;
  width:146px!important;
  max-width:146px!important;
  min-width:146px!important;
  flex:0 0 146px!important;
  border-radius:.25rem;
  overflow:hidden!important;
  box-shadow:0 .25rem .75rem rgba(15,23,42,.05)!important;
}

.product-qty-stepper .product-qty-btn{
  width:40px!important;
  min-width:40px!important;
  max-width:40px!important;
  flex:0 0 40px!important;
  min-height:42px!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-weight:900!important;
  border-color:#dbe4f0!important;
  background:#fff!important;
}

.product-qty-stepper .product-qty-btn:hover{
  color:#0d6efd!important;
  border-color:#0d6efd!important;
  background:#f8fbff!important;
}

.product-qty-stepper .product-qty-input,
.product-qty-stepper #qty{
  width:66px!important;
  min-width:66px!important;
  max-width:66px!important;
  flex:0 0 66px!important;
  height:42px!important;
  min-height:42px!important;
  padding:.25rem!important;
  text-align:center!important;
  font-weight:900!important;
  color:#0f172a!important;
  border-color:#dbe4f0!important;
  box-shadow:none!important;
}

.product-qty-stepper input[type=number]::-webkit-inner-spin-button,
.product-qty-stepper input[type=number]::-webkit-outer-spin-button{
  -webkit-appearance:none!important;
  margin:0!important;
}

.product-qty-stepper input[type=number]{
  -moz-appearance:textfield!important;
}

.product-add-cart-btn,
#btnAdd{
  width:auto!important;
  min-width:180px!important;
  max-width:220px!important;
  flex:0 0 auto!important;
  min-height:42px!important;
  height:42px!important;
  padding-left:1rem!important;
  padding-right:1rem!important;
  border-radius:.25rem;
  font-weight:900!important;
  white-space:nowrap!important;
}

/* ปุ่มรอง เช่น ขอใบเสนอราคา / ไปที่ตะกร้า ให้เป็นปุ่มปกติ ไม่ยาวเกิน */
.product-mini-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:.55rem!important;
}

.product-mini-actions .btn{
  width:auto!important;
  min-width:180px!important;
  max-width:240px!important;
  flex:0 0 auto!important;
  min-height:40px!important;
  padding-left:1rem!important;
  padding-right:1rem!important;
  border-radius:.25rem;
  font-weight:800!important;
}

.product-action-hint,
.product-cart-hint{
  flex:0 0 100%!important;
  width:100%!important;
}

/* tablet */
@media(max-width:991.98px){
  .product-qty-stepper{
    width:142px!important;
    max-width:142px!important;
    min-width:142px!important;
    flex-basis:142px!important;
  }

  .product-qty-stepper .product-qty-btn{
    width:38px!important;
    min-width:38px!important;
    max-width:38px!important;
    flex-basis:38px!important;
  }

  .product-qty-stepper .product-qty-input,
  .product-qty-stepper #qty{
    width:66px!important;
    min-width:66px!important;
    max-width:66px!important;
    flex-basis:66px!important;
  }

  .product-add-cart-btn,
  #btnAdd{
    min-width:170px!important;
    max-width:210px!important;
  }

  .product-mini-actions .btn{
    min-width:170px!important;
    max-width:220px!important;
  }
}

/* mobile */
@media(max-width:575.98px){
  .product-action-grid,
  .product-action-modern{
    gap:.5rem!important;
  }

  .product-qty-stepper{
    width:136px!important;
    max-width:136px!important;
    min-width:136px!important;
    flex-basis:136px!important;
  }

  .product-qty-stepper .product-qty-btn{
    width:36px!important;
    min-width:36px!important;
    max-width:36px!important;
    flex-basis:36px!important;
    min-height:40px!important;
  }

  .product-qty-stepper .product-qty-input,
  .product-qty-stepper #qty{
    width:64px!important;
    min-width:64px!important;
    max-width:64px!important;
    flex-basis:64px!important;
    height:40px!important;
    min-height:40px!important;
    font-size:.95rem!important;
  }

  .product-add-cart-btn,
  #btnAdd{
    min-width:160px!important;
    max-width:190px!important;
    height:40px!important;
    min-height:40px!important;
    font-size:.92rem!important;
  }

  .product-mini-actions{
    gap:.5rem!important;
  }

  .product-mini-actions .btn{
    min-width:150px!important;
    max-width:calc(50% - .25rem)!important;
    flex:1 1 150px!important;
    font-size:.9rem!important;
  }
}


/* ===== Force rounded-1 style ===== */
.product-detail-wrap .card,
.product-detail-wrap .btn,
.product-detail-wrap .form-control,
.product-detail-wrap .form-select,
.product-detail-wrap .input-group-text,
.product-detail-wrap .modal-content,
.product-detail-wrap .alert,
.product-detail-wrap .badge,
.product-detail-wrap img,
.product-main-card,
.product-info-card,
.product-related-card,
.review-form-card,
.review-card,
.product-main-img-wrap,
.product-no-img-detail,
.product-thumb,
.price-box,
.variant-outline-btn,
.quote-variant-btn,
.variant-outline-img,
.variant-outline-no-img,
.product-video-box,
.review-upload-preview img,
.review-upload-preview video,
.review-image-grid img,
.review-video-grid video,
.product-qty-stepper,
.product-qty-stepper .product-qty-btn,
.product-qty-stepper .product-qty-input,
.product-add-cart-btn,
#btnAdd,
.product-mini-actions .btn,
.product-sticky-buybar{
  border-radius:.25rem!important;
}


/* ===== Stock after qty auto ===== */
#stockQtyText.text-danger{
  color:#dc3545!important;
}

#stockCalcText{
  line-height:1.35;
}

.product-stock-soldout{
  border-color:#fecaca!important;
  background:#fff5f5!important;
}


.product-top-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:-.35rem;margin-bottom:1rem}
.product-top-meta .meta-pill{display:inline-flex;align-items:center;gap:.38rem;border:1px solid #dbeafe;background:#f8fbff;color:#0f172a;border-radius:.35rem;padding:.38rem .62rem;font-weight:800;font-size:.9rem;line-height:1.15;box-shadow:0 .25rem .65rem rgba(15,23,42,.035)}
.product-top-meta .meta-pill i{color:#0d6efd}
.product-top-meta .meta-stars{color:#ffc107;letter-spacing:.03em;white-space:nowrap}
.product-top-meta .meta-number{color:#0d6efd;font-weight:950}
.product-top-meta .meta-muted{color:#64748b;font-weight:700}
@media(max-width:575.98px){.product-top-meta{gap:.4rem}.product-top-meta .meta-pill{font-size:.82rem;padding:.34rem .5rem}.product-top-meta .meta-stars{font-size:.9rem}}


/* ===== CKEditor4 Product Description Render ===== */
.product-detail-section {
  background: #ffffff;
}

.ckeditor-content {
  color: #334155;
  line-height: 1.75;
  font-size: 1rem;
  word-break: break-word;
  overflow-wrap: anywhere;
}

.ckeditor-content :first-child {
  margin-top: 0;
}

.ckeditor-content :last-child {
  margin-bottom: 0;
}

.ckeditor-content h1,
.ckeditor-content h2,
.ckeditor-content h3,
.ckeditor-content h4,
.ckeditor-content h5,
.ckeditor-content h6 {
  color: #0f172a;
  font-weight: 800;
  line-height: 1.35;
  margin: 1rem 0 .55rem;
}

.ckeditor-content p {
  margin-bottom: .85rem;
}

.ckeditor-content ul,
.ckeditor-content ol {
  padding-left: 1.35rem;
  margin-bottom: .9rem;
}

.ckeditor-content blockquote {
  margin: .9rem 0;
  padding: .75rem 1rem;
  border-left: 4px solid #bfdbfe;
  background: #eff6ff;
  border-radius: .25rem;
  color: #1e3a8a;
}

.ckeditor-content img {
  max-width: 100%;
  height: auto !important;
  border-radius: .35rem;
  box-shadow: 0 .25rem .85rem rgba(15, 23, 42, .08);
}

.ckeditor-content figure {
  max-width: 100%;
  margin: .9rem 0;
}

.ckeditor-content table {
  width: 100% !important;
  max-width: 100%;
  border-collapse: collapse;
  margin: .9rem 0;
  display: block;
  overflow-x: auto;
  white-space: nowrap;
}

.ckeditor-content table th,
.ckeditor-content table td {
  border: 1px solid #dbe4f0;
  padding: .55rem .7rem;
  vertical-align: top;
}

.ckeditor-content table th {
  background: #f8fbff;
  color: #0f172a;
  font-weight: 800;
}

.ckeditor-content a {
  color: #0d6efd;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.ckeditor-content iframe,
.ckeditor-content video {
  max-width: 100%;
}

@media (max-width: 575.98px) {
  .ckeditor-content {
    font-size: .95rem;
    line-height: 1.7;
  }

  .ckeditor-content h1 { font-size: 1.45rem; }
  .ckeditor-content h2 { font-size: 1.3rem; }
  .ckeditor-content h3 { font-size: 1.15rem; }
  .ckeditor-content table {
    font-size: .9rem;
  }
}


.product-short-desc-box {
  margin-bottom: 1rem;
  padding: .9rem 1rem;
  border: 1px solid #dbeafe;
  border-left: 4px solid #0d6efd;
  border-radius: .35rem;
  background: linear-gradient(135deg, #f8fbff, #ffffff);
  color: #334155;
  line-height: 1.7;
}

.product-short-desc-box .short-desc-title {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-weight: 800;
  color: #0d6efd;
  margin-bottom: .3rem;
}

.product-short-desc-box .short-desc-text {
  color: #475569;
}

@media (max-width: 575.98px) {
  .product-short-desc-box {
    padding: .8rem .85rem;
  }
}


/* ===== Product carousel pastel control button area ===== */
.product-gallery-control {
  opacity: .95;
}

.product-gallery-control:focus .carousel-control-prev-icon,
.product-gallery-control:focus .carousel-control-next-icon {
  outline: 2px solid rgba(13,110,253,.18);
  outline-offset: 2px;
}


/* ===== Product top badges pastel ===== */
.product-top-badges {
  row-gap: .45rem !important;
}

.product-pastel-badge {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .18rem;
  border-radius: .25rem;
  padding: .28rem .58rem;
  font-size: .78rem;
  font-weight: 900;
  line-height: 1;
  border: 1px solid #dbeafe;
  background: #f8fbff;
  color: #475569;
  box-shadow: 0 .16rem .42rem rgba(15,23,42,.03);
  white-space: nowrap;
}

.product-pastel-badge i {
  font-size: .85rem;
  line-height: 1;
}

.product-pastel-badge.is-category {
  color: #475569;
  background: #f8fafc;
  border-color: #e2e8f0;
}

.product-pastel-badge.is-sku {
  color: #334155;
  background: #f1f5f9;
  border-color: #cbd5e1;
}

.product-pastel-badge.is-ready {
  color: #047857;
  background: #ecfdf5;
  border-color: #a7f3d0;
}

.product-pastel-badge.is-preorder {
  color: #b45309;
  background: #fff7ed;
  border-color: #fed7aa;
}

.product-pastel-badge.is-flash {
  color: #b91c1c;
  background: #fef2f2;
  border-color: #fecaca;
}

@media (max-width: 575.98px) {
  .product-pastel-badge {
    min-height: 26px;
    padding: .24rem .46rem;
    font-size: .72rem;
    white-space: normal;
    line-height: 1.15;
  }
}


/* ===== Product Flash Sale pastel badge ===== */
.price-box #priceModeText {
  color: #64748b !important;
  font-weight: 800;
}

.product-flash-pastel-badge,
#flashSaleBadge {
  min-height: 28px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: .32rem;
  border-radius: .25rem !important;
  padding: .28rem .58rem !important;
  font-size: .78rem !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  color: #b91c1c !important;
  background: #fef2f2 !important;
  border: 1px solid #fecaca !important;
  box-shadow: 0 .18rem .5rem rgba(185,28,28,.055);
  white-space: nowrap;
}

.product-flash-pastel-badge i,
#flashSaleBadge i {
  color: #dc2626 !important;
  font-size: .86rem;
  line-height: 1;
  margin-right: 0 !important;
}

.product-flash-pastel-badge #flashDiscountText,
#flashSaleBadge #flashDiscountText {
  color: #991b1b;
  font-weight: 950;
}

.price-box .product-price-text.text-danger {
  color: #dc3545 !important;
}

@media (max-width: 575.98px) {
  .product-flash-pastel-badge,
  #flashSaleBadge {
    min-height: 25px;
    font-size: .72rem !important;
    padding: .22rem .44rem !important;
    white-space: normal;
    text-align: left;
  }
}



/* ===== Product price mode badges: Flash / Sale / Normal ===== */
.product-sale-pastel-badge,
#salePriceBadge {
  min-height: 28px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: .32rem;
  border-radius: .25rem !important;
  padding: .28rem .58rem !important;
  font-size: .78rem !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  color: #b45309 !important;
  background: #fff7ed !important;
  border: 1px solid #fed7aa !important;
  box-shadow: 0 .18rem .5rem rgba(180,83,9,.055);
  white-space: nowrap;
}

.product-sale-pastel-badge i,
#salePriceBadge i {
  color: #f97316 !important;
  font-size: .86rem;
  line-height: 1;
  margin-right: 0 !important;
}

.product-price-text.text-sale {
  color: #0d6efd !important;
}

.product-price-text.text-flash {
  color: #dc3545 !important;
}

@media (max-width: 575.98px) {
  .product-sale-pastel-badge,
  #salePriceBadge {
    min-height: 25px;
    font-size: .72rem !important;
    padding: .22rem .44rem !important;
    white-space: normal;
    text-align: left;
  }
}

/* ===== Product SEO / performance / no-overflow polish ===== */
html, body {
  max-width: 100%;
  overflow-x: clip;
}

.product-detail-wrap,
.product-detail-wrap * {
  box-sizing: border-box;
}

.product-detail-wrap {
  max-width: 100%;
  overflow-x: clip;
}

.product-detail-wrap .row {
  min-width: 0;
}

.product-detail-wrap [class*="col-"] {
  min-width: 0;
}

.product-main-card,
.price-box,
.product-desc,
.product-video-box,
.review-card-modern,
.variant-outline-btn,
.quote-variant-btn {
  min-width: 0;
  max-width: 100%;
}

.product-title,
.product-desc,
.product-short-desc,
.product-top-meta,
.price-box,
.variant-option-grid,
.quote-variant-grid {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.product-detail-wrap img,
.product-detail-wrap video,
.product-detail-wrap iframe {
  max-width: 100%;
}

.product-image-carousel,
.product-thumb-scroll {
  max-width: 100%;
}

.product-thumb-scroll {
  overscroll-behavior-x: contain;
}

.product-desc table {
  width: 100% !important;
  max-width: 100%;
  display: block;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.product-desc img {
  height: auto !important;
  border-radius: .25rem;
}

.product-video-box iframe,
.product-video-box video {
  width: 100%;
  display: block;
}

@media (max-width: 575.98px) {
  .product-detail-wrap {
    padding-left: .6rem !important;
    padding-right: .6rem !important;
  }

  .breadcrumb {
    max-width: 100%;
    overflow-x: auto;
    flex-wrap: nowrap;
    white-space: nowrap;
    padding-bottom: .15rem;
  }

  .product-title {
    font-size: 1.25rem !important;
    line-height: 1.35;
  }

  .price-box {
    padding: .85rem !important;
  }

  .product-action-grid {
    max-width: 100%;
  }
}

@supports not (overflow: clip) {
  html, body,
  .product-detail-wrap {
    overflow-x: hidden;
  }
}


/* ===== Product bottom categories pastel ===== */
.product-bottom-categories {
  border: 1px solid #dbeafe;
  background:
    radial-gradient(circle at top left, rgba(13,110,253,.08), transparent 22rem),
    linear-gradient(135deg, #ffffff, #f8fbff);
  box-shadow: 0 .55rem 1.35rem rgba(15,23,42,.045);
}

.product-bottom-categories .section-title {
  font-weight: 950;
  color: #0f172a;
  letter-spacing: -.015em;
}

.product-bottom-categories .section-subtitle {
  color: #64748b;
  font-size: .88rem;
}

.product-category-pill-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}

.product-category-pill {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  padding: .42rem .72rem;
  border: 1px solid #bfdbfe;
  background: #ffffff;
  color: #0d6efd;
  border-radius: .25rem;
  text-decoration: none;
  font-weight: 900;
  font-size: .88rem;
  box-shadow: 0 .18rem .55rem rgba(13,110,253,.045);
  transition: .16s ease;
  max-width: 100%;
}

.product-category-pill:hover {
  background: #eff6ff;
  border-color: #93c5fd;
  color: #0b5ed7;
  transform: translateY(-1px);
}

.product-category-pill.is-current {
  background: #eff6ff;
  border-color: #93c5fd;
  color: #0b5ed7;
  box-shadow: 0 0 0 .15rem rgba(13,110,253,.08);
}

.product-category-pill .pill-count {
  color: #64748b;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: .25rem;
  padding: .06rem .32rem;
  font-size: .72rem;
  font-weight: 900;
}

.product-category-pill-all {
  background: #0d6efd;
  color: #ffffff;
  border-color: #0d6efd;
}

.product-category-pill-all:hover {
  background: #0b5ed7;
  color: #ffffff;
  border-color: #0b5ed7;
}

@media (max-width: 575.98px) {
  .product-bottom-categories {
    padding: .9rem !important;
  }

  .product-category-pill-grid {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: .35rem;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }

  .product-category-pill-grid::-webkit-scrollbar {
    height: 6px;
  }

  .product-category-pill-grid::-webkit-scrollbar-thumb {
    background: #bfdbfe;
    border-radius: 999px;
  }

  .product-category-pill {
    flex: 0 0 auto;
    scroll-snap-align: start;
    min-height: 36px;
    font-size: .82rem;
    padding: .38rem .62rem;
    white-space: nowrap;
  }
}


/* ===== Fix price badge auto hide =====
   badge CSS มี display:inline-flex !important จึงต้องบังคับ d-none ให้ชนะ
*/
.product-flash-pastel-badge.d-none,
.product-sale-pastel-badge.d-none,
#flashSaleBadge.d-none,
#salePriceBadge.d-none {
  display: none !important;
}
/* =========================================================
   FINAL FIX OVERRIDE - assets/css/product.css
   แก้ปัญหา CSS ซ้อนกัน / ปุ่มใหญ่ผิดปกติ / รูปสินค้า / overflow มือถือ
   ========================================================= */

/* ให้ d-none ชนะทุก badge ที่ถูกกำหนด display:inline-flex !important */
.product-detail-wrap .d-none,
.product-flash-pastel-badge.d-none,
.product-sale-pastel-badge.d-none,
#flashSaleBadge.d-none,
#salePriceBadge.d-none {
  display: none !important;
}

/* กันหน้า product ล้นแนวนอน โดยไม่ทำให้ modal/bootstrap เพี้ยน */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

.product-detail-wrap,
.product-detail-wrap .container,
.product-detail-wrap .container-fluid,
.product-detail-wrap .row,
.product-detail-wrap [class*="col-"] {
  min-width: 0;
}

.product-detail-wrap {
  max-width: 1480px;
  margin-left: auto;
  margin-right: auto;
  overflow-x: clip;
}

/* รูปหลักสินค้า: คง 1:1 และไม่บีบรูป */
.product-main-img-wrap,
.product-no-img-detail {
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  height: auto !important;
  min-height: unset !important;
  max-height: unset !important;
  border-radius: .25rem !important;
  background: linear-gradient(135deg, #f8fbff, #eef7ff) !important;
  overflow: hidden !important;
}

.product-main-img-wrap img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  background: #fff !important;
  display: block !important;
}

/* thumbnail ให้เป็นสี่เหลี่ยมและไม่ยืด */
.product-thumb {
  width: 72px !important;
  height: 72px !important;
  flex: 0 0 auto !important;
  border-radius: .25rem !important;
  overflow: hidden !important;
}

.product-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

.product-thumb-scroll {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: .55rem !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  max-width: 100% !important;
  padding: .15rem .15rem .45rem !important;
  -webkit-overflow-scrolling: touch;
}

/* ปุ่มเพิ่มลงตะกร้า + จำนวน ไม่ให้ยาว/แตกบรรทัด */
.product-action-grid,
.product-action-modern {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: .65rem !important;
  max-width: 100% !important;
}

.product-qty-stepper {
  display: flex !important;
  flex-wrap: nowrap !important;
  width: 146px !important;
  min-width: 146px !important;
  max-width: 146px !important;
  flex: 0 0 146px !important;
  overflow: hidden !important;
  border-radius: .25rem !important;
}

.product-qty-stepper .product-qty-btn {
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  flex: 0 0 40px !important;
  min-height: 42px !important;
  height: 42px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 900 !important;
}

.product-qty-stepper .product-qty-input,
.product-qty-stepper #qty,
#qty.product-qty-input {
  width: 66px !important;
  min-width: 66px !important;
  max-width: 66px !important;
  flex: 0 0 66px !important;
  height: 42px !important;
  min-height: 42px !important;
  padding: .25rem !important;
  text-align: center !important;
  font-weight: 900 !important;
  box-shadow: none !important;
}

.product-add-cart-btn,
#btnAdd {
  width: auto !important;
  min-width: 180px !important;
  max-width: 230px !important;
  flex: 0 0 auto !important;
  height: 42px !important;
  min-height: 42px !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
  white-space: nowrap !important;
  font-weight: 900 !important;
  border-radius: .25rem !important;
}

.product-action-hint,
.product-cart-hint {
  flex: 0 0 100% !important;
  width: 100% !important;
}

/* ปุ่มรองไม่ให้เต็มแถวยาวเกิน */
.product-mini-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .55rem !important;
  align-items: center !important;
}

.product-mini-actions .btn {
  width: auto !important;
  min-width: 170px !important;
  max-width: 240px !important;
  flex: 0 0 auto !important;
  min-height: 40px !important;
  border-radius: .25rem !important;
  font-weight: 800 !important;
}

/* ตัวเลือกสินค้า: ไม่ให้ข้อความโดนตัด ... */
.variant-option-grid,
.quote-variant-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important;
  gap: .75rem !important;
}

.variant-outline-btn,
.quote-variant-btn {
  min-height: 142px !important;
  height: auto !important;
  padding: .75rem !important;
  border-radius: .25rem !important;
  overflow: hidden !important;
}

.variant-outline-btn .fw-bold,
.quote-variant-btn .fw-bold,
.variant-outline-btn .small,
.quote-variant-btn .small {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
}

/* รายละเอียดจาก CKEditor กันตาราง/รูป/วิดีโอล้น */
.ckeditor-content,
.product-desc {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

.ckeditor-content img,
.product-desc img,
.product-detail-wrap img,
.product-detail-wrap video,
.product-detail-wrap iframe {
  max-width: 100% !important;
}

.ckeditor-content table,
.product-desc table {
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
  overflow-x: auto !important;
  white-space: nowrap !important;
  -webkit-overflow-scrolling: touch;
}

/* Mobile */
@media (max-width: 575.98px) {
  .product-detail-wrap {
    padding-left: .65rem !important;
    padding-right: .65rem !important;
    max-width: 100% !important;
  }

  .product-title {
    font-size: 1.25rem !important;
    line-height: 1.35 !important;
  }

  .product-price-text {
    font-size: 1.55rem !important;
  }

  .product-thumb {
    width: 58px !important;
    height: 58px !important;
  }

  .product-action-grid,
  .product-action-modern {
    display: grid !important;
    grid-template-columns: 136px minmax(0, 1fr) !important;
    gap: .5rem !important;
    align-items: center !important;
  }

  .product-qty-stepper {
    width: 136px !important;
    min-width: 136px !important;
    max-width: 136px !important;
    flex-basis: 136px !important;
  }

  .product-qty-stepper .product-qty-btn {
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    flex-basis: 36px !important;
    min-height: 40px !important;
    height: 40px !important;
  }

  .product-qty-stepper .product-qty-input,
  .product-qty-stepper #qty,
  #qty.product-qty-input {
    width: 64px !important;
    min-width: 64px !important;
    max-width: 64px !important;
    flex-basis: 64px !important;
    height: 40px !important;
    min-height: 40px !important;
    font-size: .95rem !important;
  }

  .product-add-cart-btn,
  #btnAdd {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 40px !important;
    min-height: 40px !important;
    padding-left: .65rem !important;
    padding-right: .65rem !important;
    font-size: .9rem !important;
  }

  .product-action-hint,
  .product-cart-hint {
    grid-column: 1 / -1 !important;
  }

  .product-mini-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: .5rem !important;
  }

  .product-mini-actions .btn {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 40px !important;
    font-size: .9rem !important;
    padding-left: .55rem !important;
    padding-right: .55rem !important;
  }

  .variant-option-grid,
  .quote-variant-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: .55rem !important;
  }

  .variant-outline-btn,
  .quote-variant-btn {
    min-height: 158px !important;
    padding: .55rem !important;
  }

  .variant-outline-btn .d-flex,
  .quote-variant-btn .d-flex {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: .45rem !important;
  }

  .variant-outline-img,
  .variant-outline-no-img {
    width: 48px !important;
    height: 48px !important;
  }
}

@supports not (overflow: clip) {
  .product-detail-wrap {
    overflow-x: hidden;
  }
}


/* ==============================
   Quote / Tax Option Cards
   ใช้กับกล่อง สาขา + ที่อยู่ใบเสร็จ/ใบกำกับภาษี
============================== */

.quote-option-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .5rem;
}

.quote-option-grid.quote-option-grid-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.quote-option-card {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  min-height: 74px;
  padding: .85rem .95rem;
  border: 1px solid #dee2e6;
  border-radius: .35rem;
  background: #fff;
  cursor: pointer;
  transition: .18s ease;
}

.quote-option-card:hover {
  border-color: rgba(13, 110, 253, .45);
  background: #f8fbff;
  box-shadow: 0 .25rem .75rem rgba(13, 110, 253, .08);
  transform: translateY(-1px);
}

.quote-option-card input[type="radio"] {
  width: 1rem;
  height: 1rem;
  margin-top: .18rem;
  flex: 0 0 auto;
  cursor: pointer;
}

.quote-option-card .quote-option-title {
  display: block;
  font-weight: 800;
  color: #111827;
  line-height: 1.25;
}

.quote-option-card .quote-option-desc {
  display: block;
  margin-top: .15rem;
  font-size: .78rem;
  color: #6c757d;
  line-height: 1.35;
}

/* checked style */
.quote-option-card:has(input[type="radio"]:checked) {
  border-color: rgba(13, 110, 253, .65);
  background: linear-gradient(180deg, #f3f8ff 0%, #eef6ff 100%);
  box-shadow: inset 0 0 0 1px rgba(13, 110, 253, .16);
}

.quote-option-card:has(input[type="radio"]:checked) .quote-option-title {
  color: #0d6efd;
}

.quote-option-card:has(input[type="radio"]:checked)::after {
  content: "\F26A";
  font-family: "bootstrap-icons";
  position: absolute;
  top: .55rem;
  right: .65rem;
  width: 1.35rem;
  height: 1.35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: .35rem;
  background: rgba(13, 110, 253, .1);
  color: #0d6efd;
  font-size: .85rem;
}

/* info box */
.quote-soft-info {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .55rem .75rem;
  border: 1px solid #d8e6ff;
  border-radius: .35rem;
  background: #f8fbff;
  color: #526070;
  font-size: .82rem;
}

/* section title */
.quote-mini-section-title {
  display: flex;
  align-items: center;
  gap: .45rem;
  font-weight: 800;
  color: #111827;
  margin-bottom: .25rem;
}

.quote-mini-section-title i {
  color: #0d6efd;
}

/* Auto badge/button */
.quote-auto-badge {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  padding: .35rem .55rem;
  border: 1px solid rgba(13, 110, 253, .25);
  border-radius: .35rem;
  background: #f6faff;
  color: #0d6efd;
  font-size: .78rem;
  font-weight: 700;
}

/* responsive */
@media (max-width: 991.98px) {
  .quote-option-grid {
    grid-template-columns: 1fr;
  }

  .quote-option-grid.quote-option-grid-2 {
    grid-template-columns: 1fr;
  }

  .quote-option-card {
    min-height: auto;
    padding: .8rem .85rem;
  }
}