/*
 Theme Name:   Astra Child
 Theme URI:    https://wpastra.com/
 Description:  Child Theme for Astra
 Author:       seowithmaroof@gmail.com
 Author URI:   https://paksupplements.com
 Template:     astra
 Version:      1.0.0
 Text Domain:  astra-child
*/

button.single_add_to_cart_button.button.alt {
    background-color: snow;
    color: yellow;
    border: 1px solid yellow;
}
/* =========================
   CATEGORY TAB HIDE
   ========================= */
ul.eael-cat-tab {
    display: none !important;
}

/* =========================
   SEARCH INPUT STYLE (DGWT AJAX SEARCH)
   ========================= */
.dgwt-wcas-style-pirx .dgwt-wcas-sf-wrapp input[type=search].dgwt-wcas-search-input {
    border: 1px solid #0000001f;
    border-radius: 5px;
    background-color: white;
}

/* =========================
   ICON BACKGROUND STYLE
   ========================= */
svg.e-font-icon-svg.e-fas-angle-right {
    background: #FAA432;
}

/* =========================
   PROMO SLIDER WRAPPER
   ========================= */
.promo-slider-wrap {
    width: 100%;
    overflow: hidden;
    background: #FFD700;
    padding: 10px 0;
    white-space: nowrap;
}

/* =========================
   HEADER ANNOUNCEMENT BAR
   ========================= */
.announcement-bar {
    width: 100%;
    background: #f8f8f8;
    border-bottom: 1px solid #e5e5e5;
    overflow: hidden;
    white-space: nowrap;
    padding: 8px 0;
}

/* Scrolling track animation container */
.announcement-track {
    display: inline-flex;
    align-items: center;
    gap: 80px;
    width: max-content;
    animation: scroll 20s linear infinite;
}

/* Text styling inside announcement bar */
.announcement-track span {
    color: #0a8f2d;
    font-size: 14px;
    font-weight: 600;
}

/* Pause animation on hover for better UX */
.announcement-bar:hover .announcement-track {
    animation-play-state: paused;
}

/* Smooth scrolling animation */
@keyframes scroll {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}

/* =========================
   FLUENT FORM LAYOUT FIX (2 COLUMN)
   ========================= */
.ff-t-container.ff-column-container.ff_columns_total_2 {
    gap: 0;
}

/* =========================
   EMAIL INPUT STYLING (FLUENT FORM)
   ========================= */
input#ff_4_email,
input#ff_4_2_email {
    height: 44px !important;
    border-radius: 4px 0 0 4px;
    margin-bottom: 0px;
}

/* =========================
   SUBMIT BUTTON STYLING (FLUENT FORM)
   ========================= */
button.ff-btn.ff-btn-submit.ff-btn-md.ff_btn_style.wpf_has_custom_css {
    padding: 9.3px;
    border-radius: 0 4px 4px 0;
}

/* =========================
   ELEMENTOR ICON BOX ALIGNMENT
   ========================= */
.elementor-icon-box-wrapper {
    display: flex;
}

/* =========================
   FLUENT FORM SUBMIT WRAPPER FIX
   ========================= */
.ff-el-group.ff-text-left.ff_submit_btn_wrapper.ff_submit_btn_wrapper_custom {
    padding-bottom: 0px !important;
}

/* =========================
   FLUENT FORM SUCCESS MESSAGE STYLE
   ========================= */
div#fluentform_4_success {
    color: white;
}

/* =========================
   FLUENT FORM 2 COLUMN FLEX FIX
   ========================= */
.ff-t-container.ff-column-container.ff_columns_total_2 {
    gap: 0;
    display: flex;
}

/* =========================
   MOBILE RESPONSIVE FIX (FLUENT FORM)
   ========================= */
@media (max-width: 767px) {

    .ff-t-container.ff-column-container.ff_columns_total_2 {
        gap: 0 !important;
        display: flex !important;
    }

    .ff-t-cell.ff-t-column-2 {
        display: flex !important;
    }

    .elementor-element-a804af2 {
        display: flex !important;
        gap: 10px;
    }

    .elementor-element-a804af2 > * {
        flex: 1;
    }

    /* Remove divider in mobile icon list */
    .custom-icons .elementor-icon-list-items {
        --e-icon-list-divider-width: 0px;
    }

    .custom-icons .elementor-icon-list-item:not(:last-child)::after {
        display: none !important;
    }
}

/* =========================
   ELEMENTOR ICON LIST CUSTOM LAYOUT
   ========================= */
.custom-icons .elementor-icon-list-item a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

/* Move text first in icon list */
.custom-icons .elementor-icon-list-text {
    order: 1;
}

/* Move icon to end in icon list */
.custom-icons .elementor-icon-list-icon {
    order: 2;
    margin-left: auto;
}

/* Remove icon background override */
.custom-icons svg.e-font-icon-svg.e-fas-angle-right {
    background: none !important;
}