/* maxnotes "Ink & Graphite" theme. Loads after shadcn.css and re-pitches its tokens. */

@font-face {
    font-family: 'Inter Tight';
    font-style: normal;
    font-weight: 400 600;
    font-display: swap;
    src: url('fonts/inter-tight-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Source Serif 4';
    font-style: normal;
    font-weight: 400 600;
    font-display: swap;
    src: url('fonts/source-serif-4-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Source Serif 4';
    font-style: italic;
    font-weight: 400 600;
    font-display: swap;
    src: url('fonts/source-serif-4-latin-italic.woff2') format('woff2');
}

@font-face {
    font-family: 'DejaVu Sans';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('fonts/dejavu-sans.ttf') format('truetype');
}

@font-face {
    font-family: 'DejaVu Sans';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('fonts/dejavu-sans-bold.ttf') format('truetype');
}

@font-face {
    font-family: 'JetBrains Mono';
    font-style: normal;
    font-weight: 400 500;
    font-display: swap;
    src: url('fonts/jetbrains-mono-latin.woff2') format('woff2');
}

:root,
[data-bs-theme="light"] {
    --paper: 240 20% 99%;
    --ground: 225 17% 95%;
    --ink: 223 14% 10%;
    --graphite: 218 10% 44%;
    --rule: 223 14% 90%;
    --accent-ink: 204 89% 38%;
    --oxblood: 354 50% 37%;
    --slab: 225 22% 96%;

    --background: var(--paper);
    --foreground: var(--ink);
    --card: var(--paper);
    --card-foreground: var(--ink);
    --popover: var(--paper);
    --popover-foreground: var(--ink);
    --primary: var(--ink);
    --primary-foreground: var(--paper);
    --secondary: var(--ground);
    --secondary-foreground: var(--ink);
    --muted: var(--ground);
    --muted-foreground: var(--graphite);
    --accent: var(--ground);
    --accent-foreground: var(--ink);
    --destructive: var(--oxblood);
    --destructive-foreground: 240 20% 99%;
    --info: var(--accent-ink);
    --info-foreground: 240 20% 99%;
    --border: var(--rule);
    --input: var(--rule);
    --ring: var(--accent-ink);
    --radius: 0.5rem;

    --font-ui: 'Inter Tight', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --font-prose: 'Source Serif 4', Charter, 'Iowan Old Style', Georgia, serif;
    --font-code: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    --font-dejavu: 'DejaVu Sans', Verdana, ui-sans-serif, sans-serif;
}

[data-bs-theme="dark"] {
    --paper: 220 18% 7%;
    --ground: 223 14% 10%;
    --ink: 228 16% 94%;
    --graphite: 218 10% 59%;
    --rule: 222 12% 16%;
    --accent-ink: 205 72% 56%;
    --oxblood: 354 45% 58%;
    --slab: 220 15% 12%;

    --background: var(--paper);
    --foreground: var(--ink);
    --card: var(--ground);
    --card-foreground: var(--ink);
    --popover: var(--ground);
    --popover-foreground: var(--ink);
    --primary: var(--ink);
    --primary-foreground: var(--paper);
    --secondary: var(--rule);
    --secondary-foreground: var(--ink);
    --muted: var(--rule);
    --muted-foreground: var(--graphite);
    --accent: var(--rule);
    --accent-foreground: var(--ink);
    --destructive: var(--oxblood);
    --destructive-foreground: 220 18% 7%;
    --info: var(--accent-ink);
    --info-foreground: 220 18% 7%;
    --border: var(--rule);
    --input: var(--rule);
    --ring: var(--accent-ink);

    --bs-body-color-rgb: 237, 238, 242;
    --bs-primary-rgb: 237, 238, 242;
}

[data-bs-theme="light"] {
    --bs-body-color-rgb: 21, 23, 28;
    --bs-primary-rgb: 21, 23, 28;
}

body {
    font-family: var(--font-ui);
    letter-spacing: -0.005em;
}

/* #app is full-bleed so the editor can own the viewport; ordinary pages get their padding back. */
#app > .container-fluid {
    padding: 2rem;
}

code,
kbd,
pre,
samp,
.font-code {
    font-family: var(--font-code);
    font-variant-ligatures: none;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-ui);
    letter-spacing: -0.02em;
}

a {
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

::selection {
    background: hsl(var(--accent-ink) / .22);
}

:focus-visible {
    outline: 2px solid hsl(var(--ring) / .55);
    outline-offset: 2px;
}

.text-accent-ink {
    color: hsl(var(--accent-ink));
}

.surface-slab {
    background: hsl(var(--slab));
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }
}
