/* ================================================================
   MCORP KLINIK - Gaya Khusus Aplikasi
   ================================================================ */

:root {
    --app-primary: #0d6efd;
    --app-sidebar-width: 230px;
}

body {
    background-color: #f4f6fb;
    padding-top: 56px;
    font-family: "Segoe UI", Tahoma, sans-serif;
}

/* ---------- Bar Navigasi ---------- */
.app-navbar {
    background: linear-gradient(135deg, #0d6efd 0%, #0a4fd0 100%);
    min-height: 56px;
}

/* ---------- Sidebar ---------- */
.app-sidebar {
    position: sticky;
    top: 56px;
    height: calc(100vh - 56px);
    overflow-y: auto;
    z-index: 100;
}
.sidebar-sticky { padding-bottom: 24px; }
.sidebar-item {
    color: #4a5568;
    border-left: 4px solid transparent;
    transition: all .15s ease;
}
.sidebar-item:hover {
    background-color: #eef2ff;
    color: var(--app-primary);
}
.sidebar-item.active {
    background-color: #e7f0ff;
    color: var(--app-primary);
    border-left-color: var(--app-primary);
    font-weight: 600;
}
.sidebar-icon { font-size: 1.05rem; width: 22px; }

/* ---------- Kandungan Utama ---------- */
.app-main {
    padding: 8px 24px 24px;
    min-height: calc(100vh - 56px);
}

/* ---------- Kad Statistik ---------- */
.stat-card { border-radius: 12px; overflow: hidden; }
.stat-card .card-body { padding: 18px 16px; }
.stat-icon {
    width: 48px; height: 48px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    margin-right: 14px;
    flex: 0 0 auto;
}
.stat-value { font-size: 1.35rem; font-weight: 700; line-height: 1.1; }
.stat-label { font-size: .78rem; color: #6b7280; }

/* ---------- Avatar ---------- */
.avatar-circle {
    width: 38px; height: 38px;
    border-radius: 50%;
    background: rgba(255,255,255,.25);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

/* ---------- Logo ---------- */
.navbar-logo {
    height: 22px;
    width: auto;
    max-width: 40px;
    object-fit: contain;
    margin-right: 8px;
    border-radius: 4px;
}
.sidebar-logo {
    height: 32px;
    width: auto;
    max-width: 85%;
    max-height: 40px;
    object-fit: contain;
    margin-bottom: 6px;
}
.login-logo-img {
    width: 84px;
    max-width: 70%;
    height: auto;
    margin: 0 auto 6px;
    display: block;
}
@media (max-width: 575.98px) {
    .navbar-logo { height: 18px; max-width: 32px; margin-right: 6px; }
    .sidebar-logo { height: 26px; max-height: 32px; }
    .login-logo-img { width: 68px; }
}
@media (min-width: 576px) and (max-width: 991.98px) {
    .sidebar-logo { height: 28px; }
}

/* ---------- Halaman Log Masuk ---------- */
.login-bg {
    min-height: 100vh;
    background: linear-gradient(rgba(13, 110, 253, .55), rgba(58, 12, 163, .65)),
                url('../images/doctor-consultation.jpg') center / cover no-repeat fixed;
}
.login-card { border-radius: 16px; }
.login-logo {
    width: 64px; height: 64px;
    font-size: 1.8rem;
    background: linear-gradient(135deg, #0d6efd, #3a0ca3);
    border-radius: 50%;
}

/* ---------- Jadual ---------- */
.data-table thead th {
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .3px;
    color: #6b7280;
    white-space: nowrap;
}

/* ---------- Pelbagai ---------- */
.card { border-radius: 12px; }
.card-header { border-radius: 12px 12px 0 0 !important; }
.notif-menu .dropdown-item { white-space: normal; }

@media print {
    body { padding-top: 0; }
}