/* pico.css overrides, based on https://picocss.com/docs/customization.html */

/* Light (default) */
.fwd-nav,
[data-theme="light"],
:root:not([data-theme="dark"]) {
    --primary: rgb(0, 51, 204) !important;
    --primary-hover: rgb(0, 61, 245) !important;
    --primary-focus: rgba(0, 41, 163, 0.125) !important;
    --primary-focus-opaque: rgb(0, 41, 163) !important;
    --primary-focus-dark: rgb(0, 29, 114) !important;
    --primary-inverse: white !important;
}

/* Dark (auto) */
@media only screen and (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]):not(.fwd-nav) {
        --primary: #1e88e5 !important;
        --primary-hover: #2196f3 !important;
        --primary-focus: rgba(30, 136, 229, 0.25) !important;
        --primary-focus-opaque: rgb(30, 136, 229) !important;
        --primary-inverse: white !important;
    }
}

/* Dark (forced) */
:root[data-theme="dark"]:not(.fwd-nav) {
    --primary: #1e88e5 !important;
    --primary-hover: #2196f3 !important;
    --primary-focus: rgba(30, 136, 229, 0.25) !important;
    --primary-focus-opaque: rgb(30, 136, 229) !important;
    --primary-inverse: white !important;
}

/* Common */
:root {
    --form-element-active-border-color: var(--primary) !important;
    --form-element-focus-color: var(--primary-focus) !important;
    --switch-color: var(--primary-inverse) !important;
    --switch-checked-background-color: var(--primary) !important;
}