/* ============================================================
   TOKENS — escala compartida por todas las apps Blazor
   ------------------------------------------------------------
   Se enlaza por MSBuild en cada wwwroot (ver los .csproj), no hay
   proyecto compartido ni cambio de runtime.

   Carga SIEMPRE antes que el app.css de cada app:
     tokens → touch → responsive → pos-components → app.css

   Los colores NO se redefinen aquí: se toman de MudBlazor
   (--mud-palette-*), que cada app ya emite segun su tema. Asi los
   tokens funcionan pese a que las apps van con versiones distintas
   de MudBlazor (7.8 / 8.2 / 8.6) sin tocar ninguna.
   ============================================================ */

:root {
    /* ── Espaciado: escala de 4px (Material / Apple HIG) ── */
    --sp-1: 4px;
    --sp-2: 8px;
    --sp-3: 12px;
    --sp-4: 16px;
    --sp-5: 24px;
    --sp-6: 32px;
    --sp-7: 48px;

    /* ── Radios: UNA escala. Antes convivian 6/8/10/12/16 sueltos. ── */
    --radius-sm: 8px;   /* campos, chips */
    --radius-md: 10px;  /* botones, tarjetas */
    --radius-lg: 14px;  /* dialogos, paneles */
    --radius-pill: 999px;

    /* ── Areas tactiles ──
       44px es el minimo de WCAG 2.5.5 / Apple HIG; la casa usa 56px
       por comodidad en un POS que se opera de pie y con prisa. */
    --touch-min: 44px;
    --touch-comfort: 56px;
    --touch-nav: 52px;
    --touch-list: 64px;

    /* ── Tipografia ──
       Pila del sistema: sin internet el tablet Android cae en Roboto y
       Windows en Segoe UI, ambas disenadas para UI. Antes caia en Arial. */
    --font-ui: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto,
               'Helvetica Neue', Helvetica, Arial, sans-serif;

    /* Suelo de legibilidad. Nada por debajo de --fs-min en texto visible:
       las etiquetas de boton del POS estaban en 9-10px. */
    --fs-min: 0.75rem;    /* 12px */
    --fs-body: 0.9375rem; /* 15px */
    --fs-lg: 1.125rem;
    --fs-xl: 1.5rem;

    /* ── Movimiento ──
       Curvas fuertes: las de CSS por defecto se sienten flojas.
       Nunca ease-in en UI: retrasa el arranque justo cuando el usuario mira. */
    --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
    --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
    --dur-press: 70ms;    /* feedback de pulsacion */
    --dur-enter: 200ms;   /* entrada de dialogo / panel */
    --dur-exit: 140ms;    /* salida: mas rapida que la entrada */

    /* ── Alias semanticos sobre la paleta de MudBlazor ──
       Usar estos en vez de hex a mano, o el modo oscuro se rompe
       (le paso a .pos-amt-due/.pos-amt-total, que traian #111827/#2563EB). */
    --ui-surface: var(--mud-palette-surface, #fff);
    --ui-bg: var(--mud-palette-background, #f8fafc);
    --ui-text: var(--mud-palette-text-primary, #0f172a);
    --ui-text-soft: var(--mud-palette-text-secondary, #475569);
    --ui-accent: var(--mud-palette-primary, #1d4ed8);
    --ui-line: var(--mud-palette-lines-default, #cbd5e1);
    --ui-appbar: var(--mud-palette-appbar-background, #1d4ed8);
    --ui-drawer: var(--mud-palette-drawer-background, #fff);
}