/* ============================================
   PARALLAX PARTICLE STARFIELD BACKGROUND
   - Yıldız parçacıkları arka planda hareket eder
   - Parallax efekti ile derinlik hissi
   - Evervault animasyonunun arkasında
   ============================================ */

/* Starfield container - tüm yıldızları içerir */
.starfield-background {
    position: absolute;
    top: 0;
    left: 20;
    width: 95%;
    height: 85%;
    margin-top: 15px;
    overflow: hidden;
    z-index: 0;
    background: transparent;
}

/* Canvas elementi - yıldızlar burada çizilecek */
.starfield-canvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Yıldız parçacıkları için genel stil */
.star {
    position: absolute;
    background: white;
    border-radius: 50%;
    opacity: 0;
    animation: twinkle 3s infinite;
}

/* Yıldız parıltı animasyonu */
@keyframes twinkle {
    0%, 100% {
        opacity: 0;
        transform: scale(1);
    }
    50% {
        opacity: 1;
        transform: scale(1.2);
    }
}

/* Farklı yıldız katmanları - parallax efekti için */
.star-layer-1 {
    animation-duration: 80s;
}

.star-layer-2 {
    animation-duration: 120s;
}

.star-layer-3 {
    animation-duration: 160s;
}

/* Yıldız boyutları */
.star-small {
    width: 0.5px;
    height: 0.5px;
    box-shadow: 0 0 1px rgba(255, 255, 255, 0.8);
}

.star-medium {
    width: 0.8px;
    height: 0.8px;
    box-shadow: 0 0 2px rgba(255, 255, 255, 0.9);
}

.star-large {
    width: 1px;
    height: 1px;
    box-shadow: 0 0 3px rgba(255, 255, 255, 1);
}

/* Mor tonlu yıldızlar - tema ile uyumlu */
.star-purple {
    background: #a855f7;
    box-shadow: 0 0 8px rgba(168, 85, 247, 0.8);
}

/* Mavi tonlu yıldızlar */
.star-blue {
    background: #60a5fa;
    box-shadow: 0 0 6px rgba(96, 165, 250, 0.7);
}