/**
 * Header Batik Pattern Background
 * Adds decorative batik pattern to header-main section
 */

/* Batik Pattern Background on Header Main */
.header-main {
    position: relative;
    overflow: visible;
}

.header-main::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-image: url('../images/batik-pattern.svg');
    background-repeat: no-repeat;
    background-position: left center;
    background-size: auto 100%;
    opacity: 1;
    z-index: 0;
    pointer-events: none;
}

/* Ensure content stays above pattern */
.header-main .container {
    position: relative;
    z-index: 1;
}

/* Adjust pattern for sticky header */
.rsmelati-header.header-sticky .header-main::before {
    opacity: 1;
    transition: opacity 0.3s ease;
}

/* Responsive adjustments */
@media (max-width: 1024px) {
    .header-main::before {
        width: 250px;
        opacity: 0.06;
    }
}

@media (max-width: 768px) {
    .header-main::before {
        width: 200px;
        opacity: 0.05;
    }
}

@media (max-width: 480px) {
    .header-main::before {
        width: 150px;
        opacity: 0.04;
    }
}