@import url('https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap');

:root {
  --erp-font-family: "Public Sans", sans-serif;

  --erp-color-primary: #212b36;
  --erp-color-primary-hover: #3c4a5c;
  --erp-color-brand: #cd0211;
  --erp-color-destructive: #ff5630;
  --erp-color-error: #b71d18;
  --erp-color-success: #118d57;
  --erp-color-warning: #b76e00;
  --erp-color-warning-bg: #b76e0014;
  --erp-color-arrival: #5119b7;

  --erp-color-text-primary: #212b36;
  --erp-color-text-secondary: #637381;
  --erp-color-text-disabled: #919eab;
  --erp-color-border: #919eab52;
  --erp-color-border-subtle: #919eab29;
  --erp-color-surface: #ffffff;
  --erp-color-surface-muted: #f4f6f8;
  --erp-color-selected-bg: #919eab14;
  --erp-color-destructive-bg: #ff563029;
  --erp-color-error-bg: #b71d1814;

  --erp-radius-control: 8px;
  --erp-radius-card: 12px;
  --erp-radius-hero: 16px;
  --erp-shadow-floating: 0 8px 24px rgba(33, 43, 54, 0.14);

  /* Shared responsive scale: mobile, tablet, compact desktop, desktop, large. */
  --erp-breakpoint-mobile: 640px;
  --erp-breakpoint-tablet: 768px;
  --erp-breakpoint-compact: 1024px;
  --erp-breakpoint-desktop: 1280px;
  --erp-breakpoint-large: 1680px;

  /* Compatibility aliases for established OLEN styles. */
  --color_principal: var(--erp-color-primary);
  --color_hover_olen: var(--erp-color-brand);
  --color_rojo_olen: var(--erp-color-brand);
  --color_texto: var(--erp-color-text-primary);
  --fuente_texto: var(--erp-font-family);
  --color_error: var(--erp-color-error);
  --color_status_arrival: var(--erp-color-arrival);
  --color_status_rejected: var(--erp-color-error);
  --sp_color_gris_claro_medio_olen: var(--erp-color-text-disabled);
  --sp_color_gris_medio_olen: var(--erp-color-text-secondary);
  --sp_color_gris_oscturo_medio_olen: var(--erp-color-text-primary);
  --sp_color_disabled_olen: var(--erp-color-text-disabled);
  --sp_color_naranja_olen_2: var(--erp-color-destructive);
  --sp_color_bg_rejected_olen: var(--erp-color-destructive-bg);
}

body {
  font-family: var(--erp-font-family);
}
