/* Tokens de diseño de LostPaws (ver docs/DESIGN.md). Mismos valores que la
   app móvil: no cambiar colores sin actualizar el documento de diseño. */
@font-face {
  font-family: 'Nunito';
  src: url('../assets/fonts/Nunito-VariableFont_wght.ttf') format('truetype');
  font-weight: 200 1000;
  font-style: normal;
  font-display: swap;
}

:root {
  --color-primary: #d39886;
  --color-primary-light: #e4b7a8;
  --color-background: #f5f1ed;
  --color-surface: #ffffff;
  --color-text: #554b45;
  --color-muted: #a39b95;
  --color-border: #e4ded9;
  --color-danger: #b3261e;

  /* Relleno suave de los campos: el salmón claro al 35 % */
  --color-field: rgba(228, 183, 168, 0.35);
  --color-primary-soft: rgba(228, 183, 168, 0.45);
  --color-overlay: rgba(85, 75, 69, 0.45);

  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-lg: 16px;
  --space-xl: 24px;
  --space-xxl: 32px;
  --space-3xl: 48px;

  --radius-card: 12px;
  --radius-field: 20px;
  --radius-card-lg: 24px;
  --radius-hero: 32px;
  --radius-pill: 999px;

  --shadow-soft: 0 8px 24px rgba(85, 75, 69, 0.1);
  --shadow-lift: 0 12px 32px rgba(85, 75, 69, 0.18);
  --shadow-button: 0 8px 18px rgba(211, 152, 134, 0.4);

  --font: 'Nunito', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --navbar-height: 72px;
  --content-width: 1200px;
}