/* 1. Definición del Contenedor de Variables */
:root {
  /* --nombre-de-la-variable: valor; */

  /* 2. Paleta de Colores de la Marca Agropago */
  /* Verde Oscuro del logo */
  --color-main: #1C473C;
  --color-main-light: #bfdfd3;
  --color-main-contrary: #FFFFFF;
  --color-ap-today: #163e2d;
  --color-footer: #3ca470;

  --color-bg-grey: #9fb1aa;

  --color-nav-bg: var(--color-main);
  /* Fondo del contenedor de navegación principal */
  --color-border-login: var(--color-main);
  /* Borde del botón "Iniciar Sesión" */

  /* Colores Neutros y de Texto */
  --color-text-nav: var(--color-main-contrary);
  /* Texto en fondo oscuro */
  --color-text-active: var(--color-main);
  /* Texto en elemento activo (blanco) */
  --color-text-login: var(--color-main);
  /* Texto en botones de acción */
  --color-active-bg: var(--color-main-contrary);
  /* Fondo de elemento activo */

  /* 3. Definición de Tipografía (Opcional, pero recomendado) */
  --font-family-header: 'Poppins', sans-serif;
  --font-family-body: 'Poppins', sans-serif;

}