body {
    padding-top: 56px;
}

.sidebar {
    position: fixed;
    top: 56px; /* Под navbar */
    left: 0;
    width: 250px;
    height: calc(100vh - 56px);
    background-color: #f8f9fa;
    padding: 20px 0;
    overflow-y: auto;
}

.sidebar .nav-link {
    padding: 10px 20px;
    color: #495057;
}

.sidebar .nav-link:hover {
    background-color: #e9ecef;
    color: #007bff;
}

.main-content {
    margin-left: 250px;
    padding: 20px;
    min-height: calc(100vh - 56px);
}

.status-online { color: #28a745; }
.status-offline { color: #6c757d; }
.status-error { color: #dc3545; }
.status-charging { color: #ffc107; }
.status-maintenance { color: #fd7e14; }

.alert-success { background-color: #d4edda; border-color: #c3e6cb; color: #155724; }
.alert-error { background-color: #f8d7da; border-color: #f5c6cb; color: #721c24; }

th.sortable {
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
    transition: background-color 0.15s ease;
}

th.sortable:hover {
    background-color: #e9ecef;
}

th.sortable[data-sort-dir="asc"],
th.sortable[data-sort-dir="desc"] {
    background-color: #e2e6ea;
}

th.sortable .sort-icon {
    margin-left: 4px;
    font-size: 0.8em;
    opacity: 0.35;
    transition: opacity 0.15s ease, color 0.15s ease;
}

th.sortable:hover .sort-icon {
    opacity: 0.6;
}

th.sortable[data-sort-dir="asc"] .sort-icon,
th.sortable[data-sort-dir="desc"] .sort-icon {
    opacity: 1;
    color: #0d6efd;
}

th.sortable[data-sort-dir="none"] .sort-icon {
    opacity: 0.35;
    color: inherit;
}