/* Modern Styling Overrides */
body {
    background-color: #f4f6f9; /* สีพื้นหลังแบบ Soft Gray */
    font-family: Prompt, 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.main-card {
    border: none;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    overflow: hidden;
}

.card-header {
    background-color: #fff;
    border-bottom: 1px solid #eee;
    padding: 20px 25px;
}

.table thead th {
    border-top: none;
    border-bottom: 2px solid #e9ecef;
    font-weight: 600;
    color: #495057;
    text-transform: uppercase;
    font-size: 0.85rem;
}

.table tbody td {
    vertical-align: middle;
    color: #555;
    font-size: 0.95rem;
    padding: 12px 10px;
}

/* Status Badges */
.status-badge {
    padding: 5px 12px;
    border-radius: 50px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.status-online {
    background-color: #d1e7dd;
    color: #0f5132;
}

.status-offline {
    background-color: #f8d7da;
    color: #842029;
}

.status-maintenance {
    background-color: #fff3cd;
    color: #664d03;
}

.status-busy {
    background-color: #cff4fc;
    color: #055160;
}

/* Custom DataTables Pagination */
.page-item.active .page-link {
    background-color: #435ebe;
    border-color: #435ebe;
}

.bg-sidebar {
    background-color: #23303c !important;
}

.sidebar-menu .nav-header {
    padding: 0.9rem 0.75rem;
    font-size: 0.7rem;
    font-weight: 500;
}

.sidebar-menu .nav-item > .nav-link {
    margin-bottom: 0.2rem;
    font-size: 0.9rem;
    font-weight: 400;
}