/* assets/css/style.css */

/* Modal Stilleri */
#modal-backdrop {
    display: none; /* JS ile 'flex' olarak değiştirilecek */
    transition: opacity 0.3s ease;
}

.modal-content {
    transform: scale(0.95);
    opacity: 0;
    transition: all 0.3s ease-in-out;
}

#modal-backdrop.active {
    display: flex;
}

#modal-backdrop.active .modal-content.active {
    transform: scale(1);
    opacity: 1;
}

.modal-close-btn {
    position: absolute;
    top: 1rem;
    right: 1.5rem;
    font-size: 2rem;
    font-weight: bold;
    color: #9ca3af; /* gray-400 */
    background: none;
    border: none;
    cursor: pointer;
    line-height: 1;
}
.modal-close-btn:hover {
    color: #fff;
}

/* Form stilleri */
.modal-input {
    @apply w-full p-3 rounded-lg bg-gray-700 border border-gray-600 text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-blue-500 transition duration-300;
}

/* Hata mesajı stilleri */
.error-message {
    @apply bg-red-500/20 border border-red-500 text-red-300 px-4 py-3 rounded-lg relative mb-4 text-sm;
    display: none; /* Başlangıçta gizli */
}