@import url('./main-layout.css');
@import url('./custom.css');

html,
html > body {
    --fibu3-ink: #16212b;
    --fibu3-ink-strong: #0f1720;
    --fibu3-muted: #667085;
    --fibu3-subtle: #8a97a8;
    --fibu3-canvas: #f5f7fa;
    --fibu3-surface: #ffffff;
    --fibu3-surface-subtle: #f8fafc;
    --fibu3-line: #d9e0ea;
    --fibu3-line-soft: #e8edf3;
    --fibu3-primary: #2563eb;
    --fibu3-primary-hover: #1d4ed8;
    --fibu3-primary-soft: #e8f0ff;
    --fibu3-success: #12a150;
    --fibu3-success-soft: #e7f8ee;
    --fibu3-warning: #f59e0b;
    --fibu3-warning-soft: #fff7e6;
    --fibu3-danger: #dc2626;
    --fibu3-danger-soft: #fef2f2;
    --fibu3-drawer: #17212b;
    --fibu3-drawer-strong: #111922;
    --fibu3-drawer-muted: #9aa8b8;
    --fibu3-radius-s: 5px;
    --fibu3-radius-m: 8px;
    --fibu3-shadow-xs: 0 1px 2px rgba(16, 24, 40, 0.05);
    --fibu3-shadow-s: 0 8px 20px rgba(16, 24, 40, 0.08);
    --fibu3-shadow-m: 0 18px 45px rgba(16, 24, 40, 0.12);

    --lumo-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --lumo-base-color: var(--fibu3-surface);
    --lumo-primary-color: var(--fibu3-primary);
    --lumo-primary-color-50pct: rgba(37, 99, 235, 0.5);
    --lumo-primary-color-10pct: rgba(37, 99, 235, 0.1);
    --lumo-primary-text-color: var(--fibu3-primary);
    --lumo-body-text-color: var(--fibu3-ink);
    --lumo-secondary-text-color: var(--fibu3-muted);
    --lumo-disabled-text-color: #a3adbb;
    --lumo-error-color: var(--fibu3-danger);
    --lumo-error-color-10pct: rgba(220, 38, 38, 0.1);
    --lumo-error-text-color: #b42318;
    --lumo-success-color: var(--fibu3-success);
    --lumo-warning-color: var(--fibu3-warning);
    --lumo-contrast-5pct: rgba(22, 33, 43, 0.05);
    --lumo-contrast-10pct: rgba(22, 33, 43, 0.1);
    --lumo-contrast-20pct: rgba(22, 33, 43, 0.18);
    --lumo-contrast-30pct: rgba(22, 33, 43, 0.28);
    --lumo-font-size-xxxl: 1.75rem;
    --lumo-font-size-xxl: 1.5rem;
    --lumo-font-size-xl: 1.25rem;
    --lumo-font-size-l: 1rem;
    --lumo-font-size-m: 0.875rem;
    --lumo-font-size-s: 0.8125rem;
    --lumo-font-size-xs: 0.75rem;
    --lumo-font-size-xxs: 0.6875rem;
    --lumo-line-height-m: 1.35;
    --lumo-line-height-s: 1.3;
    --lumo-line-height-xs: 1.2;
    --lumo-border-radius-s: var(--fibu3-radius-s);
    --lumo-border-radius-m: var(--fibu3-radius-m);
    --lumo-border-radius-l: var(--fibu3-radius-m);
    --lumo-size-xl: 3rem;
    --lumo-size-l: 2.5rem;
    --lumo-size-m: 2.125rem;
    --lumo-size-s: 1.875rem;
    --lumo-size-xs: 1.625rem;
    --lumo-space-xl: 2rem;
    --lumo-space-l: 1.5rem;
    --lumo-space-m: 1rem;
    --lumo-space-s: 0.5rem;
    --lumo-space-xs: 0.25rem;
}

body {
    background: var(--fibu3-canvas);
    color: var(--fibu3-ink);
    font-feature-settings: "kern";
    letter-spacing: 0;
}