/* CSS Bouton Custom Astra - Structure réelle */

/* Le texte/icônes sont directement dans .ast-custom-button */
/* Pas besoin de ::before/::after, on change directement le contenu */

/* ÉTAT NON CONNECTÉ */
.not-logged-in .ast-header-button-1 .ast-custom-button {
    color: #1A2E3B !important;
}

.not-logged-in .ast-header-button-1 .ast-custom-button:hover {
    color: #4ABDAC !important;
}

/* ÉTAT CONNECTÉ - Change les icônes et couleurs */
.logged-in .ast-header-button-1 .ast-custom-button {
    color: #4ABDAC !important;
}

.logged-in .ast-header-button-1 .ast-custom-button:hover {
    color: #1A2E3B !important;
}

/* Changement du contenu texte pour l'état connecté */
/* Remplace 🔒 par 🏠 quand connecté */
.logged-in .ast-header-button-1 .ast-custom-button {
    /* Le contenu est dans le HTML, on ne peut pas le changer avec CSS */
    /* Il faut utiliser JavaScript pour ça */
}

/* Alternative: masquer le contenu existant et ajouter le nouveau */
.logged-in .ast-header-button-1 .ast-custom-button {
    font-size: 0 !important; /* Cache le texte original */
}

.logged-in .ast-header-button-1 .ast-custom-button::before {
    content: "🏠🏄" !important;
    color: #4ABDAC !important;
    border-top-width: 0px;
    border-right-width: 0px;
    border-left-width: 0px;
    border-bottom-width: 0px;
    padding-top: 10px;
    padding-right: 20px;
    padding-bottom: 10px;
    padding-left: 20px;
    font-size: 20px;
    font-size: 1.25rem;
    line-height: 1em;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
    border-bottom-left-radius: 30px;
}

.logged-in .ast-header-button-1 .ast-custom-button:hover::before {
    color: #1A2E3B !important;
}

/* Pour l'état non connecté, on garde le contenu HTML existant */
.not-logged-in .ast-header-button-1 .ast-custom-button {
    /* Le 🔒🏄 est déjà dans le HTML */
}

/* Responsive */
@media (max-width: 921px) {
    .not-logged-in .ast-header-button-1 .ast-custom-button {
        color: #1A2E3B !important;
    }
    
    .not-logged-in .ast-header-button-1 .ast-custom-button:hover {
        color: #4ABDAC !important;
    }
    
    .logged-in .ast-header-button-1 .ast-custom-button {
        font-size: 0 !important;
        color: #4ABDAC !important;
    }
    
    .logged-in .ast-header-button-1 .ast-custom-button::before {
        content: "🏠🏄" !important;
        font-size: 16px !important;
        color: #4ABDAC !important;
         content: "🏠🏄" !important;
    border-top-width: 0px;
    border-right-width: 0px;
    border-left-width: 0px;
    border-bottom-width: 0px;
    padding-top: 10px;
    padding-right:0px;
    padding-bottom: 10px;
    padding-left: 0px;
    font-size: 20px;
    font-size: 1.25rem;
    line-height: 1em;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
    border-bottom-left-radius: 30px;
    }
    
    .logged-in .ast-header-button-1 .ast-custom-button:hover::before {
        color: #1A2E3B !important;
    }
}