/* ============================================================
   tema.css — Variables de color y tipografía del portal
   EDITAR SOLO ESTE ARCHIVO para cambiar la paleta de colores
   de toda la web al personalizar para un nuevo cliente.
   Paleta sincronizada con el Portal de Resultados (pacientes).
   ============================================================ */

:root {
  /* COLORES PRIMARIOS - Edita estos valores para cambiar la paleta */
  --brand-primary: #009B59;           /* Verde principal - botones, headers, enlaces activos */
  --brand-primary-light: #06DB80;     /* Verde claro - hover, backgrounds suaves */
  --brand-primary-dark: #039A57;      /* Verde oscuro - texto, bordes de énfasis */

  /* COLORES SECUNDARIOS */
  --brand-secondary: #F2C587;         /* Naranja/dorado - acentos, destacados */
  --brand-accent-blue: #76b5e6;       /* Azul - información, estados */

  /* COLORES NEUTRALES */
  --brand-white: #FFFFFF;
  --brand-light-gray: #F5F5F5;        /* Gris muy claro - backgrounds */
  --brand-medium-gray: #8E8E8E;       /* Gris medio - borders, disabled */
  --brand-dark-gray: #4C4C4C;         /* Gris oscuro - texto principal */
  --brand-border-gray: #C0C0C0;       /* Gris claro - bordes */

  /* COLORES DE ESTADO */
  --brand-success: #09CF77;           /* Verde éxito - mensajes positivos */
  --brand-warning: #FFD700;           /* Dorado - advertencias */
  --brand-danger: #FF0000;            /* Rojo - errores, alertas */

  /* ESTILOS DE FONDOS */
  --brand-bg-overlay: rgba(255, 255, 255, 0.90);
  --brand-bg-disabled: rgba(128, 128, 128, 0.4);

  /* FUENTES */
  --brand-font-family: 'Source Sans Pro', 'Maven Pro', Arial, sans-serif;
  --brand-font-size-base: 13px;

  /* COMPONENTES UI */
  --brand-topbar-bg: var(--brand-primary-dark);
  --brand-navbar-border: var(--brand-primary);

  /* ALIASES semánticos usados en los componentes del portal */
  --color-primario:      var(--brand-primary);
  --color-primario-hover:var(--brand-primary-dark);
  --color-acento:        var(--brand-primary-light);
  --color-fondo:         var(--brand-light-gray);
  --color-superficie:    var(--brand-white);
  --color-texto:         var(--brand-dark-gray);
  --color-texto-suave:   var(--brand-medium-gray);
  --color-borde:         var(--brand-border-gray);
  --color-exito:         var(--brand-success);
  --color-alerta:        var(--brand-secondary);
  --color-sin-dato:      var(--brand-medium-gray);
  --color-error:         var(--brand-danger);
}