$color-primary: var(--primary);
$color-secondary: var(--dca-action-bg, var(--dca-primary, var(--header-bg)));
$color-gray: var(--dca-gray, var(--breadcrumbs-fg, #999));
$dark-fg: var(--dca-dark-fg, #333);

$body-bg: var(--body-bg);
$body-fg: var(--body-fg);
$font-size-base: 0.8125rem;

$nav-pills-color: var(--dca-action-text, $body-bg);
$nav-pills-background: $color-secondary;
$nav-link-padding-y: 0.3rem;
$nav-pills-padding: 1px 12px;
$nav-pills-margin: 0.5rem;
$nav-pills-border-radius: 4px;
$nav-pills-height: 30px;

$btn-border-radius-base: var(--dca-btn-radius, 5px);
$btn-active-shadow: none;
$component-active-bg: $color-secondary;

[data-theme="auto"] {
    --dca-light-mode: 1;
    --dca-dark-mode: 0;
}
@media (prefers-color-scheme: dark) {
    [data-theme="auto"] {
        --dca-light-mode: 0;
        --dca-dark-mode: 1;
    }
}

[data-theme="light"] {
    --dca-light-mode: 1;
    --dca-dark-mode: 0;
}

[data-theme="dark"] {
    --dca-light-mode: 0;
    --dca-dark-mode: 1;
}
