/**
 * FluentHour design tokens — Alfameli ePortal (web + mobile PWA)
 *
 * Single source of truth for modern minimal shell: warm surfaces, lime CTA,
 * black underline tabs, borderless tables, pill search inputs.
 *
 * 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: #fafaf8;
    --am-sidebar-bg: #f3f3f1;
    --am-sidebar-bg-top: #f3f3f1;
    --am-sidebar-bg-bottom: #f3f3f1;
    --am-sidebar-border: transparent;
    --am-sidebar-text: #6b6b66;
    --am-sidebar-text-hover: #111110;
    --am-sidebar-title: #8a8a84;
    --am-sidebar-hover: rgba(17, 17, 16, 0.05);
    --am-sidebar-active-bg: #ffffff;
    --am-sidebar-group-bg: rgba(17, 17, 16, 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: #ececea;
    --am-sidebar-brand-wash: transparent;

    --am-surface: #ffffff;
    --am-surface-secondary: #f5f5f3;
    --am-surface-tertiary: #efefed;
    --am-card: #ffffff;
    --am-glass-surface: #ffffff;
    --am-glass-surface-strong: #ffffff;
    --am-glass-border: #ebebe8;
    --am-glass-border-soft: rgba(235, 235, 232, 0.9);
    --am-glass-blur: 0px;
    --am-glass-shadow: none;

    /* Typography colors */
    --am-text: #111110;
    --am-text-muted: #6b6b66;
    --am-muted: #6b6b66;
    --am-outline: #8a8a84;

    /* Borders */
    --am-border-subtle: #ebebe8;
    --am-border: #e8e8e6;
    --am-border-strong: #d4d4d0;

    /* Lime CTA — primary actions always use these */
    --am-accent: #d1ff00;
    --am-accent-hover: #b8e600;
    --am-accent-text: #111110;
    --am-accent-soft: rgba(209, 255, 0, 0.18);
    --am-primary-cta: var(--am-accent);
    --am-primary-cta-hover: var(--am-accent-hover);
    --am-primary-cta-text: var(--am-accent-text);

    /* Brand / link palette (default = lime; user accent partial may override --am-primary) */
    --am-primary: #d1ff00;
    --am-primary-dark: #b8e600;
    --am-primary-soft: rgba(209, 255, 0, 0.18);
    --am-primary-fixed: #d1ff00;
    --am-on-primary: #111110;
    --am-emphasis: #111110;
    --am-secondary: #111110;
    --am-secondary-container: #efefed;

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

    /* Tabs, badges, inputs */
    --am-tab-active: #111110;
    --am-tab-inactive: #6b6b66;
    --am-badge-warn: #e8ff5a;
    --am-badge-warn-text: #111110;
    --am-input-fill: #efefed;
    --am-search-fill: #efefed;

    /* Focus ring uses accent */
    --am-focus-ring: 0 0 0 1px #ffffff, 0 0 0 3px rgba(209, 255, 0, 0.55);
}