/* Optional child-theme skin for the Omnisend Back in Stock form. */
.storefront-back-in-stock__form > [id^="omnisend-embedded-v2-"],
.storefront-back-in-stock__form > div[id^="omnisend-form-"],
.storefront-back-in-stock__form div[class*="-content"],
.storefront-back-in-stock__form div[class*="-content-inner"] {
    background: transparent;
    margin: 0;
    max-width: none;
    padding: 0;
    width: 100%;
}

.storefront-back-in-stock__form form[id^="omnisend-form-"][id$="-submit-form"] {
    background: transparent;
    display: block;
    height: auto;
    margin: 0;
    max-width: none;
    padding: 0;
    width: 100%;
}

.storefront-back-in-stock__form form[id^="omnisend-form-"][id$="-submit-form"]
    > div[class*="-section-"] {
    align-items: stretch;
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
    height: var(--storefront-button-height, 44px);
    margin: 0;
    padding: 0;
    width: 100%;
}

.storefront-back-in-stock__form form[id^="omnisend-form-"][id$="-submit-form"]
    > div[class*="-section-"] > .omnisend-mobile-container {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 0;
}

.storefront-back-in-stock__form form[id^="omnisend-form-"][id$="-submit-form"]
    > div[class*="-section-"] > .omnisend-mobile-container:has(input[type="email"]) {
    flex: 1 1 auto;
}

.storefront-back-in-stock__form form[id^="omnisend-form-"][id$="-submit-form"]
    > div[class*="-section-"] > .omnisend-mobile-container:has(button) {
    flex: 0 0 200px;
    min-width: 200px;
}

.storefront-back-in-stock__form .omnisend-mobile-container:has(input[type="email"])
    div[class*="-field-container-"] {
    box-sizing: border-box;
    padding: 0;
    width: 100%;
}

.storefront-back-in-stock__form .omnisend-mobile-container:has(button)
    div[class*="-action-container-"] {
    box-sizing: border-box;
    display: flex;
    height: var(--storefront-button-height, 44px);
    padding: 0;
    width: 100%;
}

.storefront-back-in-stock__form input[type="email"] {
    background: #fff;
    border: 1px solid #cbcbcb;
    border-radius: 0;
    box-shadow: none;
    box-sizing: border-box;
    color: #3c3c3c;
    flex: none;
    font: 400 15px/24px "Montserrat", Arial, sans-serif;
    height: var(--storefront-button-height, 44px);
    margin: 0;
    max-height: var(--storefront-button-height, 44px);
    max-width: 380px;
    min-height: var(--storefront-button-height, 44px);
    min-width: 0;
    padding: var(--storefront-button-padding, 10px 15px);
    width: 100%;
}

.storefront-back-in-stock__form button {
    align-self: stretch;
    background: var(--storefront-color-control-primary, #6e0087);
    border: 1px solid var(--storefront-color-control-primary, #6e0087);
    border-radius: var(--storefront-button-radius, 0);
    box-shadow: none;
    box-sizing: border-box;
    color: var(--storefront-color-control-primary-text, #fff);
    flex: none;
    font: 700 14px/22px var(--storefront-font-ui, "Montserrat", Arial, sans-serif);
    height: var(--storefront-button-height, 44px);
    margin: 0;
    max-height: var(--storefront-button-height, 44px);
    min-height: var(--storefront-button-height, 44px);
    min-width: 0;
    padding: var(--storefront-button-padding, 10px 15px);
    text-align: center;
    text-transform: uppercase;
    width: 100%;
}

.single-product .summary .storefront-back-in-stock__form button,
.single-product .summary .storefront-back-in-stock__form form[id^="omnisend-form-"][id$="-submit-form"] button {
    border-radius: var(--storefront-button-radius, 0) !important;
}

.storefront-back-in-stock__form button:hover,
.storefront-back-in-stock__form button:active {
    background: var(--storefront-color-control-primary-hover, #ff672d);
    border-color: var(--storefront-color-control-primary-hover, #ff672d);
    color: var(--storefront-color-control-primary-hover-text, #232323);
}

.storefront-back-in-stock__form button:focus,
.storefront-back-in-stock__form button:focus-visible {
    background: var(--storefront-color-control-primary, #6e0087);
    border-color: var(--storefront-color-control-primary, #6e0087);
    color: var(--storefront-color-control-primary-text, #fff);
}

/* Keep the Omnisend field stable while the approved button states remain visible. */
.single-product .summary .storefront-back-in-stock__form input[type="email"]:hover,
.single-product .summary .storefront-back-in-stock__form input[type="email"]:active,
.single-product .summary .storefront-back-in-stock__form input[type="email"]:focus,
.single-product .summary .storefront-back-in-stock__form input[type="email"]:focus-visible {
    box-shadow: none !important;
    filter: none !important;
    outline: none !important;
    outline-offset: 0 !important;
    transform: none !important;
}

.single-product .summary .storefront-back-in-stock__form button:hover,
.single-product .summary .storefront-back-in-stock__form button:active {
    box-shadow: none !important;
    filter: none !important;
    outline: none !important;
    text-decoration: none !important;
    transform: none !important;
}

.single-product .summary .storefront-back-in-stock__form button:focus,
.single-product .summary .storefront-back-in-stock__form button:focus-visible {
    box-shadow: none !important;
    filter: none !important;
    outline: 2px solid var(--storefront-color-focus, #232323) !important;
    outline-offset: 2px !important;
    text-decoration: none !important;
    transform: none !important;
}

@media (max-width: 1199px) {
    .storefront-back-in-stock__form {
        height: 50px;
        min-height: 50px;
    }

    .storefront-back-in-stock__form form[id^="omnisend-form-"][id$="-submit-form"]
        > div[class*="-section-"],
    .storefront-back-in-stock__form input[type="email"],
    .storefront-back-in-stock__form button,
    .storefront-back-in-stock__form .omnisend-mobile-container:has(button)
        div[class*="-action-container-"] {
        height: 50px;
        max-height: 50px;
        min-height: 50px;
    }
}

@media (max-width: 550px) {
    .storefront-back-in-stock__form {
        height: 110px;
        min-height: 110px;
    }

    .storefront-back-in-stock__form > div[id^="omnisend-form-"],
    .storefront-back-in-stock__form div[class*="-content"],
    .storefront-back-in-stock__form div[class*="-content-inner"],
    .storefront-back-in-stock__form form[id^="omnisend-form-"][id$="-submit-form"] {
        height: 110px;
    }

    .storefront-back-in-stock__form form[id^="omnisend-form-"][id$="-submit-form"]
        > div[class*="-section-"] {
        align-content: flex-start;
        display: flex;
        flex-wrap: wrap;
        gap: 10px 0;
        height: 110px;
        max-height: 110px;
        min-height: 110px;
        width: 100%;
    }

    .storefront-back-in-stock__form form[id^="omnisend-form-"][id$="-submit-form"]
        > div[class*="-section-"] > .omnisend-mobile-container:has(input[type="email"]) {
        flex: 0 0 min(380px, 100%);
        max-width: 380px;
        width: min(380px, 100%);
    }

    .storefront-back-in-stock__form form[id^="omnisend-form-"][id$="-submit-form"]
        > div[class*="-section-"] > .omnisend-mobile-container:has(button) {
        flex: 0 0 100%;
        min-width: 0;
        width: 100%;
    }

    .storefront-back-in-stock__form button {
        min-width: 0;
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .storefront-back-in-stock__form button {
        transition-duration: .01ms;
    }
}