/* Section Header Widget Styles */

.section-header-wrapper {
    position: relative;
    width: 100%;
    margin: 0 0 30px 0;
}

/* Desktop Layout */
@media (min-width: 768px) {
    .section-header-wrapper {
        overflow: visible;
    }
    
    /* Icon positioned to the left of the wrapper */
    .section-header-icon {
        position: absolute;
        left: -150px; /* Position icon further left (controlled via widget settings) */
        top: 50%;
        transform: translateY(-50%);
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 10;
    }
    
    .section-header-icon i,
    .section-header-icon svg {
        display: block;
    }
    
    .section-header-icon img {
        display: block;
        height: auto;
    }
    
    /* Background only as wide as content, but extends to left edge */
    .section-header-background {
        position: relative;
        display: inline-block; /* Only as wide as content */
        max-width: 100%;
    }
    
    /* Pseudo-element extends background to left edge */
    .section-header-background::before {
        content: '';
        position: absolute;
        right: 100%; /* Position to the left of background */
        top: 0;
        bottom: 0;
        width: 100vw; /* Extend all the way to left edge */
        background-color: inherit;
        z-index: -1;
    }
    
    .section-header-content {
        position: relative;
        z-index: 5;
    }
    
    .section-header-title {
        margin: 0;
        padding: 0;
        line-height: 1.2;
        font-weight: 700;
    }
}

/* Mobile Layout */
@media (max-width: 767px) {
    .section-header-wrapper {
        overflow: visible;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }
    
    .section-header-icon {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        margin: 0;
        position: relative;
    }
    
    .section-header-icon i,
    .section-header-icon svg {
        display: block;
    }
    
    .section-header-icon img {
        display: block;
        height: auto;
    }
    
    /* Remove background on mobile */
    .section-header-background {
        background-color: transparent !important;
        border-radius: 0 !important;
        width: 100%;
        display: block;
    }
    
    .section-header-content {
        width: 100%;
        padding: 0 !important; /* Remove padding on mobile */
    }
    
    .section-header-title {
        margin: 0;
        padding: 0;
        line-height: 1.2;
        font-weight: 700;
    }
}

/* Elementor Editor Support */
.elementor-editor-active .section-header-wrapper {
    overflow: visible;
}

/* RTL Support */
@media (min-width: 768px) {
    [dir="rtl"] .section-header-icon {
        left: auto;
        right: -150px;
    }
    
    [dir="rtl"] .section-header-background::before {
        right: auto;
        left: 100%;
    }
}