/* Robbina Accesibilidad — design tokens
 * Extraídos del CSS de robbina.com. Single source of truth.
 * Si Tailwind no alcanza, importar esto en componentes ad-hoc.
 */

:root {
  /* Colores */
  --rb-bg:           #FFFFFF;
  --rb-ink:          #2A1F18;
  --rb-ink-soft:     #5F4F42;
  --rb-indigo:       #030085;
  --rb-accent:       #FF6000;

  --rb-peach:        #FFD4BD;
  --rb-blue:         #D6E4F2;
  --rb-mint:         #D5EBDD;
  --rb-lilac:        #E0D9F2;
  --rb-peach-soft:   #FAECE7;

  /* DALCo */
  --rb-dalco-D:      #FFD4BD;
  --rb-dalco-A:      #D6E4F2;
  --rb-dalco-L:      #FFE9A8;
  --rb-dalco-Co:     #D5EBDD;

  /* Sentiment (del mural UNLa) */
  --rb-sent-ok:      #16A34A;
  --rb-sent-neut:    #F59E0B;
  --rb-sent-alert:   #DC2626;

  /* Forma */
  --rb-radius-card:  18px;
  --rb-radius-chip:  999px;
  --rb-maxw-site:    1280px;

  /* Tipografía */
  --rb-font-display: "Signika", system-ui, sans-serif;
  --rb-font-body:    "Roboto", system-ui, sans-serif;
  --rb-eyebrow-spacing: 0.12em;
}

html {
  font-family: var(--rb-font-body);
  color: var(--rb-ink);
  background: var(--rb-bg);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
  font-family: var(--rb-font-display);
  color: var(--rb-indigo);
  font-weight: 700;
}

.rb-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: var(--rb-eyebrow-spacing);
  color: var(--rb-accent);
}
.rb-eyebrow::before {
  content: "";
  display: inline-block;
  width: 14px;
  height: 2px;
  background: var(--rb-accent);
}

.rb-card {
  border-radius: var(--rb-radius-card);
  padding: 18px;
}

.rb-chip {
  border-radius: var(--rb-radius-chip);
  padding: 6px 12px;
  font-size: 12px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* Badge "borrador IA · revisar" */
.rb-ia-badge {
  display: inline-flex;
  gap: 4px;
  align-items: center;
  background: var(--rb-peach-soft);
  color: var(--rb-accent);
  border-radius: var(--rb-radius-chip);
  font-size: 10px;
  font-weight: 600;
  padding: 2px 8px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.rb-ia-badge::before { content: "✱"; }
