/* Our Work Widget Styles - Widget Specific to avoid conflicts with homepage */

/* Button styles */
.elementor-widget-our-work-widget .hww-subtab-list__btn {
    width: 100%;
    background: #fff;
    border: none;
    border-radius: 14px;
    padding: 5px 7px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #004D79;
    font-family: "Manrope", sans-serif;
    font-size: 20px;
    font-weight: 500;
    line-height: 26px;
    cursor: pointer;
    transition: all 0.3s;
    text-align: left;
    white-space: normal;
}

/* Active button text color (now hardcoded) */
.elementor-widget-our-work-widget .hww-subtab-list__btn.is-active {
    color: #ffffff;
}

/* Content styles - these will be overridden by Elementor color controls */
.elementor-widget-our-work-widget .our-work-content-1 {
    font-size: 20px;
    line-height: 1.6;
    color: #1e8062;
    padding: 0;
    background: transparent;
    border: none;
    font-style: normal;
    font-family: 'DM Serif Display';
    border-radius: 0;
    margin-bottom: 24px;
    padding-bottom: 24px;
    border-bottom: 1px solid #e0e0e0;
}

.elementor-widget-our-work-widget .our-work-content-2 {
    font-size: 16px;
    font-weight: 500;
    color: #004D79;
    line-height: 1.6;
}

.elementor-widget-our-work-widget .our-work-content-2.para_list {
    font-size: 16px;
    font-weight: 500;
    color: #004D79;
}

/* Ensure proper spacing and layout */
.elementor-widget-our-work-widget .hww-detail-panel__content-inner > div:not(:last-child) {
    margin-bottom: 24px;
    padding-bottom: 24px;
    border-bottom: 1px solid #e0e0e0;
}

/* SVG icon color transitions */
.elementor-widget-our-work-widget .hww-subtab-list__btn .hww-subtab-list__btn-icon svg path,
.elementor-widget-our-work-widget .hww-subtab-list__btn .hww-subtab-list__btn-icon svg path+path {
    transition: all 0.3s;
}

/* Active button SVG colors - completely override Elementor dynamic styles */
.elementor-widget-our-work-widget .hww-section .hww-detail-wrapper .hww-detail-panel .hww-detail-panel__left .hww-subtab-list__btn.is-active .hww-subtab-list__btn-icon svg,
.elementor-widget-our-work-widget .hww-section .hww-detail-wrapper .hww-detail-panel .hww-detail-panel__left .hww-subtab-list__btn.is-active .hww-subtab-list__btn-icon svg *,
.elementor-widget-our-work-widget .hww-section .hww-detail-wrapper .hww-detail-panel .hww-detail-panel__left .hww-subtab-list__btn:hover .hww-subtab-list__btn-icon svg *,
.elementor-widget-our-work-widget .hww-section .hww-detail-wrapper .hww-detail-panel .hww-detail-panel__left .hww-subtab-list__btn:hover .hww-subtab-list__btn-icon svg * {
    fill: #fff !important;
    stroke: #fff !important;
    opacity: 1 !important;
    filter: none !important;
}

/* Additional fallback for active buttons */
.hww-section .hww-subtab-list__btn.is-active .hww-subtab-list__btn-icon svg,
.hww-section .hww-subtab-list__btn.is-active .hww-subtab-list__btn-icon svg *,
.hww-section .hww-subtab-list__btn:hover .hww-subtab-list__btn-icon svg *,
.hww-section .hww-subtab-list__btn:hover .hww-subtab-list__btn-icon svg * {
    fill: #fff !important;
    stroke: #fff !important;
    opacity: 1 !important;
    filter: none !important;
}

/* Global override for any SVG in active buttons */
.hww-subtab-list__btn.is-active svg,
.hww-subtab-list__btn.is-active svg *,
.hww-subtab-list__btn:hover svg,
.hww-subtab-list__btn:hover svg * {
    fill: #fff !important;
    stroke: #fff !important;
    opacity: 1 !important;
    filter: none !important;
}

/* Icon visibility */
.elementor-widget-our-work-widget .hww-subtab-list__btn-icon--minus {
    display: none;
}

.elementor-widget-our-work-widget .hww-subtab-list__btn.is-active .hww-subtab-list__btn-icon--plus {
    display: none;
}

.elementor-widget-our-work-widget .hww-subtab-list__btn.is-active .hww-subtab-list__btn-icon--minus {
    display: flex;
}

/* Responsive design */
@media (max-width: 768px) {
    .elementor-widget-our-work-widget .hww-subtab-list__btn {
        font-size: 16px;
        padding: 8px 10px;
    }
    
    .elementor-widget-our-work-widget .our-work-content-1 {
        font-size: 18px;
    }
    
    .elementor-widget-our-work-widget .our-work-content-2 {
        font-size: 14px;
    }
}