:root {
    --brand: #6f42c1;
    --brand-dark: #59359a;
    --brand-light: #efe9fb;
}

body {
    background: #f5f6fa;
    min-height: 100vh;
}

/* Navbar */
.app-navbar {
    background: linear-gradient(90deg, var(--brand-dark), var(--brand));
    box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
}
.app-navbar .nav-link.active {
    font-weight: 600;
    border-bottom: 2px solid #fff;
}

/* Cards */
.card {
    border: none;
    border-radius: .75rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .07);
}

/* Stat cards on the dashboard */
.stat-card .stat-value {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.1;
}
.stat-card .stat-label {
    text-transform: uppercase;
    letter-spacing: .04em;
    font-size: .72rem;
    color: #6c757d;
}
.stat-icon {
    width: 48px;
    height: 48px;
    border-radius: .75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
}
.bg-soft-success { background: #e3f6ec; color: #1a7f4b; }
.bg-soft-danger  { background: #fde8e8; color: #c0392b; }
.bg-soft-primary { background: var(--brand-light); color: var(--brand); }
.bg-soft-info    { background: #e4f3fb; color: #1c7ca8; }

/* Buttons */
.btn-brand {
    background: var(--brand);
    border-color: var(--brand);
    color: #fff;
}
.btn-brand:hover {
    background: var(--brand-dark);
    border-color: var(--brand-dark);
    color: #fff;
}

/* Login */
.login-wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--brand-dark), var(--brand));
}
.login-card {
    width: 100%;
    max-width: 400px;
}

/* Tables */
.table > :not(caption) > * > * {
    padding: .65rem .75rem;
}

/* Make tables scroll nicely on small screens */
.table-responsive {
    border-radius: .5rem;
}