/* BigDIAMOND WooCommerce layer: Shared commerce shell.
 * Generated from the audited route split; keep selectors route-scoped in inc/assets.php.
 */

.bd-commerce .site.grid-container,
.bd-commerce .container.grid-container,
.bd-commerce.one-container .site.grid-container {
    width: 100%;
    max-width: none;
}

.bd-commerce .site-content {
    width: min(var(--bd-content), calc(100% - (var(--bd-gutter) * 2)));
    margin: 0 auto;
    padding: 112px 0 clamp(72px, 9vw, 120px);
}
/* GeneratePress and WooCommerce both ship late, equally-specific layout rules.
 * Keep the project-owned commerce shell authoritative on transactional pages. */
.bd-global-header.bd-commerce.one-container .site-content {
    padding: 112px 0 clamp(72px, 9vw, 120px);
}

.bd-commerce .content-area,
.bd-commerce .site-main,
.bd-commerce .inside-article {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
}

.bd-commerce .entry-header {
    margin: 0 0 clamp(30px, 5vw, 52px);
}

.bd-commerce .entry-title {
    margin: 0;
    color: var(--bd-primary);
    font-family: var(--bd-serif);
    font-size: clamp(38px, 6vw, 72px);
    font-weight: 600;
    line-height: 1.08;
}

.bd-commerce .woocommerce-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    margin: 0 0 28px;
    color: var(--bd-muted);
    font: 400 12px/1.4 var(--bd-sans);
    letter-spacing: 0.02em;
}

.bd-commerce .woocommerce-breadcrumb a {
    color: var(--bd-muted);
}

.bd-commerce .woocommerce-breadcrumb a:hover {
    color: var(--bd-gold-ink);
}

.bd-shop-intro {
    max-width: 860px;
    margin-bottom: clamp(34px, 5vw, 58px);
}

.bd-shop-intro h1,
.bd-commerce.woocommerce-shop .woocommerce-products-header__title,
.bd-commerce.tax-product_cat .woocommerce-products-header__title,
.bd-commerce.single-product .product_title {
    margin: 14px 0 0;
    color: var(--bd-primary);
    font-family: var(--bd-serif);
    font-size: clamp(38px, 6vw, 72px);
    font-weight: 600;
    line-height: 1.08;
}

.bd-shop-intro p {
    max-width: 680px;
    margin-top: 18px;
    color: var(--bd-muted);
    font-size: 17px;
    line-height: 1.7;
}

.bd-product-category-guide {
    width: min(860px, 100%);
    margin: clamp(52px, 7vw, 88px) auto 0;
    padding: clamp(28px, 4vw, 48px);
    border: 1px solid var(--bd-border);
    background: var(--bd-surface);
    color: var(--bd-text);
}

.bd-product-category-guide > :first-child {
    margin-top: 0;
}

.bd-product-category-guide > :last-child {
    margin-bottom: 0;
}

.bd-product-category-guide :where(h2, h3) {
    color: var(--bd-primary);
}

.bd-product-category-guide a {
    color: var(--bd-primary) !important;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 0.18em;
}

.bd-product-category-guide a:hover,
.bd-product-category-guide a:focus-visible {
    color: var(--bd-gold-ink) !important;
}

.bd-commerce .woocommerce-result-count,
.bd-commerce .woocommerce-ordering {
    margin-bottom: 28px;
}

.bd-commerce .woocommerce-ordering select,
.bd-commerce input.input-text,
.bd-commerce textarea,
.bd-commerce select {
    min-height: 44px;
    border: 1px solid var(--bd-border);
    background: #fff;
    color: var(--bd-primary);
    padding: 10px 12px;
    font: 400 15px/1.4 var(--bd-sans);
}


.bd-commerce ul.products li.product .button,
.bd-commerce .single_add_to_cart_button,
.bd-commerce .checkout-button,
.bd-commerce button.button,
.bd-commerce a.button,
.bd-commerce input.button {
    border-radius: 0;
    border: 1px solid var(--bd-primary);
    background: var(--bd-primary);
    color: var(--bd-on-primary);
    padding: 13px 18px;
    font: 700 11px/1.2 var(--bd-sans);
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.bd-global-header.bd-commerce.woocommerce-account button.button,
.bd-global-header.bd-commerce.woocommerce-cart button.button,
.bd-global-header.bd-commerce.woocommerce-checkout button.button,
.bd-global-header.bd-commerce.woocommerce-cart a.button,
.bd-global-header.bd-commerce.woocommerce-checkout a.button {
    border-color: var(--bd-primary);
    background: var(--bd-primary);
    color: var(--bd-on-primary);
}

.bd-global-header.bd-commerce :where(.woocommerce-privacy-policy-text, .woocommerce-terms-and-conditions-wrapper) a {
    color: var(--bd-gold-ink);
    text-decoration: underline;
    text-underline-offset: 0.18em;
}

.bd-commerce ul.products li.product .button {
    min-height: 44px;
    padding-right: 12px;
    padding-left: 12px;
    text-align: center;
}

.bd-commerce ul.products li.product .button:hover,
.bd-commerce .single_add_to_cart_button:hover,
.bd-commerce .checkout-button:hover,
.bd-commerce button.button:hover,
.bd-commerce a.button:hover,
.bd-commerce input.button:hover {
    background: var(--bd-primary-deep);
    border-color: var(--bd-primary-deep);
    color: var(--bd-on-primary);
}


@media (max-width: 680px) {
    .bd-commerce .site-content,
    .bd-global-header.bd-commerce.one-container .site-content {
        padding-top: 92px;
    }

    /* The mobile Stitch composition starts with the media. Keep the
     * breadcrumb navigation available to assistive technology without
     * inserting a visual block between the app bar and gallery. */
    .bd-commerce.single-product .woocommerce-breadcrumb {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
    }

    .bd-commerce table.shop_table th,
    .bd-commerce table.shop_table td {
        padding: 12px;
    }
}

.bd-commerce .woocommerce-message,
.bd-commerce .woocommerce-info,
.bd-commerce .woocommerce-error {
    border-top: 0;
    border-left: 3px solid var(--bd-secondary);
    background: var(--bd-surface-low);
    color: var(--bd-primary) !important;
    font: 400 15px/1.6 var(--bd-sans);
}

.bd-commerce .woocommerce-error {
    border-left-color: #ba1a1a !important;
}

/* Keep every classic Woo notice legible when GeneratePress/WooCommerce late
 * rules style the action link as a transparent button with white text. */
.bd-global-header.bd-commerce :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) :is(li, p) {
    color: var(--bd-primary) !important;
}

.bd-global-header.bd-commerce :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) :is(a:not(.button), a:not(.button):visited) {
    color: var(--bd-primary) !important;
    text-decoration: underline;
    text-decoration-color: currentColor;
    text-underline-offset: 0.16em;
}

.bd-global-header.bd-commerce :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) :is(a.button, a.button:visited) {
    box-sizing: border-box;
    display: inline-flex !important;
    width: auto;
    max-width: 100%;
    min-height: 44px;
    margin-left: 16px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--bd-primary) !important;
    border-radius: 0 !important;
    background: var(--bd-primary) !important;
    color: var(--bd-on-primary) !important;
    padding: 10px 14px !important;
    font: 700 11px/1.25 var(--bd-sans) !important;
    letter-spacing: 0.1em;
    text-align: center;
    text-decoration: none !important;
    text-transform: uppercase;
    vertical-align: middle;
}

.bd-global-header.bd-commerce :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) :is(a.button:hover, a.button:focus-visible, a.button:active) {
    border-color: var(--bd-primary-deep) !important;
    background: var(--bd-primary-deep) !important;
    color: var(--bd-on-primary) !important;
}

.bd-global-header.bd-commerce :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) a.button:focus-visible {
    outline: 2px solid var(--bd-gold) !important;
    outline-offset: 2px;
}

@media (max-width: 680px) {
    .bd-global-header.bd-commerce :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) :is(a.button, a.button:visited) {
        display: flex !important;
        width: 100%;
        margin: 12px 0 0 !important;
    }
}

/* Native Woo notices remain the source of truth. On catalogue and product
 * routes the mini-cart controller moves them into this accessible toast stack;
 * Cart, Checkout and My Account keep their contextual inline notices. */
.bd-commerce-toasts {
    --bd-commerce-toast-top: 88px;
    position: fixed;
    top: var(--bd-commerce-toast-top);
    right: max(16px, env(safe-area-inset-right));
    z-index: 1400;
    display: grid;
    width: min(420px, calc(100vw - 32px));
    max-height: calc(100vh - var(--bd-commerce-toast-top) - 16px);
    max-height: calc(100dvh - var(--bd-commerce-toast-top) - 16px);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    gap: 12px;
    pointer-events: none;
}

.admin-bar.bd-commerce .bd-commerce-toasts {
    --bd-commerce-toast-top: 120px;
}

.bd-commerce .woocommerce-notices-wrapper:empty {
    display: none;
}

.bd-commerce-toast {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    overflow-wrap: anywhere;
    border: 1px solid var(--bd-outline-variant);
    border-left: 3px solid var(--bd-gold);
    border-radius: var(--bd-radius);
    background: var(--bd-surface);
    color: var(--bd-primary);
    padding: 16px 60px 16px 18px;
    box-shadow: none;
    font: 500 14px/1.55 var(--bd-sans);
    opacity: 1;
    transform: translateY(0);
    transition: opacity 220ms var(--bd-ease), transform 220ms var(--bd-ease);
    pointer-events: auto;
}

.bd-commerce-toast * {
    box-sizing: border-box;
}

.bd-commerce-toast--error {
    border-left-color: #8b2e2e;
}

.bd-commerce-toast.is-preparing,
.bd-commerce-toast.is-leaving {
    opacity: 0;
    transform: translateY(-8px);
}

.bd-commerce-toast__message {
    margin: 0;
    color: var(--bd-primary);
}

.bd-global-header.bd-commerce .bd-commerce-toast > :where(
    .woocommerce-message,
    .woocommerce-info,
    .woocommerce-error
) {
    min-height: 0;
    margin: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--bd-primary) !important;
    padding: 0 !important;
    box-shadow: none !important;
    font: inherit;
    list-style: none;
}

.bd-global-header.bd-commerce .bd-commerce-toast > :where(
    .woocommerce-message,
    .woocommerce-info,
    .woocommerce-error
)::before {
    display: none !important;
}

.bd-global-header.bd-commerce .bd-commerce-toast .woocommerce-error li {
    margin: 0;
    color: var(--bd-primary);
    padding: 0;
}

.bd-global-header.bd-commerce .bd-commerce-toast :where(
    .bd-commerce-toast__action,
    .woocommerce-error a.button,
    .woocommerce-message a.button,
    .woocommerce-info a.button
),
.bd-global-header.bd-commerce .bd-commerce-toast :where(
    .bd-commerce-toast__action,
    .woocommerce-error a.button,
    .woocommerce-message a.button,
    .woocommerce-info a.button
):visited {
    float: none !important;
    display: flex !important;
    width: max-content;
    max-width: 100%;
    min-height: 44px;
    margin: 12px 0 0 !important;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--bd-primary) !important;
    border-radius: var(--bd-radius) !important;
    background: var(--bd-primary) !important;
    color: var(--bd-on-primary) !important;
    padding: 10px 14px !important;
    font: 700 11px/1.25 var(--bd-sans) !important;
    letter-spacing: 0.1em;
    text-decoration: none !important;
    text-transform: uppercase;
}

.bd-global-header.bd-commerce .bd-commerce-toast :where(
    .bd-commerce-toast__action,
    .woocommerce-error a.button,
    .woocommerce-message a.button,
    .woocommerce-info a.button
):hover,
.bd-global-header.bd-commerce .bd-commerce-toast :where(
    .bd-commerce-toast__action,
    .woocommerce-error a.button,
    .woocommerce-message a.button,
    .woocommerce-info a.button
):focus-visible,
.bd-global-header.bd-commerce .bd-commerce-toast :where(
    .bd-commerce-toast__action,
    .woocommerce-error a.button,
    .woocommerce-message a.button,
    .woocommerce-info a.button
):active {
    border-color: var(--bd-primary-deep) !important;
    background: var(--bd-primary-deep) !important;
    color: var(--bd-on-primary) !important;
}

.bd-global-header.bd-commerce button.bd-commerce-toast__close,
.bd-global-header.bd-commerce button.bd-commerce-toast__close:hover,
.bd-global-header.bd-commerce button.bd-commerce-toast__close:focus-visible,
.bd-global-header.bd-commerce button.bd-commerce-toast__close:active {
    position: absolute;
    top: 8px;
    right: 8px;
    display: inline-grid;
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    place-items: center;
    border: 0 !important;
    border-radius: var(--bd-radius) !important;
    background: transparent !important;
    color: var(--bd-primary) !important;
    padding: 0 !important;
    font: 400 24px/1 var(--bd-sans) !important;
    box-shadow: none !important;
}

.bd-global-header.bd-commerce button.bd-commerce-toast__close:hover,
.bd-global-header.bd-commerce button.bd-commerce-toast__close:focus-visible,
.bd-global-header.bd-commerce button.bd-commerce-toast__close:active {
    background: var(--bd-surface-low) !important;
}

@media (max-width: 600px) {
    .bd-commerce-toasts {
        --bd-commerce-toast-top: 80px;
        right: max(16px, env(safe-area-inset-right));
        left: max(16px, env(safe-area-inset-left));
        width: auto;
    }

    .admin-bar.bd-commerce .bd-commerce-toasts {
        --bd-commerce-toast-top: 126px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .bd-commerce.single-product div.product div.images img,
    .bd-commerce-toast,
    .bd-commerce-toast.is-preparing,
    .bd-commerce-toast.is-leaving {
        transform: none;
        transition: none;
    }
}

.bd-commerce :where(.woocommerce-cart-form, .cart-collaterals, .checkout, .woocommerce-checkout, .woocommerce-MyAccount-content, .woocommerce-MyAccount-navigation, .woocommerce-order, .woocommerce-customer-details, .woocommerce-billing-fields, .woocommerce-shipping-fields, .woocommerce-additional-fields, .woocommerce-form, .woocommerce-Reviews, .woocommerce-tabs, .related, .upsells) {
    color: var(--bd-primary);
}

.bd-commerce :where(.woocommerce-cart-form, .cart-collaterals, .checkout, .woocommerce-checkout, .woocommerce-MyAccount-content, .woocommerce-order, .woocommerce-customer-details, .woocommerce-billing-fields, .woocommerce-shipping-fields, .woocommerce-additional-fields, .woocommerce-form, .woocommerce-Reviews, .woocommerce-tabs, .related, .upsells) :where(p, li, td, label, address, small, span) {
    color: var(--bd-muted);
}

.bd-commerce :where(.woocommerce-cart-form, .cart-collaterals, .checkout, .woocommerce-checkout, .woocommerce-MyAccount-content, .woocommerce-order, .woocommerce-customer-details, .woocommerce-billing-fields, .woocommerce-shipping-fields, .woocommerce-additional-fields, .woocommerce-form, .woocommerce-Reviews, .woocommerce-tabs, .related, .upsells) :where(h1, h2, h3, h4, th, strong, legend) {
    color: var(--bd-primary);
}

.bd-commerce :where(input, textarea, select, .select2-selection) {
    background: var(--bd-surface-lowest);
    color: var(--bd-primary);
}

.bd-commerce :where(input::placeholder, textarea::placeholder) {
    color: rgba(66, 72, 68, 0.72);
}

.bd-commerce :where(.quantity .qty, .coupon .input-text) {
    color: var(--bd-primary);
}

.bd-commerce :where(.woocommerce-message, .woocommerce-info, .woocommerce-error) :where(a, .button) {
    color: var(--bd-primary);
}

@media (prefers-reduced-motion: reduce) {
    .bd-product-card__image img,
    .bd-commerce ul.products li.product a img {
        transition: none;
    }

    .bd-product-card:hover img,
    .bd-commerce ul.products li.product:hover a img {
        transform: none;
    }
}

.bd-commerce .bd-menu-toggle {
    display: none;
}

/* WooCommerce adds this live alert on variable products. Keep it available to
 * assistive technology without letting its inherited width expand the page. */
.bd-commerce.single-product .reset_variations_alert.screen-reader-text {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    margin: -1px !important;
    padding: 0 !important;
    border: 0 !important;
    white-space: nowrap !important;
}

@media (max-width: 980px) {
    /* Height and link hiding for this breakpoint are already handled by the
     * unified nav rules in bigdiamond-components.css, which load before this
     * file and would lose an equal-specificity tie here. This block used to
     * re-assert height: 72px unconditionally and silently defeated the
     * .is-compact scroll shrink on every commerce page. */
    .bd-commerce .bd-menu-toggle {
        display: inline-flex;
    }
}

@media (max-width: 680px) {
    .bd-commerce .bd-nav {
        padding-inline: 20px;
    }

    .bd-commerce .bd-nav__brand {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 22px;
    }

    .bd-commerce .bd-nav__search input {
        display: none;
    }
}
