/* === FLORAL BACKGROUND PATTERN === */

/* Floral background overlay */
.floral-background-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
    opacity: 0.6; /* Even more visible */
}

/* Floral pattern SVG */
.floral-pattern {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Floral elements styling */
.floral-line {
    fill: none;
    stroke-width: 3; /* Even thicker lines for better visibility */
    opacity: 0.9; /* Very visible */
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* Flower petals */
.floral-petal {
    stroke-width: 1.5;
    opacity: 0.7;
}

/* Flower centers */
.floral-center {
    fill: currentColor;
    opacity: 0.4;
}

/* Stems and leaves */
.floral-stem {
    stroke-width: 1;
    opacity: 0.5;
}

.floral-leaf {
    stroke-width: 1.2;
    opacity: 0.6;
}

/* Responsive adjustments */
@media (max-width: 1200px) {
    .floral-background-overlay {
        opacity: 0.12;
    }
    
    .floral-line {
        stroke-width: 1;
        opacity: 0.5;
    }
    
    .floral-petal {
        stroke-width: 1.2;
        opacity: 0.6;
    }
}

@media (max-width: 768px) {
    .floral-background-overlay {
        opacity: 0.08;
    }
    
    .floral-line {
        stroke-width: 0.8;
        opacity: 0.4;
    }
    
    .floral-petal {
        stroke-width: 1;
        opacity: 0.5;
    }
}

@media (max-width: 480px) {
    .floral-background-overlay {
        opacity: 0.06;
    }
    
    .floral-line {
        stroke-width: 0.6;
        opacity: 0.3;
    }
}

/* Ensure content stays above floral pattern */
body {
    position: relative;
    z-index: 2;
}

/* Main content areas */
.container,
.main-content,
.content-wrapper {
    position: relative;
    z-index: 2;
}

/* Navigation */
.navbar,
.header {
    position: relative;
    z-index: 3;
}

/* Modals and overlays */
.modal,
.lightbox,
.popup {
    position: relative;
    z-index: 1000;
}