/* Product detail pages (pre-made, custom, accessories) — scoped .page-product */

.page-product .progress { height: 8px; border-radius: 0; }
.page-product .progress-bar[data-width="0"] { width: 0; }
.page-product .progress-bar[data-width="2"] { width: 2%; }
.page-product .progress-bar[data-width="4"] { width: 4%; }
.page-product .progress-bar[data-width="13"] { width: 13%; }
.page-product .progress-bar[data-width="81"] { width: 81%; }

.page-product .pdp-title { max-width: 22ch; }
.page-product .upsell-card { transition: border-color var(--transition-fast), background-color var(--transition-fast); }
.page-product .upsell-card:hover { border-style: solid; background: #fff; }
.page-product .upsell-card .link-arrow { color: var(--brand-secondary); }

.page-product .nav-tabs { border-bottom-color: var(--brand-border); gap: .25rem; flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; }
.page-product .nav-tabs .nav-link {
    font-family: var(--font-heading);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    white-space: nowrap;
    color: var(--brand-text-secondary);
    border-radius: var(--radius-md) var(--radius-md) 0 0;
}
.page-product .nav-tabs .nav-link:hover { color: var(--brand-primary); border-color: transparent; }
.page-product .nav-tabs .nav-link.active {
    color: var(--brand-text);
    background: #fff;
    box-shadow: inset 0 3px 0 var(--brand-primary);
}
.page-product .tab-content .table th { font-family: var(--font-heading); text-transform: uppercase; letter-spacing: var(--tracking-wide); color: var(--brand-text); }

.page-product .config-summary .summary-preview img { object-fit: contain; background: #fff; }
.page-product .list-group-numbered > .list-group-item::before { font-family: var(--font-display); font-weight: 700; color: var(--brand-primary); margin-right: .5rem; }

@media (max-width: 991.98px) {
    .page-product .config-summary { position: static; }
}

/* J3 parity product page (www.j3.naturalcarpetcompany.com/product-collections/*).
 * Markup: templates/natural/html/com_j2commerce/templates/bootstrap5/view*.php. */
.nc-pdp-crumbs { background: #f6f8f9; }
.nc-pdp-crumbs .breadcrumb { margin: 0; padding: 1rem 0;}
.nc-pdp-crumbs .breadcrumb a { color: #34393a; text-decoration: underline; }
.nc-pdp-crumbs .breadcrumb a:hover { color: #b11117; }

.nc-pdp-main { max-width: 1140px; padding-block: 60px 25px; }
.nc-pdp-media .product-gallery { max-width: 427px; margin-inline: auto; }
.nc-pdp-info { padding-inline: 1.5rem; }

.nc-pdp-collection { font-family: var(--font-natural); font-synthesis: none; font-size: .9375rem; color: #b11117; text-decoration: none; }
.nc-pdp-collection:hover, .nc-pdp-collection:focus-visible { text-decoration: underline; }
.nc-pdp-title { font-size: 3rem; line-height: 1; font-weight: 400; text-transform: capitalize; letter-spacing: 0; color: #202324; margin: .25rem 0 .5rem; }
.nc-pdp-subtitle { font-size: 1rem; color: #202324; margin: 0 0 3rem; }

/* Grey uppercase label over a red-checked list — the filter groups and the facts row. */
.nc-pdp-specs { padding-inline: 15px; }
.nc-pdp-spec + .nc-pdp-spec { margin-top: 1.5rem; }
.nc-pdp-label { font-family: var(--font-body); font-size: .9375rem; font-weight: 700; line-height: 1.4; letter-spacing: 1px; text-transform: uppercase; color: #6c757d; margin: 0 0 10px; }
.nc-pdp-checklist { list-style: none; margin: 0; padding: 0 0 0 14px; }
.nc-pdp-checklist li { display: flex; align-items: baseline; gap: .5rem; font-size: .875rem; font-weight: 600; line-height: 1.5; color: #212529; margin-bottom: 10px; }
.nc-pdp-checklist li > [class*="fa-"] { flex: 0 0 14px; font-size: .875rem; color: #b11117; }
.nc-pdp-checklist a { color: #34393a; text-decoration: none; }
.nc-pdp-checklist a:hover, .nc-pdp-checklist a:focus-visible { color: #b11117; text-decoration: underline; }

.nc-pdp-request { margin: 25px 0 40px; text-align: center; }
.nc-pdp-request-text { max-width: 370px; margin: 0 auto 15px; font-size: .75rem; line-height: 1.5; color: #212529; }
.nc-pdp-request-text strong { display: block; font-weight: 600; }
.nc-pdp-request-btn,
.nc-pdp-cart .btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-width: min(100%, 368px); padding: 16px 64px; font-family: var(--font-natural); font-synthesis: none; font-size: 1.125rem; text-transform: uppercase; color: #fff; background: #181b24; border-color: #181b24;width:100%;}
.nc-pdp-request-btn:hover, .nc-pdp-request-btn:focus-visible { background: #b11117; border-color: #b11117; color: #fff; }
.j2c-productquote-wrap {display:block;width:100%;}
.nc-pdp-facts { padding-block: 60px; }
.nc-pdp-facts .container { max-width: 1140px; }

.nc-pdp-cta { background: var(--nc-nav-bg); padding-block: 94px 72px; }
.nc-pdp-cta-intro { display: flex; align-items: center; justify-content: center; gap: 1rem; }
.nc-pdp-cta-icon { flex: 0 0 56px; display: grid; place-items: center; width: 56px; height: 56px; font-size: 2.25rem; color: var(--nc-nav-bg); background: #fff; border-radius: 6px; }
.nc-pdp-cta-title { font-family: var(--font-body); font-size: 1.5rem; font-weight: 600; line-height: 1; letter-spacing: 0; text-transform: none; color: #fff; margin: 0 0 .5rem; }
.nc-pdp-cta-lead { font-size: .875rem; font-weight: 500; line-height: 1; color: #fff; margin: 0; }
.nc-pdp-cta-actions { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; }
@media (min-width: 992px) { .nc-pdp-cta-actions { justify-content: flex-start; } }
.nc-pdp-cta-btn { font-family: var(--font-body); display: inline-flex; align-items: center; gap: .4rem; padding: 12px 24px; font-size: 1rem; font-weight: 600; letter-spacing: 1px; text-transform: uppercase;}
.nc-pdp-cta-btn.btn-dark { --bs-btn-color: #fff; --bs-btn-bg: transparent; --bs-btn-border-color: #fff; --bs-btn-hover-color: var(--nc-nav-bg); --bs-btn-hover-bg: #fff; --bs-btn-hover-border-color: #fff; --bs-btn-active-color: var(--nc-nav-bg); --bs-btn-active-bg: #fff; --bs-btn-active-border-color: #fff; --bs-btn-focus-shadow-rgb: 255, 255, 255; }
.nc-pdp-cta-btn.btn-primary { background: #b11117; border-color: #b11117; color: #fff; }
.nc-pdp-cta-note { margin: .25rem 0 0; font-size: .75rem; line-height: 1.3; text-align: center; color: #fff; }

@media (max-width: 991.98px) {
    .nc-pdp-main { padding-block: 2rem 1rem; }
    .nc-pdp-title { font-size: 2.25rem; }
    .nc-pdp-subtitle { margin-bottom: 2rem; }
    .nc-pdp-request-btn { padding-inline: 2rem; }
    .nc-pdp-cta { padding-block: 3rem; }
}