/* PDA owns branding; the installed packages own their controls and account flows. */
:root {
    --sf-font: "Segoe UI", system-ui, sans-serif;
    --sf-accent: #0f766e;
    --sf-accent-hover: #115e59;
    --sf-accent-soft: #e4f6f3;
    --sf-on-accent: #fff;
    --sf-muted: #576780;
    --sf-muted-strong: #576780;
    --sf-tab-text: #576780;
    --sf-table-heading: #576780;
    --sf-badge-text: #576780;
    --sf-focus-outline: #0f766e;
    --sf-radius: 16px;
    --sf-control-radius: 10px;
}

/* Package-wide small text must follow the surface that owns it. */
.desktop-shell { --surface-muted: var(--muted); }
.desktop-shell small { color: var(--surface-muted); }
.desktop-shell :is(.sf-theme, .sf-page, .sf-card, .sf-modal, .sf-auth-shell,
    .desktop-dialog, .plan-library, .editor, .order-summary, .login-card) {
    --surface-muted: var(--sf-muted-strong);
}
.desktop-shell .desktop-dialog-dark { --surface-muted: var(--muted); }

/* Keep the supplied account/company components on their intended light surfaces. */
.desktop-shell :is(.sf-page, .sf-card, .sf-modal, .sf-auth-shell) { color: var(--sf-text); }
.desktop-shell .sf-page { background: var(--sf-bg); }
.bottom-nav a small { color: inherit; }

.sf-auth-shell { min-height: 100dvh; }
.pda-package-administration { color: #172c29; }
.pda-package-administration .sf-card { margin-block: 1rem; }
.user-area { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; }
.user-area form { margin: 0; }