/* =====================================================
TABLET
===================================================== */

@media (max-width:900px){

.header-inner{
flex-direction:column;
align-items:flex-start;
gap:10px;
}

.menu{
display:flex;
flex-wrap:wrap;
gap:10px;
}

.menu a{
margin-right:0;
}

.dashboard-grid{
grid-template-columns:1fr 1fr;
}

.tiles{
grid-template-columns:1fr 1fr;
}

}


/* =====================================================
MOBILE MENU SIDEBAR
===================================================== */

@media (max-width:600px){

.mobile-menu-toggle{
display:block;
font-size:24px;
background:none;
border:none;
cursor:pointer;
}

.menu{
position:fixed;
top:0;
left:-260px;
width:260px;
height:100%;
background:white;
flex-direction:column;
padding:20px;
transition:left .3s ease;
z-index:1001;
}

.menu.menu-open{
left:0;
}

.menu a{
padding:12px 0;
border-bottom:1px solid #eee;
}

.menu-overlay{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.4);
opacity:0;
visibility:hidden;
transition:.3s;
z-index:1000;
}

.menu-overlay.active{
opacity:1;
visibility:visible;
}

.no-scroll{
overflow:hidden;
}


/* =====================================================
LAYOUT MOBILE
===================================================== */

.container{
padding:20px 15px;
}

.dashboard-grid{
grid-template-columns:1fr;
}

.tiles{
grid-template-columns:1fr;
}

.ordini-tiles{
grid-template-columns:1fr;
}

.consegne-tiles{
grid-template-columns:1fr;
}

.ordine-tile-info{
grid-template-columns:1fr;
}

.consegna-tile-info{
grid-template-columns:1fr;
}

.filter-form{
flex-direction:column;
gap:10px;
}

.filter-form input,
.filter-form select,
.filter-form button{
width:100%;
}

table{
display:block;
overflow-x:auto;
white-space:nowrap;
}

.btn-principale,
.btn-secondario{
width:100%;
}

.ritiri-grid{
grid-template-columns:1fr;
}

}