/* ==========================================================================
   noxforest OS — Design Tokens (Dark-first)
   Central design variables for consistent branding across the application.
   Default is dark mode. All surfaces, text, and accents derive from this.
   ========================================================================== */

:root {
    /* ----- Brand colors ----- */
    --nox-navy:          #01081E;
    --nox-steel-blue:    #1B75BB;
    --nox-teal:          #01A59D;

    /* ----- Accent / pastel palette ----- */
    --nox-accent-mint:   #92F4EC;
    --nox-accent-slate:  #6E7DA0;
    --nox-accent-sky:    #7FBCE5;
    --nox-accent-ocean:  #3A6793;

    /* ----- Dark surface hierarchy (darkest → lightest) ----- */
    --nox-surface-base:    #01081E;   /* app background — pure navy */
    --nox-surface-shell:   #060F24;   /* sidebar, appbar background */
    --nox-surface-raised:  #0B1629;   /* cards, panels, dialogs */
    --nox-surface-overlay: #101D33;   /* dropdowns, popovers, hover surfaces */
    --nox-surface-input:   #0D1A2E;   /* input field backgrounds */

    /* ----- Border hierarchy ----- */
    --nox-border-subtle:   rgba(255, 255, 255, 0.06);
    --nox-border-default:  rgba(255, 255, 255, 0.10);
    --nox-border-strong:   rgba(255, 255, 255, 0.16);

    /* ----- Text hierarchy ----- */
    --nox-text-primary:    #E8EDF4;   /* main text — high contrast */
    --nox-text-secondary:  #8B95A8;   /* descriptions, labels */
    --nox-text-muted:      #4E5A6E;   /* hints, disabled, placeholders */
    --nox-text-inverse:    #01081E;   /* text on bright surfaces */

    /* ----- Semantic colors ----- */
    --nox-success:       #34D399;
    --nox-warning:       #FBBF24;
    --nox-error:         #F87171;
    --nox-info:          var(--nox-steel-blue);

    /* ----- Interactive states ----- */
    --nox-hover-bg:        rgba(27, 117, 187, 0.08);
    --nox-active-bg:       rgba(27, 117, 187, 0.14);
    --nox-focus-ring:      rgba(27, 117, 187, 0.30);

    /* ----- Glass / frosted effects (used sparingly) ----- */
    --nox-glass-bg:        rgba(6, 15, 36, 0.80);
    --nox-glass-border:    rgba(255, 255, 255, 0.08);
    --nox-glass-blur:      24px;
    --nox-glass-shadow:    0 8px 32px rgba(0, 0, 0, 0.40);

    /* ----- Typography ----- */
    --nox-font-family:   'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
    --nox-font-size-xs:  0.75rem;
    --nox-font-size-sm:  0.8125rem;
    --nox-font-size-md:  0.9375rem;
    --nox-font-size-lg:  1.125rem;
    --nox-font-size-xl:  1.5rem;
    --nox-font-size-2xl: 2rem;
    --nox-font-weight-normal: 400;
    --nox-font-weight-medium: 500;
    --nox-font-weight-semibold: 600;
    --nox-font-weight-bold: 700;

    /* ----- Spacing ----- */
    --nox-space-xs:  0.25rem;
    --nox-space-sm:  0.5rem;
    --nox-space-md:  1rem;
    --nox-space-lg:  1.5rem;
    --nox-space-xl:  2rem;
    --nox-space-2xl: 3rem;

    /* ----- Radius ----- */
    --nox-radius-sm:  8px;
    --nox-radius-md:  12px;
    --nox-radius-lg:  16px;
    --nox-radius-xl:  24px;
    --nox-radius-full: 9999px;

    /* ----- Layout ----- */
    --nox-sidebar-width:     260px;
    --nox-header-height:     64px;
    --nox-sidebar-collapsed:  72px;

    /* ----- Transitions ----- */
    --nox-transition-fast:   150ms ease;
    --nox-transition-normal: 250ms ease;
    --nox-transition-slow:   400ms ease;
}