@charset "UTF-8";
/* CSS Document */

#menu_principal{
    background-color: rgba(255,255,255,1);
	transition: none !important;
    display: block;
    position: fixed;
    top: 0px;
    width: 100%;
    height: 80px !important;
    z-index: 800;
    vertical-align: middle;
    border-bottom: none;
    overflow: visible;
}

#menu_smart{
    position: relative;
    top: 0px;
    width:100%;
    padding: 20px;
    background-color: rgba(27,29,34,0.8);
}

.visible{ display: block; }
.hidden{ display: none; }

.menu_height_60{ height: 60px; }
.menu_height_80{ height: 80px; }
.menu_height_120{ height: 120px; }

.menu_logo {
    position: relative;
    height: 80px;
	    overflow: hidden;
    background-image: url("../../images/logos/logo.png");
    background-repeat: no-repeat;
    background-size: auto 100%; /* Hauteur = 100%, largeur auto */
    background-position: left center; /* Collé à gauche, centré verticalement */
}

.menu_logo .logo_image {
    height: 100%;
    width: auto;
    background-image: url("../../images/logos/logo.png");
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: left center;
}

.menu_menu {
    position: relative;
    background-color: rgba(255,255,255,0);
    vertical-align: middle;
}

.menu_menu .logo_extension {
		    /*background-image: url("../../images/logos/logo_suite.png");*/
	height: 100%;
    width: auto;
    background-image: url("../../images/logos/logo_suite.png");
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: left center;

    /*position: absolute;

    left: 0;
    top: 0;
    height: 100%;
    width: 100px; /* ou ajuste selon besoin */
    /*background-color: orange;*/
}

.logo_extension {
    height: 80px; /* Hauteur maximale de ton menu */
    width: auto;
    min-width: 100px; /* Ajuste si besoin */
    background-image: url("../../images/logos/logo_suite.png");
    background-repeat: no-repeat;
    background-size: auto 100%; /* Étire l’image sur la hauteur */
    background-position: left center;
    display: inline-block;
    vertical-align: middle;
}

.menu_bts {
    background-color: rgba(178,208,223,0);
    vertical-align: middle;
}

.menu_outils {
    background-color: rgba(239,122,124,0);
    vertical-align: middle;
}

.bt_menu {
    display: block;
    float: right;
    background-color: rgba(255,255,255,0);
    color:rgba(0,0,0,0.6);
    padding-top: 24px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
    min-width: 80px;
    line-height: 24px;
    height: 120px;
    vertical-align: middle;
}

.bt_menu:hover {
    background-color: rgba(238,127,10,1);
    color:rgba(255,255,255,1);
}

.bt_menu_smart {
    display: block;
    background-color: rgba(255,255,255,0);
    color:rgba(255,255,255,0.6);
    padding-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
    line-height: 24px;
    vertical-align: middle;
}

.bt_menu_smart:hover {
    background-color: rgba(238,127,10,1);
    color:rgba(255,255,255,1);
}

.fermer_menu {
    font-family: Arial, Helvetica, sans-serif;
	font-size: 24px;
    line-height: 24px;
    text-align: right;
    color: rgba(255,255,255,1.00);
    padding-right: 40px;
}

.fermer_menu:hover {
    font-family: Arial, Helvetica, sans-serif;
	font-size: 24px;
    line-height: 24px;
    text-align: right;
    color: rgba(238,127,10,1);
    padding-right: 40px;
}

.ordi { display: none; }
.smart {
    display: block;
    position: absolute;
    top: -60px;
    right: 40px;
}

.menu_menu_content {
    display: flex;
    align-items: center;
    height: 100%;
}

.logo_extension {
    height: 80px;
    min-width: 100px;
    background-image: url("../../images/logos/logo_suite.png");
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: left center;
    display: inline-block;
}

.logo_extension {
    height: 100%;
    min-width: 80px;
    background-image: url("../../images/logos/logo_suite.png");
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: left center;
    display: inline-block;
}

.menu_menu {
    display: flex;
    align-items: center;
    justify-content: flex-start; /* tu peux garder ça si besoin */
    position: relative;
}

.menu_bts {
    margin-left: auto; /* 🚀 C'est cette ligne qui pousse le bloc à droite */
    display: flex;
    align-items: center;
    gap: 10px; /* espacement entre les boutons */
}

@media(min-width:768px){
    #menu_principal{ overflow: hidden; }
    .ordi{ display: block; }
    .smart{ display: none; }
}