/* Edit only --brand-color to change the site accent. */
:root {
    --brand-color: #3D3BFF;
    --brand-on-color: #ffffff;
    --brand-text-color: var(--brand-dark-text-color, var(--brand-color));

    /* Keep owned aliases bound when a retained stylesheet loads later. */
    --accent-color: var(--brand-color) !important;
    --accent-color-hover: var(--brand-color) !important;
    --accent-fg: var(--brand-on-color) !important;
    --link-color: var(--brand-text-color) !important;
    --color-green: var(--brand-text-color) !important;
    --md-accent: var(--brand-text-color) !important;
    --md-accent-dim: color-mix(in srgb, var(--brand-color) 15%, transparent) !important;
    --focus-ring-accent: color-mix(in srgb, var(--brand-color) 40%, transparent) !important;
}

.Light, [data-theme="light"], [data-tg-theme="light"] {
    --brand-text-color: color-mix(in srgb, var(--brand-color) 55%, black);
}

:root.Light {
    --md-accent-dim: color-mix(in srgb, var(--brand-color) 12%, transparent) !important;
    --focus-ring-accent: color-mix(in srgb, var(--brand-color) 45%, transparent) !important;
    --btn-bg-primary: var(--brand-color) !important;
    --btn-primary-text-color: var(--brand-on-color) !important;
    --btn-hover-bg-primary: var(--brand-color) !important;
}