:root{--primary-yellow: #ffd21f}.login-container{display:flex;justify-content:center;align-items:center;min-height:100vh;background-color:#1a1a1a;padding:20px}.login-card{background-color:#fff;padding:1.5rem;border-radius:15px;box-shadow:0 10px 30px #00000080;width:100%;max-width:380px;text-align:center}.login-logo{width:70px;height:auto;margin-bottom:0;object-fit:contain}.login-title{color:var(--primary-yellow);font-size:1.6rem;margin:0;font-weight:900;text-transform:uppercase;line-height:1.1}.login-subtitle{color:#333;font-size:1.1rem;margin:5px 0 20px;font-weight:600}.form-group{margin-bottom:1rem;text-align:left}.form-group label{display:block;margin-bottom:.3rem;color:#555;font-weight:600;font-size:.85rem}.form-control{width:100%;padding:.7rem;border:2px solid #eee;border-radius:8px;font-size:.95rem;transition:border-color .3s;background-color:#f9f9f9;color:#333}.form-control:focus{outline:none;border-color:var(--primary-yellow);background-color:#fff}.form-control::placeholder{color:#bbb}.login-button{width:100%;padding:.8rem;border-radius:8px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s ease;margin-top:10px;text-transform:uppercase;background-color:#444;color:var(--primary-yellow);border:2px solid var(--primary-yellow)}.login-button:hover{background-color:var(--primary-yellow);color:#1a1a1a;box-shadow:0 4px 10px #ffd21f66}.login-button:disabled{opacity:.6;cursor:not-allowed}.text-danger{color:#d32f2f;font-size:.75rem;margin-top:3px;display:block}.alert{padding:8px;margin-bottom:15px;border-radius:5px;font-size:.85rem;text-align:left}.alert-danger{color:#721c24;background-color:#f8d7da;border:1px solid #f5c6cb}:root{font-family:system-ui,-apple-system,sans-serif}body{margin:0;padding:0;background-color:#1a1a1a;color:#fff;min-height:100vh}*{box-sizing:border-box}[data-sonner-toaster]{position:fixed!important;left:50%!important;transform:translate(-50%)!important;margin:0!important;pointer-events:none!important;z-index:999999!important;width:380px!important}[data-sonner-toast]{width:100%!important;box-sizing:border-box!important;padding:18px 20px!important;border-radius:12px!important;display:flex!important;align-items:center!important;gap:14px!important;box-shadow:0 8px 20px #0000001f!important;border:1px solid #e5e7eb!important;pointer-events:auto!important}[data-sonner-toast] [data-title]{font-size:15px!important;font-weight:600!important;line-height:1.5!important}[data-sonner-toast] [data-button],[data-sonner-toast] [data-cancel]{padding:8px 16px!important;border-radius:6px!important;font-size:13px!important;font-weight:600!important;cursor:pointer!important;transition:opacity .2s;flex-shrink:0!important;height:auto!important}[data-sonner-toast] [data-button]{background-color:#ef4444!important;color:#fff!important;border:none!important}[data-sonner-toast] [data-cancel]{background-color:#f3f4f6!important;color:#374151!important;border:1px solid #d1d5db!important}@media(max-width:600px){[data-sonner-toaster]{width:90vw!important;bottom:30px!important;left:50%!important;transform:translate(-50%)!important}[data-sonner-toast]{font-size:15px!important}}.barcode-scanner-modal{z-index:99999!important}:root{--bg-color: #1a1a1a;--primary-color: #ffd21f;--accent-yellow: #ffd21f;--success-color: #ffd21f;--danger-color: #ef5350;--info-color: #ffd21f;--cancel-color: #cecbcb;--cancel-hover: #7f7f7f;--background-color: #444}.page-container{display:flex;flex-direction:column;height:100vh;height:100dvh;background-color:var(--bg-color);color:#fff}.content-scroll{flex:1;overflow-y:auto;padding:15px 15px 80px}.section-title h2{text-align:center;color:var(--primary-color);font-size:1.1rem;margin-bottom:10px;text-transform:uppercase;font-weight:800;letter-spacing:.5px}.search-bar-container{background-color:#2c2c2c;border-radius:25px;padding:8px 15px;display:flex;align-items:center;box-shadow:0 4px 6px #0000004d;margin-bottom:20px;border:1px solid #444}.search-icon{margin-right:10px;color:#ccc;font-size:1.2rem;cursor:pointer}.search-input{border:none;outline:none;width:100%;font-size:1rem;background-color:transparent;color:#fff}.list-row{padding:12px 15px;border-bottom:1px solid #444;display:flex;justify-content:space-between;align-items:center}.user-data{display:flex;flex-direction:column;gap:2px}.user-name{font-weight:700;font-size:.95rem;color:#fff}.user-subdata{display:flex;align-items:center;gap:5px;font-size:.8rem;color:#fff;flex-wrap:wrap}.divider{color:#ccc}.modal-form{display:flex;flex-direction:column;gap:12px}.modal-form label{font-size:.85rem;font-weight:700;color:#555;margin-bottom:-5px}.modal-form input,.modal-form select,.modal-form textarea{padding:10px;border:1px solid #ddd;border-radius:6px;font-size:1rem}.user-detail-info{background-color:#f9f9f9;padding:15px;border-radius:8px;font-size:.9rem}.user-detail-info p{margin:5px 0;color:#444}.modal-actions{display:flex;gap:10px;margin-top:20px}.btn-base{flex:1;padding:10px;border-radius:6px;font-weight:700;cursor:pointer;text-align:center;transition:all .2s ease;background-color:transparent;border-style:solid;border-width:1px}.btn-accept,.btn-save{@extend .btn-base;flex:1;padding:10px;border-radius:6px;font-weight:700;cursor:pointer;text-align:center;transition:all .2s ease;background-color:transparent;border-style:solid;border-width:1px;color:var(--accent-yellow);border-color:var(--accent-yellow);background-color:var(--background-color)}.btn-accept:hover,.btn-save:hover{background-color:var(--accent-yellow);color:#1a1a1a}.btn-cancel{flex:1;padding:10px;border-radius:6px;font-weight:700;cursor:pointer;text-align:center;transition:all .2s ease;background-color:transparent;border-style:solid;border-width:1px;color:var(--cancel-color);border-color:var(--cancel-color);background-color:var(--background-color)}.btn-cancel:hover{background-color:var(--cancel-hover);color:#fff}.btn-edit{flex:1;padding:10px;border-radius:6px;font-weight:700;cursor:pointer;text-align:center;transition:all .2s ease;background-color:transparent;border-style:solid;border-width:1px;color:var(--accent-yellow);border-color:var(--accent-yellow);background-color:var(--background-color)}.btn-edit:hover{background-color:var(--accent-yellow);color:#1a1a1a}.btn-delete{flex:1;padding:10px;border-radius:6px;font-weight:700;cursor:pointer;text-align:center;transition:all .2s ease;background-color:transparent;border-style:solid;border-width:1px;color:var(--danger-color);border-color:var(--danger-color);background-color:var(--background-color)}.btn-delete:hover{background-color:var(--danger-color);color:#fff}.btn-view{background-color:transparent;color:var(--accent-yellow);border:1px solid var(--accent-yellow);padding:6px 14px;border-radius:6px;font-weight:700;font-size:.85rem;cursor:pointer;width:fit-content;flex-shrink:0;transition:all .2s}.btn-view:hover{background-color:var(--accent-yellow);color:#1a1a1a;box-shadow:0 0 5px #ffd21f4d}.scanner-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#000000e6;display:flex;justify-content:center;align-items:center;z-index:100000}.scanner-modal{background-color:#fff!important;padding:20px;border-radius:12px;width:90%;max-width:500px;position:relative;display:flex;flex-direction:column;max-height:90vh;overflow-y:auto;box-shadow:0 10px 25px #00000080;z-index:100001}.scanner-title{text-align:center;margin:0 0 15px;color:#333}.scanner-wrapper{position:relative;width:100%;height:300px;background:#000;border-radius:8px;overflow:hidden;margin-bottom:10px}#reader-custom{width:100%;height:100%}#reader-custom video{width:100%!important;height:100%!important;object-fit:cover!important;border-radius:8px;display:block!important}.scanner-ui-layer{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#f5f5f5;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:10}.scanner-placeholder{color:#666;text-align:center}.scanner-placeholder span{font-size:3rem;display:block;margin-bottom:10px}.scanner-error{color:#d32f2f;background-color:#ffebee;padding:10px;border-radius:5px;margin-top:10px;text-align:center;font-size:.9rem;border:1px solid #ffcdd2}.scanner-actions{margin-top:15px;display:flex;flex-direction:column;gap:10px}.scanner-btn{padding:12px;border-radius:8px;border:none;font-size:1rem;font-weight:700;cursor:pointer;width:100%;display:flex;align-items:center;justify-content:center;gap:8px;transition:background-color .2s,transform .1s}.scanner-btn:active{transform:scale(.98)}.scanner-btn.start{background-color:#4caf50;color:#fff}.scanner-btn.stop{background-color:#fa8b83;color:#fff}.scanner-btn.close{background-color:#e0e0e0;color:#333}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;display:flex;justify-content:center;align-items:center;z-index:2000;padding:20px}.modal-content{background-color:#fff;padding:35px 25px 25px;border-radius:12px;width:100%;max-width:400px;position:relative;box-shadow:0 10px 25px #0000004d;animation:fadeIn .3s;max-height:85vh;overflow-y:auto}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.modal-close-x{position:absolute;top:10px;right:10px;width:30px;height:30px;background-color:#f0f0f0;border-radius:50%;border:none;font-size:1.2rem;color:#555;cursor:pointer;display:flex;justify-content:center;align-items:center;z-index:10}.modal-close-x:hover{background-color:#e0e0e0;color:#000}.dashboard-container{display:flex;flex-direction:column;min-height:100vh;background-color:#1a1a1a;color:#fff}.dashboard-hero{padding:20px 20px 0;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%}.dashboard-title{color:#ffd21f;margin:0 0 20px;font-size:2rem;font-weight:800;text-transform:uppercase;letter-spacing:-.5px;text-align:center}.hero-search-container{width:100%;max-width:600px}.user-info{display:flex;align-items:center;gap:10px}.dashboard-content{flex:1;overflow-y:auto;padding:0 20px 80px;display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:min-content}.menu-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;width:100%;max-width:500px}.dashboard-icon-img{width:60px;height:60px;object-fit:contain;margin-bottom:15px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.menu-card{background-color:#2c2c2c;color:#ffd21f;border-radius:15px;aspect-ratio:1 / 1;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;transition:transform .2s,background-color .2s;box-shadow:0 4px 10px #0000004d;border:1px solid #3a3a3a}.menu-card:hover{transform:translateY(-5px);background-color:#383838;box-shadow:0 8px 20px #0009}.card-icon{display:flex;justify-content:center;align-items:center}.card-title{font-size:1rem;font-weight:700;text-align:center;line-height:1.2;color:#ffd21f}.flip-container{background-color:transparent;perspective:1000px;border-radius:15px;cursor:pointer}.flip-inner{position:relative;width:100%;height:100%;text-align:center;transition:transform .6s;transform-style:preserve-3d;border-radius:15px;box-shadow:0 4px 10px #0000004d}.flip-container.flipped .flip-inner{transform:rotateY(180deg)}.flip-front,.flip-back{position:absolute;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:15px;display:flex;flex-direction:column;justify-content:center;align-items:center}.flip-front{background-color:#2c2c2c;color:#ffd21f;border:1px solid #3a3a3a}.flip-back{background-color:#333;color:#ffd21f;transform:rotateY(180deg);padding:10px;border:1px solid #fef131}.profile-info h3{margin:0;font-size:1rem;color:#ffd21f}.profile-info p{margin:5px 0 0;font-size:.8rem;word-break:break-all}.btn-guide{background-color:#2c2c2c;color:#ffd21f;border:1px solid #ffd21f;padding:12px 20px;border-radius:12px;font-weight:700;font-size:.95rem;cursor:pointer;margin-top:20px;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:10px;width:100%;max-width:300px}.btn-guide:hover{background-color:#ffd21f;color:#1a1a1a;border-style:solid}.carousel-container{display:flex;flex-direction:column;align-items:center;gap:15px;width:100%}.carousel-title{color:#1a1a1a;margin:0;font-size:1.2rem;text-align:center}.carousel-image-wrapper{width:100%;min-height:250px;display:flex;justify-content:center;align-items:center;background-color:#f9f9f9;border-radius:8px;overflow:hidden;border:1px solid #eee}.carousel-image{max-width:100%;max-height:50vh;object-fit:contain}.carousel-controls{display:flex;justify-content:space-between;align-items:center;width:100%;margin-top:5px}.btn-carousel{background-color:#444;color:#fff;border:none;padding:8px 15px;border-radius:6px;cursor:pointer;font-weight:700;font-size:.85rem;transition:background-color .2s}.btn-carousel:hover:not(:disabled){background-color:#ffd21f;color:#1a1a1a}.btn-carousel:disabled{opacity:.3;cursor:not-allowed}.carousel-dots{display:flex;gap:6px}.dot{width:10px;height:10px;border-radius:50%;background-color:#ddd;transition:background-color .2s}.dot.active{background-color:#ffd21f}@media(min-width:768px){.modal-content:has(.carousel-container){max-width:500px!important;width:90%!important;padding:15px!important;max-height:130vh!important}.carousel-image-wrapper{min-height:auto;background-color:transparent;border:none}.carousel-image{max-height:82vh;width:100%;object-fit:contain}}.custom-table-container{background-color:#2c2c2c;border-radius:10px;border:1px solid #444;overflow:hidden;box-shadow:0 4px 6px #0000004d}.table-header{background-color:#2c2c2c;padding:12px 15px;display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid #444;font-weight:700;color:#fff;font-size:1.1rem}.btn-table-add{background-color:transparent;color:#ffd21f;border:1px solid #ffd21f;padding:8px 15px;border-radius:6px;font-weight:700;cursor:pointer;font-size:.9rem;width:fit-content;min-width:auto;flex-shrink:0;transition:all .2s ease}.btn-table-add:hover{background-color:#ffd21f;color:#1a1a1a;box-shadow:0 0 8px #ffd21f66}.table-body{display:flex;flex-direction:column}.table-row{padding:12px 15px;border-bottom:1px solid #444;display:flex;justify-content:space-between;align-items:center}.table-row:last-child{border-bottom:none}.table-message{text-align:center;padding:30px;color:#fff;font-style:italic}.ubi-data-row{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:15px;flex:1;margin-right:15px}.text-info{display:flex;flex-direction:column;gap:2px;text-align:left}.table-thumb{width:70px;height:70px;border-radius:6px;object-fit:cover;border:1px solid #ccc;background-color:#f0f0f0;cursor:zoom-in;transition:transform .2s;box-shadow:0 2px 4px #0000001a}.table-thumb:hover{transform:scale(1.1)}.autocomplete-container{position:relative;width:100%}.autocomplete-container input{width:100%}.suggestions-list{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #ddd;border-top:none;border-radius:0 0 6px 6px;max-height:200px;overflow-y:auto;z-index:10;box-shadow:0 4px 6px #0000001a}.suggestion-item{padding:10px;cursor:pointer;border-bottom:1px solid #eee;font-size:.9rem;color:#1c1c1c}.suggestion-item:hover{background-color:#f5f5f5}.selected-product-badge{background-color:#e3f2fd;color:#1565c0;padding:8px;border-radius:6px;font-size:.9rem;display:flex;justify-content:space-between;align-items:center;border:1px solid #90caf9}.remove-product{cursor:pointer;font-weight:700;padding:0 5px}.image-preview{width:100%;height:150px;object-fit:contain;border:2px dashed #ccc;border-radius:8px;margin-bottom:10px;background-color:#f9f9f9}.detail-image{width:100%;height:200px;object-fit:cover;border-radius:8px;margin-bottom:15px;border:1px solid #ddd;cursor:zoom-in}.lightbox-image{width:100%;height:auto;max-height:80vh;object-fit:contain;border-radius:8px}