/*
 * ===================================================================
 * CRITICAL STYLES - EXCLUDED FROM WP ROCKET OPTIMIZATION
 * ===================================================================
 */

/* --- GLOBAL STYLES --- */
/*
 * Function: Sets the default link color for main content areas.
 * This selector targets links inside the main content (#main-content .entry-content)
 * but excludes links that are also styled as Divi buttons (.et_pb_button).
 */
#main-content .entry-content a:not(.et_pb_button) {
    color: #762681; /* Your purple color */
    text-decoration: underline;
}

#main-content .entry-content a:not(.et_pb_button):hover {
    text-decoration: none;
}

/* --- CUSTOM 'ADD TO CART' POPUP --- */

/* * Function: The full-screen overlay container for our custom popup.
 */
#custom-popup-wrapper {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 99999;
    overflow-y: auto;
    padding: 20px;
    box-sizing: border-box;
    align-items: center;
    justify-content: center;
}

#custom-popup-wrapper.is-visible {
    display: flex;
}

/* * Function: Styles the Divi Section when it's acting as the modal box.
 */
#custom-popup-wrapper .et_pb_section {
    max-width: 600px;
    width: 100%;
    margin: auto;
    max-height: 90vh;
    position: relative;
    padding: 0 2em 2em 2em !important;
    border-radius: 30px;
}

/* * Function: Styles the first row containing the notification and upsells.
 */
#custom-popup-wrapper .et_pb_row_1_tb_body {
    padding-bottom: 0 !important;
}

/* * Function: Styles the column inside the second row that holds the buttons.
 */
#custom-popup-wrapper .et_pb_column_8_tb_body {
    display: flex;
    justify-content: flex-end;
    gap: 20px;
    align-items: center;
}

/* * Function: General styling for buttons inside the popup.
 */
#custom-popup-wrapper .et_pb_button {
    padding: 10px 20px !important;
    font-size: 13px !important;
    margin: 0 !important;
    border-radius: 50px !important;
    /* font-weight: 700 !important;
    letter-spacing: 0.16em !important; */
    transition: all 0.3s ease;
}

/* * Function: Hides any potential icon Divi adds on hover.
 */
#custom-popup-wrapper .et_pb_button::after {
    display: none !important;
}

/* * Function: Styles the "Continue Shopping" button.
 */
#custom-popup-wrapper .et_pb_button_3_tb_body {
    color: #8410EA !important;
    background-color: #ffffff !important;
    border: 2px solid #8410EA !important;
}
#custom-popup-wrapper .et_pb_button_3_tb_body:hover {
    color: #F9F9F9 !important;
    background-color: #8410EA !important;
}

/* * Function: Styles the "Go to Cart" button.
 */
#custom-popup-wrapper .et_pb_button_4_tb_body {
    color: #F9F9F9 !important;
    background-color: #8410EA !important;
    border: 2px solid #8410EA !important;
}
#custom-popup-wrapper .et_pb_button_4_tb_body:hover {
    color: #8410EA !important;
    background-color: #F9F9F9 !important;
}

/* * Function: Responsive styles for the buttons column on mobile.
 */
@media all and (max-width: 767px) { /* Phone */
    #custom-popup-wrapper .et_pb_column_8_tb_body {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }
    #custom-popup-wrapper .et_pb_button {
       text-align: center;
    }
}

/* * Function: Styles the close button.
 */
#custom-popup-wrapper .popup-close-button {
    cursor: pointer !important;
    position: absolute;
    top: 15px;
    right: 15px;
    z-index: 10;
}