:root {
    
  /* Buttons and Highlights */
  --white-1: white;  
  --color_cpNfP_default: #E3E3E3; /* gris claro */
  --button-color: #049dbf; /* Azul para botones */
  --highlight-color: #ffdd57; /* Amarillo para resaltar */

  /* Text Colors */
  --text-primary: #444444; /* Títulos y encabezados */
  --text-secondary: #474747; /* Bloques internos */
  --text-placeholder: #c9c9c9; /* Placeholder */

  /* Grayscale */
  --drips-1: #345063;
  /*--hover-1: #E3E3E3*/
  --gray-light: #d6d6d6; /* Gris claro */
  --gray-medium: #939393; /* Gris para bordes de tablas */
  --gray-dark: #1f1f1f; /* Gris oscuro */
  --label-gray: #677c8a; /* Gris para etiquetas */
  --table-border-gray: #d1d1d1; /* Línea de bordes para tablas grandes */

  /* Background and Shadows */
  --background-light: #ffffff; /* Fondo claro */
  --background-dark: #989898; /* Fondo oscuro */
  --shadow-color: rgba(0, 0, 0, 0.15);

  /* Utility Colors */
  --divider-color: #e9ecef; /* Divisores */

  /* Palette Colors */
  /* Blues */
  --blue-1: #003356; /* Azul profundo */
  --blue-2: #102A65; /* Azul oscuro */
  --blue-3: #4C82F7; /* Azul brillante */
  --blue-4: #1778F2; /* Azul claro */
  --blue-5: #0074B2; /* Azul usado en Landings AI */
  --blue-6: #7DCCE9; /*#7dcce9 

  /* Purples */
  --purple-1: #C070DC; /* Púrpura vibrante */
  --transparent-gray: #00000080; /* Gris transparente al 50% */

  /* Reds */
  --red-1: #EF4444; /* Rojo brillante */
  
  /* Pink */
  --pink-1: #C989C9; /* ROSA brillante */

  /* Oranges */
  --orange-1: #FFBA08; /* Naranja brillante */
  --orange-2: #FA9576; /* Naranja suave */

  /* Greens */
  --green-1: #22C55E; /* Verde fresco */

  /* Additional Blues */
  --violet-1: #6366F1; /* Azul violeta */

  /* Grays (Neutral Tones) */
  --gray-1: #101622; /* Gris profundo */
  --gray-2: #3E4E65; /* Gris medio */
  --gray-3: #586A7B; /* Gris suave usado en Landings AI */
  --gray-4: #939FAD; /* Gris claro usado en Landings AI */
  --gray-5: #B4BCC9; /* Gris pastel */

  /* Light Grays */
  --light-gray-1: #D4DEE5; /* Gris claro */
  --light-gray-2: #E2EAF1; /* Gris más claro */
  --light-gray-3: #EFF6FC; /* Gris muy claro */
  --light-gray-4: #F3F9FF; /* Gris casi blanco */
}