*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,sans-serif}body{background-color:#f5f5f5}.app-container{display:flex;min-height:100vh}.sidebar{width:250px;background-color:#2c3e50;color:#fff;transition:all .3s}.logo{padding:20px;font-size:20px;font-weight:700;text-align:center;border-bottom:1px solid rgba(255,255,255,.1)}.menu{list-style:none}.menu-item{padding:15px 20px;cursor:pointer;transition:background-color .3s}.menu-item:hover{background-color:#34495e}.menu-item.active{background-color:#3498db}.main-content{flex:1;display:flex;flex-direction:column}.header{padding:20px;background-color:#fff;box-shadow:0 2px 5px #0000001a;display:flex;justify-content:space-between;align-items:center}.header-actions{display:flex;align-items:center;gap:10px}.search-box{display:flex;align-items:center;gap:8px;margin-right:auto}#search-input{padding:8px 12px;border:1px solid #ddd;border-radius:4px;min-width:200px}#status-filter{padding:8px;border:1px solid #ddd;border-radius:4px}.btn-secondary{background-color:#1d9d4e;color:#fff}.btn-secondary:hover{background-color:#5a6268}.btn-link{color:#fff;background:#5a6268;border:none;cursor:pointer}.content{padding:20px;flex:1}.data-table{width:100%;border-collapse:collapse;background-color:#fff;box-shadow:0 1px 3px #0000001a}.data-table th,.data-table td{padding:12px 15px;text-align:left;border-bottom:1px solid #e0e0e0}.data-table th{background-color:#f8f9fa;font-weight:600}.data-table tr:hover{background-color:#f5f5f5}.btn{padding:8px 16px;border:none;border-radius:4px;cursor:pointer;font-size:14px;transition:background-color .3s}.btn-primary{background-color:#3498db;color:#fff}.btn-primary:hover{background-color:#2980b9}.btn-danger{background-color:#e74c3c;color:#fff}.btn-danger:hover{background-color:#c0392b}.modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:#00000080}.modal #modal-title{text-align:center;padding:20px 0}.modal-content{background-color:#fff;margin:0 auto;padding:20px;border-radius:5px;width:500px;max-width:90%}.close{float:right;font-size:24px;font-weight:700;cursor:pointer}.form-group{margin-bottom:15px}.form-group label{display:block;margin-bottom:5px;font-weight:600}.form-group input,.form-group textarea,.form-group select{width:100%;padding:8px;border:1px solid #ddd;border-radius:4px}.form-group textarea{height:100px;resize:vertical}.pagination-wrapper{display:flex;justify-content:space-between;align-items:center;margin-top:25px;font-family:Arial,sans-serif;flex-wrap:wrap;gap:15px}.pagination-info{color:#666;font-size:14px;display:flex;align-items:center;flex-wrap:wrap;gap:5px}.pagination-info strong{color:#333;font-weight:600}.pagination-controls{display:flex;align-items:center;flex-wrap:wrap;gap:5px}.page-btn{padding:6px 12px;margin:0 2px;cursor:pointer;border:1px solid #e0e0e0;background-color:#fff;color:#333;border-radius:3px;font-size:14px;min-width:32px;text-align:center;transition:all .2s}.page-btn:hover{background-color:#f5f5f5;border-color:#d0d0d0}.page-btn.active{background-color:#4285f4;color:#fff;border-color:#357ae8}.page-btn:disabled{opacity:.5;cursor:not-allowed;background-color:#f5f5f5}.page-jump{display:flex;align-items:center;margin-left:10px}.page-jump input{width:50px;padding:6px;border:1px solid #e0e0e0;border-radius:3px;text-align:center;margin:0 5px}.page-jump-btn{padding:6px 10px;background-color:#f5f5f5;border:1px solid #e0e0e0;border-radius:3px;cursor:pointer;transition:all .2s}.page-jump-btn:hover{background-color:#e0e0e0}.page-size-selector{margin-left:15px}.page-size-selector select{padding:6px;border:1px solid #e0e0e0;border-radius:3px;background-color:#fff}.ellipsis{margin:0 5px;color:#999}@media (max-width: 768px){.pagination-wrapper{flex-direction:column;align-items:stretch}.pagination-controls{justify-content:center;margin-top:10px}}@media (max-width: 768px){html{width:max-content}.app-container{flex-direction:column}.sidebar{width:100%;height:auto}.menu{display:flex;overflow-x:auto}.menu-item{white-space:nowrap}.modal-content{margin:20px auto}}