body {
    background: linear-gradient(135deg, #430149 0%, #c003b0 50%, #430149 100%);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; /* Police moderne et lisible */
    min-height: 100vh;
    color: #f0f0f0; /* Couleur de texte par défaut légèrement blanc cassé pour une meilleure lisibilité */
}

.glass-card {
    background: rgba(255, 255, 255, 0.08); /* Effet verre subtil */
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px); /* Pour Safari */
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 16px; /* Rayon adouci */
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
}

.tab-active {
    background: linear-gradient(135deg, #c003b0 0%, #430149 100%);
    color: white !important;
    border-bottom: 2px solid #c003b0; /* Ligne d'accentuation magenta */
}

/* Styles pour les champs de saisie */
.input-field {
    background-color: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: white !important;
    padding-top: 0.85rem; /* Ajustement du padding pour une meilleure apparence */
    padding-bottom: 0.85rem;
    transition: all 0.3s ease;
}

.input-field::placeholder {
    color: rgba(255, 255, 255, 0.65) !important;
}

.input-field:focus {
    background-color: rgba(255, 255, 255, 0.15) !important;
    border-color: #a00693 !important; /* Magenta Sonam pour le focus */
    box-shadow: 0 0 0 3px rgba(192, 3, 176, 0.35) !important; /* Lueur magenta Sonam */
}

/* Styles pour les boutons */
.btn-primary, .btn-secondary {
    background: linear-gradient(135deg, #c003b0 0%, #430149 100%) !important;
    transition: filter 0.3s ease, transform 0.2s ease;
    box-shadow: 0 4px 10px rgba(0,0,0,0.25);
    font-weight: 600 !important; /* Police plus grasse pour les boutons */
    text-transform: uppercase; /* Majuscules pour un look plus affirmé */
    letter-spacing: 0.5px;
}

.btn-primary:hover, .btn-secondary:hover {
    filter: brightness(1.15);
    transform: translateY(-2px);
}

/* NOUVEAU: Style pour le bouton de retour */
.back-to-home-button {
    position: absolute;
    top: 20px;
    left: 20px;
    display: inline-flex;
    align-items: center;
    padding: 10px 18px;
    text-decoration: none;
    color: white;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 25px;
    font-weight: 500;
    transition: all 0.3s ease;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    z-index: 50; /* S'assurer qu'il est au-dessus des autres éléments */
    white-space: nowrap; /* Empêche le texte de passer à la ligne */
}
.back-to-home-button:hover {
    background: rgba(255, 255, 255, 0.2);
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    transform: translateY(-2px);
}

/* Amélioration de la visibilité et de l'esthétique du texte */
h2.text-2xl { /* Ciblage plus spécifique pour les titres de formulaire */
    font-weight: 700 !important; /* Titres plus gras */
    letter-spacing: 0.5px;
    color: white !important;
}

label {
    font-weight: 500 !important; /* Labels un peu plus gras */
    color: rgba(255, 255, 255, 0.9) !important; /* Texte des labels plus clair */
}

.floating, .floating-2, .floating-3 {
    opacity: 0.1; /* Réduire l'opacité des formes flottantes pour moins de distraction */
}

body.is-redirecting {
    animation: pageFadeOut 0.4s ease-out forwards;
}

@keyframes pageFadeOut {
    from {
        opacity: 1;
        transform: scale(1); /* Optionnel: commencer à l'échelle normale */
    }
    to {
        opacity: 0;
        transform: scale(0.98); /* Optionnel: léger effet de rétrécissement */
    }
}
