/**
 * FluentHour design tokens — Alfameli ePortal (web + mobile PWA)
 *
 * Single source of truth for the locked Fluent Hour blue shell.
 *
 * Mobile sync: mobile/src/theme/fluent-tokens.css (duplicate values — keep in sync)
 *
 * Token map:
 *   --am-bg              Page background (warm off-white)
 *   --am-sidebar-bg      Sidebar fill (no border to content)
 *   --am-surface         Cards / panels
 *   --am-text            Primary headings & body
 *   --am-text-muted      Breadcrumbs, labels, inactive nav
 *   --am-border-subtle   Hairline dividers
 *   --am-accent          Lime primary CTA
 *   --am-accent-text     Text on lime buttons
 *   --am-primary-cta     Alias → --am-accent (primary actions)
 *   --am-success-money   Forest green for positive currency metrics
 *   --am-tab-active      Active tab text + underline
 *   --am-badge-warn      Notification / count pills
 *   --am-input-fill      Rounded grey search & form fill
 */
:root {
    /* Surfaces */
    --am-bg: #F4F8FC;
    --am-sidebar-bg: #EAF1F8;
    --am-sidebar-bg-top: #EAF1F8;
    --am-sidebar-bg-bottom: #EAF1F8;
    --am-sidebar-border: transparent;
    --am-sidebar-text: #5A6B7C;
    --am-sidebar-text-hover: #0C1924;
    --am-sidebar-title: #7A8B9C;
    --am-sidebar-hover: rgba(12, 25, 36, 0.05);
    --am-sidebar-active-bg: #ffffff;
    --am-sidebar-group-bg: rgba(12, 25, 36, 0.045);
    --am-sidebar-glow-top: transparent;
    --am-sidebar-glow-bottom: transparent;
    --am-sidebar-blend-top: transparent;
    --am-sidebar-blend-mid: transparent;
    --am-sidebar-blend-bottom: transparent;
    --am-sidebar-active-icon-bg: transparent;
    --am-sidebar-active-icon-border: transparent;
    --am-sidebar-user-tint: #E0EAF4;
    --am-sidebar-brand-wash: transparent;

    --am-surface: #ffffff;
    --am-surface-secondary: #F2F6FB;
    --am-surface-tertiary: #E6EEF6;
    --am-card: #ffffff;
    --am-glass-surface: #ffffff;
    --am-glass-surface-strong: #ffffff;
    --am-glass-border: #D5E0EC;
    --am-glass-border-soft: rgba(213, 224, 236, 0.9);
    --am-glass-blur: 0px;
    --am-glass-shadow: none;

    /* Typography colors */
    --am-text: #0C1924;
    --am-text-muted: #5A6B7C;
    --am-muted: #5A6B7C;
    --am-outline: #7A8B9C;

    /* Borders */
    --am-border-subtle: #DCE6F0;
    --am-border: #D5E0EC;
    --am-border-strong: #B8C9DA;

    /* Fluent Hour blue — locked. */
    --am-accent: #0078D4;
    --am-accent-hover: #005A9E;
    --am-accent-text: #FFFFFF;
    --am-accent-soft: rgba(0, 120, 212, 0.12);
    --am-primary-cta: var(--am-accent);
    --am-primary-cta-hover: var(--am-accent-hover);
    --am-primary-cta-text: var(--am-accent-text);

    --am-primary: #0078D4;
    --am-primary-dark: #005A9E;
    --am-primary-soft: rgba(0, 120, 212, 0.12);
    --am-primary-fixed: #0078D4;
    --am-on-primary: #FFFFFF;
    --am-emphasis: #005A9E;
    --am-secondary: #0C1924;
    --am-secondary-container: #E6EEF6;

    /* Semantic */
    --am-success: #107c10;
    --am-success-money: #0d6832;
    --am-warning: #bc5b00;
    --am-danger: #ba1a1a;

    /* Tabs, badges, inputs */
    --am-tab-active: #0C1924;
    --am-tab-inactive: #5A6B7C;
    --am-badge-warn: #D6E8F8;
    --am-badge-warn-text: #005A9E;
    --am-input-fill: #E6EEF6;
    --am-search-fill: #E6EEF6;

    --am-focus-ring: 0 0 0 1px #ffffff, 0 0 0 3px rgba(0, 120, 212, 0.45);
}