.container{min-height:100vh;padding:150px 20px 0;width:100%;display:flex;align-items:center;flex-direction:column;background:linear-gradient(180deg,#e3f2fd,#ffffff)}h1{text-align:center}.form-and-results{padding:40px;border:1px solid #ddd;border-radius:10px;background-color:#fff;box-shadow:0 4px 10px rgba(0,0,0,.1);margin-bottom:50px;max-width:100%}.section{margin-bottom:20px;padding:10px;border-radius:5px;max-width:100%;width:700px}h3{margin-bottom:10px}label{display:block;margin-bottom:5px}input,select{margin-left:10px;padding:5px}input{display:flex;justify-content:center;align-items:center}h2{width:100%;margin:20px 0}.labelAndInput{display:flex;justify-content:center;align-items:center}.labelAndInput label{font-size:20px;display:flex;align-items:center}.labelAndInput input{width:50px}.persons,.portions{display:flex;gap:20px}.extras{display:flex;flex-direction:column;width:100%;align-items:flex-start;gap:10px}.portions input{margin-right:5px;width:60px}.extras .labelAndInput{width:250px;display:flex;justify-content:space-between;align-items:center}.coal{width:20px;height:20px;margin-left:10px}button,select{margin:10px 0;padding:8px;font-size:16px;border-radius:5px}select{width:250px;margin-right:20px;border:1px solid #ccc}button{background:#28a745;color:white;border:none;cursor:pointer}button:hover{background:#218838}.seleccionadas{margin-top:15px;gap:10px}.item,.seleccionadas{display:flex;align-items:center}.item{justify-content:space-between;gap:5px;padding:0 5px;font-size:15px;border-right:1px solid #3d3d3d}.item:last-child{border-right:0}.eliminar{color:#c82333;font-size:15px;padding:0;margin:0}.eliminar,.eliminar:hover{background-color:inherit}.calc{margin-top:30px;padding:12px 20px;background-color:#007bff;color:white;border:none;border-radius:8px;cursor:pointer;font-size:20px;transition:background-color .3s ease;width:100%}.calc:hover{background-color:#0056b3}.percentajes{display:flex;align-items:center;gap:10px}.percentajeBtn{background-color:#ddd;margin:0;width:50px;color:#000;box-shadow:0 4px 10px rgba(0,0,0,.1);transition:all .2s;border-radius:16px}.percentajeBtn.active,.percentajeBtn:hover{background-color:#0056b3;color:#fff}.information p{font-size:18px;margin:10px 0}.information h3{font-size:20px;margin:20px 0}.desc{margin-bottom:50px;text-align:center}.separator{width:100%;height:1px;background-color:#ddd}@media screen and (max-width:700px){.form-and-results{padding:10px}.persons,.portions{flex-wrap:wrap}.persons .labelAndInput,.portions .labelAndInput{width:max-content;justify-content:flex-start}}@media screen and (max-width:500px){.container{padding-top:100px}select{width:150px}.seleccionadas{flex-direction:column;align-items:flex-start}.item{border-right:0}}@media screen and (max-width:450px){.persons,.portions{flex-direction:column}}