:root {
  /* Colores base */
  --color-primary: #FF9339;
  --color-secondary: #EBEFF5;
  --color-tertiary: #B7B7B7;

  /* RGB (para sombras, transparencias, etc.) */
  --color-primary-rgb: 255, 147, 57;
  --color-secondary-rgb: 235, 239, 245;
  --color-tertiary-rgb: 183, 183, 183;

  /* Variantes (puedes ajustar luego fácilmente) */
  --color-primary-hover: color-mix(in srgb, var(--color-primary) 85%, black);
  --color-primary-active: color-mix(in srgb, var(--color-primary) 70%, black);

  --color-secondary-hover: color-mix(in srgb, var(--color-secondary) 90%, black);
  --color-secondary-active: color-mix(in srgb, var(--color-secondary) 80%, black);
     
}
:root {
  --bs-primary: var(--color-primary);
  --bs-primary-rgb: var(--color-primary-rgb);

  --bs-secondary: var(--color-secondary);
  --bs-secondary-rgb: var(--color-secondary-rgb);
}

.tarjeta{
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none; 
  cursor: pointer;

  text-align: center;
  span{
    background-color: var(--color-primary);
    color: white;
    font-size: 1rem;
  }  
  p{
    background-color: var(--color-primary);
    color: white;
    font-size: 1rem;
  }
}