body{
    background-color: #2B333D;
}
#app{
    display: block;
}
#app div{
    flex-grow: 1;
    background-color: #fab3a8;
    margin:5px;
    border-radius: 4px;
    min-width:45vw;
    max-width:auto;
}
#order{
    text-align: center;
}
#orders{
    margin-right: 0px;
}
#orders-list{
    text-align: center;
    padding-left: 0px;
    font-family: cursive;
    font-size: clamp(2.2vw,2.5vw,2vw);
}
#orders-list li{
    box-shadow: #000 0px 2px 8px;
    padding-top: 15px;
    padding-bottom: 15px;
}
#meals{
    margin-bottom: auto;
    height: min-content;
}
ul {
    list-style-type: none;
}
#submit{
    background-color: #4d5866;
    color: #fff;
    font-size: clamp(2vw,2.5vw,2.5vw);
    font-family: sans-serif;
    border: solid 3px #4d5866;
    border-radius: 4px;
    padding-left:20px;
    padding-right: 20px;
    margin-top: 30px;
    margin-bottom: 30px;
}
#submit:disabled{
    background-color: #A29C9B;
    border: solid 3px #A29C9B;
}
#submit:active{
    background-color: #3e8188;
    border: solid 3px #3e8188;
    box-shadow: 0px 0px 4px #000;
}
.selected{
    background-color:#f3c3bc ;
    box-shadow: #0000007c 0px 0px 8px;
    border-radius: 4px;
    font-size: clamp(3.6vw,2.5vw,3.6vw);
}
#meals-list li{
    cursor:pointer;
    width: 40vw;
    margin-left: auto;
    margin-right: auto;
}
#meals-list{
    text-align: center;
    padding-left: 0px;
    font-family: cursive;
    font-size: clamp(3vw,2.5vw,1.5vw);
}
#app .form-main{
    max-width: 400px;
    margin: auto;
    margin-top: 100px;
    margin-bottom: 100px;
    padding: 15px;
}
.login-form p{
    font-size: 16px;
    margin-bottom: 5px;
}
.login-form{
    height: 100%;
}
form input{
    width: 98%;
    height: 25px;
    border-radius: 4px;
    border:solid 1px ;
    padding-left: 4px;
    color: rgb(63, 58, 58)
}
.boton-form{
    width: 20%;
    margin-top: 15px;
    color: #000;
    background-color: #55C1CE;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 2px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    border: solid 3px #55C1CE;
}
.boton-container{
    text-align: center;
}
.boton-form:disabled{
    background-color: #A29C9B;
    border: solid 3px #A29C9B;
}
.boton-form:active{
    background-color: #3e8188;
    border: solid 3px #3e8188;
    box-shadow: 0px 0px 4px #000;
}
.form-title{
    color: #434952;
    text-align: center;
    font-size: clamp(25px,2.5vw,30px);
    text-shadow: #4d5866 0px 1px 8px;
    margin: 5px
}
div h2{
    color:#4d5866;
    font-family: sans-serif;
    letter-spacing: 0.4em;
    font-size: 5vw;
    text-align: center;
    text-shadow: #0000007c 0px 0px 6px ;
}
.c-boton-initsesion{
    background-color: #55C1CE;
    max-height: 40px;
    padding-left: 10px;
    padding-right: 10px;
    border: solid #55C1CE;
    border-radius: 4px;
    font-size: clamp(10px,12px,12px);
    font-weight: 600;
    letter-spacing: 1px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin-bottom: 15px;
    margin-left: 5px;
}
.container-meals-orders{
    display: flex;
}
#aviso{
   color:#e96161; 
   font-size: 1em;
}