/* Tema claro. Se activa con data-theme="light" en <html>. El oscuro sigue siendo el tema por
   defecto de la marca; el claro es la misma bóveda con la luz encendida: hueso cálido, nunca #fff.
   Mismos nombres de token, solo cambian los valores → todo componente que use var(--bb-*) se adapta. */
[data-theme="light"]{
  color-scheme: light;
  --bb-bg:            #F7F4EC;
  --bb-bg-band:       #EFEBE1;
  --bb-bg-elevated:   #FFFDF8;
  --bb-line:          #DDD8CC;
  --bb-veil:          rgba(247, 244, 236, 0.72);
  --bb-header-veil:   rgba(247, 244, 236, 0.82);

  --bb-text:          #1D1D1F;
  --bb-text-muted:    #6B6A65;

  /* El violeta se oscurece un paso para sostener contraste sobre hueso;
     el lila deja de ser color de texto: enlaces y acentos de texto usan violeta. */
  --bb-violet:        #6D28D9;
  --bb-violet-deep:   #4C1D95;
  --bb-lilac:         #6D28D9;
  --bb-lilac-light:   #5B21B6;
  --bb-violet-soft:   rgba(109, 40, 217, 0.10);
  --bb-on-accent:     #F2EFE8; /* hueso sobre #6D28D9 ≈ 6.4:1 */
  --bb-accent-line:   var(--bb-violet); /* sobre hueso el violeta ya contrasta: trazo y relleno coinciden */

  --bb-success:       #15803D;
  --bb-error:         #B91C1C;
  --bb-warning:       #A16207;

  --bb-terracotta:    #C4552F;

  --bb-flow-glow:     radial-gradient(closest-side, rgba(109, 40, 217, 0.28), rgba(109, 40, 217, 0)); /* @kind other */
}