body{background-color:#f0f0f0;padding:0}.order-list-component{width:100%;max-width:1200px;min-height:100vh;margin:0 auto}.order-record-header{background:#fff;padding:15px 0;margin-bottom:20px;border-bottom:1px solid #eee;width:100%;position:sticky;top:0;z-index:10}.order-container{width:100%;margin:0 auto;padding-bottom:20px}.header-inner{padding:0 15px}.filter-container{display:flex;align-items:center;flex-wrap:wrap;gap:15px}.filter-title{font-weight:700;color:#333;font-size:16px;margin-right:10px}.filter-item{display:flex;align-items:center;gap:8px}.filter-label{font-size:14px;white-space:nowrap}.date-range-filter,.date-range-wrapper{position:relative}.date-range-trigger{padding:8px 12px;border:1px solid #ddd;font-size:14px;background-color:#fff;outline:none;transition:border-color .2s;min-width:120px;text-align:left;cursor:pointer;display:flex;justify-content:space-between;align-items:center}.date-range-trigger:hover{border-color:#007bff}.date-range-trigger.active{border-color:#007bff;box-shadow:0 0 0 2px rgba(0,123,255,.1)}.calendar-icon{font-size:16px}.custom-date-picker{position:absolute;top:100%;left:0;width:300px;background:#fff;border:1px solid #ddd;box-shadow:0 4px 12px rgba(0,0,0,.15);z-index:100;margin-top:5px;padding:15px}.calendar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;padding-bottom:10px;border-bottom:1px solid #eee}.calendar-header span{font-weight:700;color:#333}.close-calendar{background:none;border:none;font-size:20px;cursor:pointer}.close-calendar:hover{color:#333}.calendar-grid{display:grid;gap:20px}.calendar-section{display:flex;flex-direction:column}.calendar-month{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.calendar-month button{background:#f5f5f5;border:1px solid #ddd;padding:5px 10px;cursor:pointer}.calendar-month span{font-weight:700}.calendar-weekdays{text-align:center;margin-bottom:10px;font-weight:700}.calendar-days,.calendar-weekdays{display:grid;grid-template-columns:repeat(7,1fr)}.calendar-days{gap:5px}.day{display:flex;align-items:center;justify-content:center;height:40px;cursor:pointer;transition:all .2s}.day:hover:not(.empty){background-color:#f0f0f0}.day.empty{cursor:default}.day.selected{background-color:#007bff;color:#fff}.day.today{border:1px solid #007bff}.day.in-range{background-color:#e3f2fd}.day.start-date{border-top-right-radius:0;border-bottom-right-radius:0}.day.end-date,.day.start-date{background-color:#007bff;color:#fff}.day.end-date{border-top-left-radius:0;border-bottom-left-radius:0}.date-inputs{gap:15px}.date-input-group,.date-inputs{display:flex;flex-direction:column}.date-input-group{gap:8px}.date-input-group label{font-weight:700;color:#333}.date-input{padding:8px 12px;border:1px solid #ddd;font-size:14px}.date-display{font-size:12px}.date-actions{display:flex;gap:10px;margin-top:10px;margin-left:50px}.apply-btn,.reset-btn{padding:8px 15px;border:none;cursor:pointer;font-weight:500}.apply-btn{background-color:#007bff;color:#fff}.apply-btn:hover{background-color:#0069d9}.reset-btn{background-color:#f5f5f5;color:#333;border:1px solid #ddd}.reset-btn:hover{background-color:#e9e9e9}.filter-select{padding:8px 12px;border:1px solid #ddd;font-size:14px;background-color:#fff;outline:none;transition:border-color .2s;min-width:120px}.filter-select:focus{border-color:#007bff}.order-order-search-box{margin-left:auto;display:flex}.order-order-search-box input{padding:8px 12px;border:1px solid #000;font-size:14px;width:170px;outline:none;transition:border-color .2s}.order-order-search-box input:focus{border-color:#007bff}.user-groups-container{display:flex;gap:20px;min-height:600px}.user-sidebar{width:280px;background:#fff;border:1px solid #ddd;overflow:hidden;flex-shrink:0}.user-sidebar-header{padding:15px;border-bottom:1px solid #eee;background:#f8f9fa}.user-sidebar-header h3{margin:0 0 5px 0;color:#333;font-size:16px}.user-count{font-size:12px}.user-list{max-height:600px;overflow-y:auto}.user-item{padding:12px 15px;border-bottom:1px solid #f0f0f0;cursor:pointer;transition:all .2s}.user-item:hover{background-color:#f5f5f5}.user-item.active{background-color:#e3f2fd;border-left:3px solid #00f}.user-info{gap:12px}.user-avatar,.user-info{display:flex;align-items:center}.user-avatar{width:40px;height:40px;justify-content:center;font-weight:700;font-size:16px;flex-shrink:0}.user-avatar.large{width:60px;height:60px;font-size:20px}.user-details{flex:1;min-width:0}.user-name{display:block;font-weight:500;color:#333;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-order-count{font-size:12px}.user-orders-content{flex:1;min-width:0}.current-user-header{background:#fff;padding:20px;border:1px solid #ddd;margin-bottom:20px;display:flex;align-items:center;gap:20px}.user-info-main{flex:1}.user-info-main .user-name{font-size:24px;margin-bottom:10px;color:#333}.user-stats{display:flex;flex-wrap:wrap;gap:20px}.stat-item{display:flex;flex-direction:column;gap:4px}.stat-label{font-size:12px}.stat-value{font-size:16px;font-weight:500;color:#333}.user-orders-list{display:flex;flex-direction:column;gap:20px}.order-item{border:1px solid #ddd;background:#fff;overflow:hidden;transition:transform .2s,box-shadow .2s}.order-item:hover{box-shadow:0 4px 12px rgba(0,0,0,.08);transform:translateY(-2px)}.order-info{padding:12px 15px;border-bottom:1px solid #ddd;font-size:14px;background:#fafafa;display:flex;flex-wrap:wrap;gap:15px;align-items:center}.order-info span{margin-right:20px}.record-order-number{font-weight:500}.order-status{padding:7px 10px;font-size:12px;margin-left:auto;font-weight:500;background-color:#000;color:#fff}.order-status:hover{cursor:pointer}.shipping-address,.tracking-number{font-size:14px}.tracking-number{margin-right:20px}.product-table-container{overflow-x:auto;-webkit-overflow-scrolling:touch}.product-table{width:100%;border-collapse:collapse;min-width:600px}.product-table tr{border-bottom:1px solid #eee}.product-table tr:last-child{border-bottom:none}.product-table td,.product-table th{padding:12px 15px;font-size:14px;vertical-align:middle}.product-table th{font-weight:400;color:#999;white-space:nowrap}.img-col{width:100px;text-align:center}.name-col{width:auto;max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.num-col,.price-col,.subtotal-col{width:100px;text-align:right}.product-img{width:80px;height:80px;-o-object-fit:cover;object-fit:cover;border:1px solid #eee;display:block;margin:0 auto}.order-summary{padding:12px 15px;text-align:right;font-size:14px;border-top:1px solid #eee}.order-summary span{margin-left:20px}.total-price{font-weight:700}.order-actions{padding:10px 15px;text-align:right;border-top:1px solid #eee;background-color:#f9f9f9}.record-action-btn{padding:8px 20px;border:none;font-size:14px;cursor:pointer;transition:all .2s;font-weight:500}.pay-btn{background-color:#007bff;color:#fff}.pay-btn:hover{background-color:#0069d9;transform:translateY(-1px)}.track-btn{background-color:#6c757d;color:#fff}.track-btn:hover{background-color:#5a6268;transform:translateY(-1px)}.loading-state{text-align:center;padding:60px 20px;background-color:#fff;margin:20px 0;display:flex;flex-direction:column;align-items:center;justify-content:center}.loading-spinner{width:40px;height:40px;border:3px solid #f3f3f3;border-top:3px solid #007bff;animation:spin 1s linear infinite;margin-bottom:15px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.empty-state{text-align:center;padding:80px 20px;background-color:#fff;margin:20px 0;display:flex;flex-direction:column;align-items:center;justify-content:center}.empty-icon{font-size:60px;margin-bottom:20px;opacity:.6}.empty-state p{font-size:16px;margin:0}.no-user-selected{text-align:center;padding:100px 20px;background-color:#fff;margin:20px 0;display:flex;flex-direction:column;align-items:center;justify-content:center}.sidebar-header-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px}.export-btn{width:60%;background-color:#000;color:#fff;border:none;padding:8px 16px;font-size:14px;cursor:pointer;transition:all .2s;font-weight:500;white-space:nowrap;text-align:center;margin-left:15%;margin-top:20px}.export-btn:hover{background-color:#333;transform:translateY(-1px);box-shadow:0 2px 4px rgba(0,0,0,.1)}.export-btn:active{transform:translateY(0);box-shadow:none}.order-actions-container{padding:10px 15px;text-align:center;border-top:1px solid #eee;background-color:#f9f9f9;display:flex;justify-content:center;gap:10px}.cancel-btn{background-color:#fff;color:#000;border:1px solid #000}.cancel-btn:hover{background-color:#f0f0f0}.ship-btn{background-color:#000;color:#fff;border:1px solid #000}.ship-btn:hover{background-color:#333}.confirm-btn{background-color:#000;color:#fff;border:1px solid #000}.confirm-btn:hover{background-color:#333}@media (max-width:768px){.order-actions-container{flex-direction:column;gap:8px}.record-action-btn{width:100%}.shipping-address,.tracking-number{display:block;margin-right:0;margin-bottom:5px;width:100%}}@media (max-width:1024px){.user-groups-container{flex-direction:column}.user-sidebar{width:100%;margin-bottom:20px}.order-container,.order-record-header{width:95%}}@media (max-width:768px){.header-inner{padding:0 10px}.filter-container{flex-direction:column;align-items:stretch;gap:10px}.filter-item{flex-direction:column;align-items:flex-start;gap:5px}.date-range-trigger,.date-range-wrapper{width:100%}.custom-date-picker{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;max-width:400px;z-index:1000}.calendar-grid{grid-template-columns:1fr}.filter-select{width:100%}.order-order-search-box{margin-left:0;width:100%}.order-order-search-box input{width:100%}.order-container,.order-record-header{width:95%}.current-user-header{flex-direction:column;text-align:center;gap:15px}.user-stats{justify-content:center}.order-info{flex-direction:column;gap:8px;align-items:flex-start}.order-info span{margin-right:0;display:block;width:100%}.order-status{margin-left:0;align-self:flex-start}.product-table td,.product-table th{padding:10px 8px;font-size:13px}.img-col{width:70px}.num-col,.price-col,.subtotal-col{width:80px}.product-img{width:60px;height:60px}.order-summary{text-align:left}.order-summary span{display:block;margin:5px 0}.order-summary span:last-child{margin-top:10px;font-size:16px}.order-actions{text-align:center}.record-action-btn{width:100%;padding:10px}.sidebar-header-top{flex-direction:column;gap:10px}.export-btn{width:100%}}@media (max-width:480px){.order-container,.order-record-header{width:100%;padding-left:10px;padding-right:10px}.header-inner{padding:0}.order-item{margin-bottom:15px}.product-table td,.product-table th{padding:8px 6px;font-size:12px}.img-col{width:60px}.num-col,.price-col,.subtotal-col{width:70px}.product-img{width:50px;height:50px}}