﻿/* Theme sections controlled by ColorAssignment_Tbl. */

html,
body {
    color: var(--theme-page-text, var(--text-primary, #1f2937));
    background-color: var(--theme-page-bg, #fff);
    color-scheme: var(--theme-color-scheme, normal);
}

body a {
    color: inherit;
}

body a:hover,
body a:focus-visible {
    color: var(--theme-page-hover-text, var(--color-primary));
}

body hr {
    border-color: var(--theme-page-border, var(--color-border));
}

.card,
.accordion-item,
.collapse-card,
.content-box,
.info-box,
.block:not(.section-assignment-card) {
    color: var(--theme-surface-text, var(--theme-page-text));
    background-color: var(--theme-surface-bg, transparent);
    border-color: var(--theme-surface-border, var(--theme-page-border));
}

.card:hover,
.content-box:hover,
.info-box:hover {
    color: var(--theme-surface-hover-text, var(--theme-surface-text));
    border-color: var(--theme-surface-hover-border, var(--theme-surface-border));
}

#product-listing .mobile-video-card,
#product-listing .mobile-card-link,
#product-listing .mobile-card-content,
#product-listing .pr-mob-item > .row,
.product-card,
.product-item,
.shop-product-card {
    color: var(--theme-product-card-text, var(--theme-surface-text)) !important;
    background-color: var(--theme-product-card-bg, var(--theme-surface-bg)) !important;
    border-color: var(--theme-product-card-border, var(--theme-surface-border)) !important;
}

#product-listing .mobile-product-title,
#product-listing .product-name,
.product-card .product-name,
.product-item .product-name {
    color: var(--theme-product-card-text, var(--theme-surface-text)) !important;
}

#product-listing .mobile-product-title:hover,
#product-listing .product-name:hover,
.product-card .product-name:hover,
.product-item .product-name:hover {
    color: var(--theme-product-card-hover-text, var(--color-primary)) !important;
}

.form-control,
.form-select,
.input-group-text,
textarea,
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not(.mobile-ios-search__input),
select {
    color: var(--theme-form-text, var(--theme-page-text));
    background-color: var(--theme-form-bg, var(--theme-surface-bg));
    border-color: var(--theme-form-border, var(--theme-page-border));
}

.form-control::placeholder,
textarea::placeholder,
input::placeholder {
    color: var(--theme-muted-text, #6b7280);
    opacity: 1;
}

.form-control:focus,
.form-select:focus,
textarea:focus,
input:not(.mobile-ios-search__input):focus,
select:focus {
    color: var(--theme-form-text, var(--theme-page-text));
    background-color: var(--theme-form-hover-bg, var(--theme-form-bg));
    border-color: var(--theme-form-hover-border, var(--color-primary));
    box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--theme-form-hover-border, var(--color-primary)) 18%, transparent);
}

.table {
    --bs-table-color: var(--theme-table-text, var(--theme-page-text));
    --bs-table-bg: var(--theme-table-bg, var(--theme-surface-bg));
    --bs-table-border-color: var(--theme-table-border, var(--theme-page-border));
    --bs-table-hover-color: var(--theme-table-hover-text, var(--theme-table-text));
    --bs-table-hover-bg: var(--theme-table-hover-bg, var(--theme-surface-hover-bg));
    color: var(--theme-table-text, var(--theme-page-text));
    border-color: var(--theme-table-border, var(--theme-page-border));
}

.list-group-item:not(:is(#modalShoppingCart, #wholesaleShoppingCart) .list-group-item) {
    color: var(--theme-table-text, var(--theme-page-text));
    background-color: var(--theme-table-bg, var(--theme-surface-bg));
    border-color: var(--theme-table-border, var(--theme-page-border));
}

.list-group-item:not(:is(#modalShoppingCart, #wholesaleShoppingCart) .list-group-item):hover {
    color: var(--theme-table-hover-text, var(--theme-table-text));
    background-color: var(--theme-table-hover-bg, var(--theme-surface-hover-bg));
}

.modal-content,
.offcanvas:not(:is(#modalShoppingCart, #wholesaleShoppingCart)),
.popover,
.toast,
.dropdown-menu:not(.nav-body .dropdown-menu) {
    color: var(--theme-dialog-text, var(--theme-page-text));
    background-color: var(--theme-dialog-bg, var(--theme-surface-bg));
    border-color: var(--theme-dialog-border, var(--theme-page-border));
}

.modal-header,
.modal-footer,
.offcanvas-header {
    border-color: var(--theme-dialog-border, var(--theme-page-border));
}

.text-muted,
.text-secondary,
.form-text,
.small-muted,
small.text-muted {
    color: var(--theme-muted-text, #6b7280) !important;
}

.price,
.product-price,
.final-price,
.mobile-final-price,
.pr-price,
[data-price] {
    color: var(--theme-price-text, var(--color-primary)) !important;
}

.price:hover,
.product-price:hover,
.final-price:hover {
    color: var(--theme-price-hover-text, var(--theme-price-text)) !important;
}

.badge:not(.bg-success):not(.bg-danger):not(.bg-warning):not(.bg-info),
.tag-badge,
.cart-glass-badge {
    color: var(--theme-badge-text, #fff);
    background-color: var(--theme-badge-bg, var(--color-primary));
    border-color: var(--theme-badge-border, transparent);
}

.badge:not(.bg-success):not(.bg-danger):not(.bg-warning):not(.bg-info):hover,
.tag-badge:hover {
    color: var(--theme-badge-hover-text, var(--theme-badge-text));
    background-color: var(--theme-badge-hover-bg, var(--theme-badge-bg));
    border-color: var(--theme-badge-hover-border, var(--theme-badge-border));
}

.mobile-search-safe-space {
    background-color: var(--theme-search-rail-bg, var(--mob-search-bg, #fff));
    border-color: var(--theme-search-rail-border, transparent);
    border-bottom-style: solid;
    border-bottom-width: 1px;
}

.pagination {
    --bs-pagination-color: var(--theme-pagination-text, var(--theme-page-text));
    --bs-pagination-bg: var(--theme-pagination-bg, var(--theme-surface-bg));
    --bs-pagination-border-color: var(--theme-pagination-border, var(--theme-page-border));
    --bs-pagination-hover-color: var(--theme-pagination-hover-text, var(--color-primary));
    --bs-pagination-hover-bg: var(--theme-pagination-hover-bg, var(--theme-surface-hover-bg));
    --bs-pagination-hover-border-color: var(--theme-pagination-hover-border, var(--color-primary));
    --bs-pagination-active-color: var(--theme-pagination-hover-text, #fff);
    --bs-pagination-active-bg: var(--theme-pagination-hover-bg, var(--color-primary));
    --bs-pagination-active-border-color: var(--theme-pagination-hover-border, var(--color-primary));
}

.breadcrumb {
    --bs-breadcrumb-divider-color: var(--theme-muted-text, #6b7280);
    --bs-breadcrumb-item-active-color: var(--theme-muted-text, #6b7280);
    color: var(--theme-pagination-text, var(--theme-page-text));
    background-color: var(--theme-pagination-bg, transparent);
    border-color: var(--theme-pagination-border, transparent);
}

/* Product description + independent specification list (element type 34) */
.product-description-specs {
    /* SHR-CTR-THEME-SYSTEM-002: 70% canvas/text, 20% surface/border, <=10% accent. */
    --pds-accent: var(--element-accent, var(--theme-color-primary));
    --pds-text: var(--theme-color-text);
    --pds-muted: var(--theme-color-text-muted);
    --pds-background: var(--theme-color-canvas);
    --pds-surface: var(--theme-color-surface);
    --pds-line: var(--theme-color-border);
    --pds-focus: var(--element-focus-ring, var(--theme-color-focus-ring));
    position: relative;
    isolation: isolate;
    overflow: clip;
    color: var(--pds-text);
    padding-block: clamp(3rem, 6.5vw, 6.75rem);
    background: var(--pds-background);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.product-description-specs__container {
    position: relative;
    z-index: 1;
}

.product-description-specs__floating-image {
    position: absolute;
    z-index: 0;
    inset-inline-start: clamp(-4rem, -3vw, -1rem);
    bottom: 0;
    width: clamp(10rem, 24vw, 25rem);
    max-width: 42%;
    max-height: 90%;
    object-fit: contain;
    object-position: bottom center;
    pointer-events: none;
    user-select: none;
}

.product-description-specs__title {
    max-width: 64rem;
    margin: 0 0 clamp(1.75rem, 3.5vw, 3.25rem);
    color: inherit;
    font-size: clamp(1.45rem, 2.2vw, 2.15rem);
    font-weight: 800;
    line-height: 1.4;
    letter-spacing: -.02em;
}

.product-description-specs__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(20rem, .92fr);
    gap: clamp(2.5rem, 7vw, 7.5rem);
    align-items: start;
}

.product-description-specs--has-copy:not(.product-description-specs--has-specs) .product-description-specs__grid {
    grid-template-columns: minmax(0, 1fr);
}

.product-description-specs--has-specs:not(.product-description-specs--has-copy) .product-description-specs__specs {
    grid-column: 2;
}

.product-description-specs__copy {
    min-width: 0;
    max-width: 52rem;
    color: inherit;
    font-size: clamp(.96rem, 1.02vw, 1.075rem);
    line-height: 1.95;
}

.product-description-specs__copy > :first-child { margin-top: 0; }
.product-description-specs__copy > :last-child { margin-bottom: 0; }
.product-description-specs__copy p { margin-block: 0 1.15rem; }
.product-description-specs__copy ul,
.product-description-specs__copy ol { padding-inline-start: 1.35rem; }
.product-description-specs__copy li::marker { color: var(--pds-accent); }
.product-description-specs__copy strong { font-weight: 750; }
.product-description-specs__copy :where(h1, h2, h3, h4, h5, h6, p, ul, ol, li, strong, em, b, i, span) {
    color: inherit !important;
}
.product-description-specs__copy a {
    color: var(--pds-accent) !important;
}

.product-description-specs__specs {
    min-width: 0;
}

.product-description-specs__specs-title {
    display: flex;
    align-items: center;
    gap: .6rem;
    margin: 0 0 .9rem;
    color: inherit;
    font-size: clamp(1.2rem, 1.65vw, 1.55rem);
    font-weight: 800;
    line-height: 1.4;
}

.product-description-specs__specs-title::before {
    width: .22rem;
    height: 1.1em;
    border-radius: 999px;
    background: var(--pds-accent);
    content: "";
}

.product-description-specs__list {
    display: grid;
    gap: 0;
    width: 100%;
    margin: 0;
    padding: 0;
    color: inherit;
    list-style: none;
}

.product-description-specs__item {
    display: grid;
    grid-template-columns: repeat(var(--pds-spec-columns, 2), minmax(0, 1fr));
    gap: clamp(.65rem, 1.5vw, 1.1rem);
    min-height: 2.25rem;
    padding: .42rem .9rem;
    border: 0;
    border-radius: 0;
    color: inherit;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.product-description-specs__list--two-columns .product-description-specs__item {
    grid-template-columns: minmax(7.5rem, 1fr) minmax(0, 1.25fr);
}

.product-description-specs__item:nth-child(odd) {
    background: color-mix(in srgb, var(--pds-surface) 94%, transparent);
}

.product-description-specs__cell {
    display: flex;
    align-items: center;
    min-width: 0;
}

.product-description-specs__label {
    color: color-mix(in srgb, var(--pds-text) 88%, var(--pds-muted));
    font-weight: 650;
}

.product-description-specs__value {
    min-width: 0;
    font-weight: 400;
}

@media (max-width: 991.98px) {
    .product-description-specs__floating-image {
        max-width: 34%;
        max-height: 60%;
        opacity: .72;
    }

    .product-description-specs__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 2.5rem;
    }

    .product-description-specs--has-specs:not(.product-description-specs--has-copy) .product-description-specs__specs {
        grid-column: 1;
    }

    .product-description-specs__copy {
        max-width: none;
    }

    .product-description-specs__specs {
        padding-top: 1.75rem;
        border-top: 1px solid color-mix(in srgb, var(--pds-line) 75%, transparent);
    }
}

@media (max-width: 575.98px) {
    .product-description-specs {
        padding-block: 2.5rem;
    }

    .product-description-specs__floating-image {
        inset-inline-start: -2.5rem;
        width: 10rem;
        max-width: 42%;
        max-height: 45%;
        opacity: .32;
    }

    .product-description-specs__title {
        margin-bottom: 1.5rem;
        font-size: 1.35rem;
    }

    .product-description-specs__copy {
        font-size: .95rem;
        line-height: 1.8;
    }

    .product-description-specs__specs {
        padding-top: 1.35rem;
    }

    .product-description-specs__specs-title {
        font-size: 1.15rem;
    }

    .product-description-specs__item,
    .product-description-specs__list--two-columns .product-description-specs__item {
        grid-template-columns: minmax(0, 1fr);
        gap: .1rem;
        min-height: 0;
        padding: .5rem .75rem;
    }

    .product-description-specs__cell {
        display: block;
    }

    .product-description-specs__label {
        color: var(--pds-muted);
        font-size: .78rem;
    }

    .product-description-specs__value {
        font-size: .95rem;
    }
}
