@use '@lucas-labs/lui-micro' as lui;
@use './_utils/color-utils' as c;
@use './theme' as theme;

$is-dark: false;
$brand: #6296e2;

$colors: (
    primary: c.variants($brand),    
    secondary: c.variants(#bcc0cc),
    text: #484b60,
    subtle: #656c90, // same as elevation/10
    palette: (
        'red':        c.variants(#d20f39), // red
        'orange':     c.variants(#fe640b), // peach
        'yellow':     c.variants(#df8e1d), // yellow
        'olive':      c.variants(#e2f095),
        'green':      c.variants(#34ac56), // green
        'teal':       c.variants(#179299), // teal
        'blue':       c.variants(#1e66f5), // blue
        'violet':     c.variants(#7287fd), // lavender
        'purple':     c.variants(#8652e7), // mauve
        'pink':       c.variants(#ea76cb), // pink
        'brown':      c.variants(#dd7878), // flamingo
        'black':      c.variants(#181825), // black
        'white':      c.variants(#e6edf3), // white
    ),
    elevation: (
        '1':  #fcfcfd,  // elevation/1
        '2':  #f6f7f9,  // elevation/2
        '3':  #eff1f5,  // elevation/3
        '4':  #e6e9ef,  // elevation/4
        '5':  #d7dce6,  // elevation/5
        '6':  #bcc0cc,  // elevation/6
        '7':  #9ba7bf,  // elevation/7
        '8':  #838fae,  // elevation/8
        '9':  #717a9f,  // elevation/9
        '10': #656c90, // elevation/10
        '11': #565b77, // elevation/11
        '12': #484b60, // elevation/12
    )
);

$variables: (
    'font-size': (
        'xs': .714rem,
        'sm': .857rem,
        'md': 1rem,
        'lg': 1.143rem,
        'xl': 1.286rem,
    ),                    
    'font-family': '-apple-system, "Segoe UI", system-ui, "SF Pro Text", Inter, Roboto, "Helvetica Neue", Arial, sans-serif',
    'code-font-family': 'ui-monospace, SFMono-Regular, "Source Code Pro", "SF Mono", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace, var(--fonts-emoji)',
    'emoji-font-family': '"Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", "Twemoji Mozilla"',
    'measure': (
        '.25x': 4px,
        '.375x': 6px,
        '.5x': 8px,
        '.75x': 12px,
        '.875x': 14px,
        '1x': 16px,
        '1.25x': 20px,
        '1.5x': 24px,
        '2x': 32px,
        '2.5x': 40px,
        '3x': 48px,
        '4x': 64px,
    ),
    'navbar-logo': (
        'width': 56px,
        'height': 20px,
    ),
    'repo-home': (
        'sidebar-width': 296px,
    )
);

// init lui-micro, css-vars only (no reboot, no basic)
@include lui.init(
    $theme: (colors: $colors, variables: $variables),
    $options: (
        reboot: false,
        basic: false,
        fg-var-name: 'text',
        bg-var-name: 'elevation/1',
    ),
);

@include theme.make-theme($is-dark);