/*
Theme Name: Design Italia Child
Theme URI: https://github.com/italia/design-wordpress-theme
Description: Child theme per Design Italia
Author: Il tuo nome
Author URI: https://example.com
Template: design-italia
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: design-italia-child
*/

/* Qui puoi aggiungere il tuo CSS personalizzato */
/* Impostiamo flex sul contenitore dei menu */
.nav-wrapper {
    display: flex;
    justify-content: space-between; /* spinge i menu ai lati opposti */
    align-items: center;             /* allinea verticalmente */
    flex-wrap: wrap;                 /* per gestire responsive */
}

/* Rimuoviamo margin/padding di default e impostiamo flex anche sui menu */
.ul {
    margin: 0;
    padding: 0;
}

.main-left, .main-right {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Spaziatura tra le voci del menu */
.main-left li, .main-right li {
    margin: 0 15px;
}

/* Stile link */
/* .main-left a, .main-right a {
    color: #333;
    text-decoration: none;
    font-weight: 600;
} */

/* Responsive: se vuoi che in schermi piccoli i menu si dispongano verticalmente */
/* @media (max-width: 768px) {
    .col-12 {
        flex-direction: column;
        align-items: flex-start;
    }
    .main-left, .main-right {
        flex-direction: column;
    }
    .main-left li, .main-right li {
        margin: 10px 0;
    }
} */

/* NAV BAR WITH RESPONSIVE */
.show-menu-lingua, 
.show-menu-main {
	position: relative;
	text-decoration: none;
	color: #fff;
	background: transparent;
	text-align: center;
	padding: 15px 0;
	width: 100%;
	display: none;
}
.show-menu-main:after {
	content: "\2630";
	position: absolute;
	left: calc(50% - 45px);
	top: 28%;
}
.show-menu-lingua {
	padding: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 50px;
	font-size: 150%;
	line-height: 115%;
}
#show-menu-main[type="checkbox"], 
#show-menu-lingua[type="checkbox"] {
	display: none;
}


@media screen and (max-width: 767px) {
    .show-menu-main {
        display:block;
    }

    .show-menu-main {
		position: absolute;
        top: -74px;
        left: -15px;
        bottom: auto;
        right: auto;
        width: 50px;
        height: 50px;
        padding: 0;
        font-size: 0;
        z-index: 1000001;
    }

    .show-menu-main:after {
        content: "\2630";
        position: absolute;
        left: calc(50% - 45px);
        top: 28%;
    }

    .show-menu-main:after {
		left: 0;
        top: 0;
        width: 100%;
		font-size: 1.75rem;
	}
	.it-header-wrapper.is-sticky .show-menu-main {
		top: -62px;
	}

    #show-menu-main[type="checkbox"]:checked ~ .nav-wrapper .main-left,
    #show-menu-main[type="checkbox"]:checked ~ .nav-wrapper .main-right {
	  height: auto;
	  opacity: 1;
	  overflow: hidden;
	  -webkit-transition: all .4s ease-in-out;
	  -moz-transition: all .4s ease-in-out;
	  -o-transition: all .4s ease-in-out;
	  transition: all .4s ease-in-out;
	}
	#show-menu-main[type="checkbox"]:checked ~ .show-menu-main:after {
		content: "\2715";
		position: fixed;
		top: 20px;
		left: 0;
		width: 60px;
	}

	#show-menu-main[type="checkbox"]:checked ~ .nav-wrapper {
		background-color: #fff;
		display: inline-block;
		position: fixed;
		top: 0;
		bottom: auto;
		left: auto;
		right: 0;
		width: calc(100% - 60px);
		height: 100%;
		min-height: 100%;
		padding: 15px 0;
		z-index: 1000000;
		overflow-y: hidden;
		box-shadow: -100px 0px 0px 0px rgba(0, 0, 0, .6);
	}
	#show-menu-main[type="checkbox"]:checked ~ .nav-wrapper li {
		box-shadow: 0 1px 0 0 rgba(102, 102, 102, .4);
	}
	#show-menu-main[type="checkbox"]:checked ~ .nav-wrapper li:last-child, 
	#show-menu-main[type="checkbox"]:checked ~ .nav-wrapper li ul {
		/* box-shadow: none; */
		border-radius: 0;
	}
	#show-menu-main[type="checkbox"]:checked ~ .nav-wrapper a {
		color: initial;
	}
	#show-menu-main[type="checkbox"]:checked ~ .nav-wrapper li ul:before {
		content: none;
	}

    /* Stile per i singoli menu all'interno */
    .nav-wrapper .nav {
        display: block;
        /* margin-bottom: 20px; */
    }

    /* Voci menu verticali */
/*     .nav-wrapper .nav li {
        color: #000 !important;
        margin: 10px 0;
    }

    .nav li a {
        color: #000 !important;
        font-weight: 600;
        font-size: .889em;
    } */
}