/* ========================================
   Lazio Pill
   Colored badge with optional icon
   ======================================== */

.lazio-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  white-space: nowrap;
  line-height: 1.4;
}

.lazio-pill__icon {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  line-height: 1;
}

.lazio-pill__icon i,
.lazio-pill__icon svg {
  font-size: inherit;
  display: block;
}

.lazio-pill__icon img {
  display: block;
  height: auto;
}

.lazio-pill__text {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  text-transform: uppercase;
}

/* ----------------------------------------
   Size: Small — 13px / 2px 8px
   ---------------------------------------- */
.lazio-pill--sm {
  padding: 2px 8px;
}

.lazio-pill--sm .lazio-pill__text {
  font-size: 13px;
}

/* ----------------------------------------
   Size: Medium — 16px / 3px 10px
   ---------------------------------------- */
.lazio-pill--md {
  padding: 3px 10px;
}

.lazio-pill--md .lazio-pill__text {
  font-size: 16px;
}

/* ----------------------------------------
   Size: Large — 18px / 5px 15px
   ---------------------------------------- */
.lazio-pill--lg {
  padding: 5px 15px;
}

.lazio-pill--lg .lazio-pill__text {
  font-size: 18px;
}

/* ----------------------------------------
   Modifier: Flank (left border)
   ---------------------------------------- */
.lazio-pill--flank {
  border-left: 5px solid currentColor;
}

/* ----------------------------------------
   Preset: Emerald (positive/success)
   ---------------------------------------- */
.lazio-pill--emerald {
  background-color: var(--dark-emerald-t-2, rgba(177, 204, 187, 0.33));
  color: var(--dark-emerald, #166534);
}

/* ----------------------------------------
   Preset: Carmine (negative/warning)
   ---------------------------------------- */
.lazio-pill--carmine {
  background-color: var(--carmine-t-2, rgba(233, 176, 190, 0.33));
  color: var(--carmine, #be123c);
}

/* ----------------------------------------
   Preset: Orange (accent)
   ---------------------------------------- */
.lazio-pill--orange {
  background-color: var(--lazio-orange-t-2, rgba(252, 185, 139, 0.5));
  color: var(--lazio-orange, #f97316);
}

/* ----------------------------------------
   Preset: Iron (neutral)
   ---------------------------------------- */
.lazio-pill--iron {
  background-color: var(--iron-t-3, rgba(198, 198, 197, 0.1));
  color: var(--iron, #1C1917);
}

/* Dark mode — iron pill text flip */
[data-brx-theme="dark"] .lazio-pill--iron {
  color: rgba(255, 247, 237, 0.7);
}