/**
 * Pattern Styles - Ecekim Web Sitesi İçin Arka Plan Desenleri
 */

/* Pattern Container */
.pattern {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    pointer-events: none;
}

/* Dry Pattern - Çapraz çizgili desen */
.dry-pattern {
    background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.03) 25%, transparent 25%), 
                      linear-gradient(-45deg, rgba(0, 0, 0, 0.03) 25%, transparent 25%), 
                      linear-gradient(45deg, transparent 75%, rgba(0, 0, 0, 0.03) 75%), 
                      linear-gradient(-45deg, transparent 75%, rgba(0, 0, 0, 0.03) 75%);
    background-size: 20px 20px;
    background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
}

.dry-pattern-blue {
    background-image: linear-gradient(45deg, rgba(0, 86, 157, 0.05) 25%, transparent 25%), 
                      linear-gradient(-45deg, rgba(0, 86, 157, 0.05) 25%, transparent 25%), 
                      linear-gradient(45deg, transparent 75%, rgba(0, 86, 157, 0.05) 75%), 
                      linear-gradient(-45deg, transparent 75%, rgba(0, 86, 157, 0.05) 75%);
    background-size: 20px 20px;
    background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
}

.dry-pattern-green {
    background-image: linear-gradient(45deg, rgba(0, 128, 0, 0.05) 25%, transparent 25%), 
                      linear-gradient(-45deg, rgba(0, 128, 0, 0.05) 25%, transparent 25%), 
                      linear-gradient(45deg, transparent 75%, rgba(0, 128, 0, 0.05) 75%), 
                      linear-gradient(-45deg, transparent 75%, rgba(0, 128, 0, 0.05) 75%);
    background-size: 20px 20px;
    background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
}

.dry-pattern-purple {
    background-image: linear-gradient(45deg, rgba(128, 0, 128, 0.05) 25%, transparent 25%), 
                      linear-gradient(-45deg, rgba(128, 0, 128, 0.05) 25%, transparent 25%), 
                      linear-gradient(45deg, transparent 75%, rgba(128, 0, 128, 0.05) 75%), 
                      linear-gradient(-45deg, transparent 75%, rgba(128, 0, 128, 0.05) 75%);
    background-size: 20px 20px;
    background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
}

/* Grid Pattern - Kare grid desen */
.grid-pattern {
    background-image: linear-gradient(rgba(0, 0, 0, 0.03) 1px, transparent 1px), 
                      linear-gradient(90deg, rgba(0, 0, 0, 0.03) 1px, transparent 1px);
    background-size: 20px 20px;
}

.grid-pattern-blue {
    background-image: linear-gradient(rgba(0, 86, 157, 0.05) 1px, transparent 1px), 
                      linear-gradient(90deg, rgba(0, 86, 157, 0.05) 1px, transparent 1px);
    background-size: 20px 20px;
}

.grid-pattern-green {
    background-image: linear-gradient(rgba(0, 128, 0, 0.05) 1px, transparent 1px), 
                      linear-gradient(90deg, rgba(0, 128, 0, 0.05) 1px, transparent 1px);
    background-size: 20px 20px;
}

.grid-pattern-purple {
    background-image: linear-gradient(rgba(128, 0, 128, 0.05) 1px, transparent 1px), 
                      linear-gradient(90deg, rgba(128, 0, 128, 0.05) 1px, transparent 1px);
    background-size: 20px 20px;
}

/* Dot Pattern - Nokta desen */
.dot-pattern {
    background-image: radial-gradient(circle, rgba(0, 0, 0, 0.1) 1px, transparent 1px);
    background-size: 10px 10px;
}

.dot-pattern-blue {
    background-image: radial-gradient(circle, rgba(0, 86, 157, 0.15) 1px, transparent 1px);
    background-size: 10px 10px;
}

.dot-pattern-green {
    background-image: radial-gradient(circle, rgba(0, 128, 0, 0.15) 1px, transparent 1px);
    background-size: 10px 10px;
}

.dot-pattern-purple {
    background-image: radial-gradient(circle, rgba(128, 0, 128, 0.15) 1px, transparent 1px);
    background-size: 10px 10px;
}

/* Hex Pattern - Altıgen desen */
.hex-pattern {
    background-color: transparent;
    background-image: 
        linear-gradient(30deg, rgba(0, 0, 0, 0.03) 12%, transparent 12.5%, transparent 87%, rgba(0, 0, 0, 0.03) 87.5%, rgba(0, 0, 0, 0.03)), 
        linear-gradient(150deg, rgba(0, 0, 0, 0.03) 12%, transparent 12.5%, transparent 87%, rgba(0, 0, 0, 0.03) 87.5%, rgba(0, 0, 0, 0.03)), 
        linear-gradient(30deg, rgba(0, 0, 0, 0.03) 12%, transparent 12.5%, transparent 87%, rgba(0, 0, 0, 0.03) 87.5%, rgba(0, 0, 0, 0.03)), 
        linear-gradient(150deg, rgba(0, 0, 0, 0.03) 12%, transparent 12.5%, transparent 87%, rgba(0, 0, 0, 0.03) 87.5%, rgba(0, 0, 0, 0.03)), 
        linear-gradient(60deg, rgba(0, 0, 0, 0.03) 25%, transparent 25.5%, transparent 75%, rgba(0, 0, 0, 0.03) 75%, rgba(0, 0, 0, 0.03)), 
        linear-gradient(60deg, rgba(0, 0, 0, 0.03) 25%, transparent 25.5%, transparent 75%, rgba(0, 0, 0, 0.03) 75%, rgba(0, 0, 0, 0.03));
    background-size: 80px 140px;
    background-position: 0 0, 0 0, 40px 70px, 40px 70px, 0 0, 40px 70px;
}

.hex-pattern-blue {
    background-color: transparent;
    background-image: 
        linear-gradient(30deg, rgba(0, 86, 157, 0.05) 12%, transparent 12.5%, transparent 87%, rgba(0, 86, 157, 0.05) 87.5%, rgba(0, 86, 157, 0.05)), 
        linear-gradient(150deg, rgba(0, 86, 157, 0.05) 12%, transparent 12.5%, transparent 87%, rgba(0, 86, 157, 0.05) 87.5%, rgba(0, 86, 157, 0.05)), 
        linear-gradient(30deg, rgba(0, 86, 157, 0.05) 12%, transparent 12.5%, transparent 87%, rgba(0, 86, 157, 0.05) 87.5%, rgba(0, 86, 157, 0.05)), 
        linear-gradient(150deg, rgba(0, 86, 157, 0.05) 12%, transparent 12.5%, transparent 87%, rgba(0, 86, 157, 0.05) 87.5%, rgba(0, 86, 157, 0.05)), 
        linear-gradient(60deg, rgba(0, 86, 157, 0.05) 25%, transparent 25.5%, transparent 75%, rgba(0, 86, 157, 0.05) 75%, rgba(0, 86, 157, 0.05)), 
        linear-gradient(60deg, rgba(0, 86, 157, 0.05) 25%, transparent 25.5%, transparent 75%, rgba(0, 86, 157, 0.05) 75%, rgba(0, 86, 157, 0.05));
    background-size: 80px 140px;
    background-position: 0 0, 0 0, 40px 70px, 40px 70px, 0 0, 40px 70px;
}

.hex-pattern-green {
    background-color: transparent;
    background-image: 
        linear-gradient(30deg, rgba(0, 128, 0, 0.05) 12%, transparent 12.5%, transparent 87%, rgba(0, 128, 0, 0.05) 87.5%, rgba(0, 128, 0, 0.05)), 
        linear-gradient(150deg, rgba(0, 128, 0, 0.05) 12%, transparent 12.5%, transparent 87%, rgba(0, 128, 0, 0.05) 87.5%, rgba(0, 128, 0, 0.05)), 
        linear-gradient(30deg, rgba(0, 128, 0, 0.05) 12%, transparent 12.5%, transparent 87%, rgba(0, 128, 0, 0.05) 87.5%, rgba(0, 128, 0, 0.05)), 
        linear-gradient(150deg, rgba(0, 128, 0, 0.05) 12%, transparent 12.5%, transparent 87%, rgba(0, 128, 0, 0.05) 87.5%, rgba(0, 128, 0, 0.05)), 
        linear-gradient(60deg, rgba(0, 128, 0, 0.05) 25%, transparent 25.5%, transparent 75%, rgba(0, 128, 0, 0.05) 75%, rgba(0, 128, 0, 0.05)), 
        linear-gradient(60deg, rgba(0, 128, 0, 0.05) 25%, transparent 25.5%, transparent 75%, rgba(0, 128, 0, 0.05) 75%, rgba(0, 128, 0, 0.05));
    background-size: 80px 140px;
    background-position: 0 0, 0 0, 40px 70px, 40px 70px, 0 0, 40px 70px;
}

.hex-pattern-purple {
    background-color: transparent;
    background-image: 
        linear-gradient(30deg, rgba(128, 0, 128, 0.05) 12%, transparent 12.5%, transparent 87%, rgba(128, 0, 128, 0.05) 87.5%, rgba(128, 0, 128, 0.05)), 
        linear-gradient(150deg, rgba(128, 0, 128, 0.05) 12%, transparent 12.5%, transparent 87%, rgba(128, 0, 128, 0.05) 87.5%, rgba(128, 0, 128, 0.05)), 
        linear-gradient(30deg, rgba(128, 0, 128, 0.05) 12%, transparent 12.5%, transparent 87%, rgba(128, 0, 128, 0.05) 87.5%, rgba(128, 0, 128, 0.05)), 
        linear-gradient(150deg, rgba(128, 0, 128, 0.05) 12%, transparent 12.5%, transparent 87%, rgba(128, 0, 128, 0.05) 87.5%, rgba(128, 0, 128, 0.05)), 
        linear-gradient(60deg, rgba(128, 0, 128, 0.05) 25%, transparent 25.5%, transparent 75%, rgba(128, 0, 128, 0.05) 75%, rgba(128, 0, 128, 0.05)), 
        linear-gradient(60deg, rgba(128, 0, 128, 0.05) 25%, transparent 25.5%, transparent 75%, rgba(128, 0, 128, 0.05) 75%, rgba(128, 0, 128, 0.05));
    background-size: 80px 140px;
    background-position: 0 0, 0 0, 40px 70px, 40px 70px, 0 0, 40px 70px;
}

/* Cross Pattern - Çarpı desen */
.cross-pattern {
    background-image: 
        linear-gradient(45deg, rgba(0, 0, 0, 0.03) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.03) 75%), 
        linear-gradient(45deg, rgba(0, 0, 0, 0.03) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.03) 75%);
    background-size: 20px 20px;
    background-position: 0 0, 10px 10px;
}

.cross-pattern-blue {
    background-image: 
        linear-gradient(45deg, rgba(0, 86, 157, 0.05) 25%, transparent 25%, transparent 75%, rgba(0, 86, 157, 0.05) 75%), 
        linear-gradient(45deg, rgba(0, 86, 157, 0.05) 25%, transparent 25%, transparent 75%, rgba(0, 86, 157, 0.05) 75%);
    background-size: 20px 20px;
    background-position: 0 0, 10px 10px;
}

.cross-pattern-green {
    background-image: 
        linear-gradient(45deg, rgba(0, 128, 0, 0.05) 25%, transparent 25%, transparent 75%, rgba(0, 128, 0, 0.05) 75%), 
        linear-gradient(45deg, rgba(0, 128, 0, 0.05) 25%, transparent 25%, transparent 75%, rgba(0, 128, 0, 0.05) 75%);
    background-size: 20px 20px;
    background-position: 0 0, 10px 10px;
}

.cross-pattern-purple {
    background-image: 
        linear-gradient(45deg, rgba(128, 0, 128, 0.05) 25%, transparent 25%, transparent 75%, rgba(128, 0, 128, 0.05) 75%), 
        linear-gradient(45deg, rgba(128, 0, 128, 0.05) 25%, transparent 25%, transparent 75%, rgba(128, 0, 128, 0.05) 75%);
    background-size: 20px 20px;
    background-position: 0 0, 10px 10px;
}

/* Wave Pattern - Dalga desen */
.wave-pattern {
    background-image: radial-gradient(circle at center, transparent 0, rgba(0, 0, 0, 0.03) 50%, transparent 100%);
    background-size: 30px 30px;
}

.wave-pattern-blue {
    background-image: radial-gradient(circle at center, transparent 0, rgba(0, 86, 157, 0.05) 50%, transparent 100%);
    background-size: 30px 30px;
}

.wave-pattern-green {
    background-image: radial-gradient(circle at center, transparent 0, rgba(0, 128, 0, 0.05) 50%, transparent 100%);
    background-size: 30px 30px;
}

.wave-pattern-purple {
    background-image: radial-gradient(circle at center, transparent 0, rgba(128, 0, 128, 0.05) 50%, transparent 100%);
    background-size: 30px 30px;
}

/* Circle Pattern - Daire desen */
.circle-pattern {
    background-image: radial-gradient(circle, rgba(0, 0, 0, 0.05) 1px, transparent 1px);
    background-size: 20px 20px;
}

.circle-pattern-blue {
    background-image: radial-gradient(circle, rgba(0, 86, 157, 0.08) 1px, transparent 1px);
    background-size: 20px 20px;
}

.circle-pattern-green {
    background-image: radial-gradient(circle, rgba(0, 128, 0, 0.08) 1px, transparent 1px);
    background-size: 20px 20px;
}

.circle-pattern-purple {
    background-image: radial-gradient(circle, rgba(128, 0, 128, 0.08) 1px, transparent 1px);
    background-size: 20px 20px;
}

/* Industrial Pattern - Endüstriyel desen */
.industrial-pattern {
    background-image: 
        linear-gradient(90deg, rgba(0, 0, 0, 0.03) 1px, transparent 1px), 
        linear-gradient(rgba(0, 0, 0, 0.03) 1px, transparent 1px);
    background-size: 15px 15px;
    background-position: 0 0, 0 0;
}

.industrial-pattern-blue {
    background-image: 
        linear-gradient(90deg, rgba(0, 86, 157, 0.05) 1px, transparent 1px), 
        linear-gradient(rgba(0, 86, 157, 0.05) 1px, transparent 1px);
    background-size: 15px 15px;
    background-position: 0 0, 0 0;
}

.industrial-pattern-green {
    background-image: 
        linear-gradient(90deg, rgba(0, 128, 0, 0.05) 1px, transparent 1px), 
        linear-gradient(rgba(0, 128, 0, 0.05) 1px, transparent 1px);
    background-size: 15px 15px;
    background-position: 0 0, 0 0;
}

.industrial-pattern-purple {
    background-image: 
        linear-gradient(90deg, rgba(128, 0, 128, 0.05) 1px, transparent 1px), 
        linear-gradient(rgba(128, 0, 128, 0.05) 1px, transparent 1px);
    background-size: 15px 15px;
    background-position: 0 0, 0 0;
}

/* Diamond Pattern - Elmas desen */
.diamond-pattern {
    background-color: transparent;
    background-image: 
        linear-gradient(45deg, rgba(0, 0, 0, 0.03) 25%, transparent 25%), 
        linear-gradient(-45deg, rgba(0, 0, 0, 0.03) 25%, transparent 25%);
    background-size: 20px 20px;
    background-position: 0 0, 0 10px;
}

.diamond-pattern-blue {
    background-color: transparent;
    background-image: 
        linear-gradient(45deg, rgba(0, 86, 157, 0.05) 25%, transparent 25%), 
        linear-gradient(-45deg, rgba(0, 86, 157, 0.05) 25%, transparent 25%);
    background-size: 20px 20px;
    background-position: 0 0, 0 10px;
}

.diamond-pattern-green {
    background-color: transparent;
    background-image: 
        linear-gradient(45deg, rgba(0, 128, 0, 0.05) 25%, transparent 25%), 
        linear-gradient(-45deg, rgba(0, 128, 0, 0.05) 25%, transparent 25%);
    background-size: 20px 20px;
    background-position: 0 0, 0 10px;
}

.diamond-pattern-purple {
    background-color: transparent;
    background-image: 
        linear-gradient(45deg, rgba(128, 0, 128, 0.05) 25%, transparent 25%), 
        linear-gradient(-45deg, rgba(128, 0, 128, 0.05) 25%, transparent 25%);
    background-size: 20px 20px;
    background-position: 0 0, 0 10px;
}

/* Noise Pattern - Gürültü desen */
.noise-pattern {
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.03'/%3E%3C/svg%3E");
}

.noise-pattern-blue {
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' fill='%2300569D' opacity='0.05'/%3E%3C/svg%3E");
}

.noise-pattern-green {
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' fill='%23008000' opacity='0.05'/%3E%3C/svg%3E");
}

.noise-pattern-purple {
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' fill='%23800080' opacity='0.05'/%3E%3C/svg%3E");
}