/*
  Wortic macOS UI Kit — Typography
  Escala inspirada na hierarquia tipográfica do macOS/SwiftUI.
*/

@layer base {
  body {
    font-family: var(--wm-font-family);
    font-size: var(--wm-font-size-body);
    font-weight: var(--wm-font-weight-regular);
    line-height: var(--wm-leading-body);
    letter-spacing: var(--wm-tracking-body);
    color: var(--wm-label-primary);
    -webkit-font-smoothing: antialiased;
  }

  .wm-text-large-title {
    font-size: var(--wm-font-size-large-title);
    font-weight: var(--wm-font-weight-bold);
    line-height: var(--wm-leading-large-title);
    letter-spacing: var(--wm-tracking-large-title);
  }

  .wm-text-title1 {
    font-size: var(--wm-font-size-title1);
    font-weight: var(--wm-font-weight-bold);
    line-height: var(--wm-leading-title1);
    letter-spacing: var(--wm-tracking-title1);
  }

  .wm-text-title2 {
    font-size: var(--wm-font-size-title2);
    font-weight: var(--wm-font-weight-semibold);
    line-height: var(--wm-leading-title2);
    letter-spacing: var(--wm-tracking-title2);
  }

  .wm-text-title3 {
    font-size: var(--wm-font-size-title3);
    font-weight: var(--wm-font-weight-semibold);
    line-height: var(--wm-leading-title3);
    letter-spacing: var(--wm-tracking-title3);
  }

  .wm-text-headline {
    font-size: var(--wm-font-size-headline);
    font-weight: var(--wm-font-weight-bold);
    line-height: var(--wm-leading-headline);
    letter-spacing: var(--wm-tracking-headline);
  }

  .wm-text-body {
    font-size: var(--wm-font-size-body);
    font-weight: var(--wm-font-weight-regular);
    line-height: var(--wm-leading-body);
    letter-spacing: var(--wm-tracking-body);
  }

  .wm-text-callout {
    font-size: var(--wm-font-size-callout);
    font-weight: var(--wm-font-weight-regular);
    line-height: var(--wm-leading-callout);
    letter-spacing: var(--wm-tracking-callout);
  }

  .wm-text-subheadline {
    font-size: var(--wm-font-size-subheadline);
    font-weight: var(--wm-font-weight-regular);
    line-height: var(--wm-leading-subheadline);
    letter-spacing: var(--wm-tracking-subheadline);
  }

  .wm-text-footnote {
    font-size: var(--wm-font-size-footnote);
    font-weight: var(--wm-font-weight-regular);
    line-height: var(--wm-leading-footnote);
    letter-spacing: var(--wm-tracking-footnote);
  }

  .wm-text-caption {
    font-size: var(--wm-font-size-caption);
    font-weight: var(--wm-font-weight-regular);
    line-height: var(--wm-leading-caption);
    letter-spacing: var(--wm-tracking-caption);
  }

  .wm-text-caption2 {
    font-size: var(--wm-font-size-caption2);
    font-weight: var(--wm-font-weight-medium);
    line-height: var(--wm-leading-caption2);
    letter-spacing: var(--wm-letter-spacing-wide);
    text-transform: uppercase;
  }

  .wm-text-mono {
    font-family: var(--wm-font-family-mono);
  }

  /* Números tabulares — obrigatório onde há dados alinhados
     (tabelas, stats, timestamps, contadores). */
  .wm-text-tabular {
    font-variant-numeric: tabular-nums;
  }

  /* Texto-assinatura da marca: gradiente azul→cyan. Usar SÓ em
     momentos-assinatura (hero, brand, avatar do agente). */
  .wm-text-brand-gradient {
    background: var(--wm-brand-gradient, linear-gradient(135deg, var(--wm-accent), #2ac2f3));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
  }

  /* Cor por hierarquia — combinável com qualquer classe acima */
  .wm-text-primary {
    color: var(--wm-label-primary);
  }
  .wm-text-secondary {
    color: var(--wm-label-secondary);
  }
  .wm-text-tertiary {
    color: var(--wm-label-tertiary);
  }
  .wm-text-quaternary {
    color: var(--wm-label-quaternary);
  }
  .wm-text-accent {
    color: var(--wm-accent);
  }
  .wm-text-success {
    color: var(--wm-success);
  }
  .wm-text-warning {
    color: var(--wm-warning);
  }
  .wm-text-error {
    color: var(--wm-error);
  }

  .wm-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}