/* ==========================================================
   Enterprise Integration System (EIS)
   Custom Styles
   ========================================================== */

/* Google Font */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

/* Design tokens — shared with admin.php's admin-* classes, which read these
   custom properties instead of hardcoded values. */
:root{
    --border-color:#e2e8f0;
    --bg-card:#ffffff;
    --bg-main:#f1f5f9;
    --text-primary:#1e293b;
    --text-muted:#64748b;
    --radius:16px;
    --radius-sm:10px;
    --shadow-sm:0 2px 10px rgba(0,0,0,.05);
    --shadow-md:0 5px 20px rgba(0,0,0,.05);
    --transition:.2s ease;
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    font-family:'Inter',sans-serif;
    background:#f1f5f9;
    color:#1e293b;
}

/* Scrollbar */

::-webkit-scrollbar{
    width:8px;
}

::-webkit-scrollbar-track{
    background:#e2e8f0;
}

::-webkit-scrollbar-thumb{
    background:#2563eb;
    border-radius:10px;
}

::-webkit-scrollbar-thumb:hover{
    background:#1d4ed8;
}

/* Sidebar */

.sidebar{
    width:260px;
    min-height:100vh;
    background:#0f172a;
    color:#fff;
    position:fixed;
    left:0;
    top:0;
    transition:.3s;
    overflow-y:auto;
    z-index:999;
}

.sidebar-logo{
    padding:22px 20px;
    display:flex;
    align-items:center;
    gap:10px;
    font-size:20px;
    font-weight:700;
    border-bottom:1px solid rgba(255,255,255,.08);
}

.sidebar-logo i{
    font-size:22px;
    flex-shrink:0;
}

.sidebar-logo .logo-text{
    flex:1;
    white-space:nowrap;
    overflow:hidden;
}

.sidebar-collapse-btn{
    background:rgba(255,255,255,.08);
    border:none;
    color:#cbd5e1;
    width:28px;
    height:28px;
    border-radius:8px;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    transition:.2s;
}

.sidebar-collapse-btn:hover{
    background:rgba(255,255,255,.16);
    color:#fff;
}

@media(max-width:1024px){
    .sidebar-collapse-btn{
        display:none;
    }
}

.sidebar ul{
    list-style:none;
}

.sidebar li{
    margin:5px 0;
}

.sidebar a{
    display:flex;
    align-items:center;
    gap:14px;
    color:#cbd5e1;
    text-decoration:none;
    padding:15px 25px;
    transition:.25s;
    font-size:15px;
}

.sidebar a:hover{
    background:#1e40af;
    color:white;
}

.sidebar a.active{
    background:#2563eb;
    color:#fff;
}

.nav-label{
    flex:1;
    white-space:nowrap;
    overflow:hidden;
}

/* Collapsed sidebar (desktop icon rail) */

.sidebar.collapsed{
    width:76px;
}

.sidebar.collapsed .logo-text,
.sidebar.collapsed .nav-label{
    display:none;
}

.sidebar.collapsed .nav-badge{
    position:absolute;
    top:8px;
    right:8px;
}

.sidebar.collapsed li{
    position:relative;
}

.sidebar.collapsed .sidebar-logo{
    justify-content:center;
}

.sidebar.collapsed .sidebar-collapse-btn i{
    transform:rotate(180deg);
}

.sidebar.collapsed a{
    justify-content:center;
    padding:15px 10px;
}

.sidebar.collapsed + .main-content{
    margin-left:76px;
}

@media(max-width:1024px){
    .sidebar.collapsed{
        width:260px;
    }

    .sidebar.collapsed .logo-text,
    .sidebar.collapsed .nav-label{
        display:block;
    }

    .sidebar.collapsed a{
        justify-content:flex-start;
        padding:15px 25px;
    }
}

/* Main Content */

.main-content{
    margin-left:260px;
    min-height:100vh;
    transition:.3s;
}

/* Top Navbar */

.navbar{
    height:75px;
    background:white;
    box-shadow:0 2px 10px rgba(0,0,0,.05);
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:0 35px;
}

.navbar-title{
    font-size:24px;
    font-weight:700;
}

.user-profile{
    display:flex;
    align-items:center;
    gap:15px;
}

.avatar{
    width:45px;
    height:45px;
    border-radius:50%;
    background:#2563eb;
    color:white;
    display:flex;
    justify-content:center;
    align-items:center;
    font-weight:bold;
}

/* Navbar search */

.navbar-search{
    display:flex;
    align-items:center;
    gap:10px;
    background:#f1f5f9;
    border-radius:10px;
    padding:8px 14px;
    flex:1;
    max-width:340px;
    color:#94a3b8;
}

.navbar-search input{
    border:none;
    background:none;
    outline:none;
    font-size:14px;
    flex:1;
    min-width:0;
    color:#1e293b;
    font-family:inherit;
}

.navbar-search input::placeholder{
    color:#94a3b8;
}

.navbar-search kbd{
    background:white;
    border:1px solid #e2e8f0;
    border-radius:6px;
    padding:2px 6px;
    font-size:11px;
    color:#94a3b8;
    font-family:inherit;
    flex-shrink:0;
}

.navbar-actions{
    display:flex;
    align-items:center;
    gap:18px;
}

/* Icon button + dropdown (notifications) */

.icon-btn{
    position:relative;
    width:40px;
    height:40px;
    border-radius:10px;
    border:1px solid #e2e8f0;
    background:white;
    color:#475569;
    font-size:16px;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:.2s;
}

.icon-btn:hover{
    background:#f1f5f9;
}

.icon-btn-dot{
    position:absolute;
    top:7px;
    right:7px;
    width:8px;
    height:8px;
    border-radius:50%;
    background:#dc2626;
    border:2px solid white;
}

.dropdown-wrapper{
    position:relative;
}

.dropdown-menu{
    position:absolute;
    top:calc(100% + 10px);
    right:0;
    width:320px;
    background:white;
    border-radius:14px;
    box-shadow:0 15px 40px rgba(0,0,0,.15);
    border:1px solid #e2e8f0;
    z-index:1000;
    overflow:hidden;
}

@media(max-width:1024px){
    /* The bell isn't the last element in the navbar (avatar comes after it),
       so anchoring the menu to its own wrapper can push it off the left
       edge on narrow screens. Anchor to the viewport instead. */
    .dropdown-menu{
        position:fixed;
        top:80px;
        left:16px;
        right:16px;
        width:auto;
        max-width:360px;
        margin-left:auto;
    }
}

.dropdown-menu[hidden]{
    display:none;
}

.dropdown-menu-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:14px 18px;
    border-bottom:1px solid #e5e7eb;
    font-weight:600;
    font-size:14px;
}

.dropdown-menu-header a{
    font-size:12px;
    font-weight:600;
    color:#2563eb;
    text-decoration:none;
}

.dropdown-item{
    padding:12px 18px;
    border-bottom:1px solid #f1f5f9;
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:8px;
}

.notif-read-btn{
    background:none;
    border:1px solid #e2e8f0;
    color:#64748b;
    width:24px;
    height:24px;
    border-radius:7px;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:11px;
    flex-shrink:0;
    transition:.2s;
}

.notif-read-btn:hover{
    background:#f1f5f9;
    color:#1e293b;
}

.dropdown-item:last-child{
    border-bottom:none;
}

.dropdown-item.unread{
    background:#eff6ff;
}

.dropdown-item-title{
    font-size:13px;
    font-weight:600;
    color:#1e293b;
}

.dropdown-item-meta{
    font-size:11px;
    color:#94a3b8;
    margin-top:2px;
}

.dropdown-empty{
    padding:24px;
    text-align:center;
    color:#94a3b8;
    font-size:13px;
}

/* Stat cards with icon chips */

.stat-card{
    display:flex;
    align-items:center;
    gap:16px;
}

.stat-icon{
    width:52px;
    height:52px;
    border-radius:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:20px;
    flex-shrink:0;
}

.stat-body .card-title{
    margin-top:2px;
}

/* Charts */

.chart-card{
    background:white;
    border-radius:16px;
    padding:25px;
    box-shadow:0 5px 20px rgba(0,0,0,.05);
}

/* Quick actions */

.quick-actions-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    gap:16px;
}

.quick-action-card{
    display:flex;
    align-items:center;
    gap:14px;
    background:white;
    border-radius:14px;
    padding:18px;
    box-shadow:0 5px 20px rgba(0,0,0,.05);
    text-decoration:none;
    color:inherit;
    transition:.2s;
}

.quick-action-card:hover{
    transform:translateY(-2px);
    box-shadow:0 10px 30px rgba(0,0,0,.1);
}

.quick-action-icon{
    width:44px;
    height:44px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:18px;
    flex-shrink:0;
}

.quick-action-info{
    flex:1;
    min-width:0;
}

.quick-action-info h4{
    font-size:14px;
    margin-bottom:2px;
    color:#1e293b;
}

.quick-action-info p{
    font-size:12px;
    color:#64748b;
}

.quick-action-arrow{
    color:#cbd5e1;
    font-size:13px;
    flex-shrink:0;
}

/* Activity icon chips */

.activity-icon-chip{
    width:34px;
    height:34px;
    border-radius:10px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:13px;
    flex-shrink:0;
}

.activity-icon-chip.success{ background:#dcfce7; color:#15803d; }
.activity-icon-chip.danger{ background:#fee2e2; color:#b91c1c; }
.activity-icon-chip.warning{ background:#fef3c7; color:#b45309; }
.activity-icon-chip.primary{ background:#e0e7ff; color:#4338ca; }
.activity-icon-chip.muted{ background:#f1f5f9; color:#64748b; }

/* Dashboard footer */

.dashboard-footer{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:24px 4px 4px;
    color:#94a3b8;
    font-size:13px;
}

@media(max-width:768px){
    .navbar-search{
        display:none;
    }
}

/* Dashboard */

.dashboard{
    padding:30px;
}

.stat-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:20px;
    margin-bottom:30px;
}

.dual-panel{
    display:grid;
    grid-template-columns:1.4fr 1fr;
    gap:20px;
}

@media(max-width:900px){
    .dual-panel{
        grid-template-columns:1fr;
    }
}

.sidebar-toggle{
    display:none;
    align-items:center;
    justify-content:center;
    width:42px;
    height:42px;
    background:none;
    border:none;
    border-radius:8px;
    font-size:20px;
    color:#1e293b;
    cursor:pointer;
    flex-shrink:0;
    transition:.2s;
}

.sidebar-toggle:hover,
.sidebar-toggle:active{
    background:#f1f5f9;
}

@media(max-width:1024px){
    .sidebar-toggle{
        display:inline-flex;
    }
}

.nav-badge{
    margin-left:auto;
    background:#dc2626;
    color:#fff;
    font-size:11px;
    font-weight:700;
    padding:1px 7px;
    border-radius:999px;
}

.status-pill{
    display:inline-flex;
    align-items:center;
    font-size:12px;
    font-weight:600;
    padding:4px 11px;
    border-radius:999px;
    text-transform:capitalize;
}

.status-active{ background:#dcfce7; color:#15803d; }
.status-inactive{ background:#e2e8f0; color:#475569; }
.status-error{ background:#fee2e2; color:#b91c1c; }
.status-maintenance{ background:#fef3c7; color:#b45309; }

.activity-item{
    padding:14px 0;
    border-bottom:1px solid #e5e7eb;
}

.activity-item:last-child{
    border-bottom:none;
}

.activity-action{
    font-weight:600;
    text-transform:capitalize;
}

.activity-meta{
    font-size:12px;
    color:#94a3b8;
    margin-top:2px;
}

.section-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:20px;
}

.section-header h3{
    font-size:18px;
}

.empty-state{
    text-align:center;
    padding:40px 20px;
    color:#94a3b8;
}

.empty-state i{
    font-size:32px;
    margin-bottom:12px;
    display:block;
}

/* Cards */

.card{
    background:white;
    border-radius:16px;
    padding:25px;
    box-shadow:0 5px 20px rgba(0,0,0,.05);
    transition:.3s;
}

.card:hover{
    transform:translateY(-4px);
    box-shadow:0 15px 35px rgba(0,0,0,.12);
}

.card-title{
    color:#64748b;
    font-size:14px;
}

.card-value{
    margin-top:10px;
    font-size:34px;
    font-weight:700;
}

.card-footer{
    margin-top:15px;
    font-size:13px;
}

/* Status Colors */

.success{
    color:#16a34a;
}

.warning{
    color:#f59e0b;
}

.danger{
    color:#dc2626;
}

.primary{
    color:#2563eb;
}

/* Tables */

.table-container{
    overflow-x:auto;
    background:white;
    border-radius:15px;
    box-shadow:0 5px 20px rgba(0,0,0,.05);
}

table{
    width:100%;
    border-collapse:collapse;
}

thead{
    background:#2563eb;
    color:white;
}

th{
    padding:18px;
    text-align:left;
    font-weight:600;
}

td{
    padding:18px;
    border-bottom:1px solid #e5e7eb;
}

tbody tr:hover{
    background:#f8fafc;
}

/* Buttons */

.btn{
    padding:10px 18px;
    border:none;
    border-radius:8px;
    cursor:pointer;
    transition:.25s;
    font-weight:600;
}

.btn-primary{
    background:#2563eb;
    color:white;
}

.btn-primary:hover{
    background:#1d4ed8;
}

.btn-success{
    background:#16a34a;
    color:white;
}

.btn-success:hover{
    background:#15803d;
}

.btn-danger{
    background:#dc2626;
    color:white;
}

.btn-danger:hover{
    background:#b91c1c;
}

/* Forms */

.form-group{
    margin-bottom:20px;
}

.form-control{
    width:100%;
    padding:12px 15px;
    border:1px solid #cbd5e1;
    border-radius:10px;
    outline:none;
    transition:.25s;
}

.form-control:focus{
    border-color:#2563eb;
    box-shadow:0 0 0 3px rgba(37,99,235,.15);
}

/* Login Page */

.login-background{
    min-height:100vh;
    background:linear-gradient(135deg,#0f172a,#1d4ed8,#2563eb);
}

.login-card{
    background:white;
    border-radius:20px;
    overflow:hidden;
    box-shadow:0 20px 60px rgba(0,0,0,.2);
}

.login-left{
    background:#2563eb;
    color:white;
}

.login-button{
    width:100%;
    padding:14px;
    border:none;
    border-radius:10px;
    background:#2563eb;
    color:white;
    font-weight:700;
    transition:.25s;
}

.login-button:hover{
    background:#1d4ed8;
}

/* Charts */

.chart-card{
    background:white;
    border-radius:16px;
    padding:25px;
    box-shadow:0 5px 20px rgba(0,0,0,.05);
}

/* Alerts */

.alert-success{
    background:#dcfce7;
    color:#15803d;
    padding:15px;
    border-radius:10px;
}

.alert-warning{
    background:#fef3c7;
    color:#b45309;
    padding:15px;
    border-radius:10px;
}

.alert-danger{
    background:#fee2e2;
    color:#b91c1c;
    padding:15px;
    border-radius:10px;
}

/* Progress Bars */

.progress{
    width:100%;
    background:#e2e8f0;
    border-radius:20px;
    overflow:hidden;
    height:10px;
}

.progress-bar{
    height:10px;
    background:#2563eb;
}

/* Animations */

.fade-in{
    animation:fade .5s ease;
}

@keyframes fade{
    from{
        opacity:0;
        transform:translateY(20px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

.slide-left{
    animation:slideLeft .4s ease;
}

@keyframes slideLeft{
    from{
        transform:translateX(-30px);
        opacity:0;
    }
    to{
        transform:translateX(0);
        opacity:1;
    }
}

/* Responsive */

.sidebar-overlay{
    display:none;
    position:fixed;
    inset:0;
    background:rgba(15,23,42,.5);
    z-index:998;
}

@media(max-width:1024px){

.sidebar{
    left:-260px;
}

.sidebar.active{
    left:0;
}

.sidebar-overlay.active{
    display:block;
}

.main-content{
    margin-left:0;
}

.navbar{
    padding:20px;
}

.dashboard{
    padding:20px;
}

}

@media(max-width:768px){

.navbar-title{
    font-size:18px;
}

.card-value{
    font-size:28px;
}

.sidebar{
    width:240px;
}

}

@media(max-width:480px){

.dashboard{
    padding:15px;
}

.navbar{
    height:65px;
}

.card{
    padding:18px;
}

.card-value{
    font-size:24px;
}

.btn{
    width:100%;
}

.section-header{
    flex-wrap:wrap;
    row-gap:12px;
}

.section-header > *:last-child{
    width:100%;
}

}

/* =============================================
   ADMIN DASHBOARD STYLES
   ============================================= */

:root {
    --admin-primary: #6366F1;
    --admin-secondary: #8B5CF6;
    --admin-success: #10B981;
    --admin-warning: #F59E0B;
    --admin-danger: #EF4444;
    --admin-info: #3B82F6;
}

/* =============================================
   ADMIN SIDEBAR
   ============================================= */
.admin-sidebar {
    border-right: 1px solid var(--border-color);
}

.admin-sidebar .nav-item.active a,
.admin-sidebar li a.active {
    background: linear-gradient(135deg, var(--admin-primary), var(--admin-secondary));
    color: white;
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.3);
}

.admin-sidebar .nav-item.active a i,
.admin-sidebar li a.active i {
    color: white;
}

.admin-sidebar .nav-item.active a::before {
    display: none;
}

/* =============================================
   ADMIN TOP BAR
   ============================================= */
.admin-topbar {
    background: linear-gradient(135deg, var(--admin-primary), var(--admin-secondary));
    border-bottom: none;
}

.admin-topbar .page-title h1,
.admin-topbar .navbar-title,
.admin-topbar .breadcrumb {
    color: white;
}

.admin-topbar .breadcrumb {
    opacity: 0.8;
}

.system-status-indicator {
    display: flex;
    align-items: center;
    gap: 8px;
    color: white;
    font-size: 13px;
    padding: 6px 14px;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 20px;
}

.system-status-indicator .status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
}

.system-status-indicator .status-dot.online {
    background: #10B981;
    animation: pulse-dot 2s infinite;
}

.system-status-indicator .status-dot.offline {
    background: #EF4444;
}

@keyframes pulse-dot {
    0% { opacity: 1; }
    50% { opacity: 0.5; }
    100% { opacity: 1; }
}

.admin-topbar .topbar-toggle,
.admin-topbar .sidebar-toggle {
    color: white;
}

.admin-topbar .topbar-toggle:hover,
.admin-topbar .sidebar-toggle:hover {
    background: rgba(255, 255, 255, 0.15);
}

.admin-topbar .user-menu-btn .user-avatar,
.admin-topbar .avatar {
    background: rgba(255, 255, 255, 0.2);
}

.admin-topbar .user-menu-btn i {
    color: white;
}

.admin-topbar .navbar-search {
    background: rgba(255, 255, 255, 0.15);
}

.admin-topbar .navbar-search input {
    color: white;
}

.admin-topbar .navbar-search input::placeholder {
    color: rgba(255, 255, 255, 0.7);
}

.admin-topbar .navbar-search i,
.admin-topbar .navbar-search kbd {
    color: rgba(255, 255, 255, 0.85);
}

.admin-topbar .navbar-search kbd {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.25);
}

.admin-topbar .icon-btn {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.25);
    color: white;
}

.admin-topbar .icon-btn:hover {
    background: rgba(255, 255, 255, 0.28);
}

/* =============================================
   ADMIN CONTENT
   ============================================= */
.admin-content {
    padding: 24px 32px;
}

/* =============================================
   ADMIN STATS CARDS
   ============================================= */
.admin-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.admin-stat-card {
    background: var(--bg-card);
    border-radius: var(--radius);
    border: 1px solid var(--border-color);
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 16px;
    transition: var(--transition);
}

.admin-stat-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.admin-stat-icon {
    width: 48px;
    height: 48px;
    min-width: 48px;
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.admin-stat-info {
    flex: 1;
    min-width: 0;
}

.admin-stat-label {
    font-size: 13px;
    color: var(--text-muted);
    display: block;
}

.admin-stat-value {
    font-size: 22px;
    font-weight: 700;
    color: var(--text-primary);
    display: block;
    line-height: 1.2;
}

.admin-stat-change {
    font-size: 12px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 10px;
}

.admin-stat-change.positive {
    color: var(--admin-success);
    background: #ECFDF5;
}

.admin-stat-change.negative {
    color: var(--admin-danger);
    background: #FEE2E2;
}

.admin-stat-change.neutral {
    color: var(--text-muted);
    background: var(--bg-main);
}

/* =============================================
   ADMIN CHARTS
   ============================================= */
.admin-charts-grid {
    display: grid;
    gap: 20px;
    margin-bottom: 24px;
}

.admin-charts-grid.full-width {
    grid-template-columns: 1fr;
}

.admin-charts-grid.two-col {
    grid-template-columns: 1fr 1fr;
}

@media (max-width: 900px) {
    .admin-charts-grid.two-col {
        grid-template-columns: 1fr;
    }
}

.admin-chart-card {
    background: var(--bg-card);
    border-radius: var(--radius);
    border: 1px solid var(--border-color);
    padding: 20px;
}

.admin-chart-card .section-header {
    margin-bottom: 16px;
}

/* =============================================
   ADMIN TABLE (users, etc.)
   ============================================= */
.admin-table-card {
    background: var(--bg-card);
    border-radius: var(--radius);
    border: 1px solid var(--border-color);
    padding: 20px;
    margin-bottom: 24px;
    overflow-x: auto;
}

.admin-table {
    width: 100%;
    border-collapse: collapse;
}

.admin-table th {
    text-align: left;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: var(--text-muted);
    padding: 10px 14px;
    border-bottom: 1px solid var(--border-color);
}

.admin-table td {
    padding: 12px 14px;
    border-bottom: 1px solid var(--border-color);
    font-size: 14px;
    color: var(--text-primary);
}

.admin-table tr:last-child td {
    border-bottom: none;
}

.admin-role-badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: capitalize;
}

.admin-role-badge.admin { background: #EEF2FF; color: var(--admin-primary); }
.admin-role-badge.manager { background: #F3E8FF; color: var(--admin-secondary); }
.admin-role-badge.developer { background: #E0F2FE; color: var(--admin-info); }
.admin-role-badge.user { background: var(--bg-main); color: var(--text-muted); }

@media (max-width: 768px) {
    .admin-content {
        padding: 20px;
    }

    .admin-topbar .navbar-search {
        display: none;
    }

    .system-status-indicator .status-label {
        display: none;
    }

    .system-status-indicator {
        padding: 6px;
    }
}

/* Polish pass */
:root {
    --radius: 8px;
    --radius-sm: 6px;
    --shadow-sm: 0 1px 2px rgba(15, 23, 42, .05);
    --shadow-md: 0 8px 24px rgba(15, 23, 42, .08);
}

body {
    background: #eef2f7;
}

.sidebar {
    background: #111827;
}

.navbar {
    height: 68px;
    border-bottom: 1px solid #e2e8f0;
    box-shadow: none;
}

.dashboard,
.admin-content {
    max-width: 1600px;
    margin: 0 auto;
    padding: 24px;
}

.stat-grid,
.admin-stats-grid {
    gap: 16px;
    margin-bottom: 24px;
}

.card,
.chart-card,
.table-container,
.quick-action-card,
.admin-stat-card,
.admin-chart-card,
.admin-table-card {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: var(--shadow-sm);
}

.card:hover,
.quick-action-card:hover,
.admin-stat-card:hover {
    transform: none;
    box-shadow: var(--shadow-md);
}

.stat-card,
.admin-stat-card {
    min-height: 104px;
    padding: 18px;
}

.stat-icon,
.admin-stat-icon,
.quick-action-icon,
.activity-icon-chip,
.icon-btn,
.form-control,
.btn,
.notif-read-btn {
    border-radius: 8px;
}

.card-value,
.admin-stat-value {
    margin-top: 0;
    line-height: 1;
}

.card-title,
.admin-stat-label {
    line-height: 1.35;
}

.stat-body,
.admin-stat-info,
.quick-action-info {
    min-width: 0;
}

thead,
.admin-table th {
    background: #f8fafc;
    color: #475569;
}

th,
td,
.admin-table th,
.admin-table td {
    padding: 14px 16px;
}

.admin-table th {
    letter-spacing: 0;
}

.section-header {
    margin-bottom: 16px;
}

.quick-actions-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px;
}

.quick-action-card {
    padding: 16px;
}

.dual-panel,
.admin-charts-grid {
    align-items: start;
}

.dashboard-footer {
    padding-top: 20px;
}

@media(max-width: 768px) {
    .dashboard,
    .admin-content {
        padding: 18px;
    }

    .navbar-actions .user-profile > div:not(.avatar) {
        display: none;
    }
}

/* Premium redesign */
:root {
    --border-color: #e4e4e7;
    --bg-card: #ffffff;
    --bg-main: #f6f7f9;
    --text-primary: #18181b;
    --text-muted: #71717a;
    --accent: #0f766e;
    --accent-strong: #115e59;
    --ink: #18181b;
    --blue: #2563eb;
    --amber: #d97706;
    --rose: #be123c;
    --radius: 8px;
    --radius-sm: 8px;
    --shadow-sm: 0 1px 2px rgba(24, 24, 27, .04);
    --shadow-md: 0 18px 45px rgba(24, 24, 27, .08);
}

body {
    background: var(--bg-main);
    color: var(--text-primary);
}

::-webkit-scrollbar-thumb {
    background: #a1a1aa;
}

::-webkit-scrollbar-thumb:hover {
    background: #71717a;
}

.sidebar {
    background: #ffffff;
    color: var(--text-primary);
    border-right: 1px solid var(--border-color);
    box-shadow: 1px 0 0 rgba(24, 24, 27, .02);
}

.sidebar-logo {
    color: var(--ink);
    border-bottom: 1px solid var(--border-color);
}

.sidebar-logo i {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--ink);
    color: #ffffff;
    font-size: 16px;
}

.sidebar-collapse-btn {
    background: #f4f4f5;
    color: #52525b;
    border: 1px solid #e4e4e7;
}

.sidebar-collapse-btn:hover {
    background: #e4e4e7;
    color: var(--ink);
}

.sidebar a {
    color: #52525b;
    margin: 4px 12px;
    padding: 12px 14px;
    border-radius: 8px;
    font-weight: 600;
}

.sidebar a:hover {
    background: #f4f4f5;
    color: var(--ink);
}

.sidebar a.active,
.admin-sidebar li a.active {
    background: var(--ink);
    color: #ffffff;
    box-shadow: 0 12px 26px rgba(24, 24, 27, .14);
}

.sidebar a.active i,
.admin-sidebar li a.active i {
    color: #ffffff;
}

.nav-badge,
.icon-btn-dot {
    background: var(--rose);
}

.main-content {
    background: var(--bg-main);
}

.navbar,
.admin-topbar {
    height: 72px;
    background: rgba(255, 255, 255, .94);
    border-bottom: 1px solid var(--border-color);
    box-shadow: none;
    backdrop-filter: blur(14px);
}

.admin-topbar .navbar-title,
.navbar-title {
    color: var(--ink);
    font-size: 22px;
}

.admin-topbar .user-profile,
.admin-topbar .user-profile * {
    color: var(--text-primary) !important;
}

.admin-topbar .avatar {
    color: #ffffff !important;
}

.system-status-indicator {
    background: #ecfdf5;
    border: 1px solid #bbf7d0;
    color: #166534;
}

.navbar-search {
    height: 42px;
    background: #f4f4f5;
    border: 1px solid #e4e4e7;
    border-radius: 8px;
}

.navbar-search:focus-within {
    border-color: var(--accent);
    box-shadow: 0 0 0 4px rgba(15, 118, 110, .1);
}

.icon-btn {
    border-color: #e4e4e7;
    color: #52525b;
}

.icon-btn:hover {
    background: #f4f4f5;
    color: var(--ink);
}

.avatar {
    background: var(--accent);
    color: #ffffff;
    border-radius: 8px;
}

.dashboard,
.admin-content {
    padding: 28px;
}

.stat-grid {
    grid-template-columns: repeat(5, minmax(180px, 1fr));
}

.admin-stats-grid {
    grid-template-columns: repeat(5, minmax(170px, 1fr));
}

.card,
.chart-card,
.table-container,
.quick-action-card,
.admin-stat-card,
.admin-chart-card,
.admin-table-card {
    background: #ffffff;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    box-shadow: var(--shadow-sm);
}

.card:hover,
.quick-action-card:hover,
.admin-stat-card:hover {
    box-shadow: var(--shadow-md);
}

.stat-card,
.admin-stat-card {
    min-height: 112px;
    align-items: flex-start;
    padding: 18px;
}

.stat-icon,
.admin-stat-icon,
.quick-action-icon {
    width: 42px;
    height: 42px;
    border-radius: 8px;
    font-size: 16px;
}

.stat-grid .stat-card:nth-child(1) .stat-icon,
.admin-stats-grid .admin-stat-card:nth-child(1) .admin-stat-icon,
.admin-stats-grid .admin-stat-card:nth-child(4) .admin-stat-icon {
    background: #ecfdf5 !important;
    color: var(--accent) !important;
}

.stat-grid .stat-card:nth-child(2) .stat-icon,
.admin-stats-grid .admin-stat-card:nth-child(2) .admin-stat-icon,
.admin-stats-grid .admin-stat-card:nth-child(5) .admin-stat-icon {
    background: #eff6ff !important;
    color: var(--blue) !important;
}

.stat-grid .stat-card:nth-child(3) .stat-icon,
.admin-stats-grid .admin-stat-card:nth-child(3) .admin-stat-icon {
    background: #fffbeb !important;
    color: var(--amber) !important;
}

.stat-grid .stat-card:nth-child(4) .stat-icon,
.stat-grid .stat-card:nth-child(5) .stat-icon {
    background: #f4f4f5 !important;
    color: #52525b !important;
}

.card-value,
.admin-stat-value {
    color: var(--ink);
    font-size: 30px;
    font-weight: 750;
}

.card-value.primary,
.success {
    color: var(--accent);
}

.warning {
    color: var(--amber);
}

.danger {
    color: var(--rose);
}

.stat-grid .stat-card:nth-child(4) .card-value {
    color: #52525b !important;
}

.card-title,
.admin-stat-label {
    color: #71717a;
    font-weight: 600;
}

.chart-card,
.admin-chart-card,
.table-container,
.admin-table-card,
#notifications {
    padding: 22px !important;
}

.section-header h3 {
    color: var(--ink);
    font-size: 17px;
    font-weight: 750;
}

.section-header h3 i {
    color: var(--accent);
}

thead,
.admin-table th {
    background: #fafafa;
    color: #52525b;
}

th,
.admin-table th {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0;
}

td,
.admin-table td {
    color: #27272a;
}

tbody tr:hover {
    background: #fafafa;
}

.status-pill,
.admin-role-badge {
    border-radius: 999px;
    font-weight: 700;
}

.status-active {
    background: #ecfdf5;
    color: #166534;
}

.status-inactive {
    background: #f4f4f5;
    color: #52525b;
}

.status-error {
    background: #fef2f2;
    color: #991b1b;
}

.btn {
    border-radius: 8px;
    font-weight: 700;
}

.btn-primary {
    background: var(--ink);
    color: #ffffff;
}

.btn-primary:hover {
    background: var(--accent);
}

.btn-success {
    background: var(--accent);
}

.btn-success:hover {
    background: var(--accent-strong);
}

.btn-danger {
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

.btn-danger:hover {
    background: #fee2e2;
}

button[style*="background:#e2e8f0"] {
    background: #f4f4f5 !important;
    color: #3f3f46 !important;
    border: 1px solid #e4e4e7 !important;
}

.form-control {
    min-height: 44px;
    border: 1px solid #d4d4d8;
    background: #ffffff;
}

.form-control:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 4px rgba(15, 118, 110, .1);
}

.quick-action-card {
    min-height: 94px;
    border-color: #e4e4e7;
}

.quick-action-card:hover {
    border-color: #d4d4d8;
}

.quick-action-icon {
    background: #f4f4f5 !important;
}

.quick-action-info h4 {
    font-weight: 750;
}

.quick-action-info p,
.activity-meta,
.dropdown-item-meta {
    color: #71717a;
}

.dropdown-menu {
    border-radius: 8px;
    border-color: #e4e4e7;
    box-shadow: 0 22px 60px rgba(24, 24, 27, .16);
}

.dropdown-item.unread {
    background: #f0fdfa;
}

.activity-item {
    border-bottom-color: #ececef;
}

.activity-icon-chip {
    border-radius: 8px;
}

.activity-icon-chip.primary {
    background: #ecfdf5;
    color: var(--accent);
}

.empty-state {
    color: #71717a;
}

.empty-state i {
    color: #a1a1aa;
}

.alert-success,
.alert-danger {
    border-radius: 8px;
    border: 1px solid transparent;
    padding: 14px 16px;
}

.alert-success {
    background: #ecfdf5;
    border-color: #bbf7d0;
    color: #166534;
}

.alert-danger {
    background: #fef2f2;
    border-color: #fecaca;
    color: #991b1b;
}

@media(max-width: 1280px) {
    .stat-grid,
    .admin-stats-grid {
        grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    }
}

@media(max-width: 1024px) {
    .sidebar {
        box-shadow: 24px 0 60px rgba(24, 24, 27, .14);
    }

    .navbar {
        padding: 0 20px;
    }
}

@media(max-width: 768px) {
    .dashboard,
    .admin-content {
        padding: 18px;
    }

    .stat-card,
    .admin-stat-card {
        min-height: 96px;
    }
}
