html,body,#root{height:100vh;width:100%;margin:0;padding:0}h1,h2,h3,h4,p,span,div,button{font-family:Roboto,sans-serif}.App{margin:0;padding:0;height:100vh;width:100%}#menuBar{display:flex;flex-direction:column;width:250px;height:100vh;background-color:#fff;box-sizing:border-box;padding-left:10px}#header{display:flex;flex-direction:row;justify-content:flex-start;gap:10px;align-items:center;padding:10px 20px}#logo{width:30px;height:30px}#opciones{display:flex;flex-direction:column;margin-top:30px;gap:0px;padding:0 20px}.opcion-menu{display:flex;flex-direction:row;align-items:flex-start;gap:10px;padding:5px 0;font-weight:400;font-size:16px;cursor:pointer}#active{font-weight:700}#logoutButton{margin-top:auto;margin-bottom:20px;margin-left:10px;padding:10px 20px;background-color:#f44336;color:#fff;border:none;border-radius:5px;cursor:pointer;width:60%;display:flex;align-items:center;gap:10px}.popup-content{background:#fff;padding:2rem;border-radius:8px;box-shadow:0 2px 8px #0003;min-width:300px;max-width:90vw;max-height:90vh;overflow-y:auto;box-sizing:border-box}.popup-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}#rolesContainer{display:flex;flex-direction:column;justify-content:flex-start;gap:20px;flex:1;padding:20px;overflow-y:auto}#tabla-roles{overflow-x:auto;overflow-y:auto;background-color:#fff;box-shadow:0 2px 4px #0000001a;border-radius:20px;padding:10px;width:80%;max-height:70%}table{width:100%;border:none;border-collapse:collapse}th,td{border:none;border-bottom:1px solid black;padding:10px;text-align:left}#agregar-rol-btn,#eliminar-btn,#change-password-button{width:150px;padding-block:5px;background-color:#000;color:#fff;border:none;border-radius:10px;cursor:pointer}#user-form-container form{display:flex;flex-direction:column;gap:10px}#user-form-container label{display:block;margin-bottom:6px;color:#000;font-weight:500}#user-form-container input[type=text]{width:100%;padding:8px 10px;border:1px solid #ccc;border-radius:6px;margin-top:4px;font-size:14px;box-sizing:border-box}#user-form-container select{border:1px solid #d1d5db;border-radius:10px;padding:8px;background-color:#fff;box-shadow:0 2px 4px #0000000d;font-size:15px;color:#374151;transition:all .2s ease}#user-form-container option{padding:6px}#user-form-container button[type=submit]{background-color:#000;color:#fff;padding:10px;width:100%;border:none;border-radius:6px;cursor:pointer}#user-form-container button[type=submit]:disabled{background-color:#000;color:#fff;padding:10px;width:100%;border:none;border-radius:6px;cursor:not-allowed;opacity:.6}#Home{margin:0;padding:0;height:100vh;width:100vw;background-color:#b9b9b920;display:flex;flex-direction:row}#contenido-home{display:flex;flex-direction:column;flex:1;height:100vh;overflow-y:auto}#menuContainer{display:flex;flex-direction:column;margin-top:20px;padding:20px;height:100vh}#searchBar{display:flex;flex-direction:row;align-items:center;gap:10px;margin-bottom:20px;border:2px solid black;border-radius:20px;padding:5px;width:95%}#searchBar input{border:none;outline:none;background-color:transparent;font-family:Roboto,sans-serif;width:100%}#categories{display:flex;flex-direction:row;gap:10px;overflow-x:auto;margin-bottom:20px;min-height:40px}.category{padding:10px;border:2px solid black;border-radius:20px;white-space:nowrap;font-weight:600}.category.selected{background-color:#000;color:#fff}#menuProducts{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px;padding:20px}.productCard{display:grid;grid-template-rows:auto 1fr auto auto;border-radius:20px;background-color:#fff;box-shadow:0 4px 4px #00000040;padding:15px;text-align:center}.productCard img{width:140px;height:140px;object-fit:cover;border-radius:15px;margin-bottom:10px}.state-label{padding:5px;border-radius:5px;border:none;font-weight:600;height:fit-content;width:50%}#unavailable{background-color:#e8b93130;color:#e8b931}#available{background-color:#00c8b330;color:#00c8b3}.productInfo{display:flex;flex-direction:row;width:100%;align-items:center;justify-content:space-between}.Edit{background-color:#000;color:#fff;border:none;border-radius:20px;padding:10px 5px;font-weight:600;width:50%;cursor:pointer;text-align:center}#edit-category-btn{background-color:#000;color:#fff;border:none;border-radius:20px;padding:10px 20px;font-weight:600;cursor:pointer}#productCardButtons{display:flex;gap:10px;align-items:center;justify-content:space-between}#addProductBtn{background-color:#fff;color:#000;border:2px solid black;border-radius:20px;padding:10px 20px;font-weight:600;cursor:pointer;width:fit-content;display:flex;align-items:center}#product-form-container form{background-color:#fff;border:1px solid #ddd;border-radius:8px;padding:20px;width:100%;max-width:700px;margin:30px auto}#product-form-container form h2,#product-form-container form h3,#product-form-container form h4{margin-bottom:10px;color:#333}#simple-inputs-group{display:flex;flex-direction:column;gap:20px}#product-form-container label{display:block;margin-bottom:10px;color:#444;font-weight:500}#product-form-container input[type=text],#product-form-container input[type=number],#product-form-container textarea{width:100%;padding:8px 10px;border:1px solid #ccc;border-radius:6px;margin-top:4px;font-size:14px;box-sizing:border-box}#product-form-container textarea{resize:vertical;min-height:60px}#product-form-container button[type=submit]{background-color:#000;color:#fff;padding:10px;width:100%;margin-top:10px;transition:background-color .2s ease;border-radius:10px;cursor:pointer;display:block;border:none}.add-option-btn{background-color:#2e7d32;color:#fff;padding:6px 12px;margin-top:10px;transition:background-color .2s ease;border-radius:10px;cursor:pointer;display:block;border:none}.delete-personalization-btn{background-color:#c62828;color:#fff;padding:6px 12px;margin-top:10px;transition:background-color .2s ease;border-radius:10px;cursor:pointer;display:block;border:none}#add-personalization-btn{background-color:#fff;padding:6px 12px;margin-top:10px;border:1px solid black;border-radius:10px;cursor:pointer;display:block}#option-type{border:.5px solid #ccc;border-radius:6px;padding:8px 10px;margin-left:8px}.border{border:1px solid #ddd}.rounded{border-radius:8px}.bg-gray-50{background-color:#fafafa}.mb-2{margin-bottom:8px}.mb-4{margin-bottom:16px}.mt-2{margin-top:8px}.ml-4{margin-left:16px}.p-2{padding:8px}.p-3{padding:12px}#formContainer{min-height:100vh;width:100%;margin:0;padding:0;display:flex;align-items:center;justify-content:center;background-color:#b9b9b920}#loginform{max-width:500px;min-width:400px;width:30%;margin:100px auto;border-radius:25px;box-shadow:0 4px 4px #00000040;background-color:#fff}#headerTitle{text-align:center;padding:2rem 0;margin:0;font-size:2rem}.row{display:flex;flex-direction:column;align-items:center;padding-top:2rem;max-width:100%}.row input{width:80%;border:1px black solid;font-size:1rem;padding-left:1.5rem;padding-block:1rem;box-shadow:inset 0 -3px #bbb3;border-radius:15px}.row input::-webkit-input-placeholder{opacity:1;transition:opacity .25s ease-out}.row input:hover::-webkit-input-placeholder,.row input:focus::-webkit-input-placeholder{opacity:0}.row label{align-self:start;padding-left:4.5rem;padding-bottom:.5rem;color:#000;font-size:1.3rem;font-family:open sans,sans-serif}.row button{border-radius:25px;width:80%;height:40px;font-size:1.3rem;color:#fff;font-weight:700;background:#000;border:0px;cursor:pointer;transition:opacity .25s ease-out;margin-bottom:1.5rem}