/* Final responsive authority for the product detail purchase controls. */
html body:not(.admin) .rr-pd-page .rr-pd-action-panel,
html body:not(.admin) .rr-pd-page .rr-pd-cart-form {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-action-panel {
    overflow: hidden !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-cart-form {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
    align-items: stretch !important;
    justify-content: stretch !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-options-wrap {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

/* Keep unusually long option values inside the product panel. */
html body:not(.admin) .rr-pd-page .rr-pd-options-wrap .detail-option-selector,
html body:not(.admin) .rr-pd-page .rr-pd-options-wrap .detail-option-group,
html body:not(.admin) .rr-pd-page .rr-pd-options-wrap .detail-option-values {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-options-wrap .detail-option-group {
    flex: 1 1 240px !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-options-wrap .detail-option-chip.is-text {
    flex: 0 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 40px !important;
    padding: 9px 12px !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    line-height: 1.25 !important;
    text-align: center !important;
    box-sizing: border-box !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-options-wrap .detail-option-chip.is-text > span {
    display: block !important;
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-quantity-field {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

html body:not(.admin) .rr-pd-page .quantity-stepper,
html body:not(.admin) .rr-pd-page .rr-pd-quantity-stepper,
html body:not(.admin) .rr-pd-page .rr-pd-add-btn,
html body:not(.admin) .rr-pd-page .rr-pd-buy-btn,
html body:not(.admin) .rr-pd-page .rr-pd-wishlist-wrap,
html body:not(.admin) .rr-pd-page .rr-pd-wishlist-wrap .rr-wishlist-toggle-btn {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

html body:not(.admin) .rr-pd-page .quantity-stepper,
html body:not(.admin) .rr-pd-page .rr-pd-quantity-stepper {
    display: grid !important;
    grid-template-columns: minmax(38px, 1fr) minmax(38px, 1fr) minmax(38px, 1fr) !important;
}

html body:not(.admin) .rr-pd-page .quantity-stepper .qty-btn,
html body:not(.admin) .rr-pd-page .quantity-stepper .qty-input,
html body:not(.admin) .rr-pd-page .rr-pd-quantity-stepper .qty-btn,
html body:not(.admin) .rr-pd-page .rr-pd-quantity-stepper .qty-input {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

@media (max-width: 1180px) {
    html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel {
        padding: 0 !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel > .rr-pd-cart-form {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        width: calc(100% - 36px) !important;
        max-width: calc(100% - 36px) !important;
        min-width: 0 !important;
        margin: 18px !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel > .rr-pd-cart-form > .rr-pd-quantity-field,
    html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel > .rr-pd-cart-form > .rr-pd-add-btn,
    html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel > .rr-pd-cart-form > .rr-pd-buy-btn,
    html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel > .rr-pd-cart-form > .rr-pd-wishlist-wrap,
    html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel > .rr-pd-cart-form > .rr-pd-wishlist-wrap > .rr-wishlist-toggle-btn {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel > .rr-pd-cart-form > .rr-pd-quantity-field > .rr-pd-quantity-stepper,
    html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel > .rr-pd-cart-form > .rr-pd-quantity-field > .quantity-stepper {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        box-sizing: border-box !important;
    }

    html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel > .rr-pd-cart-form > .rr-pd-quantity-field > .rr-pd-quantity-stepper > .qty-btn,
    html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel > .rr-pd-cart-form > .rr-pd-quantity-field > .rr-pd-quantity-stepper > .qty-input,
    html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel > .rr-pd-cart-form > .rr-pd-quantity-field > .quantity-stepper > .qty-btn,
    html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel > .rr-pd-cart-form > .rr-pd-quantity-field > .quantity-stepper > .qty-input {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
}

@media (max-width: 1180px) {
    html body:not(.admin) .rr-pd-page .product-detail-layout.rr-pd-layout,
    html body:not(.admin) .rr-pd-page .rr-pd-layout {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 18px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: visible !important;
    }

    html body:not(.admin) .rr-pd-page .rr-pd-gallery-card,
    html body:not(.admin) .rr-pd-page .rr-pd-info-panel {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        box-sizing: border-box !important;
    }

    html body:not(.admin) .rr-pd-page .rr-pd-gallery-card {
        width: min(100%, 680px) !important;
        margin-right: auto !important;
        margin-left: auto !important;
    }

    html body:not(.admin) .rr-pd-page .rr-pd-info-panel {
        padding-right: 0 !important;
        padding-left: 0 !important;
        overflow: visible !important;
    }

    html body:not(.admin) .rr-pd-page .rr-pd-action-panel {
        overflow: visible !important;
    }
}

@media (max-width: 520px) {
    html body:not(.admin) .rr-pd-page .rr-pd-action-panel {
        padding: 0 !important;
    }

    html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel > .rr-pd-cart-form {
        grid-template-columns: 1fr !important;
        gap: 9px !important;
        width: calc(100% - 20px) !important;
        max-width: calc(100% - 20px) !important;
        margin: 10px !important;
        padding: 0 !important;
    }
}

/* RR_PD_ALL_SCREEN_RESPONSIVE_AUTHORITY_V1: keep product detail controls inside every viewport. */
html body:not(.admin) .rr-pd-page,
html body:not(.admin) .rr-pd-page *,
html body:not(.admin) .rr-pd-page *::before,
html body:not(.admin) .rr-pd-page *::after {
    box-sizing: border-box !important;
}

html body:not(.admin) .rr-pd-page {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: clip !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-shell {
    width: min(100%, 1480px) !important;
    max-width: calc(100vw - 24px) !important;
    margin-right: auto !important;
    margin-left: auto !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

html body:not(.admin) .rr-pd-page .product-detail-layout.rr-pd-layout,
html body:not(.admin) .rr-pd-page .rr-pd-layout {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    align-items: start !important;
    overflow: visible !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-gallery-card,
html body:not(.admin) .rr-pd-page .rr-pd-info-panel,
html body:not(.admin) .rr-pd-page .rr-pd-action-panel,
html body:not(.admin) .rr-pd-page .rr-pd-cart-form,
html body:not(.admin) .rr-pd-page .rr-pd-cart-form > * {
    min-width: 0 !important;
    max-width: 100% !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-info-panel {
    overflow: hidden !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel {
    width: 100% !important;
    max-width: 100% !important;
    margin-top: clamp(16px, 2vw, 24px) !important;
    padding: clamp(12px, 1.8vw, 18px) !important;
    overflow: hidden !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel > .rr-pd-cart-form {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: clamp(10px, 1.5vw, 14px) !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: stretch !important;
    justify-content: stretch !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-action-panel .rr-pd-options-wrap {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-action-panel .rr-pd-quantity-field {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-action-panel .quantity-stepper,
html body:not(.admin) .rr-pd-page .rr-pd-action-panel .rr-pd-quantity-stepper,
html body:not(.admin) .rr-pd-page .rr-pd-action-panel .rr-pd-add-btn,
html body:not(.admin) .rr-pd-page .rr-pd-action-panel .rr-pd-buy-btn,
html body:not(.admin) .rr-pd-page .rr-pd-action-panel .rr-pd-wishlist-wrap,
html body:not(.admin) .rr-pd-page .rr-pd-action-panel .rr-pd-wishlist-wrap .rr-wishlist-toggle-btn {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: clamp(46px, 4.8vw, 54px) !important;
    min-height: clamp(46px, 4.8vw, 54px) !important;
    max-height: 56px !important;
    margin: 0 !important;
    padding-right: clamp(8px, 1.4vw, 14px) !important;
    padding-left: clamp(8px, 1.4vw, 14px) !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-action-panel .quantity-stepper,
html body:not(.admin) .rr-pd-page .rr-pd-action-panel .rr-pd-quantity-stepper {
    display: grid !important;
    grid-template-columns: minmax(42px, 1fr) minmax(42px, 1fr) minmax(42px, 1fr) !important;
    padding: 0 !important;
    overflow: hidden !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-action-panel .qty-btn,
html body:not(.admin) .rr-pd-page .rr-pd-action-panel .qty-input {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 100% !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-action-panel .rr-pd-add-btn,
html body:not(.admin) .rr-pd-page .rr-pd-action-panel .rr-pd-buy-btn,
html body:not(.admin) .rr-pd-page .rr-pd-action-panel .rr-pd-wishlist-wrap .rr-wishlist-toggle-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-align: center !important;
}

html body:not(.admin) .rr-pd-page .rr-pd-meta-row,
html body:not(.admin) .rr-pd-page .product-detail-meta,
html body:not(.admin) .rr-pd-page .product-detail-anchor-nav {
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
}

@media (min-width: 1281px) {
    html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel > .rr-pd-cart-form {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1280px) {
    html body:not(.admin) .rr-pd-page .product-detail-layout.rr-pd-layout,
    html body:not(.admin) .rr-pd-page .rr-pd-layout {
        grid-template-columns: 1fr !important;
    }

    html body:not(.admin) .rr-pd-page .rr-pd-gallery-card {
        width: min(100%, 760px) !important;
        margin-right: auto !important;
        margin-left: auto !important;
    }
}

@media (max-width: 640px) {
    html body:not(.admin) .rr-pd-page {
        padding-right: 10px !important;
        padding-left: 10px !important;
    }

    html body:not(.admin) .rr-pd-page .rr-pd-shell {
        max-width: calc(100vw - 20px) !important;
    }

    html body:not(.admin) .rr-pd-page .rr-pd-action-panel.rr-pd-action-panel > .rr-pd-cart-form {
        grid-template-columns: 1fr !important;
    }
}
