@use "sass:list";

$_theme: (
    // Background
    "background": #130e0e #f2f0f0,
    "background-highlight": #333 #d0cdcd,
    "background-field": #222 #e8e6e6,

    // Text
    "text": #eee #000,
    "text-field": #ddd #000,
    "text-dim": #ccc #1b1b1b,
    "text-hint": #aaa #404040,
    "text-link": #ee4a4a #b90a0a,
    "text-highlight": #b2dbb6 #6f1e9d,
    "text-warning": #fc6 #d80,

    // Edges
    "edge-field": #888 #222,
    "edge-fieldset": #bbb #181818,
    "edge-publish": #bbb #222,
    "edge-post": #888 #3a3a3a,
    "edge-post-quote": #ddd #222
);

$_primary-theme: 1;
$_secondary-theme: 2;

@mixin theme($property, $key) {
    #{$property}: list.nth(map-get($_theme, $key), $_primary-theme);
    @media screen and (prefers-color-scheme: light) {
        #{$property}: list.nth(map-get($_theme, $key), $_secondary-theme);
    }
}