/* The deployment profile selects the brand for both public and signed-in pages. */
[data-theme] {
    --brand: #438eb9;
    --brand-action: #2479aa;
    --brand-hover: #1c618b;
    --brand-dark: #153f5b;
    --brand-soft: #edf5fb;
    --brand-ring: #438eb92b;
    --brand-light: #bfdef2;
}
[data-theme="orange"] {
    --brand: #ff7900;
    --brand-action: #b95000;
    --brand-hover: #963e00;
    --brand-dark: #713100;
    --brand-soft: #fff3e8;
    --brand-ring: #ff79002b;
    --brand-light: #ffdbba;
}
.qr-header[data-theme] { background: var(--brand); }
.qr-header[data-theme="orange"] .qr-user-info small { color: #fff; }
.qr-header[data-theme="orange"] .qr-app-mark { background: #222; }
.qr-header[data-theme="orange"] .qr-brand-divider { background: #ffffffa6; }
.qr-header[data-theme="orange"] .qr-company-logo { width: 48px; height: 48px; }
.qr-header[data-theme] .qr-account-menu button:hover,
.qr-header[data-theme] .qr-account-menu button:focus-visible { background: var(--brand-soft); color: var(--brand-action); }
.qr-login[data-theme] { --accent: var(--brand-action); background: var(--brand-soft); }
.qr-login .story { background: var(--brand-dark); }
.qr-login .art svg { color: var(--brand-light); }
.qr-login .eyebrow, .qr-login .description, .qr-login .story-footer { color: var(--brand-light); }
.qr-login .welcome { background: var(--brand-soft); }
.qr-login input:focus { box-shadow: 0 0 0 3px var(--brand-ring); }
.qr-login button:hover { background: var(--brand-hover); }
.qr-login button:focus-visible { outline-color: var(--brand); }
.qr-login .brand { flex-wrap: wrap; }
.qr-login .brand-icon { display: none; }
.login-company-logo { width: 80px; height: 48px; object-fit: contain; margin-right: 6px; }
.qr-login[data-theme="orange"] .login-company-logo { width: 46px; height: 46px; }