*{margin:0;padding:0;box-sizing:border-box}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background-color:#888;border-radius:4px}::-webkit-scrollbar-thumb:hover{background-color:#555}::-webkit-scrollbar-track{background:#f0f0f0;border-radius:4px}.login-background{min-height:100vh;display:flex;justify-content:center;align-items:center;background:linear-gradient(135deg,#1b8af1,#b58ded);padding:20px;font-family:Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif}.login-container{flex:0 0 400px;background:#ffffffe6;border-radius:16px;padding:40px;box-shadow:0 8px 32px #0000001a;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.login-header{text-align:center;margin-bottom:32px}.login-header h1{color:#2c3e50;font-size:28px;font-weight:600;margin-bottom:8px}.login-header p{color:#7f8c8d;font-size:14px}.input-group{margin-bottom:24px;position:relative}.input-group label{display:block;color:#2c3e50;margin-bottom:8px;font-size:14px;font-weight:500}.input-group input{width:100%;padding:14px 16px;border:1px solid #dfe6e9;border-radius:8px;font-size:15px;transition:all .3s ease;background-color:#f8f9fa}.input-group input:focus{outline:none;border-color:#1b8af1;box-shadow:0 0 0 3px #1b8af133;background-color:#fff}.login-button{width:100%;padding:14px;background:linear-gradient(135deg,#1b8af1,#b58ded);color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease;margin-top:8px}.login-button:hover{transform:translateY(-2px);box-shadow:0 6px 12px #0000001a}.login-button:active{transform:translateY(0)}.footer-links{margin-top:24px;text-align:center;font-size:13px;color:#7f8c8d}.footer-links a{color:#1b8af1;text-decoration:none}@media (max-width: 480px){.login-container{padding:30px 20px}}.sidebar{flex:0 0 64px;max-width:64px;display:flex;flex-direction:column;background:linear-gradient(135deg,#001f3f,#004f7f);z-index:1}.top-section{padding-top:10px}.logo{height:60px;width:60px;border-radius:100%}.logo span{padding-top:50px}.middle-section{flex:1;padding-top:20px;padding-bottom:10px}.bottom-section{padding-bottom:10px}.nav-button-container{padding-bottom:10px;display:flex;flex-direction:column;width:100%;align-items:center;justify-content:center;border-radius:10px 0 0 10px;margin-bottom:5px;transition:all .2s;cursor:pointer;text-decoration:none}.nav-button-container.active,.nav-button-container:hover{background-color:#fff;cursor:default}.nav-button-image{width:70%;filter:invert(100%) sepia(95%) saturate(12%) hue-rotate(211deg) brightness(104%) contrast(100%);transition:all .2s}.nav-button-container.active>.nav-button-image{filter:brightness(0) saturate(100%) invert(74%) sepia(18%) saturate(6910%) hue-rotate(182deg) brightness(105%) contrast(96%)}.nav-button-container:hover>img{filter:brightness(0) saturate(100%) invert(74%) sepia(18%) saturate(6910%) hue-rotate(182deg) brightness(105%) contrast(96%)}.nav-button-text{font-size:10px;font-weight:700;color:#fff;transition:all .2s}.nav-button-container.active>.nav-button-text{color:#6cbbfa}.nav-button-container:hover>span{color:#6cbbfa}.header{position:absolute;display:flex;padding-top:10px;left:64px;right:0;top:0;z-index:1}.storage-list{display:flex;margin-left:auto;overflow-x:auto}.storage{flex-shrink:0;padding:7px;margin-right:10px;border-radius:10px;background-color:#001f3f;border-width:2px;border-style:solid;color:#fff;border-color:#001f3f;transition:all .2s;cursor:pointer}.storage:hover{color:#6cbbfa;border-color:#6cbbfa;background-color:#eceff3}.storage.active{color:#6cbbfa;border-color:#6cbbfa;background-color:#eceff3;cursor:default}.search-window{position:fixed;display:flex;align-items:center;justify-content:center;top:0;left:0;right:0;bottom:0;background:#000000b6;z-index:10}.search-column{position:relative;margin:20px;flex:0 1 600px;flex-direction:column;align-items:center;justify-content:center;display:flex}.close-popup-button{position:absolute;top:-30px;right:-30px;display:flex;justify-content:center;align-items:center;border-radius:100%;background-color:red;height:30px;width:30px;z-index:1;transition:all .3s ease}.close-popup-button:hover{transform:translateY(-2px);box-shadow:0 6px 12px #0000001a}.close-popup-button:active{transform:translateY(0)}.close-pupup-image{height:60%}.search-button{position:absolute;bottom:10px;right:10px;display:flex;justify-content:center;align-items:center;border-radius:100%;background-color:gold;height:60px;width:60px;z-index:1;transition:all .3s ease}.search-button.active-order{background-color:red}.search-button:hover{transform:translateY(-2px);box-shadow:0 6px 12px #0000001a}.search-button:active{transform:translateY(0)}.search-image{height:60%}.column-blank-unit,.column-unit,.column-add-unit{display:flex;flex-direction:column;justify-content:center;align-items:center;height:80px;border-radius:10px;color:#fff;background-color:#d3d3d3;box-shadow:0 4px 8px #0003;margin-bottom:10px;transition:transform .2s ease}.column-unit:hover{transform:scale(1.05);box-shadow:0 6px 12px #0003}.column-unit-image{height:40px}.column-unit-title,.column-unit-bordero,.column-unit-shipment{width:100%;text-align:center;font-weight:700;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.column-container{align-self:start;width:160px}.column-info{display:flex;flex-direction:column;padding:10px;align-items:center;border-bottom:2px solid lightgray;margin-bottom:10px}.column-name{font-size:20px;font-weight:700}.column-capacity{color:#818181}.column-units{display:flex;flex-direction:column;padding-left:15px;padding-right:15px;border-right:2px solid lightgray}.storage-container{display:inline-flex;flex-wrap:nowrap;padding:10px;transform-origin:0 0;touch-action:none}.board{flex:1;height:100vh;position:relative;overflow:hidden}.popup-button{position:fixed;bottom:10px;right:10px;display:flex;justify-content:center;align-items:center;border-radius:100%;background-color:green;height:60px;width:60px;z-index:1;transition:all .3s ease}.popup-button.active{background-color:red}.popup-button:hover{transform:translateY(-2px);box-shadow:0 6px 12px #0000001a}.popup-button:active{transform:translateY(0)}.popup-button-image{filter:invert(100%) sepia(95%) saturate(12%) hue-rotate(211deg) brightness(104%) contrast(100%);height:65%}.clean-button{position:fixed;bottom:80px;right:10px;display:flex;justify-content:center;align-items:center;border-radius:100%;background-color:#2d81ff;height:60px;width:60px;z-index:1;transition:all .3s ease}.clean-button:hover{transform:translateY(-2px);box-shadow:0 6px 12px #0000001a}.clean-button:active{transform:translateY(0)}.clean-button-image{filter:invert(100%) sepia(95%) saturate(12%) hue-rotate(211deg) brightness(104%) contrast(100%);height:65%}.search-column{position:relative;margin:20px;flex:0 1 600px;flex-direction:column;align-items:start;justify-content:start;display:flex}.search-input-group{width:100%;display:flex;line-height:28px;align-items:center;position:relative}.search-input{width:100%;height:40px;line-height:28px;padding:0 1rem 0 2.5rem;border:2px solid transparent;border-radius:8px;outline:none;background-color:#f3f3f4;color:#0d0c22;transition:.3s ease}.search-input::placeholder{color:#9e9ea7}.search-input:focus,input:hover{outline:none;border-color:#ea4c8966;background-color:#fff;box-shadow:0 0 0 4px #ea4c891a}.search-icon{position:absolute;left:1rem;fill:#9e9ea7;width:1rem;height:1rem}.items-container{margin-top:20px;width:100%;display:flex;flex-direction:column;gap:10px}.order-item{display:flex;justify-content:space-between;align-items:center;padding:12px 15px;border-radius:5px;color:#fff;transition:all .3s ease}.order-item:hover{transform:translateY(-2px);box-shadow:0 6px 12px #0000001a}.order-item:active{transform:translateY(0)}.name,.bordero,.vsa{font-size:14px;flex:1;text-align:center}.name{text-align:left;font-weight:700}.vsa{text-align:right}.create-order-container{flex:0 0 600px;align-self:center;flex-direction:column;display:flex;justify-items:center;align-items:center;row-gap:10px}.create-order-row{width:100%;flex:0 0 1;display:flex;align-items:center;gap:10px}.create-order-lable{height:100%;flex:1;padding-left:15px;text-align:left}.create-order-input{flex:5;width:100%;height:40px;line-height:28px;padding:0 1rem;padding-left:10px;border:2px solid transparent;border-radius:8px;outline:none;background-color:#f3f3f4;color:#0d0c22;transition:.3s ease}.create-order-input::placeholder{color:#9e9ea7}.create-order-input:focus,.create-order-input:hover{outline:none;border-color:#ea4c8966;background-color:#fff;box-shadow:0 0 0 4px #ea4c891a}.circle-picker{flex:5}.create-order-button{margin-top:20px;flex:1;padding:12px 24px;background:#001f3f;color:#fff;border:none;border-radius:4px;font-family:Inter,sans-serif;font-size:16px;cursor:pointer;transition:all .3s ease}.create-order-button:hover{background:#333;transform:translateY(-1px)}.create-order-button:active{transform:translateY(0)}.orders-window{display:flex;justify-content:center;align-items:start;flex:1;height:100vh;position:relative;overflow:scroll}.app{display:flex;height:100vh;font-family:Montserrat,sans-serif}