/*
    |--------------------------------------------------------------------------
    | Style pour le Logo et le Nom du Site
    |--------------------------------------------------------------------------
    */

    /* Le conteneur du lien (<a>) devient un conteneur flex */
    .logo-link-wrapper {
        display: flex; /* Aligne les enfants (logo et texte) horizontalement */
        align-items: center; /* Centre verticalement le logo et le texte */
        gap: 12px; /* Crée un espace de 12px entre le logo et le texte */
        text-decoration: none; /* Supprime le soulignement par défaut des liens */
    }

    /* Style pour l'image du logo */
    .logo-image {
        max-height: 10vh !important; /* Une hauteur fixe est souvent meilleure pour un header */
        width: auto;
    }

    /* Style pour le nom du site */
    .site-name {
        font-size: 24px;
        font-weight: 700; /* fw-bolder */
        color: var(--White); /* Utilise la variable de couleur de votre template */
        transition: color 0.3s ease; /* Ajoute une transition douce pour le survol */
    }

    /* Effet de survol optionnel pour le texte */
    .logo-link-wrapper:hover .site-name {
        color: var(--Main-color); /* Change la couleur du texte au survol */
    }