@import"https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";:root,textarea{font-family:Poppins,sans-serif}body{margin:0;width:100%;height:auto;padding:0;background-color:var(--background-color)}button{border:none;font-size:1rem;display:flex;align-items:center;justify-content:center;cursor:pointer}button>span{display:flex;align-items:center;justify-content:center;transition:all .4s ease;margin-left:-30px;opacity:0}button:hover>span{opacity:1;margin-left:5px}@keyframes entradaAnimation{0%{opacity:0;transform:translateY(-100px)}50%{opacity:1;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes salidaAnimation{0%{opacity:1;transform:translateY(0)}50%{opacity:.5;transform:translateY(20px)}to{opacity:0;transform:translateY(-100px)}}@keyframes aparece{0%{opacity:0}to{opacity:1}}@keyframes ondas{0%{scale:0;opacity:1}to{scale:3;opacity:0}}:root{--primario: black;--colorUno: #F5B841;--colorDos: #1e71de;--colorTres: #3bce2e;--success: #36d13d;--transparencia: rgba(0, 0, 0, .7);--contraste-fondo: #E8E8E8;--bordes: #d6d6d6;--background-color: white;--gris: #7B7B7B;--delete: #FF3C38;--contraste-delete: #E3B4B8}.size-20{width:25px}.tablas{width:100%;height:auto;padding:0;border-radius:10px;border:solid 1px var(--bordes);overflow:auto}.tablas table{width:100%;border-collapse:collapse;text-align:left}.tablas table thead{background-color:var(--contraste-fondo)}.tablas table thead tr td{padding:5px 8px;font-size:1rem;color:var(--gris);font-size:small;font-weight:500;text-transform:uppercase}.tablas table tbody tr{border:solid 1px var(--bordes);border-left:none;border-right:none}.tablas table tbody tr:last-child{border-bottom:none}.tablas table tbody tr td{padding:5px 8px;font-size:small}.loader{display:flex;align-items:center;justify-content:center;position:absolute;width:100%;height:100%;top:0;left:0}.jelly{--uib-size: 40px;--uib-speed: .8s;--uib-color: #2c2b2b;position:relative;height:calc(var(--uib-size) / 2);width:var(--uib-size);filter:url(#uib-jelly-ooze);animation:rotate72317 calc(var(--uib-speed) * 2) linear infinite}.jelly:before,.jelly:after{content:"";position:absolute;top:0%;left:25%;width:50%;height:100%;background:var(--uib-color);border-radius:100%}.jelly:before{animation:shift-left var(--uib-speed) ease infinite}.jelly:after{animation:shift-right var(--uib-speed) ease infinite}.jelly-maker{width:0;height:0;position:absolute}@keyframes rotate72317{0%,49.999%,to{transform:none}50%,99.999%{transform:rotate(90deg)}}@keyframes shift-left{0%,to{transform:translate(0)}50%{transform:scale(.65) translate(-75%)}}@keyframes shift-right{0%,to{transform:translate(0)}50%{transform:scale(.65) translate(75%)}}.app{width:100%;height:auto;box-sizing:border-box;padding:30px 20px;animation:aparece 1s 1;transition:all .6s ease}.app h1{margin:0;font-size:1.3rem}.app .container{width:100%;box-sizing:border-box;overflow:auto;max-height:60vh;position:relative;margin-top:15px;height:auto}.app .container ul{list-style:none;width:100%;display:grid;grid-template-columns:repeat(2,1fr);margin:0;padding:0;gap:20px}.app .container ul>li{width:100%;aspect-ratio:1/1;background-color:var(--contraste-fondo);border-radius:15px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;flex-direction:column}.app .container ul>li .numero{position:absolute;width:35px;height:35px;background-color:var(--primario);border-radius:10px;left:5px;top:5px;display:flex;align-items:center;justify-content:center;color:#fff}.app .container ul>li .estado{position:absolute;width:20px;height:20px;background-color:var(--colorUno);border-radius:10px;right:5px;top:5px;display:flex;align-items:center;justify-content:center;color:#fff}.app .container ul>li .precio{font-size:1.2rem;font-weight:500}.app .container ul>li .food-drink{position:absolute;width:100%;bottom:10px;display:flex;align-items:center;justify-content:center}.app .container ul>li .food-drink>div{display:flex;align-items:center;color:var(--gris);margin:0 8px;font-size:small}.tapador{position:fixed;width:100%;height:100%;background-color:var(--transparencia);display:flex;align-items:center;justify-content:center;box-sizing:border-box;z-index:12;left:0;top:0}.tapador .container{width:80%;max-width:600px;height:auto;max-height:90%;overflow:hidden;background-color:#fff;box-sizing:border-box;padding:15px;border-radius:25px;animation:entradaAnimation .6s 1;position:relative}.tapador .container .cerrar{position:absolute;right:10px;top:10px;cursor:pointer}.salir .container{animation:salidaAnimation .6s 1}.tapador .container h1{margin:0;font-size:1.2rem}.tapador .container>p{margin:0 0 10px;color:var(--gris)}.tapador .container .coments{position:relative;width:100%;box-sizing:border-box;padding:10px;color:var(--colorUno);display:flex;align-items:center}.tapador .container .total{margin-top:15px;width:100%;display:flex;align-items:end;justify-content:space-between}.tapador .container .total small{color:var(--gris)}.tapador .container .total h2{margin:0}.tapador .container .total button{background-color:var(--primario);color:#fff;border-radius:10px;padding:10px 30px}.tapador .container .buttons{width:100%;display:flex;margin-top:20px;align-items:center;justify-content:center}.tapador .container .buttons button{padding:8px 20px;border-radius:10px}.tapador .container .buttons button:first-child{background-color:var(--primario);color:#fff;margin-right:10px}.tapador .container .buttons button:last-child{background-color:var(--gris);color:#fff}.tapador .enviar-preparar{width:100%;margin-top:20px;background-color:var(--success);height:35px;border-radius:10px}.tapador .container .input-group-pin{width:100%;display:flex;align-items:center;justify-content:space-between;margin-top:20px}.tapador .container .input-group-pin input{width:40px;height:40px;border:solid 1px var(--bordes);border-radius:10px;text-align:center;font-size:1rem}.tapador .container .btn-pin{width:100%;background-color:var(--primario);color:#fff;margin-top:20px;padding:10px 0;border-radius:10px}.pedir{position:relative}.pedir textarea{box-sizing:border-box;padding:10px;border-radius:10px;background-color:var(--contraste-fondo);text-align:center;font-size:1rem;width:100%;margin-top:15px;border:solid 1px var(--bordes);height:120px;position:relative}.pedir .mic{position:absolute;width:40px;height:40px;background-color:var(--primario);border-radius:20px;color:#fff;box-sizing:border-box;display:flex;align-items:center;justify-content:center;right:10px;top:110px;cursor:pointer}.pedir .mic .escalador{position:absolute;width:40px;height:40px;border-radius:20px;background-color:var(--success);animation:ondas 1s infinite}.pedir button{background-color:var(--colorUno);border-radius:10px;padding:8px 30px}.menu{position:fixed;width:calc(100% - 40px);left:20px;height:60px;bottom:20px;max-width:500px;box-sizing:border-box}.menu:before{content:"";position:absolute;left:-20px;height:110px;width:calc(100% + 40px);bottom:-20px;background-color:var(--background-color)}.menu ul{display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding:0;margin:0;list-style:none;position:relative;height:60px;width:100%;background-color:var(--primario);border-radius:15px}.menu ul li{position:relative;color:var(--gris);margin:0 3px;display:flex;align-items:center;justify-content:center;flex-direction:column;width:33.3%;height:60px}.menu ul li .icono{transition:all .4s ease}.menu ul li span{color:var(--primario);font-size:small;transition:all .4s ease;opacity:0;display:flex;align-items:end;height:0px;overflow:hidden}.menu ul .activo>span{opacity:1;height:30px}.menu ul .activo .icono{transform:translateY(-10px)}.menu ul .activo{color:#fff}.menu ul>.puntero{position:absolute;width:63px!important;height:63px!important;background-color:var(--primario);top:-25px;border-radius:33px!important;box-sizing:border-box;border:solid 6px var(--background-color);border-top-left-radius:-10px;transition:all .4s ease}.menu ul .puntero:before,.menu ul .puntero:after{content:"";position:absolute;top:calc(50% - 7px);width:20px;height:20px;background:transparent}.menu ul .puntero:before{left:-22px;border-top-right-radius:20px;box-shadow:1px -10px 0 0 var(--background-color)}.menu ul .puntero:after{right:-22px;border-top-left-radius:20px;box-shadow:-1px -10px 0 0 var(--background-color)}.header{position:sticky;width:100%;display:flex;align-items:center;justify-content:space-between;height:50px;box-sizing:border-box;padding:0 20px;top:0;background-color:var(--background-color);z-index:3}.header .nombre{position:relative;height:100%;display:flex;align-items:center}.header .nombre img{width:35px;height:35px;border-radius:18px;object-fit:cover;background-color:var(--primario);margin-right:10px}.header .notificaciones{position:relative;display:flex;align-items:center;cursor:pointer}.header .notificacion .size-20{animation:vibrar 1s infinite}.header .notificaciones span{position:absolute;width:10px;height:10px;background-color:var(--success);border-radius:5px;top:0;left:-7px}@keyframes vibrar{0%{transform:rotate(0)}20%{transform:rotate(-30deg)}40%{transform:rotate(30deg)}60%{transform:rotate(-30deg)}80%{transform:rotate(30deg)}to{transform:rotate(0)}}.btn-modificar{width:100%;padding:10px 20px;background-color:var(--primario);color:#fff;border-radius:10px}.enviar-preparar{width:100%;margin-top:20px;padding:0 20px;background-color:var(--success);height:35px;border-radius:10px}.profile{position:relative;width:100%;box-sizing:border-box;display:flex;align-items:center;justify-content:center;flex-direction:column}.profile img{width:80px;height:80px;border-radius:40px;object-fit:cover;background-color:#000}.profile p{margin:0}.profile .nombre{font-weight:600;margin-top:15px}.profile .usuario{font-size:small;color:var(--gris)}.profile .btn-edit{padding:10px 20px;background-color:var(--primario);color:#fff;margin-top:15px;border-radius:20px;cursor:pointer}.opciones{width:100%;margin-top:25px}.opciones .contenedor{background-color:var(--contraste-fondo);border-radius:20px;box-sizing:border-box;padding:010px;margin-top:10px;list-style:none}.opciones .contenedor li{width:100%;display:flex;align-items:center;justify-content:space-between;border-bottom:solid 1px var(--bordes)}.opciones .cerrar-sesion{background-color:var(--contraste-delete)}.opciones .contenedor li:last-child{border-bottom:none}.opciones .contenedor li .icono{width:40px;height:40px;padding:10px 0;display:flex;align-items:center;justify-content:center;color:var(--gris)}.opciones .contenedor li .texto{width:calc(100% - 120px)}.opciones .contenedor li>div{width:60px;height:30px;border-radius:15px;background-color:var(--gris);display:flex;align-items:center;box-sizing:border-box;padding:0 3px;cursor:pointer;transition:all .4s ease}.opciones .contenedor li>div .bola{width:24px;height:24px;border-radius:12px;background-color:#fff;transition:all .4s ease;transform-origin:left}.opciones .contenedor li>.cerrar{background-color:transparent;width:30px;color:var(--primario)}.opciones p{margin:0 0 0 20px;color:var(--gris);font-size:small}.preview{width:120px;height:120px;border-radius:60px;position:relative;overflow:hidden;background-color:var(--primario)}.preview img{position:absolute;width:100%;height:100%;object-fit:cover}.login{width:100%;min-height:100vh;display:flex;align-items:center;justify-content:center;background-color:var(--contraste-fondo)}.formulario{width:80%;height:max-content;max-width:500px;display:flex;align-items:center;justify-content:space-between;flex-direction:column;position:relative;background-color:#fff;box-sizing:border-box;padding:20px;border-radius:25px}.formulario .encabezado{width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}.formulario .encabezado img{width:80px}.formulario .encabezado h1{margin:10px 0 0;font-weight:600;font-size:1.5rem}.formulario .encabezado p{color:var(--gris);margin:0}.formulario .campos{width:100%;margin:20px 0}.formulario .campos .input-group{width:100%;display:flex;align-items:center;justify-content:center;position:relative;margin-bottom:30px}.formulario .campos .input-group label{position:absolute;left:10px;transition:all .4s ease;cursor:text}.formulario .campos .input-group span{position:absolute;right:10px;z-index:1;cursor:pointer}.formulario .campos .input-group input{width:100%;border:none;border-bottom:solid 1px black;font-size:1rem;box-sizing:border-box;padding:0 10px;height:30px}.formulario .campos .input-group input:focus{outline:none}.formulario .campos .btn-send{width:100%;height:40px;border-radius:20px;background-color:var(--primario);color:#fff;font-size:1rem;border:none}
