/* =================================================================
   DESAIN ULANG TOTAL - APLIKASI RCHK v2.0
   Dibuat untuk tampilan yang profesional, modern, dan intuitif.
   ================================================================= */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');
:root {
    --primary-dark: #192A56;
    --primary-accent: #2ECC71;
    --primary-accent-hover: #27AE60;
    --content-bg: #F5F7FA;
    --card-bg: #FFFFFF;
    --text-dark: #3F3F3F;
    --text-muted: #7A7A7A;
    --border-color: #EAEAEA;
    --card-shadow: 0 4px 25px rgba(0, 0, 0, 0.05);
    --border-radius: 0.75rem;
}
body {
    font-family: 'Inter', sans-serif;
    background-color: var(--content-bg);
    color: var(--text-dark);
    font-size: 15px;
}
.login-page { display: flex; height: 100vh; width: 100%; }
.login-aside {
    width: 50%;
    background: linear-gradient(rgba(25, 42, 86, 0.8), rgba(25, 42, 86, 0.9)), url('https://images.unsplash.com/photo-1577896851231-70ef18881754?q=80&w=2070') center center;
    background-size: cover; color: #fff; display: flex; flex-direction: column; justify-content: center; padding: 50px;
}
.login-aside h1 { font-weight: 800; font-size: 2.5rem; margin-bottom: 1rem; }
.login-aside p { font-size: 1.1rem; opacity: 0.8; }
.login-form-container { width: 50%; display: flex; align-items: center; justify-content: center; padding: 40px; }
.login-form { width: 100%; max-width: 400px; }
.login-form h2 { font-weight: 700; color: var(--primary-dark); margin-bottom: 0.5rem; }
.login-form .text-muted { margin-bottom: 2rem; }
.sidebar {
    height: 100vh; position: fixed; top: 0; left: 0; width: 260px;
    background-color: var(--primary-dark); display: flex; flex-direction: column;
}
.sidebar-header { padding: 25px 20px; text-align: center; border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
.sidebar-header h4 { color: #fff; font-weight: 700; font-size: 1.5rem; }
.sidebar-user { padding: 15px 20px; color: #fff; }
.sidebar-user small { opacity: 0.6; }
.sidebar-menu { flex-grow: 1; padding: 10px 0; }
.sidebar a {
    padding: 14px 25px; margin: 4px 10px; text-decoration: none; font-size: 1rem;
    font-weight: 500; color: rgba(255, 255, 255, 0.7); display: block;
    transition: all 0.2s ease-in-out; border-radius: 8px;
}
.sidebar a .fa-fw { transition: transform 0.2s ease; }
.sidebar a:hover { background-color: rgba(255, 255, 255, 0.1); color: #fff; }
.sidebar a:hover .fa-fw { transform: scale(1.1); }
.sidebar a.active { background-color: var(--primary-accent); color: #fff; font-weight: 600; box-shadow: 0 4px 15px rgba(46, 204, 113, 0.2); }
.content { margin-left: 260px; padding: 40px; }
.card {
    border: none; border-radius: var(--border-radius);
    box-shadow: var(--card-shadow); background-color: var(--card-bg); margin-bottom: 1.5rem;
}
.card-header {
    padding: 1.25rem 1.5rem; font-weight: 600; background-color: transparent;
    border-bottom: 1px solid var(--border-color); font-size: 1.1rem;
}
.card-title { font-weight: 600; color: var(--primary-dark); }
.btn {
    font-weight: 600; padding: 0.75rem 1.25rem; border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1); transition: all 0.2s ease;
}
.btn:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,0.15); }
.btn-primary { background-color: var(--primary-accent) !important; border-color: var(--primary-accent) !important; }
.btn-primary:hover { background-color: var(--primary-accent-hover) !important; border-color: var(--primary-accent-hover) !important; }
.table thead { background-color: var(--content-bg); font-weight: 600; color: var(--text-dark); }
.table > :not(caption) > * > * { border-bottom-width: 0; }
.table-hover > tbody > tr:hover { background-color: #EDFDF4; }
@media (max-width: 992px) {
    .sidebar { left: -260px; transition: left 0.3s ease; z-index: 1000; }
    .content { margin-left: 0; }
    .login-aside { display: none; }
    .login-form-container { width: 100%; }
}
@media print {
    .sidebar, .d-print-none, .card-header { display: none !important; }
    .content { margin-left: 0 !important; padding: 0 !important; }
    .card { border: none !important; box-shadow: none !important; padding: 0 !important; }
    a { text-decoration: none; color: inherit; } body { background-color: #fff; }
    .dont-break { page-break-inside: avoid; }
}