/* css/style.css */
body {
    background:#f6f8fb;
    font-family: Inter, system-ui, sans-serif;
}
.sidebar {
    width:260px;
    background:#fff;
    height:100vh;
    position:fixed;
    left:0;
    top:0;
    border-right:1px solid #eaeaea;
    transition: transform .3s ease;
    z-index: 1050;
}
.sidebar a {
    display:flex;
    align-items:center;
    gap:10px;
    padding:12px 20px;
    color:#555;
    text-decoration:none;
    border-radius:8px;
    margin:5px 10px;
}
.sidebar a.active {
    background:linear-gradient(135deg,#6f7bf7,#8e5bf9);
    color:#fff;
}
.sidebar h6 {
    font-size:12px;
    color:#999;
    margin:20px 20px 5px;
}
.main {
    margin-left:260px;
    padding:25px;
}
.topbar {
    background:#fff;
    padding:15px 25px;
    border-radius:12px;
    display:flex;
    justify-content:space-between;
    align-items:center;
}
.card-stat {
    color:#fff;
    border-radius:14px;
    padding:20px;
    display:flex;
    justify-content:space-between;
    align-items:center;
}
.gradient-purple { background:linear-gradient(135deg,#6f7bf7,#8e5bf9); }
.gradient-green  { background:linear-gradient(135deg,#20c997,#0bbcd6); }
.gradient-orange { background:linear-gradient(135deg,#ff9800,#ffb300); }
.gradient-blue   { background:linear-gradient(135deg,#2196f3,#03a9f4); }
.gradient-red   { background:linear-gradient(135deg,#ff4757,#ff6b81); }
.gradient-white { background:linear-gradient(135deg,#f8f9fa,#e9ecef); color:#495057; }
.gradient-white i { color:#6c757d; }

.quick-btn {
    border-radius:10px;
    padding:10px 18px;
    font-weight:500;
    border:none;
    color:#fff;
    position:relative;
    overflow:hidden;
    transition:all .25s ease;
}
.quick-btn:hover {
    transform:translateY(-2px);
    box-shadow:0 10px 26px rgba(0,0,0,.25);
}
.quick-btn::after {
    content:"";
    position:absolute;
    inset:0;
    background:rgba(255,255,255,.18);
    opacity:0;
    transition:.25s ease;
}
.quick-btn:hover::after { opacity:1; }
.quick-btn i { transition:.25s ease; }
.quick-btn:hover i { transform:scale(1.15); }
.quick-btn:active { transform:scale(.97); box-shadow:0 6px 16px rgba(0,0,0,.2); }

.table-card, .list-card {
    background:#fff;
    border-radius:14px;
    padding:20px;
}
.badge-active { background:#20c997; }
.list-item {
    display:flex;
    justify-content:space-between;
    padding:12px 0;
    border-bottom:1px solid #eee;
}
.list-item:last-child { border:none; }

.notification { cursor:pointer; color:#555; position: relative; }
.notification i { font-size:20px; }
.notif-dot {
    position:absolute;
    top:-6px;
    right:-6px;
    background:#ff4d4f;
    color:#fff;
    font-size:11px;
    padding:2px 6px;
    border-radius:50%;
    font-weight:600;
}

.admin-box {
    display:flex;
    align-items:center;
    gap:10px;
    background:#fff;
    padding:6px 12px;
    border-radius:30px;
    cursor:pointer;
    box-shadow:0 6px 18px rgba(0,0,0,.08);
}
.admin-avatar {
    width:36px;
    height:36px;
    border-radius:50%;
    background:linear-gradient(135deg,#7b61ff,#9b8cff);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:700;
}
.admin-info { line-height:1.1; }
.admin-info small { color:#888; font-size:12px; }

.dropdown-menu { border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.15); border:none; }
.dropdown-item i { margin-right:8px; }

.view-all-btn {
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:6px 14px;
    font-size:13px;
    font-weight:600;
    border-radius:20px;
    color:#fff;
    text-decoration:none;
    background:linear-gradient(135deg,#7b61ff,#9b8cff);
    box-shadow:0 6px 16px rgba(123,97,255,.35);
    transition:.25s ease;
}
.view-all-btn:hover { transform:translateX(2px); box-shadow:0 8px 20px rgba(123,97,255,.45); color:#fff; }
.view-all-btn:hover i { transform:translateX(3px); }

/* MOBILE RESPONSIVE */
@media (max-width: 768px) {
    .sidebar { transform: translateX(-100%) !important; width:100%; max-width:100%; }
    .sidebar.active { transform: translateX(0) !important; }
    .main { margin-left:0; }
    .topbar { padding:12px 15px; }
    .admin-info { display:none; }
    .card-stat { padding:16px; }
    .card-stat h3 { font-size:22px; }
    .quick-btn { margin-bottom:10px; width:100%; }
    .table-responsive { -webkit-overflow-scrolling: touch; border-radius:12px; }
    table { font-size:13px; min-width: 600px; }
    .sidebar-overlay.active {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.5);
        z-index: 1040;
    }
}

.sidebar-close { display:flex; justify-content:flex-start; padding:15px; }
.sidebar-close button {
    width:42px; height:42px; border-radius:50%; border:none;
    background:linear-gradient(135deg,#ff4d4f,#ff7875);
    color:#fff; font-size:18px; display:flex; align-items:center; justify-content:center;
    box-shadow:0 6px 18px rgba(255,77,79,.45); transition:.2s ease;
}