﻿.nav-bottom-fixed {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60px; /* ou ce que tu veux */
    background-color: #fff;
    border-top: 1px solid #ccc;
    z-index: 9999; /* pour qu’elle reste au-dessus */
}

/*hover-belowline-animation*/
/*Début*/
.hover-belowline-animation {
    display: inline-block;
    position: relative;
}

    .hover-belowline-animation::after {
        content: '';
        position: absolute;
        width: 100%;
        transform: scaleX(0);
        height: 2px;
        top: 0;
        left: 0;
        background-color: #0087ca;
        transition: transform 0.50s ease-out;
    }

    .hover-belowline-animation:hover::after {
        transform: scaleX(1);
    }

    .hover-belowline-animation.left::after {
        transform-origin: top right;
    }

    .hover-belowline-animation.left:hover::after {
        transform-origin: top left;
    }

    .hover-belowline-animation.center::after {
        transform-origin: top center;
    }

    .hover-belowline-animation.center:hover::after {
        transform-origin: top center;
    }

    .hover-belowline-animation.right::after {
        transform-origin: top left;
    }

    .hover-belowline-animation.right:hover::after {
        transform-origin: top right;
    }
/*fin*/
/*hover-belowline-animation*/

.loading {
    padding: 2rem;
    text-align: center;
    font-size: 1.2rem;
    color: #555;
}


/* ---------------------------------------------------- */
/* Menu Horizontal */
/* ---------------------------------------------------- */
.menu_horizontal {
    list-style: none;
    margin: 0;
    padding: 0;
    /*background: #333;*/
    display: flex;
}

    .menu_horizontal > li {
        position: relative;
    }

        .menu_horizontal > li > a {
            display: flex;
            align-items: center;
            /*color: white;*/
            text-decoration: none;
            padding: 14px 20px;
            transition: all 0.3s ease;
            position: relative;
        }

            /* Ligne animée au hover du niveau 1 */
            .menu_horizontal > li > a::before {
                content: "";
                position: absolute;
                top: 0;
                left: 0;
                width: 0;
                height: 3px;
                background: var(--falcon-navbar-color); /* couleur de la ligne */
                transition: width 0.3s ease;
            }

            .menu_horizontal > li > a:hover::before {
                width: 100%;
            }

            /* Icônes du niveau 1 */
            .menu_horizontal > li > a .icon {
                margin-right: 7px;
            }

    /* Sous-menus */
    .menu_horizontal li ul {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        background: #FFFFFF;
        list-style: none;
        margin: 0;
        padding: 0;
        min-width: 200px;
        z-index: 1000;
        border-radius:8px;
    }

    .menu_horizontal li:hover > ul {
        display: block;
    }

    .menu_horizontal li ul li {
        position: relative;
    }

        .menu_horizontal li ul li a {
            display: block;
            color: var(--falcon-navbar-color);
            text-decoration: none;
            padding: 10px 15px;
            transition: background 0.3s;
        }

            .menu_horizontal li ul li a:hover {
                background: #CFDDF7;
                color: var(--falcon-navbar-color);
            }

        /* Flèches à droite pour les sous-niveaux */
        .menu_horizontal li ul li:has(ul) > a::after {
            /*content: "▶";*/
            float: right;
            margin-left: 8px;
            font-size: 12px;
        }

        /* Sous-menus des sous-menus (niveaux 3 et 4) */
        .menu_horizontal li ul li ul {
            top: 0;
            left: 100%;
        }
/* ---------------------------------------------------- */
/* ---------------------------------------------------- */

.mymessagealert {
    position: fixed;
    top: 0px;
    left: 50%;
    //transform: translateX(-50%);
    width: auto;
    //max-width: 90%;
    z-index: 9999;
    display: none;
}


/* ---------------------------------------------------- */
/* --- eMall.casa ------------------------------------- */
/* ---------------------------------------------------- */
.navbar-glass {
    background-color: #fefbf9;
}

section {
    padding-top: 1rem;
    padding-bottom: 1rem;
}
/* ---------------------------------------------------- */
/* ---------------------------------------------------- */


.navbar li.nav-item {
    font-size: 13px;
    padding: 0 1px;
}

.navbar-light .navbar-nav .nav-item a {
    text-transform: capitalize;
    font-size: 13px;
    font-family: "Montserrat", sans-serif;
    font-weight: 500;
    white-space: nowrap;
}

/* ---------------------------------------------------- */
/* - logo-loader / Spiner ----------------------------- */
/* ---------------------------------------------------- */
.myloader {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 4px solid transparent;
    border-top: 4px solid black; /* Noir */
    border-right: 4px solid red; /* Rouge */
    border-bottom: 4px solid black; /* Gris clair */
    /* Le quart gauche reste transparent */
    animation: spin 1.2s linear infinite, colorChange 3.6s linear infinite;
    margin: auto;
}

@keyframes spin {
    100% {
        transform: rotate(360deg);
    }
}

@keyframes colorChange {
    0%, 33% {
        border-top-color: black;
        border-right-color: red;
        border-bottom-color: black;
    }

    34%, 66% {
        border-top-color: red;
        border-right-color: black;
        border-bottom-color: black;
    }

    67%, 100% {
        border-top-color: black;
        border-right-color: black;
        border-bottom-color: red;
    }
}

/*.loader-container {
    display: flex;
    justify-content: center;*/ /* centre horizontal */
    /*align-items: center;*/ /* centre vertical */
    /*height: 200px;*/ /* adapte selon la taille de ton popup */
/*}

.logo-loader {
    width: 40px;
    height: 40px;
    animation: spinlogo 1.2s linear infinite;
}

@keyframes spinlogo {
    to {
        transform: rotate(360deg);
    }
}*/

.loader-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 200px; /* adapte la hauteur selon ton popup */
}

.logo-loader {
    width: 40px;
    height: 40px;
    animation: flip-logo 1.2s linear infinite;
    display: block;
}

@keyframes flip-logo {
    0% {
        transform: rotateY(0deg);
    }

    50% {
        transform: rotateY(180deg); /* logo vu de dos (profil) */
    }

    100% {
        transform: rotateY(360deg); /* retour face */
    }
}

/* ---------------------------------------------------- */
/* - Fin logo-loader / Spiner ------------------------- */
/* ---------------------------------------------------- */

li.valide::before {
    content: "✔"; /* Unicode pour la coche */
    color: green;
    margin-right: 8px;
    font-size: 1.3em;
}

.pricing-table2 .pricing-box .pricing-body ul li::before {
    content: "✔"; /* Unicode pour la coche */
    position: absolute;
    top: 0;
    left: 0;
    font-family: FontAwesome;
    color: green;
}