:root {
    --jp-red: #8B0000;         /* Crimson / Merah Jepang */
    --jp-red-bright: #C0392B;  /* Highlight Red */
    --jp-black: #1A1A1A;       /* Dark Charcoal */
    --jp-silver: #E5E7EB;      /* Silver Soft */
    --jp-silver-dark: #9CA3AF; /* Silver Accent */
    --jp-white: #FFFFFF;
}

body {
    background-color: #F3F4F6;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color: var(--jp-black);
}

/* Sidebar Custom Theme */
.bg-jp-sidebar {
    background-color: var(--jp-black) !important;
    border-right: 3px solid var(--jp-red);
}

.sidebar .nav-link {
    color: var(--jp-silver);
    font-weight: 500;
    transition: all 0.3s ease;
    border-radius: 6px;
    margin-bottom: 4px;
}

.sidebar .nav-link:hover, .sidebar .nav-link.active {
    background-color: var(--jp-red);
    color: var(--jp-white);
}

.jp-card-header {
    background: linear-gradient(135deg, var(--jp-black), var(--jp-red));
    color: var(--jp-white);
    border-bottom: 2px solid var(--jp-silver-dark);
}

.btn-jp-danger {
    background-color: var(--jp-red);
    color: var(--jp-white);
    border: none;
}

.btn-jp-danger:hover {
    background-color: var(--jp-red-bright);
    color: var(--jp-white);
}

.btn-jp-dark {
    background-color: var(--jp-black);
    color: var(--jp-white);
    border: 1px solid var(--jp-silver-dark);
}

.btn-jp-dark:hover {
    background-color: #333333;
    color: var(--jp-white);
}