/*
 * Orena One — tokens semânticos iniciais (Fase 1: Brand Foundation).
 *
 * Só DEFINE variáveis; nenhuma tela é obrigada a usá-las ainda e nenhum
 * estilo existente foi substituído. A migração das telas para os tokens
 * é a Fase 2 (docs/orena/02-design-system-proposto.md).
 *
 * Valores = paleta ATUAL do sistema (tema escuro), sem cor nova.
 * TODO(decisão pendente §5.1 do plano): paleta definitiva da marca Orena
 * One. Quando decidida, muda-se o valor aqui — não os nomes.
 *
 * Arquivo local, sem importar CSS externo: precisa funcionar no Edge offline.
 */
:root {
    /* Superfícies */
    --orena-bg: #090a0f;
    --orena-surface: #111318;
    --orena-surface-sunken: #0b0c10;
    --orena-surface-raised: #161922;

    /* Texto — secundário mantém contraste AA sobre --orena-bg/--orena-surface */
    --orena-text-primary: #e4e4e7;
    --orena-text-secondary: #a1a1aa;
    --orena-text-inverse: #000000;

    /* Bordas */
    --orena-border: #222630;
    --orena-border-strong: #2a2f3f;

    /* Marca / ação principal (provisório: acento ciano atual) */
    --orena-primary: #00f2ff;
    --orena-primary-strong: #0072ff;
    --orena-link: #52a5e0;

    /* Estados */
    --orena-success: #2ecc71;
    --orena-warning: #f59e0b;
    --orena-danger: #ef4444;
    --orena-info: #52a5e0;

    /* Foco: anel visível sempre (acessibilidade). Ainda não aplicado às
       telas — elas continuam com o CSS próprio até a Fase 2. */
    --orena-focus-ring: #00f2ff;
    --orena-focus-ring-width: 2px;

    /* Tipografia */
    --orena-font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --orena-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    --orena-font-size-min: 12px;

    /* Forma: cantos retos continuam a identidade atual (regra travada por
       teste). TODO(decisão pendente §5.2): manter ou não. */
    --orena-radius: 0;
}

/*
 * ------------------------------------------------------------------
 * Fase 2 — Orena Design System Core (docs/orena/design-system/01-tokens.md)
 *
 * Os tokens acima (Fase 1) continuam valendo e NÃO mudam de nome.
 * Abaixo, a escala completa que os componentes `.o-*` consomem.
 * Tudo aqui é aditivo: nenhuma tela existente lê estes nomes ainda,
 * então defini-los não altera nenhuma tela.
 * ------------------------------------------------------------------
 */
:root {
    /* ---------- Cores semânticas ---------- */
    --orena-background: var(--orena-bg);
    /* --orena-surface e --orena-surface-raised já existem (Fase 1) */
    --orena-surface-muted: var(--orena-surface-sunken);
    /* --orena-border e --orena-border-strong já existem (Fase 1).
       Borda de CONTROLE (input, checkbox): >= 3:1 sobre a superfície. */
    --orena-border-control: #71717a;

    /* --orena-text-primary / --orena-text-secondary já existem (Fase 1).
       Muted = placeholder, rótulo auxiliar. #71717a não atinge 4.5:1
       sobre o fundo; este tom atinge (>= 5:1). */
    --orena-text-muted: #8b8b94;

    /* --orena-primary já existe (Fase 1). Hover reaproveita o ciano
       claro que já existe na UI atual — sem cor nova. */
    --orena-primary-hover: #7de8ff;
    --orena-on-primary: var(--orena-text-inverse);

    /* Estados: cor de texto/borda (já existem) + fundo tonal + preenchimento
       sólido com contraste AA para texto. */
    --orena-success-bg: rgba(46, 204, 113, 0.12);
    --orena-warning-bg: rgba(245, 158, 11, 0.12);
    --orena-danger-bg: rgba(239, 68, 68, 0.12);
    --orena-info-bg: rgba(82, 165, 224, 0.12);
    --orena-on-success: #000000;
    --orena-on-warning: #000000;
    /* #ef4444 com texto branco dá 3.76:1 (reprova AA). Preenchimento
       destrutivo usa o tom mais escuro: 4.83:1. */
    --orena-danger-strong: #dc2626;
    --orena-danger-strong-hover: #b91c1c;
    --orena-on-danger: #ffffff;

    /* ---------- Estados de disponibilidade (DS-01c) ----------
       Só ALIAS dos tons já existentes: nenhuma cor nova. Cada estado tem
       texto/borda + fundo tonal; a tela deve sempre acompanhar a cor de
       texto (e ícone quando couber) — estado nunca depende só de cor. */
    --orena-neutral: var(--orena-text-secondary);          /* sem estado / padrão */
    --orena-neutral-bg: rgba(161, 161, 170, 0.12);
    --orena-unavailable: var(--orena-text-muted);          /* indisponível / desativado */
    --orena-unavailable-bg: var(--orena-surface-sunken);
    --orena-readonly-bg: var(--orena-surface-sunken);      /* somente leitura */
    --orena-readonly-border: var(--orena-border-strong);
    --orena-blocked: var(--orena-danger);                  /* bloqueado por regra/permissão */
    --orena-blocked-bg: var(--orena-danger-bg);
    --orena-partial: var(--orena-warning);                 /* parcial / incompleto */
    --orena-partial-bg: var(--orena-warning-bg);
    --orena-disabled-opacity: 0.45;                        /* mesmo valor dos componentes .o-* */

    /* ---------- Densidade (DS-01c) ----------
       Altura de linha/controle por contexto: compacta (tabela densa),
       confortável (backoffice) e toque (PDV/tablet). */
    --orena-density-compact: var(--orena-control-height-sm);
    --orena-density-comfortable: var(--orena-control-height-md);
    --orena-density-touch: var(--orena-hit-target-touch);

    /* Números alinhados (valores, quantidades, relógios). Tailwind não é
       fonte disto: usar `.o-tabular` ou `font-variant-numeric: var(...)`. */
    --orena-font-variant-numeric: tabular-nums;

    /* ---------- Tipografia ---------- */
    --orena-font-family: var(--orena-font-sans);
    --orena-font-size-xs: 12px;   /* mínimo absoluto (Fase 1) */
    --orena-font-size-sm: 13px;
    --orena-font-size-md: 14px;   /* corpo padrão do sistema interno */
    --orena-font-size-lg: 16px;
    --orena-font-size-xl: 18px;
    --orena-font-size-2xl: 24px;
    --orena-font-size-3xl: 32px;
    /* Site público (hero): fluido, nunca abaixo de 32px */
    --orena-font-size-display: clamp(32px, 5vw + 12px, 64px);

    --orena-line-height-tight: 1.2;
    --orena-line-height-snug: 1.35;
    --orena-line-height-normal: 1.5;
    --orena-line-height-relaxed: 1.65;

    --orena-font-weight-regular: 400;
    --orena-font-weight-medium: 500;
    --orena-font-weight-semibold: 600;
    --orena-font-weight-bold: 700;
    --orena-font-weight-extrabold: 800;

    /* ---------- Espaçamento (base 4px, índices alinhados ao Tailwind) ---------- */
    --orena-space-0: 0;
    --orena-space-1: 4px;
    --orena-space-2: 8px;
    --orena-space-3: 12px;
    --orena-space-4: 16px;
    --orena-space-5: 20px;
    --orena-space-6: 24px;
    --orena-space-8: 32px;
    --orena-space-10: 40px;
    --orena-space-12: 48px;
    --orena-space-16: 64px;
    --orena-space-20: 80px;
    --orena-space-24: 96px;

    /* ---------- Layout ---------- */
    --orena-gutter: 16px;          /* mobile; 24px >= tablet; 32px >= wide */
    --orena-container-max: 1280px;
    --orena-section-spacing: 64px; /* site público: 96px >= desktop */

    /* Área clicável mínima (WCAG 2.5.8 recomenda 24px; adotamos 40px no
       backoffice e 44px no toque/PDV). */
    --orena-hit-target: 40px;
    --orena-hit-target-touch: 44px;

    /* Alturas de controle (input, select, botão md) */
    --orena-control-height-sm: 32px;
    --orena-control-height-md: 40px;
    --orena-control-height-lg: 48px;

    /* ---------- Radius ----------
       Escala Orena (decisão aprovada na revisão da Fase 2). Vale só para os
       componentes `.o-*`: `--orena-radius` (Fase 1, 0) continua sendo o
       canto das telas legadas, que não mudam nesta fase.
       Botões e campos usam sm/md — nunca pill. `full` fica restrito ao que
       é semanticamente pill: badge, chip de filtro, switch, spinner. */
    --orena-radius-sm: 4px;
    --orena-radius-md: 6px;
    --orena-radius-lg: 8px;
    --orena-radius-xl: 12px;
    --orena-radius-full: 9999px;  /* pill: badge, chip, switch, avatar */

    /* ---------- Sombras ---------- */
    --orena-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
    --orena-shadow-md: 0 4px 20px rgba(0, 0, 0, 0.45);
    --orena-shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.6);

    /* Véu atrás de modal/dialog (DS-03). Único valor de overlay do DS. */
    --orena-overlay: rgba(0, 0, 0, 0.75);

    /* ---------- Z-index ----------
       Acima dos overlays legados (que chegam a 9999) para que um modal/toast
       do DS nunca fique atrás de um componente antigo na mesma tela. */
    --orena-z-dropdown: 1000;
    --orena-z-sticky: 1100;
    --orena-z-modal: 10000;
    --orena-z-toast: 10100;

    /* ---------- Breakpoints ----------
       Variáveis CSS não funcionam dentro de @media: estes valores são a
       referência (JS, docs) e os @media do DS usam os mesmos números
       literais (travado por teste). */
    --orena-bp-mobile: 360px;
    --orena-bp-tablet: 768px;
    --orena-bp-desktop: 1024px;
    --orena-bp-wide: 1280px;

    /* ---------- Motion (DS-MOTION-01) ---------- */
    --orena-motion-fast: 150ms;
    --orena-motion-normal: 300ms;
    --orena-motion-slow: 500ms;
    --orena-ease: cubic-bezier(0.4, 0, 0.2, 1);
    --orena-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    /* Deslocamento das entradas: discreto no sistema interno; o site
       público aumenta via [data-orena-motion="site"] (orena.motion.css). */
    --orena-motion-distance: 4px;
    /* Nomes curtos da especificação DS-MOTION-01 (aliases). */
    --motion-fast: var(--orena-motion-fast);
    --motion-normal: var(--orena-motion-normal);
    --motion-slow: var(--orena-motion-slow);
}

/*
 * ------------------------------------------------------------------
 * UIUX-01B — aliases de adoção (docs/orena/uiux-01/, §7 da UIUX-01A)
 *
 * SÓ aliases de valores que já existem acima: nenhuma cor, tamanho ou
 * sombra nova (exceção documentada: --orena-module-*, que traz para cá
 * os tons que o Hub já usa via Tailwind). Nenhum nome existente muda.
 * `--orena-radius` (0) fica DEPRECADO: continua definido enquanto houver
 * tela legada; componentes novos usam --orena-radius-sm/md/lg.
 * ------------------------------------------------------------------
 */
:root {
    /* ---------- Spacing semântico ---------- */
    --orena-space-inline-xs: var(--orena-space-1);   /* ícone ↔ texto */
    --orena-space-inline-sm: var(--orena-space-2);
    --orena-space-stack-field: var(--orena-space-4); /* entre campos */
    --orena-space-inset-card: var(--orena-space-4);  /* 24px >= tablet */
    --orena-space-inset-modal: var(--orena-space-6);
    --orena-space-section: var(--orena-space-6);     /* entre seções internas */
    --orena-space-page-y: var(--orena-space-6);      /* 32px >= desktop */

    /* ---------- Papéis tipográficos (size | weight | leading) ---------- */
    --orena-text-display-size: var(--orena-font-size-display);
    --orena-text-display-weight: var(--orena-font-weight-extrabold);
    --orena-text-display-leading: var(--orena-line-height-tight);
    --orena-text-h1-size: var(--orena-font-size-2xl);
    --orena-text-h1-weight: var(--orena-font-weight-extrabold);
    --orena-text-h1-leading: var(--orena-line-height-tight);
    --orena-text-h2-size: var(--orena-font-size-xl);
    --orena-text-h2-weight: var(--orena-font-weight-bold);
    --orena-text-h2-leading: var(--orena-line-height-snug);
    --orena-text-h3-size: var(--orena-font-size-lg);
    --orena-text-h3-weight: var(--orena-font-weight-bold);
    --orena-text-h3-leading: var(--orena-line-height-snug);
    --orena-text-body-size: var(--orena-font-size-md);
    --orena-text-body-weight: var(--orena-font-weight-regular);
    --orena-text-body-leading: var(--orena-line-height-normal);
    --orena-text-body-sm-size: var(--orena-font-size-sm);
    --orena-text-body-sm-weight: var(--orena-font-weight-medium);
    --orena-text-body-sm-leading: var(--orena-line-height-normal);
    --orena-text-label-size: var(--orena-font-size-sm);
    --orena-text-label-weight: var(--orena-font-weight-semibold);
    --orena-text-label-leading: var(--orena-line-height-snug);
    --orena-text-caption-size: var(--orena-font-size-xs);  /* piso: 12px */
    --orena-text-caption-weight: var(--orena-font-weight-semibold);
    --orena-text-caption-leading: var(--orena-line-height-normal);

    /* ---------- Elevação (superfície + sombra existentes) ---------- */
    --orena-elevation-0-bg: var(--orena-bg);              /* fundo da página */
    --orena-elevation-0-shadow: none;
    --orena-elevation-1-bg: var(--orena-surface);         /* card, sidebar, tabela */
    --orena-elevation-1-shadow: none;
    --orena-elevation-2-bg: var(--orena-surface-raised);  /* dropdown, menu da conta */
    --orena-elevation-2-shadow: var(--orena-shadow-sm);
    --orena-elevation-3-bg: var(--orena-surface-raised);  /* toast, popover */
    --orena-elevation-3-shadow: var(--orena-shadow-md);
    --orena-elevation-4-bg: var(--orena-surface);         /* modal, drawer (+ --orena-overlay) */
    --orena-elevation-4-shadow: var(--orena-shadow-lg);

    /* ---------- Cor de módulo ----------
       Mesmos tons que o Hub já usa (MODULES_REGISTRY.color → Tailwind
       *-400 em tailwind.local.css): cyan, sky, emerald, amber, violet.
       Identificam o módulo; nunca indicam estado. */
    --orena-module-retail: #22d3ee;
    --orena-module-services: #38bdf8;
    --orena-module-health: #34d399;
    --orena-module-food: #fbbf24;
    --orena-module-os: #a78bfa;
}

@media (min-width: 768px) {
    :root { --orena-gutter: 24px; }
    :root { --orena-space-inset-card: var(--orena-space-6); }
}

@media (min-width: 1024px) {
    :root { --orena-space-page-y: var(--orena-space-8); }
}

@media (min-width: 1024px) {
    :root { --orena-section-spacing: 96px; }
}

@media (min-width: 1280px) {
    :root { --orena-gutter: 32px; }
}

/* Motion desligado — por contexto (PDV: data-orena-motion="off") ou por
   preferência do sistema: toda duração do DS vira instantânea e nada se
   desloca. Os componentes ainda zeram animation/transition explicitamente
   (orena.components.css / orena.motion.css). */
[data-orena-motion="off"] {
    --orena-motion-fast: 0.01ms;
    --orena-motion-normal: 0.01ms;
    --orena-motion-slow: 0.01ms;
    --orena-motion-distance: 0px;
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --orena-motion-fast: 0.01ms;
        --orena-motion-normal: 0.01ms;
        --orena-motion-slow: 0.01ms;
        --orena-motion-distance: 0px;
    }
}