/* Inapem Premium Styling for Elementor Pro Tabs (Standard & Nested) */

/* General Container */
.elementor-widget-tabs .elementor-widget-container,
.elementor-widget-n-tabs .elementor-widget-container {
    padding: 0 !important;
}

/* Force Layout for the Tabs component */
.elementor-widget-tabs .elementor-tabs,
.elementor-widget-n-tabs .elementor-tabs {
    display: flex !important;
    flex-direction: row !important; /* Row: Sidebar left, Content right */
    gap: 32px !important;
    align-items: flex-start !important;
}

/* Sidebar / Wrapper (The tabs column) */
.elementor-widget-tabs .elementor-tabs-wrapper,
.elementor-widget-n-tabs .elementor-tabs-wrapper {
    display: flex !important;
    flex-direction: column !important;
    width: 320px !important;
    min-width: 320px !important;
    gap: 8px !important;
    border: none !important;
    background: transparent !important;
}

/* Individual Tab Title */
.elementor-widget-tabs .elementor-tab-title,
.elementor-widget-n-tabs .elementor-tab-title {
    background-color: transparent !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 16px 20px !important;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    margin: 0 !important;
    width: 100% !important;
    justify-content: flex-start !important;
    text-align: left !important;
}

/* Inactive Text Styling */
.elementor-widget-tabs .elementor-tab-title .elementor-tab-title__text,
.elementor-widget-n-tabs .elementor-tab-title .elementor-tab-title__text,
.elementor-widget-tabs .elementor-tab-title a,
.elementor-widget-n-tabs .elementor-tab-title a {
    color: #25355C !important;
    font-family: "Poppins", Sans-serif !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
}

/* Inactive Icon Styling */
.elementor-widget-tabs .elementor-tab-title .elementor-tab-title__icon i,
.elementor-widget-n-tabs .elementor-tab-title .elementor-tab-title__icon i,
.elementor-widget-tabs .elementor-tab-title i,
.elementor-widget-n-tabs .elementor-tab-title i {
    color: #25355C !important;
    font-size: 20px !important;
    width: 24px !important;
    text-align: center !important;
    display: inline-block !important;
}

/* Active State Styles */
.elementor-widget-tabs .elementor-tab-title.elementor-active,
.elementor-widget-n-tabs .elementor-tab-title.elementor-active {
    background-color: #F4F6F9 !important; /* Subtle background from mockup */
}

.elementor-widget-tabs .elementor-tab-title.elementor-active .elementor-tab-title__text,
.elementor-widget-n-tabs .elementor-tab-title.elementor-active .elementor-tab-title__text {
    font-weight: 700 !important;
}

.elementor-widget-tabs .elementor-tab-title.elementor-active .elementor-tab-title__icon i,
.elementor-widget-n-tabs .elementor-tab-title.elementor-active .elementor-tab-title__icon i,
.elementor-widget-tabs .elementor-tab-title.elementor-active i,
.elementor-widget-n-tabs .elementor-tab-title.elementor-active i {
    color: #469BD3 !important; /* Cyan color from mockup */
}

/* Hover effect */
.elementor-widget-tabs .elementor-tab-title:hover:not(.elementor-active),
.elementor-widget-n-tabs .elementor-tab-title:hover:not(.elementor-active) {
    background-color: #F8FAFC !important;
}

/* Content Area (Right Side) */
.elementor-widget-tabs .elementor-tabs-content-wrapper,
.elementor-widget-n-tabs .elementor-tabs-content-wrapper {
    flex: 1 !important;
    border: none !important;
    background: transparent !important;
}

.elementor-widget-tabs .elementor-tab-desktop-title.elementor-active,
.elementor-widget-n-tabs .elementor-tab-desktop-title.elementor-active {
    display: flex !important;
}

.elementor-widget-tabs .elementor-tab-content,
.elementor-widget-n-tabs .elementor-tab-content {
    background-color: transparent !important;
    padding: 0 !important;
}

/* Mobile adjustments */
@media (max-width: 767px) {
    /* Stack the wrapper and the content vertically */
    .elementor-widget-tabs .elementor-tabs,
    .elementor-widget-n-tabs .elementor-tabs {
        flex-direction: column !important;
        gap: 16px !important; /* Reduce gap on mobile */
    }
    
    /* The tabs container itself turns into a horizontal scrolling row */
    .elementor-widget-tabs .elementor-tabs-wrapper,
    .elementor-widget-n-tabs .elementor-tabs-wrapper {
        width: 100% !important;
        min-width: 100% !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        box-sizing: border-box !important;
        /* Hide scrollbar for a cleaner look */
        -ms-overflow-style: none; /* IE and Edge */
        scrollbar-width: none;    /* Firefox */
    }
    
    /* WebKit scrollbar hide */
    .elementor-widget-tabs .elementor-tabs-wrapper::-webkit-scrollbar,
    .elementor-widget-n-tabs .elementor-tabs-wrapper::-webkit-scrollbar {
        display: none !important;
    }

    /* Adjust each tab button so they line up horizontally without squeezing */
    .elementor-widget-tabs .elementor-tab-title,
    .elementor-widget-n-tabs .elementor-tab-title {
        width: auto !important;
        flex-shrink: 0 !important;
        white-space: nowrap !important;
        padding: 12px 16px !important;
    }
}