/* Sea PDP — export-html parity. Loaded last to beat front-ecommerce.css */
body.page-product-detail {
--pdp-radius: 1.25rem;
--pdp-radius-lg: 2rem;
}
/* Nested main from old templates → treat as block */
body.page-product-detail main main,
body.page-product-detail .pdp-main {
display: block;
width: min(100% - 2rem, 1280px) !important;
max-width: 1280px !important;
margin-inline: auto !important;
padding-block: 1rem 2.5rem !important;
padding-inline: 0 !important;
}
body.page-product-detail .sea-pdp,
body.page-product-detail .bb-product-detail {
width: 100% !important;
max-width: none !important;
background: transparent !important;
padding: 0 !important;
margin: 0 !important;
}
body.page-product-detail .sea-pdp-layout {
display: grid !important;
grid-template-columns: 1fr !important;
gap: 1.25rem !important;
width: 100% !important;
align-items: start !important;
}
@media (min-width: 992px) {
body.page-product-detail .sea-pdp-layout {
grid-template-columns: minmax(0, 1.08fr) minmax(0, 1.42fr) !important;
gap: 2rem 3rem !important;
}
}
/* —— Gallery —— */
body.page-product-detail .sea-pdp-gallery {
display: grid !important;
gap: 0.85rem !important;
}
body.page-product-detail .sea-pdp-gallery .pdp-gallery,
body.page-product-detail .pdp-gallery {
position: relative !important;
aspect-ratio: 1 / 1 !important;
background: rgb(241 245 249 / 55%) !important;
border-radius: var(--pdp-radius) !important;
overflow: hidden !important;
border: 0 !important;
box-shadow: 0 8px 24px rgb(15 23 42 / 6%) !important;
}
@media (min-width: 768px) {
body.page-product-detail .sea-pdp-gallery .pdp-gallery {
border-radius: var(--pdp-radius-lg) !important;
border-width: 4px !important;
border-color: #fff !important;
box-shadow: 0 12px 32px rgb(15 23 42 / 10%) !important;
}
}
body.page-product-detail .sea-pdp-gallery__light,
body.page-product-detail .sea-pdp-gallery__light img,
body.page-product-detail .pdp-gallery img {
display: block !important;
width: 100% !important;
height: 100% !important;
object-fit: contain !important;
padding: 0.35rem !important;
margin: 0 !important;
border: 0 !important;
background: transparent !important;
transition: transform 0.7s ease !important;
}
body.page-product-detail .pdp-gallery:hover img {
transform: none;
}
body.page-product-detail .sea-pdp-gallery__stage {
display: block !important;
width: 100% !important;
height: 100% !important;
padding: 0 !important;
margin: 0 !important;
border: 0 !important;
background: transparent !important;
cursor: zoom-in !important;
touch-action: pan-y !important;
}
body.page-product-detail .sea-pdp-gallery__stage img.is-sea-swap {
animation: none;
}
body.page-product-detail .sea-pdp-gallery-lg {
position: absolute !important;
width: 1px !important;
height: 1px !important;
overflow: hidden !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
}
body.page-product-detail .sea-pdp-gallery__tools {
display: flex !important;
position: absolute !important;
bottom: 1.25rem !important;
inset-inline-end: 1.25rem !important;
flex-direction: column !important;
gap: 0.5rem !important;
z-index: 2 !important;
}
body.page-product-detail .sea-pdp-gallery__tool {
width: 2.5rem !important;
height: 2.5rem !important;
border-radius: 999px !important;
border: 0 !important;
background: rgb(255 255 255 / 85%) !important;
color: var(--primary) !important;
display: grid !important;
place-items: center !important;
box-shadow: 0 4px 12px rgb(15 23 42 / 12%) !important;
backdrop-filter: blur(8px);
}
body.page-product-detail .sea-pdp-thumbs {
display: flex !important;
gap: 0.65rem !important;
overflow-x: auto !important;
padding-bottom: 0.25rem !important;
scrollbar-width: none;
/* Keep DOM order = visual order so the first product image stays first */
flex-direction: row !important;
}
body.page-product-detail .sea-pdp-thumbs::-webkit-scrollbar { display: none; }
body.page-product-detail .sea-pdp-thumb {
width: 4rem !important;
height: 4rem !important;
flex-shrink: 0 !important;
border-radius: 0.85rem !important;
border: 2px solid transparent !important;
background: rgb(241 245 249 / 55%) !important;
padding: 0.35rem !important;
overflow: hidden !important;
cursor: pointer !important;
}
@media (min-width: 768px) {
body.page-product-detail .sea-pdp-thumb {
width: 5rem !important;
height: 5rem !important;
border-radius: 1rem !important;
}
}
body.page-product-detail .sea-pdp-thumb.is-active {
border-color: var(--primary) !important;
background: #fff !important;
}
body.page-product-detail .sea-pdp-thumb img {
width: 100% !important;
height: 100% !important;
object-fit: contain !important;
opacity: 0.55;
}
body.page-product-detail .sea-pdp-thumb.is-active img { opacity: 1; }
.sea-pdp-zoom {
position: fixed;
inset: 0;
z-index: 10050;
background: rgb(8 25 40 / 88%);
display: grid;
place-items: center;
padding: 1.5rem;
cursor: zoom-out;
}
.sea-pdp-zoom img {
max-width: min(96vw, 1100px);
max-height: 90vh;
object-fit: contain;
border-radius: 1rem;
box-shadow: 0 20px 60px rgb(0 0 0 / 35%);
}
.sea-pdp-zoom__close {
position: absolute;
top: 1rem;
inset-inline-end: 1rem;
width: 2.75rem;
height: 2.75rem;
border: 0;
border-radius: 999px;
background: #fff;
color: var(--primary, #0077b6);
display: grid;
place-items: center;
cursor: pointer;
}
/* —— Info column (buybox rhythm) —— */
body.page-product-detail .pdp-info {
display: flex !important;
flex-direction: column !important;
gap: 0 !important;
min-width: 0 !important;
}
body.page-product-detail .pdp-info__top {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 0.75rem !important;
margin: 0 0 0.65rem !important;
}
body.page-product-detail .pdp-info__badge {
display: inline-flex !important;
align-items: center !important;
gap: 0.35rem !important;
background: color-mix(in srgb, var(--primary) 10%, transparent) !important;
color: var(--primary) !important;
border: 0 !important;
border-radius: 999px !important;
padding: 0.28rem 0.75rem !important;
font-size: 0.72rem !important;
font-weight: 900 !important;
text-decoration: none !important;
line-height: 1.2 !important;
}
body.page-product-detail .pdp-info__badge img {
max-height: 36px !important;
max-width: 56px !important;
width: auto !important;
object-fit: contain !important;
}
body.page-product-detail .pdp-info__rating {
display: inline-flex !important;
align-items: center !important;
gap: 0.25rem !important;
color: var(--secondary) !important;
text-decoration: none !important;
font-weight: 900 !important;
}
body.page-product-detail .pdp-info__headline {
display: flex !important;
align-items: flex-start !important;
gap: 0.65rem !important;
margin: 0 0 0.45rem !important;
}
body.page-product-detail .pdp-info h1,
body.page-product-detail .pdp-info__title {
font-family: var(--font-heading) !important;
font-weight: 900 !important;
font-size: clamp(1.25rem, 2.3vw, 1.9rem) !important;
line-height: 1.35 !important;
margin: 0 !important;
padding: 0 !important;
color: var(--foreground) !important;
max-width: none !important;
overflow: visible !important;
white-space: normal !important;
text-overflow: unset !important;
flex: 1 1 auto !important;
min-width: 0 !important;
}
body.page-product-detail .pdp-info__wish {
width: 2.75rem !important;
height: 2.75rem !important;
flex: 0 0 2.75rem !important;
border-radius: 999px !important;
border: 0 !important;
background: #fff !important;
color: var(--primary) !important;
display: grid !important;
place-items: center !important;
padding: 0 !important;
box-shadow: 0 4px 12px rgb(15 23 42 / 6%) !important;
cursor: pointer !important;
}
body.page-product-detail .pdp-info__wish.is-active,
body.page-product-detail .pdp-info__wish.active {
color: #e11d48 !important;
background: #fff1f2 !important;
border-color: #fecdd3 !important;
}
body.page-product-detail .tp-product-details-action-sm-btn[data-bb-toggle="add-to-wishlist"] {
display: none !important;
}
body.page-product-detail .pdp-info__meta,
body.page-product-detail .tp-product-details-inventory {
display: flex !important;
flex-wrap: wrap !important;
align-items: center !important;
gap: 0.35rem 0.65rem !important;
margin: 0 0 1rem !important;
padding: 0 !important;
}
body.page-product-detail .tp-product-details-sold,
body.page-product-detail .pdp-info__sold,
body.page-product-detail .tp-product-details-stock {
margin: 0 !important;
display: inline-flex !important;
align-items: center !important;
gap: 0.3rem !important;
}
body.page-product-detail .pdp-info__sold {
min-height: 2.7rem !important;
padding: 0.36rem 0.5rem 0.36rem 0.75rem !important;
gap: 0.42rem !important;
border: 0 !important;
border-radius: 999px !important;
background: linear-gradient(135deg, #fff 0%, #eef9fe 100%) !important;
box-shadow: 0 6px 18px rgb(0 119 182 / 9%) !important;
color: #475569 !important;
white-space: nowrap !important;
}
body.page-product-detail .pdp-info__sold[hidden] {
display: none !important;
}
body.page-product-detail .pdp-info__sold-icon {
width: 1.9rem;
height: 1.9rem;
display: grid;
flex: 0 0 1.9rem;
place-items: center;
border-radius: 50%;
background: var(--primary, #0077b6);
color: #fff;
box-shadow: 0 4px 10px rgb(0 119 182 / 22%);
}
body.page-product-detail .pdp-info__sold-icon iconify-icon {
color: inherit !important;
font-size: 1.08rem !important;
}
body.page-product-detail .pdp-info__sold-label {
color: #475569 !important;
font-size: 0.84rem !important;
font-weight: 800 !important;
line-height: 1 !important;
}
body.page-product-detail .pdp-info__sold-value {
display: inline-flex !important;
align-items: baseline !important;
gap: 0.22rem !important;
color: var(--primary, #0077b6) !important;
line-height: 1 !important;
}
body.page-product-detail .pdp-info__sold .pdp-info__sold-value .sold-count-display {
min-width: 0 !important;
height: auto !important;
display: inline !important;
padding: 0 !important;
border-radius: 0 !important;
background: transparent !important;
color: var(--primary, #0077b6) !important;
font-size: 1rem !important;
font-weight: 900 !important;
font-variant-numeric: tabular-nums;
line-height: 1 !important;
letter-spacing: 0 !important;
}
body.page-product-detail .pdp-info__sold .pdp-info__sold-unit {
color: #0f4c6e !important;
font-size: 0.84rem !important;
font-weight: 900 !important;
line-height: 1 !important;
}
/* Hide clutter that export doesn't show in buybox */
body.page-product-detail .pdp-info .tp-product-details-description,
body.page-product-detail .pdp-info .tp-product-details-social,
body.page-product-detail .pdp-info .product-nav-button,
body.page-product-detail .pdp-info .product-nav-preview,
body.page-product-detail .pdp-info .attribute-arrow-indicator {
display: none !important;
}
/* Price then points (export order) */
body.page-product-detail .tp-product-details-price-block {
display: flex !important;
flex-direction: column !important;
gap: 0rem !important;
margin-bottom: 0rem !important;
}
body.page-product-detail .pdp-price,
body.page-product-detail .tp-product-details-price-wrapper {
order: 1 !important;
display: block !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
min-height: auto !important;
}
body.page-product-detail .pdp-points {
order: 2 !important;
margin-bottom: 10px !important;
margin-top: 10px !important;
}
body.page-product-detail .tp-product-details-price-block > *:not(.pdp-price):not(.tp-product-details-price-wrapper):not(.pdp-points) {
order: 3 !important;
}
body.page-product-detail .pdp-price__stack {
display: flex !important;
flex-direction: column !important;
gap: 0.45rem !important;
width: 100% !important;
align-items: flex-start !important;
}
body.page-product-detail .pdp-price__row {
display: flex !important;
flex-wrap: wrap !important;
align-items: baseline !important;
gap: 0.45rem 0.75rem !important;
}
body.page-product-detail .pdp-price__current,
body.page-product-detail .tp-product-details-price.new-price,
body.page-product-detail .tp-product-details-price-wrapper .new-price {
font-size: clamp(1.45rem, 3vw, 1.85rem) !important;
font-weight: 900 !important;
color: var(--primary) !important;
margin: 0 !important;
line-height: 1.15 !important;
font-family: var(--font-heading, inherit) !important;
font-variant-numeric: tabular-nums !important;
}
body.page-product-detail .pdp-price__old-wrap {
display: inline-flex !important;
align-items: baseline !important;
margin: 0 !important;
}
body.page-product-detail .pdp-price__current del,
body.page-product-detail .pdp-price__current .old-price,
body.page-product-detail .pdp-price__current .pdp-price__old-wrap,
body.page-product-detail .pdp-price__old-wrap del del {
display: none !important;
}
body.page-product-detail .pdp-price__old,
body.page-product-detail .tp-product-details-price.old-price,
body.page-product-detail .pdp-price__old-wrap del,
body.page-product-detail .pdp-price__old-wrap .old-price {
font-size: 0.95rem !important;
font-weight: 700 !important;
color: var(--muted-foreground) !important;
text-decoration: line-through !important;
text-decoration-color: color-mix(in srgb, #ef4444 45%, transparent) !important;
margin: 0 !important;
font-family: inherit !important;
}
body.page-product-detail .pdp-price__save {
display: inline-flex !important;
align-items: center !important;
padding: 0.18rem 0.5rem !important;
border-radius: 0.5rem !important;
background: #ef4444 !important;
color: #fff !important;
font-size: 0.68rem !important;
font-weight: 900 !important;
line-height: 1.2 !important;
}
/* Vendor wholesale range + MOQ on one row */
body.page-product-detail .tp-vendor-wholesale-card,
body.page-product-detail .pdp-price__wholesale {
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
width: 100% !important;
display: block !important;
}
body.page-product-detail .pdp-price__wholesale-row {
display: flex !important;
flex-wrap: wrap !important;
align-items: center !important;
justify-content: flex-start !important;
gap: 0.55rem 0.85rem !important;
width: 100% !important;
}
body.page-product-detail .tp-vendor-wholesale-card__range,
body.page-product-detail .pdp-price__range {
width: auto !important;
max-width: 100% !important;
margin: 0 !important;
padding: 0 !important;
font-size: clamp(1.45rem, 3vw, 1.85rem) !important;
font-weight: 900 !important;
font-family: var(--font-heading, inherit) !important;
color: var(--primary) !important;
line-height: 1.15 !important;
letter-spacing: 0 !important;
font-variant-numeric: tabular-nums !important;
unicode-bidi: isolate !important;
}
body.page-product-detail .pdp-price__range-sep {
margin-inline: 0.15rem !important;
color: color-mix(in srgb, var(--primary) 55%, #64748b) !important;
font-weight: 800 !important;
}
body.page-product-detail .tp-vendor-wholesale-card__row,
body.page-product-detail .pdp-price__moq {
display: inline-flex !important;
align-items: center !important;
gap: 0.3rem !important;
margin: 0 !important;
padding: 0.28rem 0.65rem !important;
width: fit-content !important;
max-width: 100% !important;
border-radius: 999px !important;
background: color-mix(in srgb, var(--primary) 8%, #fff) !important;
border: 0 !important;
color: var(--muted-foreground, #64748b) !important;
font-size: 0.72rem !important;
font-weight: 800 !important;
line-height: 1.25 !important;
}
body.page-product-detail .pdp-price__moq iconify-icon {
font-size: 0.95rem !important;
color: var(--primary) !important;
flex-shrink: 0 !important;
}
body.page-product-detail .pdp-price__wholesale--solo .pdp-price__range {
font-size: clamp(1.45rem, 3vw, 1.85rem) !important;
}
body.page-product-detail .pdp-points {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 0.65rem !important;
text-decoration: none !important;
color: inherit !important;
background: color-mix(in srgb, var(--accent, #0ea5e9) 9%, #fff) !important;
border: 0 !important;
border-radius: 0.9rem !important;
padding: 0.7rem 0.85rem !important;
margin-bottom: 10px !important;
margin-top: 10px !important;
transition: background 0.15s ease, border-color 0.15s ease !important;
}
body.page-product-detail .pdp-points:hover {
background: color-mix(in srgb, var(--accent, #0ea5e9) 14%, #fff) !important;
border-color: color-mix(in srgb, var(--accent, #0ea5e9) 32%, transparent) !important;
}
body.page-product-detail .pdp-points__main {
display: flex !important;
align-items: center !important;
gap: 0.65rem !important;
min-width: 0 !important;
flex: 1 1 auto !important;
}
body.page-product-detail .pdp-points__icon {
width: 2.15rem !important;
height: 2.15rem !important;
border-radius: 999px !important;
background: transparent !important;
color: #fff !important;
display: grid !important;
place-items: center !important;
flex-shrink: 0 !important;
font-size: 1.05rem !important;
}
body.page-product-detail .pdp-points__copy {
min-width: 0 !important;
flex: 1 1 auto !important;
}
body.page-product-detail .pdp-points__lead {
margin: 0 !important;
font-size: 0.84rem !important;
font-weight: 800 !important;
line-height: 1.35 !important;
color: var(--foreground) !important;
}
body.page-product-detail .pdp-points__lead span,
body.page-product-detail #reward-points-display {
color: var(--accent, #0ea5e9) !important;
font-weight: 900 !important;
}
body.page-product-detail .pdp-points__lead .pdp-points__multi {
display: inline-flex !important;
align-items: center !important;
margin-inline-start: 0.35rem !important;
padding: 0.1rem 0.4rem !important;
border-radius: 999px !important;
background: color-mix(in srgb, var(--accent, #0ea5e9) 14%, #fff) !important;
color: #0369a1 !important;
font-size: 0.72rem !important;
font-weight: 900 !important;
line-height: 1.2 !important;
vertical-align: middle !important;
}
body.page-product-detail .pdp-points__balance {
margin: 0.12rem 0 0 !important;
font-size: 0.72rem !important;
font-weight: 700 !important;
color: var(--muted-foreground) !important;
line-height: 1.3 !important;
}
body.page-product-detail .pdp-points__rate {
display: none !important;
}
body.page-product-detail .pdp-points__rate .sea-treasure-rate {
font-size: 0.68rem !important;
color: #0369a1 !important;
}
body.page-product-detail .pdp-points__chevron {
color: var(--accent, #0ea5e9) !important;
flex-shrink: 0 !important;
font-size: 1.15rem !important;
opacity: 0.85;
}
@media (max-width: 767.98px) {
body.page-product-detail .pdp-info__headline {
margin-bottom: 0.3rem !important;
gap: 0.5rem !important;
}
body.page-product-detail .pdp-info__title,
body.page-product-detail .pdp-info h1 {
font-size: 1.05rem !important;
line-height: 1.4 !important;
}
body.page-product-detail .pdp-info__wish {
width: 2.5rem !important;
height: 2.5rem !important;
flex-basis: 2.5rem !important;
}
body.page-product-detail .pdp-info__meta {
margin-bottom: 0.45rem !important;
}
body.page-product-detail .tp-product-details-price-block {
gap: 0 !important;
margin-bottom: 0 !important;
}
body.page-product-detail .pdp-points {
padding: 0.5rem 0.7rem !important;
border-radius: 0.8rem !important;
}
body.page-product-detail .pdp-points__icon {
width: 1.75rem !important;
height: 1.75rem !important;
font-size: 0.9rem !important;
}
body.page-product-detail .pdp-points__lead {
font-size: 0.78rem !important;
}
body.page-product-detail .pdp-points__balance {
display: none !important;
}
}
/* —— Attribute swatches → export color dots / text pills —— */
body.page-product-detail .product-attributes,
body.page-product-detail .bb-product-attribute-swatch,
body.page-product-detail .sea-pdp-attrs {
margin: 0 0 1.15rem !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
}
body.page-product-detail .sea-swatch-head,
body.page-product-detail .bb-product-attribute-swatch-header {
display: flex !important;
align-items: center !important;
flex-wrap: wrap !important;
gap: 0.65rem !important;
margin: 0 0 0.75rem !important;
padding: 0 !important;
}
body.page-product-detail .sea-swatch-title,
body.page-product-detail .bb-product-attribute-swatch-title {
position: static !important;
display: inline-flex !important;
align-items: baseline !important;
flex-wrap: wrap !important;
gap: 0.35rem !important;
margin: 0 !important;
padding: 0 !important;
font-size: 0.9rem !important;
font-weight: 900 !important;
color: var(--foreground) !important;
}
body.page-product-detail .bb-product-attribute-swatch-title-label {
font-weight: 900 !important;
}
body.page-product-detail .bb-product-attribute-swatch-title-value:not(:empty)::before {
content: "" !important;
}
body.page-product-detail .bb-product-attribute-swatch-title-value:not(:empty) {
color: var(--primary) !important;
font-weight: 900 !important;
font-size: 0.95rem !important;
}
body.page-product-detail .attribute-arrow-indicator {
display: none !important;
}
/* Clear / cancel selection — Sea chip (export-friendly cancel) */
body.page-product-detail .sea-swatch-clear,
body.page-product-detail .bb-swatch-clear-selection {
appearance: none !important;
border: 0 !important;
background: color-mix(in srgb, var(--destructive) 10%, #fff) !important;
color: var(--destructive) !important;
font-size: 0.75rem !important;
font-weight: 900 !important;
font-family: inherit !important;
line-height: 1 !important;
padding: 0.4rem 0.7rem !important;
border-radius: 999px !important;
display: none !important;
align-items: center !important;
gap: 0.25rem !important;
cursor: pointer !important;
margin-inline-start: auto !important;
box-shadow: none !important;
}
body.page-product-detail .sea-swatch-clear:not([hidden]),
body.page-product-detail .bb-swatch-clear-selection:not([hidden]),
body.page-product-detail .sea-swatch-clear.show,
body.page-product-detail .bb-swatch-clear-selection.show {
display: inline-flex !important;
}
body.page-product-detail .sea-swatch-clear:hover,
body.page-product-detail .bb-swatch-clear-selection:hover {
background: color-mix(in srgb, var(--destructive) 18%, #fff) !important;
}
body.page-product-detail .sea-swatch-list,
body.page-product-detail .bb-product-attribute-swatch-list,
body.page-product-detail ul.swatch-box-layout,
body.page-product-detail ul.visual-swatch,
body.page-product-detail ul.color-swatch {
display: flex !important;
flex-wrap: wrap !important;
gap: 0.65rem 0.75rem !important;
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
}
body.page-product-detail ul.sea-swatch-list--visual,
body.page-product-detail ul.visual-swatch.sea-swatch-list,
body.page-product-detail ul.visual-swatch.color-swatch {
display: flex !important;
flex-wrap: wrap !important;
gap: 0.65rem !important;
align-items: stretch !important;
justify-content: flex-start !important;
max-width: none !important;
}
body.page-product-detail .swatch-box-item,
body.page-product-detail .bb-product-attribute-swatch-item {
width: auto !important;
min-width: 0 !important;
margin: 0 !important;
padding: 0 !important;
float: none !important;
border: 0 !important;
background: transparent !important;
box-shadow: none !important;
flex: 0 0 auto !important;
transform: none !important;
}
body.page-product-detail ul.visual-swatch > .swatch-box-item,
body.page-product-detail ul.sea-swatch-list--visual > .swatch-box-item,
body.page-product-detail ul.visual-swatch > .bb-product-attribute-swatch-item {
width: 6.85rem !important;
max-width: 6.85rem !important;
flex: 0 0 6.85rem !important;
}
body.page-product-detail .sea-swatch,
body.page-product-detail .swatch-box-label {
position: relative !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
box-shadow: none !important;
min-width: 0 !important;
width: 100% !important;
cursor: pointer !important;
transform: none !important;
}
body.page-product-detail ul.visual-swatch .sea-swatch,
body.page-product-detail ul.sea-swatch-list--visual .sea-swatch,
body.page-product-detail ul.visual-swatch .swatch-box-label {
padding: 0 !important;
border: 2px solid #e8eaed !important;
border-radius: 0.5rem !important;
background: #fff !important;
gap: 0 !important;
height: 100% !important;
overflow: hidden !important;
box-sizing: border-box !important;
box-shadow: none !important;
transition: border-color 0.15s ease !important;
}
body.page-product-detail ul.visual-swatch .sea-swatch:hover,
body.page-product-detail ul.sea-swatch-list--visual .sea-swatch:hover {
border-color: var(--primary, #0077b6) !important;
box-shadow: none !important;
}
body.page-product-detail ul.visual-swatch .sea-swatch:has(input:checked),
body.page-product-detail ul.sea-swatch-list--visual .sea-swatch:has(input:checked),
body.page-product-detail ul.visual-swatch .swatch-box-item:has(input:checked) .swatch-box-label {
border-color: var(--primary, #0077b6) !important;
border-width: 2px !important;
box-shadow: none !important;
}
body.page-product-detail .sea-swatch:hover,
body.page-product-detail .swatch-box-label:hover,
body.page-product-detail .swatch-box-item:hover,
body.page-product-detail .bb-product-attribute-swatch-item:hover,
body.page-product-detail .swatch-box-item:hover .swatch-box-content,
body.page-product-detail .swatch-box-item:hover .swatch-box-label {
transform: none !important;
margin: 0 !important;
}
body.page-product-detail .sea-swatch input,
body.page-product-detail .swatch-box-item input.product-filter-item {
position: absolute !important;
opacity: 0 !important;
pointer-events: none !important;
width: 0 !important;
height: 0 !important;
}
body.page-product-detail .sea-swatch__dot,
body.page-product-detail .bb-product-attribute-swatch-display,
body.page-product-detail span.bb-product-attribute-swatch-display {
position: relative !important;
display: grid !important;
place-items: center !important;
inset: auto !important;
top: auto !important;
right: auto !important;
bottom: auto !important;
left: auto !important;
inset-inline: auto !important;
width: 100% !important;
height: auto !important;
min-width: 0 !important;
min-height: 0 !important;
max-width: none !important;
max-height: none !important;
aspect-ratio: 1 / 1 !important;
border-radius: 0 !important;
border: 0 !important;
box-shadow: none !important;
overflow: hidden !important;
background-image: none !important;
background-size: contain !important;
background-position: center center !important;
background-repeat: no-repeat !important;
background-color: #f7f8fa !important;
transition: none !important;
transform: none !important;
-webkit-transform: none !important;
margin: 0 !important;
padding: 0 !important;
box-sizing: border-box !important;
}
body.page-product-detail .sea-swatch__dot::before,
body.page-product-detail .sea-swatch__dot::after,
body.page-product-detail .bb-product-attribute-swatch-display::before,
body.page-product-detail .bb-product-attribute-swatch-display::after {
content: none !important;
display: none !important;
}
body.page-product-detail ul.visual-swatch .sea-swatch:hover .sea-swatch__dot,
body.page-product-detail ul.visual-swatch .sea-swatch:has(input:checked) .sea-swatch__dot,
body.page-product-detail ul.sea-swatch-list--visual .sea-swatch:has(input:checked) .sea-swatch__dot,
body.page-product-detail .swatch-box-item:hover .bb-product-attribute-swatch-display,
body.page-product-detail .swatch-box-item:has(input:checked) .bb-product-attribute-swatch-display,
body.page-product-detail .swatch-box-item input:checked + .sea-swatch__dot,
body.page-product-detail .swatch-box-item:has(input:checked) span.bb-product-attribute-swatch-display {
transform: none !important;
border: 0 !important;
box-shadow: none !important;
}
body.page-product-detail ul.visual-swatch .sea-swatch:has(input:checked) .sea-swatch__dot::after,
body.page-product-detail ul.sea-swatch-list--visual .sea-swatch:has(input:checked) .sea-swatch__dot::after {
content: none !important;
}
/* Visual/image swatches: kill legacy card chrome that reflows on hover */
body.page-product-detail .visual-swatch .swatch-box-content,
body.page-product-detail ul.visual-swatch .swatch-box-content,
body.page-product-detail .color-swatch .swatch-box-content {
border: 0 !important;
padding: 0 !important;
margin: 0 !important;
min-width: 0 !important;
background: transparent !important;
box-shadow: none !important;
border-radius: 0 !important;
}
body.page-product-detail .visual-swatch .swatch-box-content:hover,
body.page-product-detail ul.visual-swatch .swatch-box-content:hover {
border: 0 !important;
box-shadow: none !important;
transform: none !important;
}
body.page-product-detail .sea-swatch-list--text .swatch-box-label:hover,
body.page-product-detail .text-swatch .swatch-box-label:hover {
border-color: #94a3b8 !important;
}
body.page-product-detail .sea-swatch__img {
width: 100% !important;
height: 100% !important;
max-width: 100% !important;
max-height: 100% !important;
object-fit: contain !important;
object-position: center center !important;
padding: 0.5rem !important;
margin: 0 !important;
display: block !important;
border: 0 !important;
transform: none !important;
}
body.page-product-detail .sea-swatch__text {
font-size: 0.65rem !important;
font-weight: 900 !important;
color: #0f172a !important;
line-height: 1 !important;
}
body.page-product-detail .swatch-out-of-stock .sea-swatch__img {
opacity: 0.55 !important;
filter: grayscale(0.2);
}
body.page-product-detail .sea-swatch__oos {
position: absolute !important;
inset: 0 !important;
display: grid !important;
place-items: end center !important;
padding: 0.35rem !important;
background: linear-gradient(to top, rgb(127 29 29 / 78%), rgb(15 23 42 / 12%) 52%, transparent) !important;
z-index: 2 !important;
}
body.page-product-detail .sea-swatch__oos span {
display: inline-block !important;
background: #7f1d1d !important;
color: #fff !important;
font-size: 0.62rem !important;
font-weight: 900 !important;
line-height: 1 !important;
padding: 0.22rem 0.42rem !important;
border-radius: 999px !important;
white-space: nowrap !important;
}
body.page-product-detail .swatch-box-item.disabled {
opacity: 0.45 !important;
}
body.page-product-detail .swatch-box-item.swatch-out-of-stock {
opacity: 1 !important;
}
/* Hide legacy box chrome (names / tooltips / arrows) — prices stay visible */
body.page-product-detail .swatch-box-attribute-name-row,
body.page-product-detail .bb-product-attribute-swatch-item-tooltip,
body.page-product-detail .attribute-arrow-indicator,
body.page-product-detail .swatch-box-content > .swatch-box-row:not(.swatch-box-image-row):not(.swatch-box-price-row):not(.swatch-box-text-row),
body.page-product-detail .visually-hidden {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border: 0 !important;
font-size: 0 !important;
opacity: 0 !important;
pointer-events: none !important;
}
/* Text attribute pills */
body.page-product-detail .sea-swatch-list--text .swatch-box-label,
body.page-product-detail .text-swatch .swatch-box-label {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: auto !important;
min-height: 2.5rem !important;
padding: 0.45rem 0.95rem !important;
border-radius: 0.85rem !important;
border: 2px solid rgba(203, 213, 225, 0.7) !important;
background: #fff !important;
font-size: 0.875rem !important;
font-weight: 800 !important;
color: var(--foreground) !important;
transition: border-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease !important;
}
body.page-product-detail .sea-swatch-list--text .swatch-box-item:has(input:checked) .swatch-box-label,
body.page-product-detail .text-swatch .swatch-box-item input:checked + .swatch-box-content,
body.page-product-detail .text-swatch .swatch-box-item:has(input:checked) .swatch-box-label {
border-color: var(--primary) !important;
box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 18%, transparent) !important;
color: var(--primary) !important;
}
body.page-product-detail .sea-swatch-list--text .swatch-box-attribute-name-row,
body.page-product-detail .text-swatch .swatch-box-attribute-name-row {
position: static !important;
width: auto !important;
height: auto !important;
margin: 0 !important;
clip: auto !important;
overflow: visible !important;
font-size: inherit !important;
opacity: 1 !important;
pointer-events: auto !important;
white-space: normal !important;
display: block !important;
}
body.page-product-detail .sea-swatch-list--text .swatch-box-image-row,
body.page-product-detail .text-swatch .swatch-box-image-row {
display: none !important;
}
body.page-product-detail .visual-swatch .swatch-box-price-row,
body.page-product-detail .color-swatch .swatch-box-price-row,
body.page-product-detail .sea-swatch__price,
body.page-product-detail .text-swatch .swatch-box-price-row,
body.page-product-detail .sea-swatch-list--text .swatch-box-price-row {
position: static !important;
display: block !important;
width: 100% !important;
height: auto !important;
margin: 0 !important;
padding: 0 !important;
clip: auto !important;
overflow: visible !important;
opacity: 1 !important;
pointer-events: none !important;
white-space: nowrap !important;
text-align: center !important;
}
body.page-product-detail .sea-swatch__meta {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
gap: 0.1rem !important;
width: 100% !important;
min-width: 0 !important;
padding: 0.4rem 0.3rem 0.5rem !important;
border-top: 0 !important;
background: #fff !important;
}
body.page-product-detail ul.visual-swatch .sea-swatch__name,
body.page-product-detail ul.sea-swatch-list--visual .sea-swatch__name {
display: -webkit-box !important;
overflow: hidden !important;
width: 100% !important;
color: #172033 !important;
font-size: 0.68rem !important;
font-weight: 900 !important;
line-height: 1.3 !important;
text-align: center !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 2 !important;
}
body.page-product-detail ul.visual-swatch .sea-swatch__price,
body.page-product-detail ul.sea-swatch-list--visual .sea-swatch__price {
display: block !important;
}
body.page-product-detail ul.visual-swatch .swatch-price-original,
body.page-product-detail ul.sea-swatch-list--visual .swatch-price-original {
display: block !important;
}
body.page-product-detail .visual-swatch .swatch-price,
body.page-product-detail .color-swatch .swatch-price,
body.page-product-detail .sea-swatch__price .swatch-price,
body.page-product-detail .text-swatch .swatch-price,
body.page-product-detail .sea-swatch-list--text .swatch-price {
position: static !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
gap: 0.1rem !important;
width: 100% !important;
height: auto !important;
margin: 0 !important;
clip: auto !important;
overflow: visible !important;
opacity: 1 !important;
font-size: 0.68rem !important;
font-weight: 800 !important;
line-height: 1.25 !important;
color: var(--primary) !important;
font-variant-numeric: tabular-nums !important;
}
body.page-product-detail .swatch-price-current {
color: var(--primary, #0077b6) !important;
font-weight: 800 !important;
font-size: 0.84rem !important;
line-height: 1.2 !important;
max-width: 100% !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
order: -1 !important;
}
body.page-product-detail .swatch-box-item:has(input:checked) .swatch-price-current,
body.page-product-detail .bb-product-attribute-swatch-item:has(input:checked) .swatch-price-current {
color: var(--primary) !important;
}
body.page-product-detail .swatch-price-original {
color: var(--muted-foreground, #64748b) !important;
font-size: 0.62rem !important;
font-weight: 700 !important;
text-decoration: line-through !important;
}
body.page-product-detail .text-swatch .swatch-box-content,
body.page-product-detail .sea-swatch-list--text .swatch-box-content {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
gap: 0.2rem !important;
}
/* —— Availability / wholesale —— */
body.page-product-detail .product-availability,
body.page-product-detail .pdp-stock-wrap,
body.page-product-detail .number-items-available {
display: block !important;
margin: 0 0 1rem !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
}
body.page-product-detail .pdp-stock {
display: flex !important;
align-items: center !important;
gap: 0.7rem !important;
padding: 0.75rem 0.9rem !important;
border-radius: 0.95rem !important;
border: 0 !important;
}
body.page-product-detail .pdp-stock--ok {
background: #ecfdf5 !important;
border-color: #a7f3d0 !important;
color: #047857 !important;
}
body.page-product-detail .pdp-stock--warn {
background: #fffbeb !important;
border-color: #fde68a !important;
color: #b45309 !important;
}
body.page-product-detail .pdp-stock--oos {
background: #fef2f2 !important;
border-color: #fecaca !important;
color: #991b1b !important;
}
body.page-product-detail .pdp-stock__icon {
width: 2.15rem !important;
height: 2.15rem !important;
flex-shrink: 0 !important;
display: grid !important;
place-items: center !important;
border-radius: 999px !important;
background: #fff !important;
font-size: 1.2rem !important;
}
body.page-product-detail .pdp-stock__copy {
display: grid !important;
gap: 0.08rem !important;
min-width: 0 !important;
flex: 1 !important;
}
body.page-product-detail .pdp-stock__copy strong {
font-size: 0.95rem !important;
font-weight: 900 !important;
line-height: 1.3 !important;
}
body.page-product-detail .pdp-stock__copy small {
font-size: 0.72rem !important;
font-weight: 700 !important;
opacity: 0.82 !important;
line-height: 1.35 !important;
}
/* Fallback if AJAX ever injects plain Bootstrap text spans */
body.page-product-detail .number-items-available > .text-success,
body.page-product-detail .number-items-available > .text-danger,
body.page-product-detail .number-items-available > .text-warning {
display: flex !important;
align-items: center !important;
gap: 0.7rem !important;
padding: 0.75rem 0.9rem !important;
border-radius: 0.95rem !important;
font-size: 0.95rem !important;
font-weight: 900 !important;
line-height: 1.3 !important;
margin: 0 !important;
}
body.page-product-detail .number-items-available > .text-success {
background: #ecfdf5 !important;
border: 0 !important;
color: #047857 !important;
}
body.page-product-detail .number-items-available > .text-danger {
background: #fef2f2 !important;
border: 0 !important;
color: #991b1b !important;
}
body.page-product-detail .number-items-available > .text-warning {
background: #fffbeb !important;
border: 0 !important;
color: #b45309 !important;
}
body.page-product-detail .pdp-stock__ask {
flex-shrink: 0 !important;
appearance: none !important;
border: 0 !important;
font-family: inherit !important;
cursor: pointer !important;
background: #7f1d1d !important;
color: #fff !important;
font-size: 0.72rem !important;
font-weight: 900 !important;
padding: 0.42rem 0.75rem !important;
border-radius: 999px !important;
text-decoration: none !important;
white-space: nowrap !important;
}
body.page-product-detail .swatch-out-of-stock-x,
body.page-product-detail .swatch-out-of-stock-label {
position: static !important;
width: auto !important;
height: auto !important;
margin: 0.15rem 0 0 !important;
padding: 0.15rem 0.4rem !important;
overflow: visible !important;
clip: auto !important;
font-size: 0.62rem !important;
font-weight: 900 !important;
opacity: 1 !important;
pointer-events: none !important;
display: inline-block !important;
background: #7f1d1d !important;
color: #fff !important;
border-radius: 999px !important;
white-space: nowrap !important;
}
body.page-product-detail .sea-pdp-tiers,
body.page-product-detail .variation-wholesale-pricing-section {
margin: 0 0 1.15rem !important;
}
body.page-product-detail .sea-pdp-tiers__title {
font-family: var(--font-heading, inherit) !important;
}
body.page-product-detail .tp-product-details-price-block .minimum-order,
body.page-product-detail .minimum-order-quantity,
body.page-product-detail [class*="min-order"],
body.page-product-detail .tp-product-details-price-block .text-muted {
font-size: 0.8125rem !important;
font-weight: 700 !important;
color: var(--muted-foreground) !important;
}
/* Kill leftover red price/badge from old wholesale chrome */
body.page-product-detail .wholesale-b2b-value-badge {
display: none !important;
}
body.page-product-detail .tp-product-details-price.new-price,
body.page-product-detail .pdp-price__current {
color: var(--primary) !important;
}
/* —— Actions (export qty + cart row) —— */
body.page-product-detail .pdp-actions,
body.page-product-detail .tp-product-details-action-wrapper {
display: grid !important;
gap: 0.85rem !important;
margin-top: 0.35rem !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
}
body.page-product-detail .pdp-actions__label {
display: none !important;
}
body.page-product-detail .pdp-actions__row {
display: flex !important;
flex-wrap: wrap !important;
align-items: stretch !important;
gap: 1rem !important;
margin: 0 !important;
width: 100% !important;
}
body.page-product-detail .tp-product-details-quantity,
body.page-product-detail .pdp-actions__cart-wrap {
margin: 0 !important;
padding: 0 !important;
width: auto !important;
float: none !important;
}
body.page-product-detail .pdp-actions__cart-wrap {
flex: 1 1 auto !important;
min-width: 12rem !important;
}
body.page-product-detail .pdp-qty,
body.page-product-detail .tp-product-quantity {
display: inline-flex !important;
align-items: center !important;
height: 3.25rem !important;
margin: 0 !important;
padding: 0 !important;
background: var(--muted, #f1f5f9) !important;
border: 0 !important;
border-radius: 0.85rem !important;
overflow: hidden !important;
width: auto !important;
}
body.page-product-detail .pdp-qty__btn,
body.page-product-detail .tp-cart-minus,
body.page-product-detail .tp-cart-plus {
width: 3rem !important;
height: 3.25rem !important;
display: grid !important;
place-items: center !important;
border: 0 !important;
background: transparent !important;
box-shadow: none !important;
font-size: 1.25rem !important;
font-weight: 900 !important;
color: var(--foreground) !important;
cursor: pointer !important;
line-height: 1 !important;
}
body.page-product-detail .pdp-qty__btn:disabled,
body.page-product-detail .tp-cart-minus:disabled,
body.page-product-detail .tp-cart-plus:disabled {
opacity: 0.35 !important;
cursor: not-allowed !important;
}
body.page-product-detail .pdp-qty__input,
body.page-product-detail .tp-cart-input,
body.page-product-detail .tp-product-details-quantity .tp-cart-input[type=number] {
width: 3rem !important;
height: 3.25rem !important;
border: 0 !important;
background: transparent !important;
text-align: center !important;
font-weight: 900 !important;
font-size: 1.05rem !important;
color: var(--foreground) !important;
box-shadow: none !important;
-moz-appearance: textfield;
}
body.page-product-detail .tp-cart-input::-webkit-outer-spin-button,
body.page-product-detail .tp-cart-input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
body.page-product-detail .pdp-actions__cart,
body.page-product-detail .tp-product-details-add-to-cart-btn {
width: 100% !important;
min-height: 3.25rem !important;
height: auto !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 0.55rem !important;
background: var(--primary) !important;
color: #fff !important;
border: 0 !important;
border-radius: 0.85rem !important;
font-weight: 900 !important;
font-size: 1.1rem !important;
box-shadow: 0 12px 28px rgb(0 119 182 / 30%) !important;
padding: 0.75rem 1.25rem !important;
text-decoration: none !important;
}
body.page-product-detail .pdp-actions__cart::before,
body.page-product-detail .pdp-actions__cart::after,
body.page-product-detail .tp-product-details-add-to-cart-btn::before,
body.page-product-detail .tp-product-details-add-to-cart-btn::after,
body.page-product-detail .tp-product-details-buy-now-btn::before,
body.page-product-detail .tp-product-details-buy-now-btn::after {
content: none !important;
display: none !important;
background: none !important;
width: 0 !important;
height: 0 !important;
}
body.page-product-detail .pdp-actions__cart.is-sea-busy .sea-busy-dot,
body.page-product-detail .pdp-actions__cart.btn-loading .sea-busy-dot,
body.page-product-detail .tp-product-details-add-to-cart-btn.is-sea-busy .sea-busy-dot,
body.page-product-detail .tp-product-details-add-to-cart-btn.btn-loading .sea-busy-dot {
width: 1.35rem;
height: 1.35rem;
}
body.page-product-detail .pdp-actions__buy,
body.page-product-detail .tp-product-details-buy-now-btn {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
min-height: 3.5rem !important;
background: var(--secondary) !important;
color: #0f172a !important;
border: 0 !important;
border-bottom: 4px solid #d97706 !important;
border-radius: 0.85rem !important;
font-weight: 900 !important;
font-size: 1.1rem !important;
box-shadow: 0 8px 18px rgb(255 183 3 / 28%) !important;
padding: 0.85rem 1.25rem !important;
margin: 0 !important;
}
body.page-product-detail .pdp-actions__tip {
display: flex !important;
align-items: center !important;
gap: 0.4rem !important;
margin: 0 !important;
font-size: 0.75rem !important;
font-weight: 800 !important;
color: var(--muted-foreground) !important;
}
body.page-product-detail .tp-product-details-action-sm {
display: flex !important;
flex-wrap: wrap !important;
gap: 0.55rem !important;
margin-top: 0.75rem !important;
padding: 0 !important;
border: 0 !important;
}
body.page-product-detail .tp-product-details-action-sm-btn {
display: inline-flex !important;
align-items: center !important;
gap: 0.35rem !important;
background: var(--card) !important;
border: 0 !important;
border-radius: 0.75rem !important;
font-weight: 800 !important;
color: var(--foreground) !important;
padding: 0.55rem 0.85rem !important;
box-shadow: none !important;
}
body.page-product-detail .tp-product-details-query {
margin-top: 0.85rem !important;
font-size: 0.85rem !important;
font-weight: 700 !important;
color: var(--muted-foreground) !important;
}
/* Perks */
body.page-product-detail .pdp-perks {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 0.75rem 1rem !important;
margin-top: 1.15rem !important;
padding-top: 1.15rem !important;
border-top: 0 !important;
}
body.page-product-detail .pdp-perks__item {
display: flex !important;
align-items: center !important;
gap: 0.45rem !important;
font-size: 0.8rem !important;
font-weight: 800 !important;
}
body.page-product-detail .pdp-perks__item iconify-icon {
font-size: 1.25rem !important;
color: var(--primary) !important;
flex-shrink: 0 !important;
}
/* Matching styles */
body.page-product-detail .sea-matching-styles {
margin-top: 1.25rem !important;
}
/* Tabs */
body.page-product-detail .pdp-details,
body.page-product-detail .sea-pdp-tabs {
margin-top: 2.5rem !important;
}
body.page-product-detail .sea-pdp-tabs__nav {
display: flex !important;
overflow-x: auto !important;
border-bottom: 0 !important;
margin-bottom: 1.25rem !important;
gap: 0 !important;
}
body.page-product-detail .sea-pdp-tabs__btn {
appearance: none !important;
background: transparent !important;
border: 0 !important;
border-bottom: 4px solid transparent !important;
padding: 0.85rem 1.35rem !important;
font-weight: 800 !important;
color: var(--muted-foreground) !important;
white-space: nowrap !important;
border-radius: 0 !important;
box-shadow: none !important;
}
body.page-product-detail .sea-pdp-tabs__btn.is-active {
color: var(--primary) !important;
border-bottom-color: var(--primary) !important;
font-weight: 900 !important;
background: transparent !important;
}
body.page-product-detail .sea-pdp-tabs__content {
max-width: 48rem !important;
font-weight: 600 !important;
line-height: 1.8 !important;
color: color-mix(in srgb, var(--foreground) 82%, transparent) !important;
}
@media (min-width: 992px) {
body.page-product-detail .sea-pdp-tabs {
margin-top: 3rem !important;
padding: 0.75rem !important;
border: 0 !important;
border-radius: 1.4rem !important;
background: linear-gradient(145deg, #f8fcff, #f1f8fc) !important;
box-shadow: 0 16px 42px rgb(15 23 42 / 7%) !important;
}
body.page-product-detail .sea-pdp-tabs__nav {
width: fit-content !important;
max-width: 100% !important;
display: flex !important;
align-items: center !important;
gap: 0.35rem !important;
margin: 0 0 0.75rem !important;
padding: 0.35rem !important;
border: 0 !important;
border-radius: 1rem !important;
background: rgb(226 240 248 / 72%) !important;
}
body.page-product-detail .sea-pdp-tabs__btn {
min-height: 2.85rem !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 0.45rem !important;
padding: 0.65rem 1rem !important;
border: 0 !important;
border-radius: 0.75rem !important;
color: #526176 !important;
background: transparent !important;
font-size: 0.9rem !important;
transition: color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease !important;
}
body.page-product-detail .sea-pdp-tabs__btn iconify-icon {
color: #7b8da3 !important;
font-size: 1.15rem !important;
transition: color 0.18s ease !important;
}
body.page-product-detail .sea-pdp-tabs__btn:hover {
color: var(--primary, #0077b6) !important;
background: rgb(255 255 255 / 58%) !important;
}
body.page-product-detail .sea-pdp-tabs__btn.is-active {
color: var(--primary, #0077b6) !important;
background: #fff !important;
box-shadow: 0 6px 16px rgb(0 119 182 / 12%) !important;
transform: translateY(-1px) !important;
}
body.page-product-detail .sea-pdp-tabs__btn.is-active iconify-icon {
color: var(--primary, #0077b6) !important;
}
body.page-product-detail .sea-pdp-tabs__count {
min-width: 1.45rem !important;
height: 1.45rem !important;
display: grid !important;
place-items: center !important;
padding: 0 0.3rem !important;
border-radius: 999px !important;
background: rgb(100 116 139 / 12%) !important;
color: #64748b !important;
font-size: 0.68rem !important;
font-weight: 900 !important;
}
body.page-product-detail .sea-pdp-tabs__btn.is-active .sea-pdp-tabs__count {
background: rgb(0 119 182 / 10%) !important;
color: var(--primary, #0077b6) !important;
}
body.page-product-detail .sea-pdp-tabs__panels {
border: 0 !important;
border-radius: 1.05rem !important;
background: #fff !important;
overflow: hidden !important;
}
body.page-product-detail .sea-pdp-tabs__panel {
max-width: none !important;
min-height: 0 !important;
padding: 1.45rem 1.6rem 1.65rem !important;
}
body.page-product-detail .sea-pdp-tabs__panel-head {
max-width: 72rem !important;
display: flex !important;
align-items: center !important;
gap: 0.75rem !important;
margin: 0 auto 1.15rem !important;
padding-bottom: 1rem !important;
border-bottom: 0 !important;
}
body.page-product-detail .sea-pdp-tabs__panel-icon {
width: 2.7rem !important;
height: 2.7rem !important;
flex: 0 0 auto !important;
display: grid !important;
place-items: center !important;
border-radius: 0.85rem !important;
background: rgb(0 119 182 / 9%) !important;
color: var(--primary, #0077b6) !important;
font-size: 1.35rem !important;
}
body.page-product-detail .sea-pdp-tabs__panel-head > span:last-child {
display: grid !important;
gap: 0.15rem !important;
}
body.page-product-detail .sea-pdp-tabs__panel-head strong {
color: #0f172a !important;
font-size: 1.05rem !important;
font-weight: 900 !important;
}
body.page-product-detail .sea-pdp-tabs__panel-head small {
color: #64748b !important;
font-size: 0.76rem !important;
font-weight: 700 !important;
}
body.page-product-detail .sea-pdp-tabs__content {
max-width: 72rem !important;
margin-inline: auto !important;
font-size: 1rem !important;
font-weight: 600 !important;
line-height: 2 !important;
color: #3f4d61 !important;
}
body.page-product-detail .sea-pdp-tabs__content > :first-child {
margin-top: 0 !important;
}
body.page-product-detail .sea-pdp-tabs__content > :last-child {
margin-bottom: 0 !important;
}
body.page-product-detail .sea-pdp-tabs__content p {
margin-bottom: 0.85rem !important;
}
body.page-product-detail .sea-pdp-tabs__content ul,
body.page-product-detail .sea-pdp-tabs__content ol {
display: grid !important;
gap: 0.5rem !important;
margin: 0.8rem 0 0 !important;
padding-inline-start: 1.25rem !important;
}
}
/* —— Attribute missing: whale mascot speech bubble —— */
@keyframes sea-attr-shake {
0%, 100% { transform: translateX(0); }
20% { transform: translateX(-5px); }
40% { transform: translateX(5px); }
60% { transform: translateX(-3px); }
80% { transform: translateX(3px); }
}
@keyframes sea-attr-alert-in {
from {
opacity: 0;
transform: translateY(8px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@keyframes sea-attr-whale-bob {
0%, 100% { transform: translateY(0) rotate(0deg); }
35% { transform: translateY(-5px) rotate(-6deg); }
70% { transform: translateY(2px) rotate(4deg); }
}
.sea-attr-alert {
display: flex;
flex-direction: row;
direction: ltr;
align-items: center;
gap: 0.15rem;
margin: 0 0 0.55rem;
padding: 0;
background: transparent;
color: inherit;
font-size: 0.86rem;
font-weight: 800;
line-height: 1.35;
opacity: 0;
}
.sea-attr-alert.is-show {
opacity: 1;
animation: sea-attr-alert-in 0.28s ease-out both;
}
.sea-attr-alert__whale {
flex: 0 0 auto;
display: block;
width: 4.35rem;
height: auto;
margin: 0.55rem 0 0;
filter: drop-shadow(0 8px 12px rgb(0 119 182 / 22%));
pointer-events: none;
user-select: none;
}
.sea-attr-alert.is-show .sea-attr-alert__whale {
animation: sea-attr-whale-bob 0.7s ease-in-out 3;
}
.sea-attr-alert__bubble {
direction: rtl;
display: flex;
align-items: center;
gap: 0.4rem;
flex: 1;
min-width: 0;
position: relative;
margin: 0;
padding: 0.62rem 0.75rem 0.62rem 0.5rem;
border-radius: 1.15rem 1.15rem 1.15rem 0.28rem;
background: #dc2626;
color: #fff;
border: 0;
box-shadow: 0 10px 24px rgb(220 38 38 / 28%);
}
.sea-attr-alert__bubble::before {
content: "";
position: absolute;
left: -0.32rem;
top: 48%;
bottom: auto;
width: 0.72rem;
height: 0.72rem;
background: #dc2626;
border: 0;
transform: translateY(-50%) rotate(45deg);
}
.sea-attr-alert.is-show .sea-attr-alert__bubble {
animation: sea-attr-shake 0.45s ease-in-out 0.12s 1;
}
.sea-attr-alert__msg {
flex: 1;
min-width: 0;
}
.sea-attr-alert__close {
flex-shrink: 0;
display: grid;
place-items: center;
width: 1.7rem;
height: 1.7rem;
margin: 0;
padding: 0;
border: 0;
border-radius: 0.7rem;
background: rgb(255 255 255 / 18%);
color: #fff;
cursor: pointer;
}
.sea-attr-alert__close iconify-icon {
font-size: 1.05rem;
}
.sea-attr-alert__close:hover {
background: rgb(255 255 255 / 28%);
}
@media (max-width: 767px) {
.sea-attr-alert__whale {
width: 3.85rem;
}
}
@media (prefers-reduced-motion: reduce) {
.sea-attr-alert.is-show,
.sea-attr-alert.is-show .sea-attr-alert__whale,
.sea-attr-alert.is-show .sea-attr-alert__bubble {
animation: none !important;
}
}
/* Mobile sticky — cart summary dock */
@media (max-width: 767px) {
body.page-product-detail .order-sticky {
display: flex !important;
}
}
/* —— Prev / next product pager (top of PDP) —— */
body.page-product-detail .sea-pdp-pager {
display: grid !important;
grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
align-items: center !important;
gap: 0.55rem 0.75rem !important;
width: 100% !important;
margin: 0 0 1rem !important;
padding: 0.5rem !important;
background: #fff !important;
border: 0 !important;
border-radius: 1.15rem !important;
box-shadow: 0 10px 28px rgb(2 48 71 / 6%) !important;
}
body.page-product-detail .sea-pdp-pager__link {
display: flex !important;
align-items: center !important;
gap: 0.55rem !important;
min-width: 0 !important;
max-width: 100% !important;
padding: 0.4rem 0.5rem !important;
text-decoration: none !important;
color: inherit !important;
border-radius: 0.9rem !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
transition: background 0.18s ease, transform 0.18s ease !important;
}
body.page-product-detail .sea-pdp-pager__link.is-next {
justify-content: flex-end !important;
text-align: end !important;
}
body.page-product-detail .sea-pdp-pager__link.is-disabled {
visibility: hidden !important;
pointer-events: none !important;
}
body.page-product-detail .sea-pdp-pager__link:hover {
background: #f0f9ff !important;
color: inherit !important;
transform: translateY(-1px);
}
body.page-product-detail .sea-pdp-pager__arrow {
width: 1.9rem !important;
height: 1.9rem !important;
flex-shrink: 0 !important;
display: grid !important;
place-items: center !important;
border-radius: 999px !important;
background: color-mix(in srgb, var(--primary, #0077b6) 12%, #fff) !important;
color: var(--primary, #0077b6) !important;
font-size: 1rem !important;
}
body.page-product-detail .sea-pdp-pager__link:hover .sea-pdp-pager__arrow {
background: var(--primary, #0077b6) !important;
color: #fff !important;
}
body.page-product-detail .sea-pdp-pager__thumb {
width: 2.7rem !important;
height: 2.7rem !important;
flex-shrink: 0 !important;
border-radius: 0.8rem !important;
overflow: hidden !important;
background: linear-gradient(145deg, #f0f9ff, #e2e8f0) !important;
border: 0 !important;
}
body.page-product-detail .sea-pdp-pager__thumb img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
display: block !important;
}
body.page-product-detail .sea-pdp-pager__text {
display: flex !important;
flex-direction: column !important;
gap: 0.1rem !important;
min-width: 0 !important;
}
body.page-product-detail .sea-pdp-pager__label {
display: block !important;
font-size: 0.68rem !important;
font-weight: 800 !important;
color: var(--primary, #0077b6) !important;
line-height: 1.2 !important;
}
body.page-product-detail .sea-pdp-pager__name {
display: -webkit-box !important;
-webkit-line-clamp: 1 !important;
-webkit-box-orient: vertical !important;
overflow: hidden !important;
font-size: 0.8rem !important;
font-weight: 800 !important;
line-height: 1.3 !important;
color: #0f172a !important;
}
body.page-product-detail .sea-pdp-pager__all {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 0.35rem !important;
flex-shrink: 0 !important;
padding: 0.5rem 0.95rem !important;
border-radius: 999px !important;
text-decoration: none !important;
font-size: 0.75rem !important;
font-weight: 900 !important;
color: #fff !important;
background: linear-gradient(135deg, #0077b6, #00b4d8) !important;
box-shadow: 0 8px 18px rgb(0 119 182 / 22%) !important;
white-space: nowrap !important;
border: 0 !important;
}
body.page-product-detail .sea-pdp-pager__all:hover {
color: #fff !important;
transform: translateY(-1px);
box-shadow: 0 10px 22px rgb(0 119 182 / 28%) !important;
}
body.page-product-detail .sea-pdp-pager__all iconify-icon {
font-size: 1rem !important;
color: #fff !important;
}
@media (max-width: 720px) {
body.page-product-detail .sea-pdp-pager {
grid-template-columns: 1fr 1fr !important;
gap: 0.45rem !important;
}
body.page-product-detail .sea-pdp-pager__all {
grid-column: 1 / -1 !important;
order: -1 !important;
width: 100% !important;
}
body.page-product-detail .sea-pdp-pager__name {
font-size: 0.74rem !important;
}
body.page-product-detail .sea-pdp-pager__thumb {
width: 2.4rem !important;
height: 2.4rem !important;
}
}
@media (prefers-reduced-motion: reduce) {
body.page-product-detail .sea-pdp-pager__link:hover,
body.page-product-detail .sea-pdp-pager__all:hover {
transform: none !important;
}
}
/* —— PDP sticky cart dock (count + total + checkout) —— */
body.page-product-detail .sea-pdp-sticky.order-sticky {
position: fixed !important;
inset-inline: 0.7rem !important;
bottom: calc(0.7rem + env(safe-area-inset-bottom, 0px)) !important;
z-index: 420 !important;
display: flex !important;
align-items: stretch !important;
width: auto !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
border-radius: 0 !important;
box-shadow: none !important;
backdrop-filter: none !important;
transition: opacity 0.22s ease, transform 0.28s ease !important;
}
body.page-product-detail:is(.sea-sheet-open, .sea-track-open, .modal-open, .sea-atc-confirm-open, .cartmini-opened, .sea-variant-picker-open) .sea-pdp-sticky.order-sticky,
body.page-product-detail:is(.sea-sheet-open, .sea-track-open, .modal-open, .sea-atc-confirm-open, .cartmini-opened, .sea-variant-picker-open) .sea-pdp-sticky,
body.page-product-detail:is(.sea-sheet-open, .sea-track-open, .modal-open, .sea-atc-confirm-open, .cartmini-opened, .sea-variant-picker-open) .sea-pdp-sticky--app,
body.page-product-detail:is(.sea-sheet-open, .sea-track-open, .modal-open, .sea-atc-confirm-open, .cartmini-opened, .sea-variant-picker-open) [data-sea-pdp-sticky],
body.page-product-detail:has(.sea-prequest-modal:not([hidden]), .sea-track-modal:not([hidden]), .sea-wholesale-modal:not([hidden]), .sea-feedback-modal:not([hidden]), .sea-vendor-modal.show, .sea-atc-confirm.is-open, .cartmini__area.cartmini-opened) .sea-pdp-sticky.order-sticky {
opacity: 0 !important;
visibility: hidden !important;
pointer-events: none !important;
}
body.page-product-detail .sea-pdp-sticky.order-sticky.is-empty {
opacity: 0 !important;
pointer-events: none !important;
transform: translateY(calc(100% + 1.25rem)) !important;
}
body.page-product-detail main,
body.page-product-detail #main-content,
body.page-product-detail .pdp-main,
body.page-product-detail .sea-shell {
padding-bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px)) !important;
}
body.page-product-detail .sea-pdp-sticky__inner {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 0.65rem !important;
width: 100% !important;
min-height: 3.45rem !important;
padding-block: 0.4rem !important;
padding-inline-start: 0.85rem !important;
padding-inline-end: 0.4rem !important;
background: linear-gradient(180deg, #eef9fd 0%, #dff3fa 100%) !important;
border: 0 !important;
border-radius: 1.05rem !important;
box-shadow: 0 14px 34px rgb(2 48 71 / 16%) !important;
}
body.page-product-detail .sea-pdp-sticky__cart {
display: inline-flex !important;
align-items: center !important;
gap: 0.5rem !important;
min-width: 0 !important;
flex: 1 1 auto !important;
padding: 0 !important;
text-decoration: none !important;
color: inherit !important;
background: transparent !important;
border: 0 !important;
border-radius: 0 !important;
}
body.page-product-detail .sea-pdp-sticky__cart:hover,
body.page-product-detail .sea-pdp-sticky__cart:focus-visible {
color: inherit !important;
}
body.page-product-detail .sea-pdp-sticky__icon {
display: grid !important;
place-items: center !important;
flex-shrink: 0 !important;
width: 1.7rem !important;
height: 1.7rem !important;
color: #0f172a !important;
font-size: 1.45rem !important;
}
body.page-product-detail .sea-pdp-sticky__copy {
display: inline-flex !important;
align-items: baseline !important;
flex-wrap: wrap !important;
gap: 0.35rem 0.65rem !important;
min-width: 0 !important;
}
body.page-product-detail .sea-pdp-sticky__copy [data-sea-pdp-cart-count] {
color: #0f172a !important;
font-size: 0.86rem !important;
font-weight: 800 !important;
line-height: 1.3 !important;
white-space: nowrap !important;
}
body.page-product-detail .sea-pdp-sticky__total {
color: var(--primary, #0077b6) !important;
font-size: 0.98rem !important;
font-weight: 900 !important;
line-height: 1.2 !important;
font-variant-numeric: tabular-nums !important;
white-space: nowrap !important;
}
body.page-product-detail .sea-pdp-sticky__total[hidden] {
display: none !important;
}
body.page-product-detail .sea-pdp-sticky__checkout {
display: inline-flex !important;
flex: 0 0 auto !important;
align-items: center !important;
justify-content: center !important;
min-height: 2.75rem !important;
min-width: 7.25rem !important;
padding: 0.55rem 1.15rem !important;
border: 0 !important;
border-radius: 0.8rem !important;
background: var(--secondary, #ffb703) !important;
color: #0f172a !important;
box-shadow: 0 8px 18px rgb(255 183 3 / 32%) !important;
font-size: 0.92rem !important;
font-weight: 900 !important;
line-height: 1 !important;
text-decoration: none !important;
white-space: nowrap !important;
transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease !important;
}
body.page-product-detail .sea-pdp-sticky__checkout[hidden] {
display: none !important;
}
body.page-product-detail .sea-pdp-sticky__checkout:hover,
body.page-product-detail .sea-pdp-sticky__checkout:focus-visible {
transform: translateY(-1px) !important;
box-shadow: 0 11px 22px rgb(255 183 3 / 40%) !important;
filter: brightness(1.03);
color: #0f172a !important;
}
body.page-product-detail .sea-pdp-sticky__checkout:focus-visible {
outline: 3px solid rgb(0 119 182 / 35%) !important;
outline-offset: 2px !important;
}
body.page-product-detail .sea-pdp-sticky__cart.is-bounce .sea-pdp-sticky__icon {
animation: sea-pdp-cart-wiggle 0.55s ease;
}
@keyframes sea-pdp-cart-wiggle {
0%, 100% { transform: rotate(0deg); }
25% { transform: rotate(-12deg); }
55% { transform: rotate(10deg); }
}
@media (min-width: 768px) {
body.page-product-detail .sea-pdp-sticky.order-sticky {
inset-inline: max(1rem, calc(50% - 22rem)) !important;
bottom: 1.1rem !important;
}
body.page-product-detail main,
body.page-product-detail #main-content,
body.page-product-detail .pdp-main,
body.page-product-detail .sea-shell {
padding-bottom: 6.25rem !important;
}
body.page-product-detail .sea-pdp-sticky__inner {
min-height: 3.65rem !important;
padding-block: 0.45rem !important;
padding-inline-start: 1rem !important;
padding-inline-end: 0.45rem !important;
border-radius: 1.15rem !important;
}
body.page-product-detail .sea-pdp-sticky__copy [data-sea-pdp-cart-count] {
font-size: 0.92rem !important;
}
body.page-product-detail .sea-pdp-sticky__total {
font-size: 1.05rem !important;
}
body.page-product-detail .sea-pdp-sticky__checkout {
min-width: 8.25rem !important;
min-height: 2.9rem !important;
font-size: 0.98rem !important;
}
}
@media (max-width: 420px) {
body.page-product-detail .sea-pdp-sticky__copy [data-sea-pdp-cart-count] {
font-size: 0.76rem !important;
}
body.page-product-detail .sea-pdp-sticky__total {
font-size: 0.86rem !important;
}
body.page-product-detail .sea-pdp-sticky__checkout {
min-width: 0 !important;
padding-inline: 0.85rem !important;
font-size: 0.82rem !important;
}
}
@media (prefers-reduced-motion: reduce) {
body.page-product-detail .sea-pdp-sticky.order-sticky,
body.page-product-detail .sea-pdp-sticky__checkout {
transition: none !important;
}
body.page-product-detail .sea-pdp-sticky__cart.is-bounce .sea-pdp-sticky__icon {
animation: none !important;
}
}
/* —— Large variation sets: compact trigger + searchable picker —— */
body.page-product-detail.sea-variant-picker-open {
overflow: hidden !important;
}
body.page-product-detail .sea-variant-picker-enhanced {
position: relative !important;
margin-bottom: 1rem !important;
}
body.page-product-detail .sea-variant-picker-enhanced > .sea-swatch-head {
margin-bottom: 0.55rem !important;
}
body.page-product-detail .sea-variant-picker-enhanced > .sea-swatch-head .sea-swatch-clear {
display: none !important;
}
body.page-product-detail .sea-variant-summary {
display: none !important;
}
body.page-product-detail .sea-variant-rail,
body.sea-app.page-product-detail .sea-variant-rail,
body.sea-app.single-product .sea-variant-rail {
display: flex !important;
flex-direction: row !important;
align-items: stretch !important;
gap: 0.5rem !important;
min-width: 0 !important;
width: 100% !important;
}
body.page-product-detail .sea-variant-picker-enhanced.is-picker-open .sea-variant-rail {
visibility: hidden !important;
}
body.page-product-detail .sea-variant-rail > ul.visual-swatch,
body.page-product-detail .sea-variant-rail > ul.sea-swatch-list--visual,
body.page-product-detail .sea-variant-rail > ul.bb-product-attribute-swatch-list,
body.page-product-detail .sea-variant-rail > .bb-product-attribute-swatch-list,
body.sea-app.page-product-detail .sea-variant-rail > ul.visual-swatch,
body.sea-app.page-product-detail .sea-variant-rail > ul.sea-swatch-list--visual,
body.sea-app.single-product .sea-variant-rail > ul.visual-swatch,
body.sea-app.single-product .sea-variant-rail > ul.sea-swatch-list--visual {
flex: 1 1 0% !important;
min-width: 0 !important;
width: auto !important;
max-width: none !important;
margin: 0 !important;
flex-wrap: nowrap !important;
overflow: hidden !important;
}
body.page-product-detail .sea-variant-rail > ul > .sea-rail-extra,
body.sea-app.page-product-detail .sea-variant-rail > ul > .sea-rail-extra,
body.sea-app.single-product .sea-variant-rail > ul > .sea-rail-extra {
display: none !important;
}
body.page-product-detail .sea-variant-more,
body.sea-app.page-product-detail .sea-variant-more {
appearance: none !important;
flex: 0 0 4.75rem !important;
align-self: stretch !important;
width: 4.75rem !important;
min-width: 4.75rem !important;
min-height: 5.5rem !important;
display: inline-flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
gap: 0.18rem !important;
margin: 0.35rem 0 0.55rem !important;
padding: 0.4rem 0.3rem !important;
border: 1.5px dashed color-mix(in srgb, var(--primary, #0784bd) 40%, #d7e4ee) !important;
border-radius: 0.9rem !important;
background: color-mix(in srgb, var(--primary, #0784bd) 8%, #fff) !important;
color: var(--primary, #0784bd) !important;
box-shadow: none !important;
font-family: inherit !important;
font-size: 0.7rem !important;
font-weight: 900 !important;
line-height: 1.25 !important;
text-align: center !important;
cursor: pointer !important;
}
body.page-product-detail .sea-variant-more iconify-icon,
body.sea-app.page-product-detail .sea-variant-more iconify-icon {
font-size: 1.2rem !important;
}
body.page-product-detail .sea-variant-more small,
body.sea-app.page-product-detail .sea-variant-more small {
display: block !important;
color: #64748b !important;
font-size: 0.62rem !important;
font-weight: 800 !important;
}
body.page-product-detail .sea-variant-more:hover,
body.page-product-detail .sea-variant-more:focus-visible,
body.sea-app.page-product-detail .sea-variant-more:hover,
body.sea-app.page-product-detail .sea-variant-more:focus-visible {
border-style: solid !important;
border-color: var(--primary, #0784bd) !important;
background: #fff !important;
outline: none !important;
box-shadow: 0 0 0 3px rgb(7 132 189 / 14%) !important;
}
body.page-product-detail .sea-variant-more:active {
transform: scale(0.98) !important;
}
body.page-product-detail .sea-variant-remove,
body.page-product-detail .sea-variant-picker__remove {
appearance: none !important;
min-height: 2.35rem !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 0.35rem !important;
padding: 0.45rem 0.75rem !important;
border: 0 !important;
border-radius: 0.7rem !important;
background: #fff7f7 !important;
color: #b42318 !important;
font-family: inherit !important;
font-size: 0.76rem !important;
font-weight: 900 !important;
cursor: pointer !important;
}
body.page-product-detail .sea-variant-remove {
justify-self: end !important;
}
body.page-product-detail .sea-variant-remove:hover,
body.page-product-detail .sea-variant-remove:focus-visible,
body.page-product-detail .sea-variant-picker__remove:hover,
body.page-product-detail .sea-variant-picker__remove:focus-visible {
border-color: #ef4444 !important;
background: #fef2f2 !important;
color: #991b1b !important;
outline: none !important;
}
body.page-product-detail .sea-variant-remove[hidden],
body.page-product-detail .sea-variant-picker__remove[hidden] {
display: none !important;
}
body.page-product-detail .sea-variant-trigger {
appearance: none !important;
width: 100% !important;
min-height: 5.25rem !important;
display: grid !important;
grid-template-columns: 4rem minmax(0, 1fr) auto !important;
align-items: center !important;
gap: 0.9rem !important;
margin: 0 !important;
padding: 0.65rem !important;
border: 0 !important;
border-radius: 1rem !important;
background: linear-gradient(135deg, #fff, color-mix(in srgb, var(--primary, #0784bd) 5%, #fff)) !important;
color: var(--foreground, #0f172a) !important;
box-shadow: 0 8px 24px rgb(15 23 42 / 6%) !important;
font-family: inherit !important;
text-align: start !important;
cursor: pointer !important;
transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease !important;
}
body.page-product-detail .sea-variant-trigger:hover,
body.page-product-detail .sea-variant-trigger:focus-visible {
border-color: var(--primary, #0784bd) !important;
box-shadow: 0 10px 28px rgb(7 132 189 / 14%) !important;
outline: none !important;
}
body.page-product-detail .sea-variant-trigger:active {
transform: scale(0.995) !important;
}
body.page-product-detail .sea-variant-trigger__preview {
width: 4rem !important;
height: 4rem !important;
display: grid !important;
place-items: center !important;
overflow: hidden !important;
border: 0 !important;
border-radius: 0.85rem !important;
background: #f2f8fc !important;
color: var(--primary, #0784bd) !important;
font-size: 1.75rem !important;
}
body.page-product-detail .sea-variant-trigger__preview img,
body.page-product-detail .sea-variant-trigger__color {
width: 100% !important;
height: 100% !important;
display: block !important;
object-fit: contain !important;
}
body.page-product-detail .sea-variant-trigger__copy {
min-width: 0 !important;
display: grid !important;
gap: 0.15rem !important;
}
body.page-product-detail .sea-variant-trigger__copy small {
color: #64748b !important;
font-size: 0.7rem !important;
font-weight: 800 !important;
}
body.page-product-detail .sea-variant-trigger__copy strong {
overflow: hidden !important;
color: var(--foreground, #0f172a) !important;
font-size: 1rem !important;
font-weight: 950 !important;
line-height: 1.35 !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
}
body.page-product-detail .sea-variant-trigger__copy > span {
color: #64748b !important;
font-size: 0.74rem !important;
font-weight: 700 !important;
}
body.page-product-detail .sea-variant-trigger.has-selection .sea-variant-trigger__copy > span {
color: #07855c !important;
}
body.page-product-detail .sea-variant-trigger__action {
min-height: 2.75rem !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 0.35rem !important;
padding: 0.55rem 0.8rem !important;
border-radius: 0.75rem !important;
background: var(--primary, #0784bd) !important;
color: #fff !important;
font-size: 0.78rem !important;
font-weight: 900 !important;
white-space: nowrap !important;
}
body.page-product-detail .sea-variant-picker[hidden] {
display: none !important;
}
body.page-product-detail .sea-variant-picker {
position: fixed !important;
inset: 0 !important;
z-index: 1000002 !important;
display: grid !important;
place-items: center !important;
padding: 1.25rem !important;
}
body.page-product-detail .sea-variant-picker__backdrop {
position: absolute !important;
inset: 0 !important;
background: rgb(15 23 42 / 58%) !important;
backdrop-filter: blur(5px) !important;
}
body.page-product-detail .sea-variant-picker__panel {
position: relative !important;
width: min(58rem, calc(100vw - 2.5rem)) !important;
max-height: min(52rem, calc(100dvh - 2.5rem)) !important;
display: grid !important;
grid-template-rows: auto auto minmax(0, 1fr) !important;
overflow: hidden !important;
border: 0 !important;
border-radius: 1.35rem !important;
background: #fff !important;
box-shadow: 0 30px 90px rgb(15 23 42 / 28%) !important;
animation: seaVariantPickerIn 0.2s ease both !important;
}
@keyframes seaVariantPickerIn {
from {
opacity: 0;
transform: translateY(0.75rem) scale(0.985);
}
to {
opacity: 1;
transform: translateY(0) scale(1);
}
}
body.page-product-detail .sea-variant-picker__header {
display: flex !important;
align-items: flex-start !important;
justify-content: space-between !important;
gap: 1rem !important;
padding: 1.15rem 1.25rem 0.85rem !important;
border-bottom: 0 !important;
background: linear-gradient(135deg, #fff, #effaff) !important;
}
body.page-product-detail .sea-variant-picker__eyebrow {
display: block !important;
margin-bottom: 0.15rem !important;
color: var(--primary, #0784bd) !important;
font-size: 0.72rem !important;
font-weight: 900 !important;
}
body.page-product-detail .sea-variant-picker__header h2 {
margin: 0 !important;
color: var(--foreground, #0f172a) !important;
font-family: var(--font-heading, inherit) !important;
font-size: 1.35rem !important;
font-weight: 950 !important;
line-height: 1.3 !important;
}
body.page-product-detail .sea-variant-picker__header p {
margin: 0.2rem 0 0 !important;
color: #64748b !important;
font-size: 0.78rem !important;
font-weight: 700 !important;
}
body.page-product-detail .sea-variant-picker__close {
appearance: none !important;
width: 2.75rem !important;
height: 2.75rem !important;
flex: 0 0 2.75rem !important;
display: grid !important;
place-items: center !important;
padding: 0 !important;
border: 0 !important;
border-radius: 50% !important;
background: #fff !important;
color: #475569 !important;
font-size: 1.4rem !important;
cursor: pointer !important;
}
body.page-product-detail .sea-variant-picker__close:hover,
body.page-product-detail .sea-variant-picker__close:focus-visible {
border-color: var(--primary, #0784bd) !important;
color: var(--primary, #0784bd) !important;
outline: none !important;
}
body.page-product-detail .sea-variant-picker__tools {
display: grid !important;
grid-template-columns: minmax(0, 1fr) auto auto !important;
gap: 0.65rem !important;
padding: 0.8rem 1.25rem !important;
border-bottom: 0 !important;
background: #fff !important;
}
body.page-product-detail .sea-variant-picker__search {
height: 3rem !important;
display: flex !important;
align-items: center !important;
gap: 0.55rem !important;
padding-inline: 0.9rem !important;
border: 0 !important;
border-radius: 0.8rem !important;
background: #f8fbfd !important;
color: #64748b !important;
}
body.page-product-detail .sea-variant-picker__search:focus-within {
border-color: var(--primary, #0784bd) !important;
box-shadow: 0 0 0 3px rgb(7 132 189 / 10%) !important;
}
body.page-product-detail .sea-variant-picker__search input {
width: 100% !important;
height: 100% !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
outline: 0 !important;
background: transparent !important;
color: var(--foreground, #0f172a) !important;
font-family: inherit !important;
font-size: 0.9rem !important;
font-weight: 750 !important;
}
body.page-product-detail .sea-variant-picker__available {
appearance: none !important;
min-height: 3rem !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 0.35rem !important;
padding: 0.65rem 0.9rem !important;
border: 0 !important;
border-radius: 0.8rem !important;
background: #fff !important;
color: #475569 !important;
font-family: inherit !important;
font-size: 0.8rem !important;
font-weight: 900 !important;
cursor: pointer !important;
}
body.page-product-detail .sea-variant-picker__available.is-active,
body.page-product-detail .sea-variant-picker__available[aria-pressed="true"] {
border-color: #36b37e !important;
background: #ecfdf5 !important;
color: #087a55 !important;
}
body.page-product-detail .sea-variant-picker__body {
min-height: 0 !important;
overflow: auto !important;
overscroll-behavior: contain !important;
padding: 1rem 1.25rem 1.25rem !important;
scrollbar-color: color-mix(in srgb, var(--primary, #0784bd) 42%, #dbe4ec) transparent !important;
scrollbar-width: thin !important;
content-visibility: auto;
contain-intrinsic-size: 480px;
}
body.page-product-detail .sea-variant-picker__body > ul.sea-swatch-list--visual,
body.page-product-detail .sea-variant-picker__body > ul.visual-swatch {
display: grid !important;
grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr)) !important;
align-items: stretch !important;
justify-content: stretch !important;
gap: 0.75rem !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
}
body.page-product-detail .sea-variant-picker__body > ul.visual-swatch > .swatch-box-item,
body.page-product-detail .sea-variant-picker__body > ul.sea-swatch-list--visual > .swatch-box-item,
body.page-product-detail .sea-variant-picker__body > ul.visual-swatch > .bb-product-attribute-swatch-item {
position: relative !important;
width: auto !important;
max-width: none !important;
min-width: 0 !important;
flex: none !important;
content-visibility: auto;
contain-intrinsic-size: 180px;
contain: layout paint style;
}
body.page-product-detail .sea-variant-picker__body .sea-swatch {
border-radius: 0.85rem !important;
box-shadow: 0 2px 8px rgb(15 23 42 / 4%) !important;
}
body.page-product-detail .sea-variant-picker__body .sea-swatch__dot,
body.page-product-detail .sea-variant-picker__body .bb-product-attribute-swatch-display {
aspect-ratio: 5 / 4 !important;
background-color: #f7fafc !important;
}
body.page-product-detail .sea-variant-picker__body .sea-swatch__img {
padding: 0.35rem !important;
}
body.page-product-detail .sea-variant-picker__body .sea-swatch__meta {
min-height: 3rem !important;
display: grid !important;
place-items: center !important;
padding: 0.45rem 0.4rem !important;
border-top: 0 !important;
}
body.page-product-detail .sea-variant-picker__body ul.visual-swatch .sea-swatch__name,
body.page-product-detail .sea-variant-picker__body ul.sea-swatch-list--visual .sea-swatch__name {
display: -webkit-box !important;
overflow: hidden !important;
color: #172033 !important;
font-size: 0.75rem !important;
font-weight: 900 !important;
line-height: 1.35 !important;
text-align: center !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 2 !important;
}
body.page-product-detail .sea-variant-picker-enhanced.sea-variant-prices-uniform .sea-swatch__price {
display: block !important;
}
body.page-product-detail .sea-variant-picker__body .swatch-box-item.is-selected .sea-swatch,
body.page-product-detail .sea-variant-picker__body .swatch-box-item:has(input:checked) .sea-swatch {
border-color: var(--primary, #0784bd) !important;
box-shadow: 0 0 0 3px rgb(7 132 189 / 14%) !important;
}
body.page-product-detail .sea-variant-picker__body .swatch-box-item.is-selected::after,
body.page-product-detail .sea-variant-picker__body .swatch-box-item:has(input:checked)::after {
content: "✓" !important;
position: absolute !important;
top: 0.45rem !important;
inset-inline-end: 0.45rem !important;
z-index: 4 !important;
width: 1.55rem !important;
height: 1.55rem !important;
display: grid !important;
place-items: center !important;
border: 2px solid #fff !important;
border-radius: 50% !important;
background: var(--primary, #0784bd) !important;
color: #fff !important;
font-size: 0.75rem !important;
font-weight: 950 !important;
box-shadow: 0 3px 8px rgb(15 23 42 / 20%) !important;
}
body.page-product-detail .sea-variant-picker__body .swatch-box-item.disabled,
body.page-product-detail .sea-variant-picker__body .swatch-box-item.swatch-out-of-stock {
opacity: 0.55 !important;
}
body.page-product-detail .sea-variant-picker__body .swatch-box-item[hidden] {
display: none !important;
}
body.page-product-detail .sea-variant-picker__empty {
min-height: 13rem !important;
place-items: center !important;
margin: 0 !important;
padding: 2rem !important;
color: #64748b !important;
font-size: 0.95rem !important;
font-weight: 850 !important;
text-align: center !important;
}
body.page-product-detail .sea-variant-picker__empty:not([hidden]) {
display: grid !important;
}
@media (max-width: 767px) {
body.page-product-detail .sea-variant-trigger {
min-height: 4.75rem !important;
grid-template-columns: 3.5rem minmax(0, 1fr) auto !important;
gap: 0.65rem !important;
padding: 0.55rem !important;
border-radius: 0.9rem !important;
}
body.page-product-detail .sea-variant-trigger__preview {
width: 3.5rem !important;
height: 3.5rem !important;
border-radius: 0.75rem !important;
}
body.page-product-detail .sea-variant-trigger__copy strong {
font-size: 0.9rem !important;
}
body.page-product-detail .sea-variant-trigger__copy > span {
max-width: 12rem !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
}
body.page-product-detail .sea-variant-trigger__action {
width: 2.7rem !important;
min-height: 2.7rem !important;
padding: 0 !important;
font-size: 0 !important;
}
body.page-product-detail .sea-variant-trigger__action iconify-icon {
font-size: 1rem !important;
}
body.page-product-detail .sea-variant-picker {
place-items: end center !important;
padding: 0 !important;
}
body.page-product-detail .sea-variant-picker__panel {
width: 100% !important;
max-height: 92dvh !important;
border-width: 1px 0 0 !important;
border-radius: 1.5rem 1.5rem 0 0 !important;
animation-name: seaVariantPickerSheetIn !important;
}
@keyframes seaVariantPickerSheetIn {
from {
opacity: 0;
transform: translateY(2rem);
}
to {
opacity: 1;
transform: translateY(0);
}
}
body.page-product-detail .sea-variant-picker__header {
padding: 0.9rem 1rem 0.7rem !important;
}
body.page-product-detail .sea-variant-picker__header::before {
content: "" !important;
position: absolute !important;
top: 0.4rem !important;
left: 50% !important;
width: 2.75rem !important;
height: 0.25rem !important;
border-radius: 999px !important;
background: #cbd5e1 !important;
transform: translateX(-50%) !important;
}
body.page-product-detail .sea-variant-picker__header h2 {
font-size: 1.15rem !important;
}
body.page-product-detail .sea-variant-picker__header p {
max-width: 16rem !important;
font-size: 0.7rem !important;
}
body.page-product-detail .sea-variant-picker__close {
width: 2.5rem !important;
height: 2.5rem !important;
flex-basis: 2.5rem !important;
}
body.page-product-detail .sea-variant-picker__tools {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 0.5rem !important;
padding: 0.65rem 1rem !important;
}
body.page-product-detail .sea-variant-picker__search {
height: 2.8rem !important;
grid-column: 1 / -1 !important;
}
body.page-product-detail .sea-variant-picker__available {
min-height: 2.55rem !important;
justify-self: stretch !important;
padding: 0.45rem 0.75rem !important;
}
body.page-product-detail .sea-variant-picker__remove {
width: 100% !important;
}
body.page-product-detail .sea-variant-picker__body {
padding: 0.75rem 1rem calc(1.35rem + env(safe-area-inset-bottom, 0px)) !important;
}
body.page-product-detail .sea-variant-picker__body > ul.sea-swatch-list--visual,
body.page-product-detail .sea-variant-picker__body > ul.visual-swatch {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 0.4rem !important;
}
}
@media (prefers-reduced-motion: reduce) {
body.page-product-detail .sea-variant-picker__panel,
body.page-product-detail .sea-variant-trigger {
animation: none !important;
transition: none !important;
}
}
/* —— Reviews + vendor tabs —— */
body.page-product-detail .sea-pdp-tabs__count {
min-width: 1.35rem;
height: 1.35rem;
display: inline-grid;
place-items: center;
padding: 0 0.3rem;
margin-inline-start: 0.2rem;
border-radius: 999px;
background: rgb(100 116 139 / 12%);
color: #64748b;
font-size: 0.68rem;
font-weight: 900;
}
body.page-product-detail .sea-pdp-tabs__btn.is-active .sea-pdp-tabs__count {
background: rgb(0 119 182 / 12%);
color: var(--primary, #0077b6);
}
body.page-product-detail .sea-pdp-reviews {
display: grid;
gap: 1.15rem;
}
body.page-product-detail .sea-pdp-reviews__top {
display: grid;
gap: 1rem;
}
@media (min-width: 900px) {
body.page-product-detail .sea-pdp-reviews__top {
grid-template-columns: minmax(14rem, 0.9fr) minmax(0, 1.35fr);
align-items: start;
gap: 1.25rem;
}
}
body.page-product-detail .sea-pdp-reviews__summary,
body.page-product-detail .sea-pdp-reviews__compose,
body.page-product-detail .sea-pdp-reviews__feed,
body.page-product-detail .sea-pdp-reviews__photos,
body.page-product-detail .sea-pdp-vendor {
background: #fff;
border: 0;
border-radius: 1.15rem;
box-shadow: 0 10px 28px rgb(15 23 42 / 6%);
padding: 1.05rem 1.1rem 1.15rem;
}
body.page-product-detail .sea-pdp-reviews__summary {
display: grid;
justify-items: start;
gap: 0.85rem;
background: linear-gradient(160deg, #f4fbff, #fff 55%);
}
body.page-product-detail .sea-pdp-reviews__score {
display: flex;
align-items: baseline;
gap: 0.4rem;
}
body.page-product-detail .sea-pdp-reviews__score strong {
font-size: 2.4rem;
font-weight: 900;
letter-spacing: -0.04em;
line-height: 1;
color: #0f172a;
}
body.page-product-detail .sea-pdp-reviews__score span {
font-size: 0.82rem;
font-weight: 800;
color: #64748b;
}
body.page-product-detail .sea-pdp-reviews__summary-meta p {
margin: 0.35rem 0 0;
font-size: 0.78rem;
font-weight: 700;
color: #64748b;
}
body.page-product-detail .sea-pdp-reviews__bars {
width: 100%;
display: grid;
gap: 0.35rem;
}
body.page-product-detail .sea-pdp-reviews__bar {
display: grid !important;
grid-template-columns: 1.1rem minmax(0, 1fr) 2.4rem;
align-items: center;
gap: 0.55rem !important;
padding: 0.2rem 0.15rem !important;
border-radius: 0.55rem !important;
}
body.page-product-detail .sea-pdp-reviews__bar .product-review-progress-bar-title,
body.page-product-detail .sea-pdp-reviews__bar .product-review-progress-bar-percent {
min-width: 0 !important;
width: auto !important;
font-size: 0.72rem;
font-weight: 800;
color: #64748b;
}
body.page-product-detail .sea-pdp-reviews__bar .progress {
height: 0.45rem !important;
border-radius: 999px !important;
background: rgb(0 119 182 / 10%) !important;
overflow: hidden;
}
body.page-product-detail .sea-pdp-reviews__bar .progress-bar {
background: linear-gradient(90deg, #0077b6, #00b4d8) !important;
border-radius: 999px;
}
body.page-product-detail .sea-pdp-reviews__compose-head,
body.page-product-detail .sea-pdp-tabs__panel-head {
display: flex;
align-items: center;
gap: 0.7rem;
margin-bottom: 0.95rem;
}
body.page-product-detail .sea-pdp-reviews__compose-icon,
body.page-product-detail .sea-pdp-tabs__panel-icon {
width: 2.55rem;
height: 2.55rem;
flex: 0 0 auto;
display: grid;
place-items: center;
border-radius: 0.7rem;
background: rgb(0 119 182 / 9%);
color: var(--primary, #0077b6);
font-size: 1.25rem;
}
body.page-product-detail .sea-pdp-reviews__compose-head strong,
body.page-product-detail .sea-pdp-tabs__panel-head strong {
display: block;
color: #0f172a;
font-size: 1rem;
font-weight: 900;
}
body.page-product-detail .sea-pdp-reviews__compose-head small,
body.page-product-detail .sea-pdp-tabs__panel-head small {
color: #64748b;
font-size: 0.74rem;
font-weight: 700;
}
body.page-product-detail .sea-pdp-reviews__hint {
margin: 0 0 0.85rem;
font-size: 0.75rem;
font-weight: 700;
color: #94a3b8;
}
body.page-product-detail .sea-pdp-note {
display: flex;
gap: 0.75rem;
align-items: flex-start;
padding: 0.9rem 1rem;
border-radius: 0.95rem;
background: rgb(0 119 182 / 7%);
}
body.page-product-detail .sea-pdp-note--ok {
background: rgb(16 185 129 / 10%);
}
body.page-product-detail .sea-pdp-note--login {
background: rgb(15 23 42 / 4%);
}
body.page-product-detail .sea-pdp-note__icon {
width: 2.35rem;
height: 2.35rem;
flex: 0 0 auto;
display: grid;
place-items: center;
border-radius: 0.7rem;
background: #fff;
color: var(--primary, #0077b6);
font-size: 1.25rem;
box-shadow: 0 6px 14px rgb(15 23 42 / 6%);
}
body.page-product-detail .sea-pdp-note--ok .sea-pdp-note__icon {
color: #059669;
}
body.page-product-detail .sea-pdp-note__body {
min-width: 0;
display: grid;
gap: 0.35rem;
justify-items: start;
}
body.page-product-detail .sea-pdp-note__body strong {
font-size: 0.92rem;
font-weight: 900;
color: #0f172a;
}
body.page-product-detail .sea-pdp-note__body p {
margin: 0;
font-size: 0.8rem;
font-weight: 700;
line-height: 1.55;
color: #526176;
}
body.page-product-detail .sea-pdp-note .sea-btn {
margin-top: 0.35rem;
min-height: 2.55rem;
padding-inline: 1rem;
}
body.page-product-detail .sea-pdp-reviews__stars-row {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.65rem;
margin-bottom: 0.85rem;
}
body.page-product-detail .sea-pdp-reviews__stars-row .form-label {
margin: 0;
font-size: 0.85rem;
font-weight: 800;
}
body.page-product-detail .product-review-container .form-rating-stars {
float: none !important;
display: inline-flex;
flex-direction: row-reverse;
gap: 0.15rem;
}
body.page-product-detail .product-review-container .form-rating-stars > label {
float: none !important;
color: #cbd5e1 !important;
font-size: 1.45rem;
line-height: 1;
}
body.page-product-detail .product-review-container .form-rating-stars > label iconify-icon {
display: block;
}
body.page-product-detail .product-review-container .form-rating-stars:not(:checked) > label:hover,
body.page-product-detail .product-review-container .form-rating-stars:not(:checked) > label:hover ~ label,
body.page-product-detail .product-review-container .form-rating-stars > input:checked ~ label {
color: #ffb703 !important;
}
body.page-product-detail .sea-pdp-reviews__field .form-label {
font-size: 0.85rem;
font-weight: 800;
margin-bottom: 0.4rem;
}
body.page-product-detail .sea-pdp-reviews__field textarea,
body.page-product-detail .sea-pdp-reviews .review-search-input,
body.page-product-detail .sea-pdp-reviews .review-star-filter,
body.page-product-detail .sea-pdp-reviews .review-sort-select {
border: 0 !important;
border-radius: 0.85rem !important;
background: #f4f8fb !important;
min-height: 2.85rem;
box-shadow: none !important;
font-weight: 700;
}
body.page-product-detail .sea-pdp-reviews__field textarea {
min-height: 8.5rem;
resize: vertical;
}
body.page-product-detail .sea-pdp-reviews__upload .image-upload__uploader {
width: 4.5rem !important;
height: 4.5rem !important;
border: 1.5px dashed rgb(0 119 182 / 35%) !important;
border-radius: 0.85rem !important;
background: rgb(0 119 182 / 5%) !important;
color: var(--primary, #0077b6);
gap: 0.15rem;
}
body.page-product-detail .sea-pdp-reviews__upload .image-upload__text {
color: inherit !important;
font-size: 0.62rem !important;
font-weight: 800;
}
body.page-product-detail .sea-pdp-reviews__upload .image-viewer__item {
width: 4.5rem !important;
height: 4.5rem !important;
border: 0 !important;
border-radius: 0.85rem !important;
overflow: hidden;
}
body.page-product-detail .sea-pdp-reviews__upload-hint {
margin: 0.55rem 0 0.95rem;
font-size: 0.72rem;
font-weight: 700;
color: #94a3b8;
}
body.page-product-detail .sea-pdp-reviews__form .sea-btn {
min-height: 2.85rem;
width: min(100%, 16rem);
}
body.page-product-detail .sea-pdp-reviews__empty {
padding: 0.25rem 0 0.5rem;
}
body.page-product-detail .sea-pdp-reviews__empty .sea-guide-speech {
margin: 0;
}
body.page-product-detail .sea-pdp-reviews__feed-title,
body.page-product-detail .sea-pdp-reviews__photos h4 {
margin: 0 0 0.85rem;
font-size: 0.95rem;
font-weight: 900;
color: #0f172a;
}
body.page-product-detail .sea-pdp-reviews__tools {
gap: 0.5rem;
}
body.page-product-detail .product-review-container .review-control-btn.btn,
body.page-product-detail .product-review-container .review-clear-btn {
min-height: 2.45rem !important;
padding: 0.4rem 0.85rem !important;
border-radius: 0.7rem !important;
font-weight: 800 !important;
font-size: 0.78rem !important;
}
body.page-product-detail .product-review-container .review-control-btn.btn {
background: #f4f8fb !important;
border: 0 !important;
color: #334155 !important;
}
body.page-product-detail .product-review-container .review-control-btn.btn.active {
background: var(--primary, #0077b6) !important;
color: #fff !important;
}
body.page-product-detail .sea-pdp-review {
margin: 0 !important;
padding: 0.95rem 0 !important;
border-bottom: 1px solid rgb(15 23 42 / 6%) !important;
}
body.page-product-detail .sea-pdp-review:last-of-type {
border-bottom: 0 !important;
}
body.page-product-detail .sea-pdp-review.current-customer-review {
background: rgb(0 119 182 / 5%) !important;
border: 0 !important;
border-radius: 0.95rem;
padding: 0.95rem 0.85rem !important;
}
body.page-product-detail .sea-pdp-review.current-customer-review:before {
display: none !important;
}
body.page-product-detail .sea-pdp-review__avatar {
width: 2.75rem;
height: 2.75rem;
border-radius: 0.7rem !important;
object-fit: cover;
background: rgb(0 119 182 / 10%);
}
body.page-product-detail .sea-pdp-review__avatar--fallback,
body.page-product-detail .sea-pdp-review__avatar--shop {
display: grid;
place-items: center;
font-weight: 900;
color: var(--primary, #0077b6);
}
body.page-product-detail .sea-pdp-review__name {
font-weight: 900 !important;
color: #0f172a;
}
body.page-product-detail .sea-pdp-review__badge,
body.page-product-detail .sea-pdp-review__bought,
body.page-product-detail .sea-pdp-review__pending {
display: inline-flex;
align-items: center;
min-height: 1.35rem;
padding: 0 0.5rem;
border-radius: 999px;
font-size: 0.68rem;
font-weight: 800;
}
body.page-product-detail .sea-pdp-review__badge {
background: rgb(0 119 182 / 12%);
color: var(--primary, #0077b6);
}
body.page-product-detail .sea-pdp-review__badge--shop {
background: rgb(255 183 3 / 18%);
color: #9a6700;
}
body.page-product-detail .sea-pdp-review__bought {
background: rgb(16 185 129 / 12%);
color: #047857;
}
body.page-product-detail .sea-pdp-review__pending {
background: rgb(245 158 11 / 14%);
color: #b45309;
}
body.page-product-detail .review-item__body {
font-size: 0.9rem;
font-weight: 650;
line-height: 1.7;
color: #3f4d61;
}
body.page-product-detail .sea-pdp-review__reply > div {
background: #f7fbfe !important;
border-radius: 0.95rem !important;
padding: 0.85rem !important;
}
body.page-product-detail .sea-pdp-review__reply > div:before {
display: none !important;
}
body.page-product-detail .review-warning-alert,
body.page-product-detail .image-upload-info {
display: none !important;
}
body.page-product-detail .sea-pdp-vendor {
display: grid;
gap: 0.95rem;
}
body.page-product-detail .sea-pdp-vendor__head {
display: flex;
gap: 0.9rem;
align-items: flex-start;
}
body.page-product-detail .sea-pdp-vendor__logo {
width: 4.25rem;
height: 4.25rem;
flex: 0 0 auto;
display: grid;
place-items: center;
overflow: hidden;
border-radius: 0.95rem;
background: linear-gradient(145deg, rgb(0 119 182 / 10%), rgb(0 180 216 / 12%));
color: var(--primary, #0077b6);
font-size: 1.35rem;
font-weight: 900;
}
body.page-product-detail .sea-pdp-vendor__logo img {
width: 100%;
height: 100%;
object-fit: contain;
padding: 0.3rem;
}
body.page-product-detail .sea-pdp-vendor__eyebrow {
margin: 0;
font-size: 0.72rem;
font-weight: 800;
color: var(--primary, #0077b6);
}
body.page-product-detail .sea-pdp-vendor__name {
margin: 0.15rem 0 0;
font-size: 1.12rem;
font-weight: 900;
color: #0f172a;
line-height: 1.35;
}
body.page-product-detail .sea-pdp-vendor__stats {
display: flex;
flex-wrap: wrap;
gap: 0.45rem 0.85rem;
margin-top: 0.45rem;
}
body.page-product-detail .sea-pdp-vendor__stats span {
display: inline-flex;
align-items: center;
gap: 0.28rem;
font-size: 0.78rem;
font-weight: 800;
color: #526176;
}
body.page-product-detail .sea-pdp-vendor__stats iconify-icon {
color: var(--primary, #0077b6);
font-size: 1rem;
}
body.page-product-detail .sea-pdp-vendor__about {
margin: 0;
font-size: 0.88rem;
font-weight: 650;
line-height: 1.7;
color: #3f4d61;
}
body.page-product-detail .sea-pdp-vendor__chips {
display: flex;
flex-wrap: wrap;
gap: 0.45rem;
margin: 0;
padding: 0;
list-style: none;
}
body.page-product-detail .sea-pdp-vendor__chips li,
body.page-product-detail .sea-pdp-vendor__chips a {
display: inline-flex;
align-items: center;
gap: 0.35rem;
max-width: 100%;
padding: 0.4rem 0.7rem;
border-radius: 999px;
background: #f4f8fb;
color: #0f172a;
font-size: 0.76rem;
font-weight: 800;
text-decoration: none;
line-height: 1.3;
}
body.page-product-detail .sea-pdp-vendor__chips iconify-icon {
color: var(--primary, #0077b6);
font-size: 1rem;
}
body.page-product-detail .sea-pdp-vendor__socials {
display: flex;
flex-wrap: wrap;
gap: 0.4rem;
margin: 0;
padding: 0;
list-style: none;
}
body.page-product-detail .sea-pdp-vendor__socials a {
font-size: 0.78rem;
font-weight: 800;
color: var(--primary, #0077b6);
}
body.page-product-detail .sea-pdp-vendor__actions .sea-btn {
min-height: 2.85rem;
width: min(100%, 18rem);
}
@media (max-width: 767.98px) {
body.page-product-detail .sea-pdp-reviews {
gap: 0.5rem;
}
body.page-product-detail .sea-pdp-reviews__summary,
body.page-product-detail .sea-pdp-reviews__compose,
body.page-product-detail .sea-pdp-reviews__feed,
body.page-product-detail .sea-pdp-reviews__photos,
body.page-product-detail .sea-pdp-vendor {
padding: 0.7rem 0.65rem 0.75rem;
border-radius: 0.85rem;
box-shadow: 0 8px 20px rgb(15 23 42 / 5%);
}
body.page-product-detail .sea-pdp-reviews__score strong {
font-size: 1.28rem;
}
body.page-product-detail .sea-pdp-vendor__logo {
width: 3.6rem;
height: 3.6rem;
border-radius: 0.8rem;
}
}
/* Compact reviews: one scan, fewer cards */
body.page-product-detail .sea-pdp-reviews {
gap: 0.7rem;
}
body.page-product-detail .sea-pdp-reviews__top {
gap: 0.7rem;
}
@media (min-width: 900px) {
body.page-product-detail .sea-pdp-reviews__top {
grid-template-columns: minmax(17rem, 1.15fr) minmax(0, 1fr);
gap: 0.85rem;
align-items: start;
}
body.page-product-detail .sea-pdp-reviews__top:has(.sea-pdp-reviews__compose--status) {
grid-template-columns: 1fr;
}
}
body.page-product-detail .sea-pdp-reviews__summary,
body.page-product-detail .sea-pdp-reviews__compose,
body.page-product-detail .sea-pdp-reviews__feed {
padding: 0.8rem 0.85rem 0.85rem;
border-radius: 1rem;
box-shadow: 0 8px 20px rgb(15 23 42 / 5%);
}
body.page-product-detail .sea-pdp-reviews__summary {
display: grid;
grid-template-columns: auto minmax(0, 1fr);
align-items: center;
gap: 0.3rem 0.7rem;
justify-items: stretch;
padding: 0.6rem 0.7rem;
}
body.page-product-detail .sea-pdp-reviews__headline {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 0.12rem;
min-width: 0;
}
body.page-product-detail .sea-pdp-reviews__score {
gap: 0.18rem;
}
body.page-product-detail .sea-pdp-reviews__score strong {
font-size: 1.35rem;
}
body.page-product-detail .sea-pdp-reviews__score span {
font-size: 0.68rem;
}
body.page-product-detail .sea-pdp-reviews__summary-meta p {
margin: 0;
font-size: 0.68rem;
}
body.page-product-detail .sea-pdp-reviews__bars {
gap: 0.08rem;
}
body.page-product-detail .sea-pdp-reviews__bar {
gap: 0.32rem !important;
padding: 0 !important;
}
body.page-product-detail .sea-pdp-reviews__bar .product-review-progress-bar-title,
body.page-product-detail .sea-pdp-reviews__bar .product-review-progress-bar-percent {
font-size: 0.64rem;
}
body.page-product-detail .sea-pdp-reviews__bar .progress {
height: 0.26rem !important;
}
body.page-product-detail .sea-pdp-reviews__photos {
display: flex;
align-items: center;
gap: 0.3rem;
margin: 0.2rem 0 0;
padding: 0;
background: none;
box-shadow: none;
border: 0;
border-radius: 0;
}
body.page-product-detail .sea-pdp-reviews__photos-label {
display: none;
}
body.page-product-detail .sea-pdp-reviews__thumbs {
display: flex;
gap: 0.28rem;
min-width: 0;
overflow-x: auto;
scrollbar-width: none;
-webkit-overflow-scrolling: touch;
}
body.page-product-detail .sea-pdp-reviews__thumbs::-webkit-scrollbar {
display: none;
}
body.page-product-detail .sea-pdp-reviews__thumb {
position: relative;
flex: 0 0 2.1rem;
width: 2.1rem;
height: 2.1rem;
border-radius: 0.42rem;
overflow: hidden;
background: #eef4f8;
}
body.page-product-detail .sea-pdp-reviews__thumb img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
body.page-product-detail .sea-pdp-reviews__thumb-more {
position: absolute;
inset: 0;
display: grid;
place-items: center;
background: rgb(15 23 42 / 58%);
color: #fff;
font-size: 0.7rem;
font-weight: 800;
}
body.page-product-detail .sea-pdp-tabs__panel[data-sea-panel="review"],
body.page-product-detail #product-review {
width: 100% !important;
max-width: none !important;
box-sizing: border-box;
}
body.page-product-detail .sea-pdp-reviews {
width: 100%;
max-width: none;
display: grid;
gap: 0.7rem;
}
body.page-product-detail .sea-pdp-review.row {
--bs-gutter-x: 0.55rem;
margin-inline: 0 !important;
width: 100%;
}
body.page-product-detail .sea-pdp-review__thumbs {
display: flex;
gap: 0.35rem;
margin-top: 0.45rem;
}
body.page-product-detail .sea-pdp-review__thumbs .sea-pdp-reviews__thumb {
flex: 0 0 3.1rem;
width: 3.1rem;
height: 3.1rem;
}
body.page-product-detail .sea-pdp-reviews__summary,
body.page-product-detail .sea-pdp-reviews__compose,
body.page-product-detail .sea-pdp-reviews__feed {
width: 100%;
box-sizing: border-box;
}
body.page-product-detail .sea-pdp-note--inline {
width: 100%;
box-sizing: border-box;
}
body.page-product-detail .sea-pdp-reviews__feed-whale {
display: block;
height: 2.85rem;
width: auto;
max-width: 3.1rem;
flex-shrink: 0;
object-fit: contain;
pointer-events: none;
filter: drop-shadow(0 6px 10px rgb(15 23 42 / 14%));
}
body.page-product-detail .sea-pdp-reviews__hold {
display: flex;
flex-direction: row;
direction: ltr;
align-items: center;
gap: 0.45rem;
width: 100%;
}
body.page-product-detail .sea-pdp-reviews__whale {
display: block;
height: 4.35rem;
width: auto;
max-width: 4.6rem;
flex-shrink: 0;
object-fit: contain;
pointer-events: none;
user-select: none;
filter: drop-shadow(0 6px 10px rgb(15 23 42 / 14%));
}
body.page-product-detail .sea-pdp-reviews__hold-body {
flex: 1;
min-width: 0;
direction: rtl;
}
body.page-product-detail .sea-pdp-reviews:has(.sea-pdp-reviews__empty) .sea-pdp-reviews__whale {
display: none;
}
body.page-product-detail .sea-pdp-reviews__empty .sea-guide-speech__whale {
height: 4.4rem;
}
body.page-product-detail .sea-pdp-reviews__compose.sea-pdp-reviews__compose--status {
padding: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
body.page-product-detail .sea-pdp-note--inline {
display: flex;
align-items: center;
gap: 0.6rem;
min-height: 2.85rem;
padding: 0.45rem 0.75rem;
border-radius: 0.85rem;
text-decoration: none;
color: inherit;
}
body.page-product-detail a.sea-pdp-note--inline:hover,
body.page-product-detail a.sea-pdp-note--inline:focus-visible {
filter: brightness(0.98);
outline: none;
}
body.page-product-detail .sea-pdp-note--inline .sea-pdp-note__icon {
width: 1.85rem;
height: 1.85rem;
font-size: 1.05rem;
border-radius: 0.55rem;
box-shadow: none;
}
body.page-product-detail .sea-pdp-note--inline .sea-pdp-note__copy {
min-width: 0;
display: flex;
flex-wrap: wrap;
align-items: baseline;
gap: 0.15rem 0.55rem;
}
body.page-product-detail .sea-pdp-note--inline strong {
font-size: 0.84rem;
font-weight: 900;
color: #0f172a;
}
body.page-product-detail .sea-pdp-note--inline .sea-pdp-note__copy > span {
font-size: 0.76rem;
font-weight: 800;
color: var(--primary, #0077b6);
}
body.page-product-detail .sea-pdp-reviews__compose-head {
margin-bottom: 0.65rem;
gap: 0.55rem;
}
body.page-product-detail .sea-pdp-reviews__compose-icon {
width: 2.1rem;
height: 2.1rem;
font-size: 1.05rem;
}
body.page-product-detail .sea-pdp-reviews__compose-head strong {
font-size: 0.92rem;
}
body.page-product-detail .sea-pdp-reviews__stars-row {
margin-bottom: 0.55rem;
}
body.page-product-detail .sea-pdp-reviews__field textarea {
min-height: 5.5rem;
}
body.page-product-detail .sea-pdp-reviews__form-foot {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.65rem;
margin-top: 0.55rem;
}
body.page-product-detail .sea-pdp-reviews__upload .image-upload__uploader,
body.page-product-detail .sea-pdp-reviews__upload .image-viewer__item {
width: 3.35rem !important;
height: 3.35rem !important;
border-radius: 0.7rem !important;
}
body.page-product-detail .sea-pdp-reviews__form .sea-btn {
width: auto;
min-height: 2.65rem;
margin-inline-start: auto;
padding-inline: 1.1rem;
}
body.page-product-detail .sea-pdp-reviews__feed-bar {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.5rem;
margin-bottom: 0.45rem;
}
body.page-product-detail .sea-pdp-reviews__feed-title {
margin: 0;
min-width: 0;
flex: 1 1 auto;
font-size: 0.88rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
body.page-product-detail .sea-pdp-reviews__tools {
margin: 0 !important;
gap: 0.3rem;
}
body.page-product-detail .product-review-container .review-control-btn.btn,
body.page-product-detail .product-review-container .review-clear-btn {
min-height: 2.2rem !important;
padding: 0.25rem 0.6rem !important;
font-size: 0.72rem !important;
}
body.page-product-detail .sea-pdp-review {
padding: 0.7rem 0 !important;
}
body.page-product-detail .sea-pdp-review.current-customer-review {
padding: 0.7rem 0.7rem !important;
border-radius: 0.8rem;
}
body.page-product-detail .sea-pdp-review__avatar {
width: 2.25rem;
height: 2.25rem;
border-radius: 0.55rem !important;
}
body.page-product-detail .review-item__body {
font-size: 0.84rem;
line-height: 1.55;
}
body.page-product-detail .sea-pdp-review__reply {
margin-top: 0.55rem;
}
body.page-product-detail .sea-pdp-review__reply > div {
padding: 0.65rem !important;
}
@media (max-width: 639.98px) {
body.page-product-detail .sea-pdp-reviews__score strong {
font-size: 1.28rem;
}
body.page-product-detail .sea-pdp-reviews__compose:not(.sea-pdp-reviews__compose--status),
body.page-product-detail .sea-pdp-reviews__feed {
padding: 0.75rem 0.8rem 0.8rem;
}
}
body.page-product-detail .sea-pdp-reviews,
body.page-product-detail .sea-pdp-reviews__feed,
body.page-product-detail .product-review-container {
max-width: 100%;
overflow-x: hidden;
box-sizing: border-box;
}
body.page-product-detail .sea-pdp-reviews__feed-whale {
width: 2.6rem !important;
height: 2.6rem !important;
max-width: 2.6rem !important;
object-fit: contain;
}
body.page-product-detail .review-item__header {
position: relative;
min-width: 0;
}
body.page-product-detail .review-item__actions {
margin-inline-start: auto;
flex: 0 0 auto;
}
@media (max-width: 767.98px) {
body.page-product-detail .sea-pdp-reviews__feed-bar {
display: grid;
grid-template-columns: auto minmax(0, 1fr);
grid-template-areas:
"whale title"
"tools tools";
align-items: start;
gap: 0.45rem 0.5rem;
width: 100%;
}
body.page-product-detail .sea-pdp-reviews__feed-whale {
grid-area: whale;
width: 2.2rem !important;
height: 2.2rem !important;
max-width: 2.2rem !important;
}
body.page-product-detail .sea-pdp-reviews__feed-title {
grid-area: title;
white-space: normal !important;
overflow: visible !important;
text-overflow: unset !important;
font-size: 0.8rem !important;
line-height: 1.4;
}
body.page-product-detail .sea-pdp-reviews__tools,
body.page-product-detail .product-review-container .product-review-controls {
grid-area: tools;
width: 100%;
min-width: 0;
flex-wrap: wrap;
}
body.page-product-detail .product-review-container .review-control-buttons {
display: flex !important;
flex-wrap: wrap;
width: 100%;
gap: 0.35rem;
}
body.page-product-detail .product-review-container .review-control-btn.btn,
body.page-product-detail .product-review-container .review-clear-btn {
flex: 1 1 calc(33.33% - 0.35rem);
min-width: 4.4rem;
max-width: 100%;
min-height: 2.35rem !important;
padding: 0.3rem 0.4rem !important;
font-size: 0.72rem !important;
}
body.page-product-detail .sea-pdp-review.row {
--bs-gutter-x: 0.4rem;
margin-inline: 0 !important;
width: 100%;
max-width: 100%;
}
body.page-product-detail .sea-pdp-review .col {
min-width: 0;
padding-inline-end: 0;
}
body.page-product-detail .sea-pdp-review .col-auto {
padding-inline: 0 0.35rem;
}
body.page-product-detail .sea-pdp-review.current-customer-review {
padding: 0.7rem 0.6rem !important;
}
body.page-product-detail .review-item__header {
row-gap: 0.28rem;
padding-inline-end: 1.7rem;
}
body.page-product-detail .review-item__actions {
position: absolute;
inset-inline-end: 0;
top: -0.1rem;
}
}
body.page-product-detail .pdp-points {
margin-bottom: 10px !important;
margin-top: 10px !important;
}
/* ===== Moved from sea-pages (PDP-scoped) ===== */
/* —— PDP restyle of existing Botble markup —— */
body.single-product .bb-product-detail,
body.single-product .tp-product-details-area {
background: transparent !important;
}
body.single-product .bb-product-detail > .container,
body.single-product .tp-product-details-top {
max-width: 1280px;
}
body.single-product .tp-product-details-thumb-wrapper,
body.single-product .tp-product-details-nav-main-thumb,
body.single-product .tp-product-details-thumb {
border-radius: 1.25rem !important;
overflow: hidden;
background: rgb(224 232 245 / 30%);
border: 0;
}
@media (min-width: 768px) {
body.single-product .tp-product-details-thumb-wrapper {
border: 4px solid #fff;
box-shadow: 0 12px 28px rgb(15 23 42 / 8%);
}
}
body.single-product .tp-product-details-title {
font-family: var(--font-heading) !important;
font-weight: 900 !important;
font-size: clamp(1.35rem, 3vw, 2.25rem) !important;
line-height: 1.25 !important;
}
body.single-product .tp-product-details-price,
body.single-product .tp-product-details-price-wrapper .new-price {
font-size: clamp(1.5rem, 3vw, 1.85rem) !important;
font-weight: 900 !important;
color: var(--primary) !important;
}
body.single-product .tp-product-details-add-to-cart-btn,
body.single-product button[data-bb-toggle="add-to-cart"].tp-product-details-add-to-cart-btn {
background: var(--primary) !important;
border-color: var(--primary) !important;
border-radius: 0.75rem !important;
font-weight: 900 !important;
box-shadow: 0 10px 24px rgb(0 119 182 / 28%);
}
body.single-product .tp-product-details-buy-now-btn,
body.single-product button[name="checkout"] {
background: var(--secondary) !important;
color: #000 !important;
border: 0 !important;
border-radius: 0.75rem !important;
font-weight: 900 !important;
border-bottom: 4px solid #d97706 !important;
}
body.single-product .tp-product-details-action-wrapper,
body.single-product .tp-product-details-action-sm {
gap: 0.75rem !important;
}
body.single-product .tp-product-details-sticky-actions {
display: none !important; /* replaced by .order-sticky */
}
.pdp-sea-wrap {
padding-bottom: 5rem;
}
/* —— PDP Sea layout (gallery | info + tabs) —— */
.sea-pdp-layout {
display: grid;
grid-template-columns: 1fr;
gap: 1.25rem 2.5rem;
align-items: start;
}
@media (min-width: 992px) {
.sea-pdp-layout {
grid-template-columns: 1.18fr 0.82fr;
gap: 2rem 3rem;
}
}
.sea-pdp-gallery .pdp-gallery {
position: relative;
aspect-ratio: 1 / 1;
background: rgb(241 245 249 / 55%);
border-radius: 1.25rem;
overflow: hidden;
border: 0;
box-shadow: 0 8px 24px rgb(15 23 42 / 6%);
}
@media (min-width: 768px) {
.sea-pdp-gallery .pdp-gallery {
border-radius: 2rem;
border-width: 4px;
border-color: #fff;
box-shadow: 0 12px 32px rgb(15 23 42 / 10%);
}
}
.sea-pdp-gallery__light {
display: block;
width: 100%;
height: 100%;
}
.sea-pdp-gallery__light img,
.sea-pdp-gallery .pdp-gallery img[data-sea-gallery-img] {
width: 100%;
height: 100%;
object-fit: contain;
padding: 0.35rem;
transition: transform 0.7s ease;
}
.sea-pdp-gallery .pdp-gallery:hover img[data-sea-gallery-img] {
transform: none;
}
.sea-pdp-gallery__badge {
position: absolute;
top: 0.85rem;
inset-inline-start: 0.85rem;
z-index: 2;
background: var(--destructive, #ef4444);
color: #fff;
font-size: 0.7rem;
font-weight: 800;
padding: 0.35rem 0.65rem;
border-radius: 0.65rem;
}
.sea-pdp-gallery__stage {
display: block;
width: 100%;
height: 100%;
padding: 0;
margin: 0;
border: 0;
background: transparent;
cursor: zoom-in;
touch-action: pan-y;
}
.sea-pdp-gallery-lg {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden;
clip: rect(0 0 0 0);
}
.sea-pdp-gallery__tools {
display: flex;
position: absolute;
bottom: 1.25rem;
inset-inline-end: 1.25rem;
flex-direction: column;
gap: 0.5rem;
z-index: 2;
}
.sea-pdp-gallery__tool {
width: 2.5rem;
height: 2.5rem;
border-radius: 999px;
border: 0;
background: rgb(255 255 255 / 85%);
backdrop-filter: blur(8px);
color: var(--primary, #0077b6);
display: inline-flex;
align-items: center;
justify-content: center;
box-shadow: 0 4px 14px rgb(15 23 42 / 12%);
cursor: pointer;
text-decoration: none;
}
.sea-pdp-gallery__tool:hover {
background: #fff;
}
.sea-pdp-thumbs {
display: flex;
gap: 0.65rem;
overflow-x: auto;
padding-bottom: 0.25rem;
margin-top: 0.75rem;
scrollbar-width: none;
flex-direction: row;
}
.sea-pdp-thumbs::-webkit-scrollbar {
display: none;
}
.sea-pdp-thumb {
width: 4rem;
height: 4rem;
flex-shrink: 0;
border-radius: 0.85rem;
border: 2px solid transparent;
background: rgb(241 245 249 / 55%);
padding: 0.35rem;
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
color: var(--muted-foreground, #64748b);
text-decoration: none;
}
@media (min-width: 768px) {
.sea-pdp-thumb {
width: 5rem;
height: 5rem;
border-radius: 1rem;
padding: 0.5rem;
}
}
.sea-pdp-thumb img {
width: 100%;
height: 100%;
object-fit: contain;
opacity: 0.55;
}
.sea-pdp-thumb.is-active {
border-color: var(--primary, #0077b6);
background: #fff;
}
.sea-pdp-thumb.is-active img {
opacity: 1;
}
.sea-pdp-thumb:hover:not(.is-active) {
border-color: var(--accent, #00b4d8);
}
.sea-pdp-video {
margin-top: 1rem;
}
.sea-pdp-video-card {
position: relative;
width: 100%;
border-radius: 1rem;
overflow: hidden;
background: transparent;
border: 0;
box-shadow: none;
}
.sea-pdp-video-card__play {
position: relative;
display: block;
width: 100%;
margin: 0;
padding: 0;
border: 0;
cursor: pointer;
background: transparent;
text-align: inherit;
color: inherit;
font: inherit;
height: 4rem;
min-height: 4rem;
max-height: 4rem;
overflow: hidden;
border-radius: 1rem;
}
.sea-pdp-video-card__cta {
position: relative;
display: flex;
align-items: center;
justify-content: flex-start;
gap: 0.75rem;
width: 100%;
height: 4rem;
min-height: 4rem;
padding: 0 1rem;
color: #fff;
overflow: hidden;
border-radius: 1rem;
background-color: #0b1220;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
box-shadow: 0 8px 22px rgb(15 23 42 / 10%);
pointer-events: none;
}
.sea-pdp-video-card__cta--empty {
background-image:
radial-gradient(circle at 20% 40%, rgb(0 180 216 / 35%), transparent 55%),
radial-gradient(circle at 80% 60%, rgb(0 119 182 / 30%), transparent 50%),
linear-gradient(120deg, #023e8a, #0077b6);
}
.sea-pdp-video-card__veil {
position: absolute;
inset: 0;
z-index: 0;
background:
linear-gradient(90deg, rgb(2 12 28 / 88%) 0%, rgb(2 12 28 / 78%) 48%, rgb(2 12 28 / 62%) 100%);
pointer-events: none;
}
html[dir="rtl"] .sea-pdp-video-card__veil {
background:
linear-gradient(270deg, rgb(2 12 28 / 88%) 0%, rgb(2 12 28 / 78%) 48%, rgb(2 12 28 / 62%) 100%);
}
.sea-pdp-video-card__icon {
position: relative;
z-index: 1;
flex: 0 0 auto;
width: 2.55rem;
height: 2.55rem;
border-radius: 999px;
display: inline-flex;
align-items: center;
justify-content: center;
background: rgb(255 255 255 / 96%);
color: #0077b6;
box-shadow: 0 6px 16px rgb(2 20 40 / 28%);
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.sea-pdp-video-card__icon iconify-icon,
.sea-pdp-video-card__icon svg,
.sea-pdp-video-card__icon .sea-ico {
width: 1.25rem;
height: 1.25rem;
}
.sea-pdp-video-card__label {
position: relative;
z-index: 1;
display: flex;
flex-direction: column;
gap: 0.05rem;
min-width: 0;
text-shadow: 0 1px 2px rgb(0 0 0 / 55%), 0 0 12px rgb(0 0 0 / 35%);
}
.sea-pdp-video-card__label strong {
font-size: 0.95rem;
font-weight: 800;
line-height: 1.2;
color: #fff;
}
.sea-pdp-video-card__label small {
font-size: 0.72rem;
opacity: 0.95;
font-weight: 600;
color: #f8fafc;
}
.sea-pdp-video-card__play:hover .sea-pdp-video-card__icon,
.sea-pdp-video-card__play:focus-visible .sea-pdp-video-card__icon {
transform: scale(1.06);
box-shadow: 0 8px 20px rgb(2 20 40 / 34%);
}
.sea-pdp-video-card__stage {
position: relative;
width: 100%;
max-width: 100%;
background: #0b1220;
overflow: hidden;
}
.sea-pdp-video-card__stage[hidden] {
display: none !important;
}
.sea-pdp-video-card.is-playing .sea-pdp-video-card__play,
.sea-pdp-video-card.video-playing .sea-pdp-video-card__play {
display: none !important;
}
.sea-pdp-video-card__close {
position: absolute;
top: 0.65rem;
right: 0.65rem;
left: auto;
z-index: 5;
width: 2.35rem;
height: 2.35rem;
border: 0;
border-radius: 999px;
display: inline-flex;
align-items: center;
justify-content: center;
background: rgb(255 255 255 / 94%);
color: #0f172a;
cursor: pointer;
box-shadow: 0 4px 14px rgb(0 0 0 / 25%);
}
html[dir="rtl"] .sea-pdp-video-card__close {
right: auto;
left: 0.65rem;
}
.sea-pdp-video-card__media,
.sea-pdp-video-card__embed {
position: relative;
display: block;
width: 100%;
max-width: 100%;
aspect-ratio: 16 / 9;
background: #000;
overflow: hidden;
}
.sea-pdp-video-card__media {
height: auto;
object-fit: contain;
}
.sea-pdp-video-card__embed iframe,
.sea-pdp-video-card__embed .bb-product-video-iframe,
iframe.bb-product-video-iframe {
position: absolute !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
width: 100% !important;
height: 100% !important;
max-width: none !important;
border: 0 !important;
display: block !important;
}
.sea-pdp-video-card__embed--social {
aspect-ratio: auto;
min-height: 18rem;
display: flex;
align-items: center;
justify-content: center;
padding: 1rem;
background: #f8fafc;
}
@media (max-width: 767.98px) {
.sea-pdp-video {
margin-top: 0.85rem;
width: 100%;
max-width: 100%;
}
.sea-pdp-video-card {
border-radius: 1rem;
box-shadow: none;
width: 100%;
max-width: 100%;
}
.sea-pdp-video-card__play,
.sea-pdp-video-card__cta {
height: 4rem;
min-height: 4rem;
max-height: 4rem;
}
.sea-pdp-video-card__stage,
.sea-pdp-video-card__embed,
.sea-pdp-video-card__media {
width: 100% !important;
max-width: 100% !important;
}
.sea-pdp-video-card__cta {
padding: 0 0.95rem;
gap: 0.7rem;
justify-content: flex-start;
}
.sea-pdp-video-card__icon {
width: 2.65rem;
height: 2.65rem;
}
.sea-pdp-video-card__label strong {
font-size: 0.98rem;
}
.sea-pdp-video-card__close {
top: 0.55rem;
width: 2.5rem;
height: 2.5rem;
}
}
/* —— Wholesale tiers —— */
.sea-pdp-tiers {
margin: 1rem 0 1.25rem;
}
.sea-pdp-tiers__title {
font-weight: 900;
font-size: 1rem;
margin-bottom: 0.65rem;
color: var(--foreground, #0f172a);
}
.sea-pdp-tiers__row {
display: flex;
gap: 0.55rem;
overflow-x: auto;
padding-bottom: 0.35rem;
scrollbar-width: thin;
}
.sea-pdp-tier {
flex: 1 0 auto;
min-width: 6.5rem;
border: 2px solid rgb(203 213 225 / 55%);
border-radius: 1rem;
background: var(--card, #fff);
padding: 0.65rem 0.75rem;
text-align: center;
cursor: pointer;
display: flex;
flex-direction: column;
gap: 0.2rem;
transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
color: inherit;
font: inherit;
}
.sea-pdp-tier:hover,
.sea-pdp-tier.is-active,
.sea-pdp-tier.wholesale-active {
border-color: var(--primary, #0077b6);
background: rgb(0 119 182 / 6%);
box-shadow: 0 6px 16px rgb(0 119 182 / 12%);
}
.sea-pdp-tier__qty {
font-size: 0.72rem;
font-weight: 800;
color: var(--muted-foreground, #64748b);
}
.sea-pdp-tier__price {
font-size: 1rem;
font-weight: 900;
color: var(--primary, #0077b6);
}
.sea-pdp-tier__total {
font-size: 0.7rem;
font-weight: 700;
color: var(--foreground, #0f172a);
}
.sea-pdp-tier__save {
font-size: 0.65rem;
font-weight: 800;
color: #16a34a;
}
.sea-pdp-tiers__hint {
display: flex;
align-items: flex-start;
gap: 0.4rem;
margin-top: 0.65rem;
font-size: 0.75rem;
color: var(--muted-foreground, #64748b);
font-weight: 600;
}
.sea-pdp-tiers__badge {
display: inline-flex;
margin-bottom: 0.5rem;
background: var(--primary, #0077b6);
color: #fff;
font-size: 0.7rem;
font-weight: 900;
padding: 0.3rem 0.65rem;
border-radius: 999px;
}
/* —— PDP tabs —— */
.sea-pdp-tabs.pdp-details {
margin-top: 2.5rem;
}
@media (min-width: 768px) {
.sea-pdp-tabs.pdp-details {
margin-top: 3.5rem;
}
}
.sea-pdp-tabs__nav {
display: flex;
border-bottom: 0;
margin-bottom: 1.25rem;
overflow-x: auto;
scrollbar-width: none;
}
.sea-pdp-tabs__nav::-webkit-scrollbar {
display: none;
}
.sea-pdp-tabs__btn {
appearance: none;
background: transparent;
border: 0;
border-bottom: 4px solid transparent;
padding: 0.85rem 1.15rem;
font-weight: 800;
font-size: 0.9rem;
color: var(--muted-foreground, #64748b);
white-space: nowrap;
cursor: pointer;
transition: color 0.2s, border-color 0.2s;
}
@media (min-width: 768px) {
.sea-pdp-tabs__btn {
padding: 1rem 1.75rem;
font-size: 1rem;
}
}
.sea-pdp-tabs__btn:hover {
color: var(--foreground, #0f172a);
}
.sea-pdp-tabs__btn.is-active {
color: var(--primary, #0077b6);
border-bottom-color: var(--primary, #0077b6);
font-weight: 900;
}
.sea-pdp-tabs__panel {
display: none;
max-width: 48rem;
}
.sea-pdp-tabs__panel.is-active {
display: block;
}
.sea-pdp-tabs__content {
font-size: 0.95rem;
line-height: 1.75;
font-weight: 600;
color: rgb(15 23 42 / 80%);
}
@media (min-width: 768px) {
.sea-pdp-tabs__content {
font-size: 1.05rem;
}
}
.sea-pdp-tabs__content.product-description-collapse,
#product-description-collapse.product-description-collapse {
max-height: none;
overflow: visible;
}
/* —— PDP info widget —— */
.sea-widget__pdp-messages {
list-style: none;
margin: 0 0 0.85rem;
padding: 0;
display: flex;
flex-direction: column;
gap: 0.45rem;
}
.sea-widget__pdp-messages li {
display: flex;
align-items: flex-start;
gap: 0.45rem;
font-size: 0.875rem;
font-weight: 700;
color: var(--muted-foreground);
}
.sea-widget__pdp-messages li::before {
content: '';
width: 0.45rem;
height: 0.45rem;
border-radius: 999px;
background: var(--accent);
margin-top: 0.45rem;
flex-shrink: 0;
}
.sea-widget__pdp-payment {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
}
.sea-widget__pdp-payment p {
margin: 0;
font-size: 0.875rem;
font-weight: 700;
}
/* —— PDP matching styles —— */
.sea-matching-styles {
margin-top: 1.25rem;
}
.sea-matching-styles__head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
margin-bottom: 0.75rem;
}
.sea-matching-styles__title {
margin: 0;
font-family: var(--font-heading);
font-weight: 900;
font-size: 1rem;
color: var(--foreground);
}
.sea-matching-styles__count {
font-size: 0.8rem;
font-weight: 700;
color: var(--muted-foreground);
}
.sea-matching-styles__grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 0.5rem;
}
.sea-matching-styles__item {
aspect-ratio: 1;
display: grid;
place-items: center;
overflow: hidden;
border-radius: 0.85rem;
border: 0;
background: #f0f7fb;
text-decoration: none;
color: var(--foreground);
transition: border-color 0.15s ease, transform 0.15s ease;
}
.sea-matching-styles__item:hover {
border-color: var(--primary);
transform: translateY(-1px);
}
.sea-matching-styles__item img {
width: 100%;
height: 100%;
object-fit: contain;
padding: 0.35rem;
}
.sea-matching-styles__more {
flex-direction: column;
gap: 0.15rem;
font-weight: 900;
background: linear-gradient(160deg, #e8f4fb, #d7ecf8);
}
.sea-matching-styles__more small {
font-weight: 700;
font-size: 0.7rem;
color: var(--muted-foreground);
}
@media (max-width: 576px) {
.sea-matching-styles__grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}
/* —— PDP Sea buy-box polish —— */
.pdp-brand { margin-bottom: 0.65rem; }
.pdp-brand__logo {
max-height: 52px;
max-width: 140px;
object-fit: contain;
}
.pdp-brand__name {
display: inline-flex;
background: color-mix(in srgb, var(--primary) 12%, transparent);
color: var(--primary);
border: 0;
border-radius: 999px;
padding: 0.25rem 0.75rem;
font-size: 0.75rem;
font-weight: 900;
}
.pdp-info__title {
font-family: var(--font-heading) !important;
font-weight: 900 !important;
line-height: 1.3 !important;
margin-bottom: 0.75rem !important;
}
.pdp-points {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
text-decoration: none;
color: inherit;
background: color-mix(in srgb, var(--accent, #0ea5e9) 10%, #fff);
border: 2px solid color-mix(in srgb, var(--accent, #0ea5e9) 20%, transparent);
border-radius: 1rem;
padding: 0.85rem 1rem;
margin-bottom: 1.15rem;
transition: background 0.15s ease;
}
.pdp-points:hover {
background: color-mix(in srgb, var(--accent, #0ea5e9) 18%, #fff);
}
.pdp-points__main {
display: flex;
align-items: center;
gap: 0.75rem;
min-width: 0;
}
.pdp-points__icon {
width: 2.5rem;
height: 2.5rem;
border-radius: 999px;
background: transparent;
color: #fff;
display: grid;
place-items: center;
font-size: 1.15rem;
flex-shrink: 0;
}
.pdp-points__lead {
margin: 0;
font-size: 0.9rem;
font-weight: 800;
}
.pdp-points__lead span { color: var(--accent, #0ea5e9); }
.pdp-points__balance {
margin: 0.15rem 0 0;
font-size: 0.75rem;
font-weight: 700;
color: var(--muted-foreground);
}
.pdp-points__chevron {
color: var(--accent, #0ea5e9);
flex-shrink: 0;
}
.pdp-price .new-price,
.pdp-price__current {
font-size: 1.75rem !important;
font-weight: 900 !important;
color: var(--primary) !important;
}
.pdp-actions__label {
font-size: 0.9rem !important;
font-weight: 900 !important;
margin-bottom: 0.65rem !important;
}
.pdp-actions__cart,
.pdp-actions .tp-product-details-add-to-cart-btn {
display: inline-flex !important;
align-items: center;
justify-content: center;
gap: 0.5rem;
border-radius: 0.85rem !important;
font-weight: 900 !important;
font-size: 1.05rem !important;
box-shadow: 0 10px 24px rgb(0 119 182 / 28%) !important;
}
.pdp-actions__buy,
.pdp-actions .tp-product-details-buy-now-btn {
border-radius: 0.85rem !important;
font-weight: 900 !important;
font-size: 1.05rem !important;
margin-top: 0.65rem;
}
.pdp-perks {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.75rem 1rem;
margin-top: 1.25rem;
padding-top: 1.15rem;
border-top: 0;
}
.pdp-perks__item {
display: flex;
align-items: center;
gap: 0.45rem;
font-size: 0.8rem;
font-weight: 800;
color: var(--foreground);
}
.pdp-perks__item iconify-icon {
font-size: 1.25rem;
color: var(--primary);
flex-shrink: 0;
}
.sea-related-products,
.sea-cross-sale {
margin-top: 2rem;
}
.sea-related-products__grid,
.sea-cross-sale__grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.85rem;
}
@media (min-width: 768px) {
.sea-related-products__grid,
.sea-cross-sale__grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}
@media (min-width: 1200px) {
.sea-related-products__grid,
.sea-cross-sale__grid {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
}
/* —— PDP container centering + nav —— */
.sea-pdp,
.pdp-sea-wrap {
width: 100%;
}
.sea-pdp .pdp-main,
body.single-product .bb-product-detail > .sea-container,
body.single-product .bb-product-detail > .container {
width: min(100% - 2rem, 1280px) !important;
max-width: 1280px !important;
margin-inline: auto !important;
}
.sea-pdp-nav {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
margin-bottom: 1rem;
}
.sea-pdp-nav__btn {
display: inline-flex;
align-items: center;
gap: 0.35rem;
text-decoration: none;
color: var(--muted-foreground);
font-weight: 800;
font-size: 0.85rem;
background: var(--card);
border: 0;
border-radius: 999px;
padding: 0.45rem 0.85rem;
transition: color 0.15s ease, border-color 0.15s ease;
}
.sea-pdp-nav__btn:hover {
color: var(--primary);
border-color: var(--primary);
}
/* Prev / next product pager (top of PDP) */
.sea-pdp-pager {
display: grid;
grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
align-items: center;
gap: 0.55rem 0.75rem;
margin: 0 0 1rem;
padding: 0.45rem;
background: color-mix(in srgb, var(--card, #fff) 88%, #e0f2fe);
border: 0;
border-radius: 1.15rem;
box-shadow: 0 10px 28px rgb(2 48 71 / 5%);
}
.sea-pdp-pager__link {
display: flex;
align-items: center;
gap: 0.55rem;
min-width: 0;
padding: 0.35rem 0.45rem;
text-decoration: none;
color: inherit;
border-radius: 0.9rem;
transition: background 0.18s ease, transform 0.18s ease;
}
.sea-pdp-pager__link.is-next {
justify-content: flex-end;
text-align: end;
}
.sea-pdp-pager__link.is-disabled {
visibility: hidden;
pointer-events: none;
}
.sea-pdp-pager__link:hover {
background: #fff;
transform: translateY(-1px);
}
.sea-pdp-pager__arrow {
width: 1.85rem;
height: 1.85rem;
flex-shrink: 0;
display: grid;
place-items: center;
border-radius: 999px;
background: color-mix(in srgb, var(--primary, #0077b6) 12%, #fff);
color: var(--primary, #0077b6);
font-size: 1rem;
}
.sea-pdp-pager__link:hover .sea-pdp-pager__arrow {
background: var(--primary, #0077b6);
color: #fff;
}
.sea-pdp-pager__thumb {
width: 2.65rem;
height: 2.65rem;
flex-shrink: 0;
border-radius: 0.75rem;
overflow: hidden;
background: linear-gradient(145deg, #f0f9ff, #e2e8f0);
border: 0;
}
.sea-pdp-pager__thumb img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.sea-pdp-pager__text {
display: flex;
flex-direction: column;
gap: 0.08rem;
min-width: 0;
}
.sea-pdp-pager__label {
font-size: 0.68rem;
font-weight: 800;
color: var(--primary, #0077b6);
letter-spacing: 0.01em;
}
.sea-pdp-pager__name {
font-size: 0.8rem;
font-weight: 800;
line-height: 1.3;
color: var(--foreground, #0f172a);
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
overflow: hidden;
}
.sea-pdp-pager__all {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.35rem;
flex-shrink: 0;
padding: 0.45rem 0.85rem;
border-radius: 999px;
text-decoration: none;
font-size: 0.75rem;
font-weight: 900;
color: #fff;
background: linear-gradient(135deg, var(--primary, #0077b6), #00b4d8);
box-shadow: 0 8px 18px rgb(0 119 182 / 22%);
white-space: nowrap;
transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.sea-pdp-pager__all:hover {
transform: translateY(-1px);
box-shadow: 0 10px 22px rgb(0 119 182 / 28%);
color: #fff;
}
.sea-pdp-pager__all iconify-icon {
font-size: 1rem;
}
@media (max-width: 720px) {
.sea-pdp-pager {
grid-template-columns: 1fr 1fr;
gap: 0.45rem;
padding: 0.4rem;
}
.sea-pdp-pager__all {
grid-column: 1 / -1;
order: -1;
width: 100%;
}
.sea-pdp-pager__name {
font-size: 0.74rem;
}
.sea-pdp-pager__thumb {
width: 2.35rem;
height: 2.35rem;
}
}
@media (prefers-reduced-motion: reduce) {
.sea-pdp-pager__link:hover,
.sea-pdp-pager__all:hover {
transform: none;
}
}
/* Legacy siblings (unused) kept harmless */
.sea-pdp-siblings {
display: none;
}
.sea-pdp-layout {
width: 100%;
}
@media (min-width: 992px) {
.sea-pdp-layout {
grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
}
}
/* Kill legacy GIF button icons */
body.single-product .tp-product-details-add-to-cart-btn::after,
body.single-product .tp-product-details-buy-now-btn::after,
.pdp-actions__cart::after,
.pdp-actions__buy::after {
content: none !important;
display: none !important;
background: none !important;
width: 0 !important;
height: 0 !important;
}
.pdp-actions__cart,
.pdp-actions__buy {
display: inline-flex !important;
align-items: center;
justify-content: center;
gap: 0.5rem;
min-height: 3.25rem;
}
.pdp-actions__buy iconify-icon,
.pdp-actions__cart iconify-icon {
font-size: 1.35rem;
}
/* Variation swatches — export color-dot chrome lives in sea-pdp.css */
.pdp-info .tp-product-details-wrapper {
position: relative;
padding-top: 0 !important;
}
.pdp-info .product-nav-button,
.pdp-info .product-nav-preview {
display: none !important;
}
/* —— Search / compare / galleries —— */
.sea-search__head {
padding: 1rem 1.15rem;
margin-bottom: 1rem;
}
.sea-search__head h1 {
margin: 0 0 0.35rem;
font-family: var(--font-heading);
font-weight: 900;
}
.sea-search__count {
font-weight: 800;
color: var(--muted-foreground);
margin-bottom: 1rem;
}
.sea-search__grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.85rem;
}
@media (min-width: 768px) {
.sea-search__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1200px) {
.sea-search__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.sea-search__empty,
.sea-compare__empty {
padding: 2rem 1.25rem;
display: grid;
gap: 0.65rem;
justify-items: center;
}
.sea-compare__table {
padding: 0.75rem;
overflow-x: auto;
}
.sea-compare__thumb img {
width: 88px;
height: 88px;
object-fit: contain;
margin-inline: auto;
}
.sea-compare__title {
font-size: 0.9rem;
font-weight: 800;
margin-top: 0.5rem;
}
.sea-compare__title a { color: inherit; text-decoration: none; }
.sea-compare__remove {
border: 0;
background: var(--muted);
border-radius: 0.65rem;
width: 2.25rem;
height: 2.25rem;
display: grid;
place-items: center;
margin-inline: auto;
}
.sea-galleries__grid,
.sea-gallery__grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.85rem;
}
@media (min-width: 768px) {
.sea-galleries__grid,
.sea-gallery__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1200px) {
.sea-galleries__grid,
.sea-gallery__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.sea-galleries__card {
display: grid;
gap: 0.5rem;
text-decoration: none;
color: inherit;
padding: 0.65rem;
overflow: hidden;
}
.sea-galleries__card img {
width: 100%;
aspect-ratio: 1;
object-fit: cover;
border-radius: 0.85rem;
}
.sea-galleries__card span {
font-weight: 800;
font-size: 0.9rem;
}
/* —— Export-html PDP parity —— */
.page-product-detail .pdp-main {
padding-block: 1rem 2rem;
}
.page-product-detail .sea-pdp-layout {
display: grid;
grid-template-columns: 1fr;
gap: 1.25rem;
}
@media (min-width: 992px) {
.page-product-detail .sea-pdp-layout {
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
gap: 2.5rem 4rem;
align-items: start;
}
}
.pdp-info {
display: flex;
flex-direction: column;
}
.pdp-info__top {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
margin-bottom: 0.85rem;
}
.pdp-info__badge {
display: inline-flex;
align-items: center;
gap: 0.35rem;
background: color-mix(in srgb, var(--primary) 10%, transparent);
color: var(--primary);
border: 0;
border-radius: 999px;
padding: 0.25rem 0.75rem;
font-size: 0.75rem;
font-weight: 900;
text-decoration: none;
}
.pdp-info__badge .pdp-brand__logo {
max-height: 22px;
max-width: 72px;
object-fit: contain;
}
.pdp-info__rating {
display: inline-flex;
align-items: center;
gap: 0.25rem;
color: var(--secondary);
text-decoration: none;
font-weight: 900;
}
.pdp-info__rating-score { color: var(--foreground); font-size: 0.9rem; }
.pdp-info__rating-count { color: var(--muted-foreground); font-size: 0.75rem; font-weight: 800; }
.pdp-info__title {
font-family: var(--font-heading) !important;
font-weight: 900 !important;
font-size: clamp(1.35rem, 3vw, 2.25rem) !important;
line-height: 1.3 !important;
margin: 0 0 0.85rem !important;
color: var(--foreground) !important;
}
.pdp-info__meta {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.5rem 0.85rem;
margin-bottom: 0.75rem;
}
.pdp-info__meta .sold-count-display,
.pdp-info .tp-product-details-sold .sold-count-display {
font-size: 0.85rem !important;
font-weight: 800 !important;
color: var(--muted-foreground) !important;
}
/* Hide buybox description — full content lives in tabs */
.pdp-info .tp-product-details-description,
.pdp-info .tp-product-details-social {
display: none !important;
}
.pdp-info .tp-product-details-price-block {
display: flex;
flex-direction: column;
gap: 0.85rem;
}
.pdp-info .pdp-price { order: 1; margin-bottom: 0 !important; }
.pdp-info .pdp-points { order: 2; margin-bottom: 0 !important; }
.pdp-info .tp-product-details-price-block > *:not(.pdp-price):not(.pdp-points) {
order: 3;
}
.pdp-info .pdp-price,
.pdp-info .tp-product-details-price-wrapper {
display: flex;
flex-wrap: wrap;
align-items: baseline;
gap: 0.65rem 0.85rem;
}
.pdp-info .pdp-price__current,
.pdp-info .tp-product-details-price.new-price {
font-size: clamp(1.5rem, 3vw, 1.85rem) !important;
font-weight: 900 !important;
color: var(--primary) !important;
}
.pdp-info .pdp-price__old,
.pdp-info .tp-product-details-price.old-price {
font-size: 1.05rem !important;
color: var(--muted-foreground) !important;
text-decoration: line-through;
text-decoration-color: color-mix(in srgb, var(--destructive, #ef4444) 50%, transparent);
}
/* Desktop qty + cart row like export */
.pdp-actions {
display: grid;
gap: 0.85rem;
margin-top: 0.5rem;
}
.pdp-actions__row {
display: none;
flex-wrap: wrap;
align-items: stretch;
gap: 1rem;
}
@media (min-width: 768px) {
.pdp-actions__row {
display: flex !important;
}
.pdp-actions__buy,
.pdp-actions__tip {
display: block !important;
}
}
.pdp-qty {
display: inline-flex !important;
align-items: center;
background: var(--muted);
border: 0;
border-radius: 0.85rem;
overflow: hidden;
height: 3.25rem;
margin: 0 !important;
}
.pdp-qty__btn,
.pdp-qty .tp-cart-minus,
.pdp-qty .tp-cart-plus {
width: 3rem !important;
height: 3.25rem !important;
display: grid !important;
place-items: center;
border: 0 !important;
background: transparent !important;
font-size: 1.25rem !important;
font-weight: 900 !important;
cursor: pointer;
color: inherit;
}
.pdp-qty__input,
.pdp-qty .tp-cart-input {
width: 3rem !important;
height: 3.25rem !important;
border: 0 !important;
background: transparent !important;
text-align: center !important;
font-weight: 900 !important;
font-size: 1.05rem !important;
-moz-appearance: textfield;
}
.pdp-qty__input::-webkit-outer-spin-button,
.pdp-qty__input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
.pdp-actions__cart-wrap {
flex: 1;
margin: 0 !important;
min-width: 12rem;
}
.pdp-actions__cart {
width: 100% !important;
min-height: 3.25rem !important;
display: inline-flex !important;
align-items: center;
justify-content: center;
gap: 0.65rem;
background: var(--primary) !important;
color: #fff !important;
border: 0 !important;
border-radius: 0.85rem !important;
font-weight: 900 !important;
font-size: 1.1rem !important;
box-shadow: 0 12px 28px rgb(0 119 182 / 30%) !important;
}
.pdp-actions__cart::after { display: none !important; content: none !important; }
.pdp-actions__buy {
width: 100% !important;
min-height: 3.5rem !important;
background: var(--secondary) !important;
color: var(--secondary-foreground, #000) !important;
border: 0 !important;
border-bottom: 4px solid #d97706 !important;
border-radius: 0.85rem !important;
font-weight: 900 !important;
font-size: 1.1rem !important;
box-shadow: 0 8px 18px rgb(255 183 3 / 25%) !important;
}
.pdp-actions__buy::after { display: none !important; content: none !important; }
.pdp-actions__tip {
display: none;
align-items: center;
gap: 0.45rem;
margin: 0;
font-size: 0.75rem;
font-weight: 800;
color: var(--muted-foreground);
}
@media (min-width: 768px) {
.pdp-actions__tip { display: flex !important; }
}
.pdp-actions__tip iconify-icon {
color: var(--accent, #0ea5e9);
font-size: 1.1rem;
}
.pdp-info .tp-product-details-action-sm {
display: flex;
flex-wrap: wrap;
gap: 0.65rem;
margin-top: 0.75rem;
}
.pdp-info .tp-product-details-action-sm-btn {
border-radius: 0.75rem !important;
font-weight: 800 !important;
border: 0 !important;
background: var(--card) !important;
}
.pdp-perks {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.75rem 1rem;
margin-top: 1.15rem;
padding-top: 1.15rem;
border-top: 0;
order: 50;
}
.pdp-info .sea-matching-styles { margin-top: 1.25rem; }
/* Tabs like export */
.sea-pdp-tabs__nav {
display: flex;
gap: 0;
border-bottom: 0;
overflow-x: auto;
margin-bottom: 1.25rem;
}
.sea-pdp-tabs__btn {
appearance: none;
background: transparent;
border: 0;
border-bottom: 4px solid transparent;
padding: 0.85rem 1.25rem;
font-weight: 800;
color: var(--muted-foreground);
white-space: nowrap;
cursor: pointer;
}
.sea-pdp-tabs__btn.is-active {
color: var(--primary);
border-bottom-color: var(--primary);
font-weight: 900;
}
.sea-pdp-tabs__content {
max-width: 48rem;
font-weight: 600;
line-height: 1.8;
color: color-mix(in srgb, var(--foreground) 80%, transparent);
}
/* Mobile: cart/buy live in order-sticky like export */
@media (max-width: 767px) {
.pdp-actions__row,
.pdp-actions__buy,
.pdp-actions__tip {
display: none !important;
}
}