/* ==========================================================================
   random-number-generator.css — result chips, copy bar and list textarea.
   Layered on top of toolpage.css; only the bits that page does not cover.
   ========================================================================== */

/* ------------------------------------------------------- generated output */
.rng-out {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--bg-soft);
  padding: 14px;
}

.rng-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

.rng-bar .rng-count {
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: var(--muted);
}

.rng-tools { display: flex; gap: 8px; flex-wrap: wrap; }

.rng-mini {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border-radius: var(--r-pill);
  background: var(--tint-purple);
  color: var(--primary-dark);
  font-size: .8rem;
  font-weight: 600;
  transition: background var(--transition), color var(--transition);
}
[data-theme="dark"] .rng-mini { color: var(--primary-light); }
.rng-mini:hover { background: var(--primary); color: #fff; }
.rng-mini[disabled] { opacity: .45; cursor: default; }
.rng-mini[disabled]:hover { background: var(--tint-purple); color: var(--primary-dark); }
[data-theme="dark"] .rng-mini[disabled]:hover { color: var(--primary-light); }

/* Numbers / picked items */
.rng-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  max-height: 320px;
  overflow-y: auto;
}

.rng-chip {
  padding: 8px 14px;
  border-radius: 11px;
  background: var(--card);
  border: 1.5px solid var(--border-strong);
  color: var(--heading);
  font-size: .95rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  word-break: break-all;
}

/* Lottery bonus balls (Powerball, Mega Ball, Lucky Stars…) */
.rng-chip.is-bonus {
  background: var(--tint-amber);
  border-color: transparent;
  color: #B45309;
}
[data-theme="dark"] .rng-chip.is-bonus { color: #FCD34D; }

/* Picked list entries are words, not numbers — let them breathe. */
.rng-chip.is-item {
  font-weight: 600;
  word-break: normal;
}

.rng-empty {
  font-size: .88rem;
  color: var(--muted);
  padding: 6px 2px;
}

/* --------------------------------------------------------- advanced strip */
.rng-adv {
  margin-top: 14px;
  border-top: 1px dashed var(--border);
  padding-top: 12px;
}
.rng-adv > summary {
  cursor: pointer;
  list-style: none;
  font-size: .82rem;
  font-weight: 600;
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.rng-adv > summary::-webkit-details-marker { display: none; }
.rng-adv > summary::before {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-45deg);
  transition: transform var(--transition);
}
.rng-adv[open] > summary::before { transform: rotate(45deg); }
.rng-adv > summary:hover { color: var(--primary); }
.rng-adv .tool-grid { margin-top: 14px; }

@media (max-width: 575.98px) {
  .rng-chips { max-height: 260px; }
}