/* Stylinginizi giris.php'den adapte ettim */ /* Başlangıç notu (Kodun kaynağını belirtir) */
    :root { /* CSS değişkenlerinin (renk paletinin) tanımlandığı kök alan */
        --primary-red: #d90429; 
        --primary-red-light: #ef233c; 
        --secondary-dark: #2b2d42; 
        --background-light: #edf2f4; 
        --card-bg: #ffffff; 
        --border-light: #e0e0e0; 
        --danger-color: #dc3545; 
    } /* Değişken tanımlarının sonu */
    
    body { background-color: var(--background-light); font-family: 'Poppins', sans-serif; } /* Sayfa geneli: Arka plan rengi, yazı tipi */
    .uyelik-container { display: flex; justify-content: center; align-items: center; padding: 50px 20px; min-height: 80vh; } /* Ana kapsayıcı: İçeriği sayfada dikey ve yatay olarak ortalar */
    .uyelik-form { width: 100%; max-width: 450px; background-color: var(--card-bg); padding: 40px; border-radius: 15px; box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1); } /* Form Kartı: Beyaz zemin, gölge efekti ve yuvarlak köşeler */
    .uyelik-form h2 { font-family: 'Montserrat', sans-serif; font-size: 2rem; font-weight: 700; color: var(--secondary-dark); border-bottom: 3px solid var(--primary-red); display: inline-block; padding-bottom: 5px; margin-bottom: 10px; } /* Başlık: Büyük font, koyu renk ve altına kırmızı çizgi */
    .uyelik-form p { color: var(--text-muted, #6c757d); margin-bottom: 30px; } /* Açıklama Metni: Gri renk ve alt boşluk */
    .form-grup { margin-bottom: 25px; } /* Form Grubu: Inputlar arası dikey boşluk */
    .form-grup label { display: block; font-weight: 600; margin-bottom: 8px; color: var(--secondary-dark); } /* Etiket: Blok yerleşim, kalın yazı ve koyu renk */
    .form-grup input { width: 100%; padding: 12px 15px; border: 1px solid var(--border-light); border-radius: 8px; transition: all 0.3s ease; font-size: 1em; box-sizing: border-box; } /* Input Alanı: Tam genişlik, kenarlık, oval köşe ve geçiş efekti */
    .form-grup input:focus { border-color: var(--primary-red); box-shadow: 0 0 0 3px rgba(217, 4, 41, 0.15); outline: none; } /* Input Odaklanma: Tıklanınca kenarlık kırmızı olur ve etrafa ışık yayar */
    .btn-primary { background: linear-gradient(90deg, var(--primary-red), var(--primary-red-light)); color: white; padding: 14px 30px; border: none; border-radius: 50px; font-weight: 700; font-size: 1.1em; cursor: pointer; width: 100%; transition: all 0.3s ease; box-shadow: 0 8px 20px rgba(217, 4, 41, 0.3); } /* Buton: Kırmızı gradyan, tam oval yapı, gölge ve hover geçişi */
    .btn-primary:hover { transform: translateY(-3px); box-shadow: 0 10px 25px rgba(217, 4, 41, 0.5); } /* Buton Hover: Üzerine gelince buton yukarı kalkar ve gölgesi büyür */
    .form-yonlendirme { text-align: center; margin-top: 25px; font-size: 0.95em; } /* Alt Link Alanı: Metni ortalar ve üstten boşluk bırakır */
    .form-yonlendirme a { color: var(--primary-red); font-weight: 600; } /* Link: Rengi ana kırmızı yapar ve kalınlaştırır */
    
    /* Hata listesi stili */ /* Hata mesajları bölümü için açıklama */
    .hata-listesi { /* Hata kutusunun genel çerçevesi */
        background-color: #ffe6e8; 
        color: var(--danger-color); 
        border: 1px solid #f0c9ce; /* Kenarlık rengi (Pembe tonu) */
        padding: 15px; /* İç boşluk (Yazı kenarlara yapışmasın) */
        border-radius: 8px; /* Köşeleri hafifçe yuvarlat */
        margin-bottom: 30px; /* Altındaki elemanla arasına mesafe koy */
    } /* Hata kutusu stilinin sonu */
    .hata-listesi ul { margin: 0; padding-left: 20px; list-style: disc; } /* Liste: Dış boşluğu sıfırla, iç boşluk ver ve madde işareti koy */