/* Shared storefront layout and readability. Theme palettes, seller overrides,
   font families, media, and component configuration remain authoritative. */

.site-wrapper .main-content {
    scroll-margin-block-start: 10rem;
}

/* All header templates use the same action elements. */
.site-wrapper .header-root .header-icon-btn {
    box-shadow: none;
}

.site-wrapper .header-root .header-icon-btn:hover {
    box-shadow: none;
}

.site-wrapper .header-root .icon-label {
    max-inline-size: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: 0;
}

.site-wrapper .header-root .search-box {
    box-shadow: none;
}

.site-wrapper .header-root .search-box:focus-within {
    border-color: var(--cmp-searchbox-focus-border, var(--header-text-color));
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--header-text-color) 15%, transparent);
}

.site-wrapper .search-input {
    min-block-size: 2.25rem;
    font-size: 1rem;
}

.site-wrapper :is(.search-clear, .instasearch-clear) {
    min-inline-size: 2.25rem;
    min-block-size: 2.25rem;
}

.site-wrapper :is(.announcement-bar, .menubar-section.menubar-inverse) {
    box-shadow: none;
}

/* A single outer gutter aligns headings and shopping sections across tenants. */
.site-wrapper .home-page > .page-body {
    padding-inline: clamp(1rem, 3vw, 2.5rem);
    padding-block: clamp(1.5rem, 3vw, 2.5rem);
    gap: clamp(2rem, 4vw, 3.5rem);
}

.site-wrapper .home-page .image-showcase-section {
    padding-inline: 0;
}

.site-wrapper .storefront-section-header {
    flex-wrap: wrap;
    row-gap: 0.75rem;
}

.site-wrapper .storefront-section-copy {
    flex: 1 1 15rem;
}

.site-wrapper .storefront-section-kicker {
    font-size: 0.75rem;
    line-height: 1.4;
}

.site-wrapper :is(.storefront-section-title, .pdp-title) {
    overflow-wrap: anywhere;
    line-height: 1.3;
}

.site-wrapper .storefront-section-subtitle {
    font-size: 1rem;
    line-height: 1.6;
}

/* Product information uses readable sizes at every breakpoint. */
.site-wrapper .product-card {
    background: var(--bhogi-surface);
    box-shadow: none;
}

.site-wrapper .product-card:hover {
    transform: none;
    border-color: var(--bhogi-border-strong);
    box-shadow: var(--bhogi-shadow-sm);
}

.site-wrapper .product-card .product-meta {
    flex-wrap: wrap;
    gap: 0.375rem 0.5rem;
    margin-block-end: 0.5rem;
}

.site-wrapper .product-card .product-brand {
    min-inline-size: 0;
    max-inline-size: 100%;
    font-size: 0.75rem;
    color: var(--bhogi-text-secondary);
}

.site-wrapper .product-card .product-status {
    font-size: 0.75rem;
    line-height: 1.4;
}

.site-wrapper .product-card .product-title {
    font-size: 1rem;
    line-height: 1.4;
    height: 2.8em;
    max-height: none;
    margin-block: 0 0.5rem;
    overflow-wrap: anywhere;
}

.site-wrapper .product-card .product-description {
    font-size: 0.875rem;
    line-height: 1.5;
    height: 3em;
    max-height: none;
    color: var(--bhogi-text-secondary);
}

.site-wrapper .product-card .product-price-block {
    padding: 0.75rem 0;
    border: 0;
    background: transparent;
    overflow: visible;
}

.site-wrapper .product-card :is(.art-price, .art-info-group, .art-finalprice) {
    flex-wrap: wrap;
    min-inline-size: 0;
    max-inline-size: 100%;
}

.site-wrapper .product-card :is(.price-current, .price-call) {
    font-size: 1.125rem;
    line-height: 1.4;
    white-space: normal;
    overflow-wrap: anywhere;
    font-variant-numeric: tabular-nums;
}

.site-wrapper .product-card :is(.art-compareprice-value, .price-savings, .delivery-time) {
    font-size: 0.8125rem;
    line-height: 1.5;
}

.site-wrapper .product-card :is(.art-compareprice, .art-compareprice-value, .art-delivery-info) {
    white-space: normal;
    overflow-wrap: anywhere;
}

.site-wrapper .product-card .art-more-opts {
    flex-wrap: wrap;
}

.site-wrapper .product-card :is(.art-more-opts, .art-more-opt-link) {
    font-size: 0.875rem;
    line-height: 1.5;
}

.site-wrapper .product-card .art-btn-group {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    overflow: visible;
}

.site-wrapper .product-card .art-btn {
    min-inline-size: 2.25rem;
    min-block-size: 2.25rem;
    height: auto;
    padding: 0.375rem;
}

.site-wrapper .product-card .art-btn-label {
    font-size: 0.875rem;
    white-space: normal;
}

.site-wrapper .product-card .art-btn-cart .art-btn-label {
    display: inline;
}

.site-wrapper .product-card .art-color-more {
    min-inline-size: 2.25rem;
    min-block-size: 2.25rem;
    font-size: 0.875rem;
}

/* Preserve theme-specific colours; improve the existing filters and price text. */
.site-wrapper .category-page :is(.filter-price-input, .artlist-sorter select) {
    min-block-size: 2.25rem;
    min-inline-size: 0;
    font-size: 1rem;
}

.site-wrapper .category-page :is(.filter-price-apply, .filters-clear, .mobile-filter-bar-btn) {
    min-block-size: 2.25rem;
    font-size: 0.875rem;
}

.site-wrapper .category-page .filter-option label {
    min-block-size: 2.25rem;
    font-size: 0.875rem;
}

.site-wrapper :is(.pdp-tax-info, .pdp-lowest-price, .pdp-base-price, .pdp-rating-row) {
    font-size: 0.875rem;
    line-height: 1.5;
}

.site-wrapper .pdp-current-price {
    font-size: clamp(1.75rem, 3vw, 2.125rem);
    line-height: 1.25;
    overflow-wrap: anywhere;
    font-variant-numeric: tabular-nums;
}

.site-wrapper :is(.pdp-btn-cart, .pdp-btn-buy) {
    min-block-size: 2.5rem;
    font-size: 1rem;
    line-height: 1.4;
    white-space: normal;
}

.site-wrapper :is(.pdp-qty-btn, .pdp-qty-input) {
    min-inline-size: 2.25rem;
    min-block-size: 2.25rem;
}

.site-wrapper .pdp-qty-input {
    font-size: 1rem;
}

.site-wrapper :is(.product-card, .category-page, .pdp-purchase-section) :is(a, button, input, select):focus-visible {
    outline: 2px solid var(--bhogi-text);
    outline-offset: 3px;
}

@media (max-width: 767.98px) {
    .site-wrapper .product-card .art-btn-cart {
        flex-basis: 100%;
    }

    .site-wrapper .storefront-section-link span {
        position: static;
        width: auto;
        height: auto;
        overflow: visible;
        clip: auto;
        white-space: normal;
    }
}

@media (max-width: 576px) {
    /* Keep purchasing pinned, with separate rows so quantity controls and
       labelled actions retain usable touch targets on narrow screens. */
    .site-wrapper .pdp-purchase-section {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.75rem;
        background: var(--bhogi-surface);
    }

    .site-wrapper .pdp-quantity-row {
        justify-content: flex-start;
        gap: 1rem;
        margin: 0;
    }

    .site-wrapper .pdp-qty-label {
        position: static;
        width: auto;
        height: auto;
        margin: 0;
        overflow: visible;
        clip: auto;
        white-space: normal;
        font-size: 0.875rem;
    }

    .site-wrapper .pdp-action-buttons {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .site-wrapper .product-detail-page {
        padding-block-end: calc(12rem + env(safe-area-inset-bottom));
    }
}

@media (pointer: coarse) {
    .site-wrapper .product-card .art-color-opts {
        gap: 0.5rem;
    }

    .site-wrapper .product-card .art-color-opt {
        width: 2.25rem;
        height: 2.25rem;
    }
}
