/**
 * Styles pour la page Register
 * Extrait de class/pages/pageRegister.php pour respecter le principe MVC
 * 
 * Auteur: IT JD SOLUTIONS
 * Date: 10 janvier 2026
 */

/* Styles pour les labels sur fond bleu */
#registerForm .form-label {
    color: #ffffff !important;
    font-weight: 500;
    text-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

#registerForm .form-text {
    color: rgba(255,255,255,0.9) !important;
}

#registerForm .form-check-label {
    color: #ffffff !important;
}

#registerForm h4 {
    color: #ffffff !important;
    text-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

#registerForm .text-danger {
    color: #ffebee !important;
}

#registerForm small.text-muted {
    color: rgba(255,255,255,0.8) !important;
}

/* Suggestions d'autocomplétion pour raison sociale */
.register__suggestions {
    position: absolute;
    z-index: 1000;
    max-height: 300px;
    overflow-y: auto;
    display: none;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    width: 100%;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}

/* Bouton de visibilité du mot de passe */
.register__password-toggle {
    right: 0.5rem;
}

/* Message d'erreur personnalisé (blanc pour fond coloré) */
.register__terms-error {
    color: #ffffff !important;
    opacity: 0.95;
}

/* Section de sélection de couleur */
.register__color-section {
    background: rgba(255,255,255,0.95);
}

/* Container des couleurs */
.register__color-display-container {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Affichage de la couleur actuelle */
.register__color-display {
    width: 60px;
    height: 60px;
    border-radius: 8px;
    border: 3px solid #333;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

/* Texte du code couleur */
.register__color-code {
    font-size: 14px;
    display: block;
    color: #333;
}

/* Grille de couleurs */
.register__color-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 15px;
}

/* Option de couleur cliquable */
.register__color-option {
    cursor: pointer;
    text-align: center;
}

/* Box de couleur */
.register__color-box {
    width: 100%;
    height: 80px;
    border-radius: 8px;
    margin: 0 auto 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
}

/* Box de couleur active */
.register__color-box--active {
    border: 3px solid #333;
}

/* Box de couleur inactive */
.register__color-box--inactive {
    border: 2px solid #ddd;
}

/* Nom de la couleur */
.register__color-name {
    font-size: 11px;
    font-weight: 500;
}

/* Code hex de la couleur */
.register__color-hex {
    font-size: 10px;
}