* { box-sizing: border-box; }
body { background: #f8f9fa; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
.card { border: none; border-radius: 12px; box-shadow: 0 2px 12px rgba(0,0,0,0.08); margin-bottom: 1.5rem; }
.card-header { background: #fff; border-bottom: 1px solid #e9ecef; padding: 1rem 1.25rem; font-weight: 600; border-radius: 12px 12px 0 0 !important; }
.card-header.bg-primary { background: #0d6efd !important; color: #fff; }
.card-header.bg-info { background: #0dcaf0 !important; color: #fff; }
.table-responsive { border-radius: 8px; overflow: hidden; }
.table { margin-bottom: 0; background: #fff; }
.table thead th { background: #f8f9fa; border-bottom: 2px solid #e9ecef; font-weight: 600; white-space: nowrap; }
.table td { vertical-align: middle; }
.form-control:focus, .form-select:focus { border-color: #0d6efd; box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); }
.btn { border-radius: 8px; padding: 0.5rem 1rem; transition: all 0.2s; }
.btn-sm { padding: 0.25rem 0.75rem; }
.btn-primary { background: #0d6efd; border-color: #0d6efd; }
.btn-primary:hover { background: #0b5ed7; border-color: #0a58ca; }
.alert { border-radius: 8px; border: none; }
.pagination { margin-bottom: 0; flex-wrap: wrap; }
.page-link { border: none; padding: 0.5rem 0.75rem; color: #0d6efd; border-radius: 6px; margin: 0 2px; }
.page-link:hover { background: #e9ecef; color: #0a58ca; }
.page-item.active .page-link { background: #0d6efd; color: #fff; }
@media (max-width: 768px) {
    .container { padding-left: 12px; padding-right: 12px; }
    .card-body { padding: 1rem; }
    .table td, .table th { padding: 0.5rem; font-size: 0.875rem; }
    .btn { width: 100%; margin-bottom: 0.5rem; }
    .btn-sm { width: auto; margin-bottom: 0; }
    .d-flex.gap-2 { flex-direction: column; gap: 0.5rem !important; }
    .pagination { justify-content: center !important; }
}
@media (max-width: 576px) {
    .table { font-size: 0.8rem; }
    .table td, .table th { padding: 0.375rem; }
    .form-control, .form-select { font-size: 0.875rem; }
}
.list-group.position-absolute { position: absolute !important; width: 100%; max-height: 250px; overflow-y: auto; z-index: 1050; background: #fff; border: 1px solid #dee2e6; border-radius: 0 0 8px 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.list-group.position-absolute .list-group-item { padding: 0.5rem 0.75rem; cursor: pointer; border-left: none; border-right: none; }
.list-group.position-absolute .list-group-item:hover { background: #f8f9fa; }
.brand-wrapper { position: relative; }
#brandList { position: absolute; width: 100%; z-index: 2000; }
.stat-card .stat-icon { width: 48px; height: 48px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 1.25rem; flex-shrink: 0; }