/* Catppuccin Mocha Theme */
:root {
    --ctp-rosewater: #f5e0dc;
    --ctp-flamingo: #f2cdcd;
    --ctp-pink: #f5c2e7;
    --ctp-mauve: #cba6f7;
    --ctp-red: #f38ba8;
    --ctp-maroon: #eba0ac;
    --ctp-peach: #fab387;
    --ctp-yellow: #f9e2af;
    --ctp-green: #a6e3a1;
    --ctp-teal: #94e2d5;
    --ctp-sky: #89dceb;
    --ctp-sapphire: #74c7ec;
    --ctp-blue: #89b4fa;
    --ctp-lavender: #b4befe;
    --ctp-text: #cdd6f4;
    --ctp-subtext1: #bac2de;
    --ctp-subtext0: #a6adc8;
    --ctp-overlay2: #9399b2;
    --ctp-overlay1: #7f849c;
    --ctp-overlay0: #6c7086;
    --ctp-surface2: #585b70;
    --ctp-surface1: #45475a;
    --ctp-surface0: #313244;
    --ctp-base: #1e1e2e;
    --ctp-mantle: #181825;
    --ctp-crust: #11111b;
}

/* ── Font scale ── */
:root {
    --font-title: 1.1rem; /* page titles */
    --font-body: 0.8125rem; /* 13px — body text, breadcrumbs */
    --font-table: 0.75rem; /* 12px — table cells, inputs, buttons */
    --font-sm: 0.6875rem; /* 11px — section headers, labels, captions */
    --font-xs: 0.625rem; /* 10px — badges (minimum) */
}

/* ── Density: comfortable (default) ── */
[data-density="comfortable"],
:root {
    --d-header-py: 0.625rem;
    --d-header-px: 2rem;
    --d-header-logo: 1.25rem;
    --d-nav-gap: 1rem;
    --d-nav-py: 0.25rem;
    --d-nav-px: 0.75rem;
    --d-nav-radius: 0.5rem;
    --d-user-gap: 0.5rem;
    --d-user-font: var(--font-body);

    --d-th-py: 0.25rem;
    --d-th-px: 0.75rem;
    --d-th-font: var(--font-table);
    --d-td-py: 0.25rem;
    --d-td-px: 0.75rem;
    --d-td-font: var(--font-body);

    --d-toolbar-gap: 0.5rem;
    --d-toolbar-py: 0.5rem;
    --d-toolbar-mb: 0.25rem;
    --d-input-py: 0.25rem;
    --d-input-px: 0.5rem;
    --d-input-font: var(--font-body);

    --d-footer-h: 28px;
    --d-footer-font: var(--font-table);
    --d-footer-px: 2rem;

    --d-sidebar-w: 220px;
    --d-sidebar-collapsed: 48px;
}

/* ── Density: compact ── */
[data-density="compact"] {
    --d-header-py: 0.25rem;
    --d-header-px: 1.25rem;
    --d-header-logo: 1.1rem;
    --d-nav-gap: 0.5rem;
    --d-nav-py: 0.25rem;
    --d-nav-px: 0.5rem;
    --d-nav-radius: 0.25rem;
    --d-user-gap: 0.25rem;
    --d-user-font: var(--font-table);

    --d-th-py: 0.25rem;
    --d-th-px: 0.5rem;
    --d-th-font: var(--font-sm);
    --d-td-py: 0.25rem;
    --d-td-px: 0.5rem;
    --d-td-font: var(--font-table);

    --d-toolbar-gap: 0.25rem;
    --d-toolbar-py: 0.25rem;
    --d-toolbar-mb: 0.25rem;
    --d-input-py: 0.25rem;
    --d-input-px: 0.5rem;
    --d-input-font: var(--font-table);

    --d-footer-h: 24px;
    --d-footer-font: var(--font-sm);
    --d-footer-px: 1.25rem;

    --d-sidebar-w: 180px;
    --d-sidebar-collapsed: 40px;
}