/* Genel Stil (Anasayfa ve Arka Plan) */
body {
    margin: 0;
    padding: 0;
    height: 100vh;
    font-family: 'Arial', sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(120deg, #1a2a6c, #b21f1f, #fdbb2d); /* Hareketli degrade renkler */
    background-size: 400% 400%; /* Arka plan animasyonu için */
    animation: gradientBackground 6s ease infinite;
    color: white;
    text-align: center;
}

/* Hareketli Degrade Arka Plan */
@keyframes gradientBackground {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

/* Anasayfa Mesaj Kutusu */
.maintenance-message {
    background: rgba(0, 0, 0, 0.7); /* Şeffaf siyah kutu */
    padding: 40px 60px;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
    width: 90%;
    max-width: 500px;
    text-align: center;
    border: 4px solid white; /* Beyaz çerçeve */
}

    .maintenance-message img {
        max-width: 150px; /* Logo boyutu */
        margin-bottom: 20px;
        border: 3px solid white; /* Logoya beyaz çerçeve */
        border-radius: 50%; /* Çerçeveyi yuvarlak yapar */
        padding: 5px; /* Logonun etrafında boşluk */
        background-color: rgba(255, 255, 255, 0.1); /* Hafif beyaz arka plan efekti */
    }

    .maintenance-message h1 {
        font-size: 2.5em;
        margin-bottom: 15px;
        text-shadow: 0 2px 4px rgba(0, 0, 0, 0.6);
    }

    .maintenance-message p {
        font-size: 1.2em;
        margin-bottom: 20px;
        color: #e0e0e0;
    }

.admin-button {
    padding: 10px 25px;
    font-size: 1.2em;
    color: #fff;
    background-color: #007bff;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
}

    .admin-button:hover {
        background-color: #0056b3;
        transform: scale(1.05);
    }

/* Modal Tasarımı */
.modal-backdrop {
    background: rgba(0, 0, 0, 0.85); /* Koyu arka plan efekti */
}

.modal-content {
    border-radius: 20px; /* Yuvarlatılmış köşeler */
    overflow: hidden;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5); /* Modern gölge efekti */
}

.modal-header {
    background: linear-gradient(90deg, #1a2a6c, #b21f1f); /* Gradient geçişli arka plan */
    color: white; /* Yazı rengi */
    border-bottom: none;
    text-align: center;
    font-weight: bold;
}

.btn-close-white {
    filter: invert(1); /* Beyaz görünmesi için invert */
}

.modal-body {
    background-color: #121212; /* Karanlık arka plan */
    color: white; /* Yazı rengi */
    padding: 30px;
    border-top: 2px solid rgba(255, 255, 255, 0.1); /* İnce beyaz çizgi */
}

    .modal-body .form-label {
        font-weight: bold; /* Etiketlerin kalın görünümü */
        color: white;
    }

    .modal-body .form-control {
        background: rgba(255, 255, 255, 0.1); /* Şeffaf arka plan */
        color: white; /* Yazı rengi */
        border: none; /* Kenarlık yok */
        border-bottom: 2px solid #007bff; /* Alt kenarlık mavi */
        border-radius: 5px; /* Yuvarlatılmış kenarlar */
        padding: 10px;
        transition: border-color 0.3s ease; /* Renk değişimi animasyonu */
    }

        .modal-body .form-control::placeholder {
            color: rgba(255, 255, 255, 0.5); /* Placeholder rengi */
            font-style: italic;
        }

        .modal-body .form-control:focus {
            border-bottom-color: #fdbb2d; /* Odaklanıldığında alt kenarlık sarı */
            outline: none;
        }

    .modal-body .btn-primary {
        padding: 10px; /* Buton iç dolgu */
        font-size: 1.2em; /* Yazı boyutu */
        border-radius: 10px; /* Yuvarlatılmış köşeler */
        background: linear-gradient(90deg, #1a2a6c, #b21f1f); /* Gradient geçişli arka plan */
        border: none; /* Kenarlık yok */
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4); /* Gölge efekti */
        transition: transform 0.3s ease, background 0.3s ease; /* Animasyon */
    }

        .modal-body .btn-primary:hover {
            transform: scale(1.05); /* Hover sırasında büyütme */
            background: linear-gradient(90deg, #b21f1f, #fdbb2d); /* Gradient renk değişimi */
        }

.modal-title {
    font-size: 1.5em; /* Yazı boyutu */
    font-weight: bold;
}