/*
 * Paper for Nuvabill: a calm, light client area on top of Nova.
 * Free on the Nuvabill Marketplace.
 */

:root {
    --nb-bg: #faf9f6;
    --nb-surface: #ffffff;
    --nb-surface-2: #f6f4ef;
    --nb-line: #ebe7df;
    --nb-line-2: #ddd8cd;
    --nb-ink: #1d1c19;
    --nb-muted: #6b675e;
    --nb-faint: #8a857a;
    --nb-chrome: #ffffff;
    --nb-chrome-2: #faf9f6;
    --nb-chrome-ink: #1d1c19;
    --nb-chrome-muted: #6b675e;
    --nb-chrome-faint: #8a857a;
    --nb-chrome-line: #ebe7df;
    --nb-chrome-hover: #f3f0e9;
    --nb-chrome-active: #efebe2;
    --nb-radius: 12px;
    --nb-radius-sm: 10px;
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme='light']) {
        --nb-bg: #16161a;
        --nb-surface: #1d1d22;
        --nb-surface-2: #232329;
        --nb-line: #2c2c33;
        --nb-line-2: #37373f;
        --nb-ink: #eeede9;
        --nb-muted: #aaa79f;
        --nb-faint: #8a877f;
        --nb-chrome: #1d1d22;
        --nb-chrome-2: #16161a;
        --nb-chrome-ink: #eeede9;
        --nb-chrome-muted: #aaa79f;
        --nb-chrome-line: #2c2c33;
        --nb-chrome-hover: #26262c;
        --nb-chrome-active: #2c2c33;
    }
}

:root[data-theme='dark'] {
    --nb-bg: #16161a;
    --nb-surface: #1d1d22;
    --nb-surface-2: #232329;
    --nb-line: #2c2c33;
    --nb-line-2: #37373f;
    --nb-ink: #eeede9;
    --nb-muted: #aaa79f;
    --nb-faint: #8a877f;
    --nb-chrome: #1d1d22;
    --nb-chrome-2: #16161a;
    --nb-chrome-ink: #eeede9;
    --nb-chrome-muted: #aaa79f;
    --nb-chrome-line: #2c2c33;
    --nb-chrome-hover: #26262c;
    --nb-chrome-active: #2c2c33;
}

body {
    font-size: 1.02rem;
}

.topbar {
    border-bottom: 1px solid var(--nb-line);
}

.main-nav {
    border-bottom: 1px solid var(--nb-line);
}

.main-nav a[aria-current='page'] {
    color: var(--nb-ink);
    box-shadow: inset 0 -2px 0 var(--nb-accent);
}

.card {
    border-color: var(--nb-line);
    box-shadow: none;
}

.page-title h1 {
    font-size: clamp(1.8rem, 3vw, 2.4rem);
    font-weight: 700;
    letter-spacing: -0.02em;
}

.btn {
    border-radius: 999px;
}

.table th {
    background: transparent;
    font-weight: 600;
}