@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap");*{margin:0;padding:0;box-sizing:border-box}body{font-family:Poppins,-apple-system,BlinkMacSystemFont,sans-serif;background:#f5f5f5}body.login-page{background-image:url(/shutters-factory-1031-jpg.webp);background-size:cover;background-position:50%;background-repeat:no-repeat;background-attachment:fixed;min-height:100vh;height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;position:fixed;width:100%;top:0;left:0}body.login-page .container{width:90%;margin:0;position:relative;z-index:1}.container,body.login-page .container{max-width:400px;padding:20px;background:#000;border-radius:8px;box-shadow:0 2px 10px rgba(0,0,0,.1)}.container{margin:50px auto}h1{text-align:center;margin-bottom:30px;color:#333}.container-detail h1{text-align:left}.container-detail .stock-list td:nth-child(2){text-align:center;vertical-align:middle}.login-logo{display:block;margin:0 auto 30px;max-width:250px;height:auto}.auth-toggle{display:flex;margin-bottom:20px;border-radius:4px;overflow:hidden}.auth-toggle button{flex:1 1;padding:10px;border:none;background:#e9e9e9;cursor:pointer;transition:background .2s}.auth-toggle button.active{background:#007bff;color:#fff}.auth-form{display:flex;flex-direction:column;gap:15px}.auth-form input{padding:12px;border:1px solid #444;border-radius:4px;font-size:16px;background:#222;color:#fff;font-family:Poppins,sans-serif}.auth-form input::placeholder{color:#aaa}.auth-form button{padding:12px;background:#fd7e14;color:#fff;border:none;border-radius:4px;font-size:16px;cursor:pointer;transition:background .2s;font-family:Poppins,sans-serif;font-weight:500}.auth-form button:hover:not(:disabled){background:#e8690b}.auth-form button:disabled{background:#ccc;cursor:not-allowed}.layout{display:flex;min-height:100vh;position:fixed;width:100%;height:100vh;overflow:hidden}.sidebar{width:250px;background:#000;color:#fff;padding:20px;display:flex;flex-direction:column;transition:width .3s ease}.sidebar.collapsed{width:70px;padding:20px 10px}.sidebar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;min-height:40px}.sidebar-logo{height:40px;max-width:180px;object-fit:contain}.sidebar-icon{height:30px;width:30px;object-fit:contain}.toggle-btn{background:none;border:none;color:#fff;font-size:18px;cursor:pointer;padding:5px;border-radius:3px}.toggle-btn:hover{background:hsla(0,0%,100%,.1)}.sidebar nav{flex:1 1}.sidebar nav a{display:flex;align-items:center;padding:12px 0;color:#bdc3c7;text-decoration:none;border-bottom:1px solid #34495e;transition:color .2s;gap:10px}.sidebar nav a.active,.sidebar nav a:hover{color:#fff}.sidebar nav a .icon{font-size:18px;min-width:20px}.sidebar.collapsed nav a .text{display:none}.logout-btn{display:flex;align-items:center;gap:10px;padding:10px;background:#e74c3c;color:#fff;border:none;border-radius:4px;cursor:pointer;margin-top:20px;font-family:Poppins,sans-serif;font-weight:500}.logout-btn:hover{background:#c0392b}.sidebar.collapsed .logout-btn .text{display:none}.content{flex:1 1;padding:30px;background:#ecf0f1;overflow-y:auto;height:100vh}.content h1{margin-bottom:20px;color:#2c3e50}.stock-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.header-buttons{display:flex;gap:10px}.categories-btn{background:#3498db;color:#fff;text-decoration:none;padding:8px 16px;border-radius:4px;transition:background .2s;font-size:14px;font-family:Poppins,sans-serif;font-weight:500}.categories-btn:hover{background:#2980b9}.add-btn{background:#27ae60;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:14px;font-family:Poppins,sans-serif;font-weight:500}.add-btn:hover{background:#219a52}.stock-form{background:#fff;padding:20px;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,.1)}.stock-form,.stock-form h3{margin-bottom:20px}.stock-form form{display:grid;grid-template-columns:repeat(4,1fr);grid-gap:15px;gap:15px}.form-field{display:flex;flex-direction:column}.form-field label{margin-bottom:8px;font-weight:600;color:#2c3e50}.stock-form input,.stock-form select{padding:10px;border:1px solid #ddd;border-radius:4px}.form-buttons{grid-column:span 4;display:flex;gap:10px;margin-top:10px}.form-buttons button{padding:8px 16px;border:none;border-radius:4px;cursor:pointer;font-size:14px}.form-buttons button[type=submit]{background:#3498db;color:#fff}.form-buttons button[type=button]{background:#95a5a6;color:#fff}.stock-list{overflow-x:auto;-webkit-overflow-scrolling:touch}.stock-list table{width:100%;min-width:800px;background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 2px 4px rgba(0,0,0,.1)}.stock-list th{padding:12px}.stock-list td,.stock-list th{text-align:left;border-bottom:1px solid #eee}.stock-list td{font-size:12px}.stock-list th{background:#f8f9fa;font-weight:600;font-size:14px}.actions-cell{width:80px;text-align:center;padding:8px 4px}.action-icon-btn{background:none;border:none;font-size:16px;cursor:pointer;padding:4px;margin:0 2px;border-radius:3px;transition:background-color .2s}.action-icon-btn:hover{background-color:rgba(0,0,0,.1)}.action-icon-btn:first-child:hover{background-color:rgba(243,156,18,.2)}.action-icon-btn:last-child:hover{background-color:rgba(231,76,60,.2)}.stock-list th:first-child{text-align:center}.stock-list th:last-child{width:80px;text-align:center}.nr-cell{text-align:center!important;vertical-align:middle!important;padding:12px}.stock-list .nr-cell{text-align:center;vertical-align:middle}.stock-list tbody tr{cursor:move;transition:background-color .2s}.stock-list tbody tr:hover{background-color:#f8f9fa}.stock-list tbody tr.dragging{opacity:.5;background-color:#e3f2fd}.stock-list tbody tr[draggable=true]:active{cursor:-webkit-grabbing;cursor:grabbing}@media (max-width:768px){.content{padding:15px}.stock-header{flex-direction:column;gap:10px;align-items:stretch}.header-buttons{flex-wrap:wrap;gap:8px}.add-btn,.categories-btn{padding:6px 12px;font-size:12px}.stock-form{padding:15px}.stock-form form{grid-template-columns:1fr;gap:10px}.form-buttons{grid-column:span 1;flex-direction:column}}.containers-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));grid-gap:20px;gap:20px;margin-top:20px}.container-card{background:#fff;border-radius:8px;padding:20px;box-shadow:0 2px 4px rgba(0,0,0,.1);transition:transform .2s,box-shadow .2s}.container-card:hover{transform:translateY(-2px);box-shadow:0 4px 8px rgba(0,0,0,.15)}.container-card h3{margin-bottom:15px;color:#2c3e50;font-family:Poppins,sans-serif;font-weight:600}.container-dates p{margin-bottom:8px;font-size:14px;color:#666}.container-dates strong{color:#333;font-weight:500}.container-actions{margin-top:15px;padding-top:15px;border-top:1px solid #eee}.container-btn{background:#fd7e14;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-family:Poppins,sans-serif;font-weight:500;font-size:14px;transition:background .2s}.container-btn:hover{background:#e8690b}.container-detail{max-width:100%}.container-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:20px;padding:20px;background:#fff;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,.1)}.container-info{display:flex;gap:20px;margin-top:10px;font-size:14px;color:#666}.container-info span{background:#f8f9fa;padding:4px 8px;border-radius:4px}.quantity-input{width:80px;padding:4px 8px;border:1px solid #ddd;border-radius:3px;text-align:center;font-size:12px}.quantity-input:focus{outline:none;border-color:#fd7e14}.delete-container-btn{background:#e74c3c;color:#fff;text-decoration:none;padding:8px 16px;border-radius:4px;border:none;cursor:pointer;font-family:Poppins,sans-serif;font-weight:500;font-size:14px;transition:background .2s}.delete-container-btn:hover{background:#c0392b}@media (max-width:768px){.container-header{flex-direction:column;gap:15px}.container-info{flex-direction:column;gap:8px}}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:#fff;border-radius:8px;min-width:300px;max-width:500px;box-shadow:0 4px 20px rgba(0,0,0,.3);font-family:Poppins,sans-serif}.modal-header{padding:20px 20px 0;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #eee;margin-bottom:20px}.modal-header h3{margin:0;font-weight:600;color:#333}.modal-header.success h3{color:#27ae60}.modal-header.error h3{color:#e74c3c}.modal-header.confirm h3{color:#f39c12}.modal-close{background:none;border:none;font-size:24px;cursor:pointer;color:#999;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center}.modal-close:hover{color:#333}.modal-body{padding:0 20px 20px}.modal-body p{margin:0;line-height:1.5;color:#666}.modal-footer{padding:0 20px 20px;display:flex;gap:10px;justify-content:flex-end}.modal-btn{padding:8px 16px;border:none;border-radius:4px;cursor:pointer;font-family:Poppins,sans-serif;font-weight:500;font-size:14px;transition:background .2s}.modal-btn.ok{background:#3498db;color:#fff}.modal-btn.ok:hover{background:#2980b9}.modal-btn.confirm{background:#27ae60;color:#fff}.modal-btn.confirm:hover{background:#219a52}.modal-btn.cancel{background:#95a5a6;color:#fff}.modal-btn.cancel:hover{background:#7f8c8d}.cell-input{width:100%;padding:12px;border:1px solid #3498db;border-radius:0;font-size:14px;background:#fff;box-sizing:border-box;margin:0}.cell-input:focus{outline:none;border-color:#2980b9}.stock-list td{padding:0;vertical-align:top}.editable-cell{cursor:pointer;padding:12px;border-radius:0;transition:background-color .2s;display:block;min-height:20px;margin:0;box-sizing:border-box}.editable-cell:hover{background-color:#f8f9fa;border:1px dashed #ddd;margin:-1px}