/* Override WPBakery Tabs styles to match CTA banner approach */

/* Main tabs container - match CTA banner container approach */
.contact-us-page-tabs .w-tabs {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 80px;
    padding-top: 40px;
    padding-bottom: 80px;
    padding-left: 1.5rem;
    padding-right: 1.5rem;

    @media only screen and (min-width: 576px) {
        padding-left: 2rem;
        padding-right: 2rem;
    }

    @media only screen and (min-width: 992px) {
        padding-top: 40px;
        padding-bottom: 120px;
    }
}

/* Tabs content wrapper - match CTA banner container */
.contact-us-page-tabs .w-tabs-sections {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 40px;
    z-index: 2;
    width: 100%;

    @media only screen and (min-width: 992px) {
        gap: 90px;
    }
}

/* Individual tab section content */
.contact-us-page-tabs .w-tabs-section-content {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 40px;
    z-index: 2;
    padding: 0 !important; /* Remove all padding with !important */

    @media only screen and (min-width: 992px) {
        gap: 90px;
    }
}

/* Content wrapper - match CTA banner approach */
.contact-us-page-tabs .w-tabs-section-content-h {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 40px;
    z-index: 2;
    margin: 0 !important; /* Force remove auto margins to take full width */
    width: 100%;
    max-width: none !important; /* Force remove max-width constraint */

    @media only screen and (min-width: 992px) {
        gap: 90px;
    }
}

/* Override fullwidth section padding */
.l-section.width_full > div > .g-cols.cols_1 > div > div > .contact-us-page-tabs .w-tabs.layout_hor .w-tabs-section-content,
.l-section.width_full > div > div > .vc_col-sm-12 > div > div > .contact-us-page-tabs .w-tabs.layout_hor .w-tabs-section-content {
    padding: 0; /* Remove the default 5vh 3vmax padding */
}

/* Ensure tabs list has proper spacing */
.contact-us-page-tabs .w-tabs-list {
    margin-bottom: 40px;

    @media only screen and (min-width: 992px) {
        margin-bottom: 60px;
    }
}

/* Accordion specific overrides */
.contact-us-page-tabs .w-tabs.accordion > div > div > .w-tabs-section-content {
    padding: 1.5rem 0; /* Remove left/right padding, keep top/bottom */
}

/* Remove indents override for accordion */
.contact-us-page-tabs .w-tabs.accordion.remove_indents > div > div > .w-tabs-section-content {
    padding: 0 !important;
}

/* Ensure proper spacing for vertical layout */
.contact-us-page-tabs .w-tabs.layout_ver > .w-tabs-sections {
    width: 100%;
}

.contact-us-page-tabs .w-tabs.layout_ver:not(.accordion) > div > div > .w-tabs-section-content {
    padding: 0;
}

/* Responsive adjustments */
@media only screen and (max-width: 991px) {
    .contact-us-page-tabs .w-tabs {
        gap: 40px;
    }
    
    .contact-us-page-tabs .w-tabs-sections {
        gap: 40px;
    }
    
    .contact-us-page-tabs .w-tabs-section-content {
        gap: 40px;
    }
    
    .contact-us-page-tabs .w-tabs-section-content-h {
        gap: 40px;
    }
}

/* Apply Figma styles to tabs list */
.contact-us-page-tabs .w-tabs-list.align_none {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 10px;
    gap: 10px;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border-radius: 100px;
    margin-bottom: 0 !important;
    max-width: 1156px;
    margin-left: auto;
    margin-right: auto;
    z-index: 2;
}

/* Style individual tab items */
.contact-us-page-tabs .w-tabs-list.align_none .w-tabs-item {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 24px 45px;
    gap: 10px;
    height: 68px;
    border-radius: 100px;
    background: transparent;
    border: none !important;
    box-shadow: none !important;
    margin: 0;
    transition: background-color 0.3s ease;
}

/* Add margin to tabs items except first child */
.contact-us-page-tabs .w-tabs-list.align_none .w-tabs-item:not(:first-child) {
    margin-left: 8px;
}

/* Active tab styling - target the correct active class and use specific blue color */
.contact-us-page-tabs .w-tabs-list.align_none .w-tabs-item.active,
.contact-us-page-tabs .w-tabs-list.align_none .w-tabs-item.w-active,
.contact-us-page-tabs .w-tabs-list.align_none .w-tabs-item.active:hover,
.contact-us-page-tabs .w-tabs-list.align_none .w-tabs-item.w-active:hover,
.contact-us-page-tabs .w-tabs-list.align_none .w-tabs-item.active:focus,
.contact-us-page-tabs .w-tabs-list.align_none .w-tabs-item.w-active:focus {
    background: #468ACA !important;
    background-color: #468ACA !important;
    border: none !important;
    box-shadow: none !important;
}

/* Additional override to ensure blue color is applied */
.contact-us-page-tabs .w-tabs-list.align_none .w-tabs-item.active,
.contact-us-page-tabs .w-tabs-list.align_none .w-tabs-item.w-active {
    background: #468ACA !important;
    background-color: #468ACA !important;
    background-image: none !important;
}

/* Tab text styling */
.contact-us-page-tabs .w-tabs-list.align_none .w-tabs-item .w-tabs-item-title {
    font-family: 'League Spartan', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 110%;
    display: flex;
    align-items: center;
    text-align: center;
    color: #000000;
    margin: 0;
    padding: 0;
}

/* Active tab text color */
.contact-us-page-tabs .w-tabs-list.align_none .w-tabs-item.active .w-tabs-item-title,
.contact-us-page-tabs .w-tabs-list.align_none .w-tabs-item.w-active .w-tabs-item-title {
    color: #FFFFFF !important;
}

/* Remove default tab styling */
.contact-us-page-tabs .w-tabs-list.align_none .w-tabs-item:before,
.contact-us-page-tabs .w-tabs-list.align_none .w-tabs-item:after {
    display: none;
}

/* Tabs sections positioning */
.contact-us-page-tabs .w-tabs-sections.titles-align_none.icon_chevron.cpos_right {
    z-index: 1;
    padding-top: 16px;
    
    @media only screen and (min-width: 992px) {
        margin-top: -40px;
        padding-top: 0;
    }
}

/* Remove gap from horizontal tabs layout - handle both initial and initialized states */
.contact-us-page-tabs .w-tabs.layout_hor.style_default.switch_click.has_scrolling,
.contact-us-page-tabs .w-tabs.layout_hor.style_default.switch_click.has_scrolling.initialized {
    gap: 0 !important;
}

.contact-us-page-tabs .w-tabs.layout_hor.style_default.switch_click.has_scrolling .w-tabs-list,
.contact-us-page-tabs .w-tabs.layout_hor.style_default.switch_click.has_scrolling.initialized .w-tabs-list {
    gap: 0 !important;
}

/* Also target the tabs list directly to prevent any gap changes */
.contact-us-page-tabs .w-tabs.layout_hor .w-tabs-list {
    gap: 0 !important;
}

/* Remove left and right padding from tabs layout at 992px and below */
@media only screen and (max-width: 991px) {
    .contact-us-page-tabs .w-tabs.layout_hor.style_default.switch_click.has_scrolling.initialized,
    .contact-us-page-tabs .w-tabs.layout_hor.style_default.switch_click.has_scrolling {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* Add bottom padding to tabs layout on desktop */
@media only screen and (min-width: 992px) {
    .contact-us-page-tabs .w-tabs.layout_hor.style_default.switch_click.has_scrolling.initialized {
        padding-bottom: 60px !important;
    }
}