/* Keep every storefront page white, regardless of the device theme.
   "only light" also opts out of browser automatic darkening. */
html {
    color-scheme: only light !important;
    background-color: #fff;
}
body.portal-body,
body.portal-body .portal-shell,
body.portal-body .portal-main {
    background-color: #fff;
}

/* Mobile rules load after the shared desktop stylesheet. Keep content in the
   available width rather than clipping the document to conceal overflow. */
.mobile-commerce-bar { display: none; }
@media (max-width: 760px) {
    .portal-header.portal-header--white-label {
        display: flex !important;
        flex-wrap: wrap;
        gap: 8px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding-inline: 12px !important;
    }
    .portal-header .catalog-search {
        order: 10;
        flex: 1 0 100%;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }
    .portal-header-logo, .portal-guest-brand { flex: 1 1 90px; min-width: 0; }
    .portal-body--authenticated .portal-main,
    .portal-body--authenticated .portal-sidebar.is-open ~ .portal-main {
        width: calc(100% - 58px) !important;
        max-width: calc(100% - 58px) !important;
        margin-left: 58px !important;
    }
    .portal-header .locale-selector select { min-width: 0; max-width: 84px; padding-inline: 5px; }
    .portal-header .topbar-account-button { min-width: 42px; max-width: 100%; }
    .portal-header .topbar-account-button > span:last-child:not(:first-child) { display: none; }
    .product-page, .product-page form, .product-configurator,
    .product-properties, .product-properties-column, .product-property,
    .product-premium-header, .product-premium-copy { min-width: 0; max-width: 100%; }
    .product-layout--premium, #configProperties {
        grid-template-columns: minmax(0, 1fr) !important;
        min-width: 0;
        max-width: 100%;
    }
    .product-page .product-breadcrumb { flex-wrap: wrap; overflow-wrap: anywhere; }
    .product-premium-identity {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        min-width: 0;
        max-width: 100%;
    }
    .product-premium-identity .premium-product-gallery {
        width: 100%;
        min-width: 0;
        max-width: 240px;
        justify-self: center;
    }
    .product-premium-copy h1 { overflow-wrap: anywhere; }
    .product-premium-copy .catalog-favorite-button {
        max-width: 100%;
        white-space: normal;
    }
    .product-property-heading { flex-wrap: wrap; }
    #configProperties [data-role="format"] .selectable-list,
    #configProperties > .product-property--illustrated-format .selectable-list {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        overflow: visible !important;
        scrollbar-gutter: auto !important;
    }
    #configProperties [data-role="format"] .selectable-list-item,
    #configProperties > .product-property--illustrated-format .selectable-list-item {
        width: 100%;
        min-width: 0 !important;
        max-width: none !important;
        flex: none !important;
    }
    #configProperties [data-role="format"] .selectable-list-item--custom-dimension { grid-column: 1 / -1; }
    #configProperties [data-role="format"] .selectable-list-item__select { grid-template-columns: 16px minmax(0, 1fr); }
    #configProperties [data-role="format"] .selectable-list-item__meta { grid-column: 2; }
    #configProperties .is-illustrated-option-card .selectable-list-item__select {
        min-height: 112px !important;
        padding: 10px 7px !important;
    }
    #configProperties .illustrated-option-card__icon,
    #configProperties .is-illustrated-option-card .illustrated-option-card__photo {
        width: 64px !important;
        height: 64px !important;
        max-width: 100%;
    }
    #configProperties .illustrated-option-card__content strong {
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        font-size: 12px !important;
    }
    #configProperties .illustrated-option-navigation { display: none !important; }
    .product-page .product-price-details, .product-page .product-key-data { display: grid; }
    .product-page .product-summary--top { display: block; }
    .product-layout--premium .product-purchase { margin-inline: 0; }
    .product-page .product-shopify-cta {
        position: static;
        inset: auto;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        white-space: normal;
    }
    .product-property--delay-row .selectable-list {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        overflow: visible;
    }
    .product-property--delay-row .selectable-list-item { flex: none !important; min-width: 0; }
    .product-property--delay-row .selectable-list-item__select { grid-template-columns: 16px minmax(0, 1fr); min-height: 64px; }
    .product-property--delay-row .selectable-list-item__meta { grid-column: 2; }
    .product-property--printing-row .selectable-list-item__select { min-height: 48px; }
    .mobile-commerce-bar:not([hidden]) {
        position: fixed;
        inset: auto 0 0;
        z-index: 1000;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 7px 12px;
        padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
        border-top: 1px solid #e5e7eb;
        background: #fff;
        box-shadow: 0 -5px 20px rgba(15, 23, 42, .1);
        color: #111827;
        font-size: 12px;
    }
    .mobile-commerce-bar__copy { display: grid; gap: 3px; min-width: 0; }
    .mobile-commerce-bar__copy > strong { font-size: 13px; }
    .mobile-commerce-bar__selection { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .mobile-commerce-bar__delivery { overflow-wrap: anywhere; color: #586174; line-height: 1.3; }
    .mobile-commerce-bar__prices { display: grid; gap: 4px; text-align: right; white-space: nowrap; }
    .mobile-commerce-bar__prices strong { font-size: 14px; }
    .mobile-commerce-bar__action {
        grid-column: 1 / -1;
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 44px;
        padding: 8px 12px;
        border: 0;
        border-radius: 9px;
        background: var(--kp-primary, #f5a000);
        color: #111;
        font: inherit;
        font-weight: 600;
        text-decoration: none;
        cursor: pointer;
    }
    .mobile-commerce-bar__action:disabled { opacity: .55; cursor: not-allowed; }
    .portal-body--authenticated .mobile-commerce-bar:not([hidden]) { left: 58px; }
    .mobile-commerce-bar__status { grid-column: 1 / -1; margin: 0; font-size: 11px; color: #586174; }
    .mobile-commerce-bar__status:empty { display: none; }
    body:has(.mobile-commerce-bar:not([hidden])) {
        --mobile-commerce-height: 170px;
        padding-bottom: calc(var(--mobile-commerce-height) + env(safe-area-inset-bottom, 0px));
    }
    body:has(.mobile-commerce-bar:not([hidden])) .koto-ai { bottom: calc(var(--mobile-commerce-height) + 12px); }
    body.quick-cart-open .mobile-commerce-bar { visibility: hidden; }
    .mobile-commerce-bar__action:focus-visible { outline: 3px solid #111; outline-offset: 2px; }
}
@media (max-width: 380px) {
    .portal-body--authenticated .product-property--delay-row .selectable-list {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}
