/*
 * Design tokens de tema (cores, raio), reutilizáveis por qualquer tela via
 * --app-*. Não toca nos assets do Apple Pay (bootstrap.css/index.css).
 */

:root {
    color-scheme: light dark;

    --app-bg: #f5f6f8;
    --app-surface: #ffffff;
    --app-border: #d5d8de;
    --app-text: #1c1e21;
    --app-muted: #6b7280;
    --app-accent: #0b5fff;
    --app-accent-contrast: #ffffff;
    --app-success: #1a7f37;
    --app-error: #b42318;
    --app-badge-browser-bg: #e7f0ff;
    --app-badge-browser-fg: #0b5fff;
    --app-badge-default-bg: #f0f0f2;
    --app-badge-default-fg: #6b7280;
    --app-radius: 8px;
}

@media (prefers-color-scheme: dark) {
    :root {
        --app-bg: #16181c;
        --app-surface: #202329;
        --app-border: #363a42;
        --app-text: #e8eaed;
        --app-muted: #9aa0ab;
        --app-accent: #204486;
        --app-accent-contrast: #ffffff;
        --app-success: #3fb950;
        --app-error: #f0836f;
        --app-badge-browser-bg: #16305c;
        --app-badge-browser-fg: #9dc0ff;
        --app-badge-default-bg: #2a2e35;
        --app-badge-default-fg: #9aa0ab;
    }
}