:root {
    --whatsapp-green: #25D366;
    --whatsapp-light-green: #DCF7C5;
    --color-x: rgba(0, 0, 0, 0.05);
    --bg-main: #fff;

    --bg-main-light: #f2f2f7;
    --bg-main-light-opacity-0: #f2f2f700;
}

.theme-dark {
    --whatsapp-light-green: #DCF7C5;
    --color-x: #21252a;
    --bg-main: #21252a;

    --bg-main-light: #1b1d21;
    --bg-main-light-opacity-0: #1b1d2100;
}

.ol-black-on-green {
    background-color: var(--whatsapp-light-green);
    color: #000 !important;
}

.ol-green-on-black {
    background-color: #000;
    color: var(--whatsapp-light-green) !important;
}

.btn.ol-black-on-green:hover {
    background-color: var(--whatsapp-light-green) !important;
    color: #000 !important;
}

.theme-dark .ol-black-on-green {}


.ol-bg-main {
    background-color: #f2f2f7;
}

.theme-dark .ol-bg-main {
    background-color: #1b1d21;
}

/* .stepper-container:has(.qty-input:valid) .stepper-sub,
.stepper-container:has(.qty-input:valid) .qty-input {
    display: none;
} */

.ol_product_info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.stepper-container:has(#qty-input-16-detail:valid) .stepper-sub {
    pointer-events: none;
    opacity: 0;
}

.stepper-container:has(.validate_product_list_input:valid) .stepper-sub {
    pointer-events: none;
    opacity: 0;
}

.btn-disabled {
    /* background-color: red; 
    display: none !important;*/
    opacity: 0.3;
    pointer-events: none;
}

.disabled-visible-add-to-cart {
    /* pointer-events: none !important; */
    opacity: 0.5;
}

.disabled-visible {
    pointer-events: none !important;
    opacity: 0.5;
}

.qty-input {
    pointer-events: none !important;
}

.sale_price_ori {
    text-decoration: line-through;
    opacity: 0.5;
}

[data-stock-state="outofstock"] {
    opacity: 0.5;
    pointer-events: none;
}

[data-stock-state="outofstock"] .stepper-sub,
[data-stock-state="outofstock"] .qty-input,
[data-stock-state="outofstock"] .stepper-add {
    display: none;
}

[data-stock-state="outofstock"] .out_of_stock_container {
    display: block !important;
}

.stepper-container-checkout:has(.qty-input:valid) .stepper-sub .fa-minus {
    display: none;
}

.stepper-container-checkout:has(.qty-input:valid) .stepper-sub .fa-trash {
    display: block;
}

.stepper-container-checkout:has(.qty-input:not(:valid)) .stepper-sub .fa-trash {
    display: none;
}

/* Loader  */
#loading {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.2);
    z-index: 999999;
}

.loader {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 30px;
    height: 30px;
    margin: -15px 0 0 -15px;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    border: 5px solid var(--whatsapp-light-green);
    border-top-color: transparent;
    animation: spin 1s linear infinite;
}

/* Checkout - Logistics bar  */

.checkout_logisticsbar_container {
    position: sticky;
    z-index: 2;
    top: 0;
    background-color: white;
    cursor: pointer;
}

.theme-dark .checkout_logisticsbar_container {
    background-color: black;
}


/* Checkout - logistics menu */

.toggle-menu {
    display: inline-flex;
    border-radius: 9999px;
    overflow: hidden;
}

.theme-dark .toggle-menu {
    background-color: #0f1117 !important;
}

.theme-dark .menu .toggle-menu {
    background-color: #21252a !important;
}

.theme-dark .menu .toggle-menu label {
    background-color: #21252a !important
}

.toggle-menu input[type="radio"] {
    display: none;
}

.toggle-menu label {
    padding: 3px 12px;
    cursor: pointer;
    font-weight: bold;
    color: #888;
}

.toggle-menu input[type="radio"]:checked+label {
    background-color: var(--whatsapp-light-green) !important;
    color: #000;
    border-radius: 50px;
}

.logistics_checkoutpage_top_buttons {
    position: sticky;
    top: 0;
    background-color: #fff;
    padding: 1rem 0;
    z-index: 2;
}

.theme-dark .logistics_checkoutpage_top_buttons {
    background-color: #21252a !important;

}

#menu-logistics-choice .toggle-menu label {
    padding: 4px 16px;
    font-size: 16px;
}

#menu-logistics-choice:has(#menu_pickup:checked) #logistics_checkoutpage_menu_for_delivery {
    display: none !important;
}

#menu-logistics-choice:has(#menu_delivery:checked) #logistics_checkoutpage_menu_for_pickup {
    display: none !important;
}



#single-slider-3::after,
.splide-categories::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
    width: 60px;
    background: linear-gradient(90deg, var(--bg-main-light-opacity-0), var(--bg-main-light));
    pointer-events: none;
}

.top_menu_icon {
    height: 30px;
    transition: 200ms;
    overflow: hidden;
}

.top_menu_icon_collapsed {
    height: 0px;
}

#top_menu_search_container {
    position: absolute;
    right: 0;
    z-index: 11;
    height: 100%;
    transition: 250ms;
    width: 100%;
    margin-right: -100%;
}


.top_menu_search_icon i {
    transition: 200ms;
    font-size: 16px;
    padding: 1rem;
}

.top_menu_search_icon_small i {
    font-size: 14px !important;
    padding: 0.5rem !important;
}

/* Payment page */
.ol_payment_input {
    border-radius: 10px;
    border: 2px solid var(--color-x);
    cursor: pointer;
}

.ol_payment_input:has(input:checked) {
    border: 2px solid var(--whatsapp-light-green);
}

.ol_payment_input label {
    padding: 1rem;
    background-color: unset !important;
    cursor: pointer;
}

.ol_payment_input input {
    accent-color: var(--whatsapp-light-green);
}

.ol_payment_input input:active,
.ol_payment_input input:hover,
.ol_payment_input input:focus {
    background-color: red !important;
    -webkit-appearance: radio !important;
}


.ol_custom_radio {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: transparent;
    border: 2px solid var(--color-x);
    position: relative;
}

label:has(input:checked) .ol_custom_radio {
    background-color: var(--whatsapp-light-green);
}

label:has(.ol_custom_radio) input {
    display: none;
}

.bg-green-dark {
    background-color: var(--whatsapp-light-green) !important;
}

.color-green-dark {
    color: var(--whatsapp-light-green) !important;
}

.category_card_16 {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.categoryblock>div>.ol_product:last-of-type .divider,
#campaigns_items_list>.ol_product:last-of-type .divider {
    display: none;
}

.compose_product-selected {
    outline: 3px solid var(--whatsapp-green) !important;
}

#product_name_container:has(#product_name.stuck) {
    /*  background-color: red !important;*/
    box-shadow: 0px -5px 20px 0px #000;
    /* padding: 0.5rem !important; */
}

.last_used {
    align-self: start;
}

.ol-bottom-menu {
    max-width: 800px;
    margin: auto;
}

#add_to_cart_btn.disabled-visible-add-to-cart:hover {
    opacity: 0.5 !important;
}

.ios-input:checked~.custom-control-label::before {
    background-color: var(--whatsapp-light-green) !important;
}

.ios-switch label::after {
    background-color: var(--color-x) !important;
}

input::placeholder {
    opacity: 0.3 !important;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.offender_pulse {
    -webkit-animation: pulse 1.2s ease-in-out 0.4s;
    animation: pulse 1.2s ease-in-out 0.4s;
}

@-webkit-keyframes pulse {
    0% {
        outline: 0px solid transparent;
    }

    50% {
        outline: 3px solid var(--whatsapp-light-green);
    }

    100% {
        outline: 0px solid transparent;
    }
}

@keyframes pulse {
    0% {
        outline: 0px solid transparent;
    }

    50% {
        outline: 3px solid var(--whatsapp-light-green);
    }

    100% {
        outline: 0px solid transparent;
    }
}

@media only screen and (max-width: 360px) {
    #checkout_logisticsbar_date_time {
        flex-direction: column !important;
    }
}