/* Shared styles for the boss tracker, loot split, bless and level pages. */

.boss-filters .ranking-filter-grid,
.tool-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px;
  align-items: end;
}

.lookup-field input,
.lookup-field select,
.lookup-field textarea {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid rgba(124, 139, 145, 0.44);
  color: var(--ink);
  font: inherit;
}

.lookup-field textarea {
  min-height: 220px;
  resize: vertical;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 12px;
  line-height: 1.45;
}

.lookup-field label {
  display: block;
  margin-bottom: 6px;
  color: #aebbb6;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.chance-meter {
  display: inline-block;
  width: 80px;
  height: 7px;
  margin-right: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  vertical-align: middle;
}

.chance-meter span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #d8ad57, #63d79c);
}

.boss-table td small,
.muted-text {
  color: var(--muted);
  font-size: 11px;
}

.boss-category {
  display: inline-block;
  padding: 2px 8px;
  border: 1px solid rgba(124, 139, 145, 0.3);
  border-radius: 999px;
  color: #c9d4d2;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.boss-category-archdemon { border-color: rgba(255, 125, 115, 0.45); color: #ffaaa3; }
.boss-category-poi { border-color: rgba(255, 148, 115, 0.4); color: #ffc39b; }
.boss-category-vampire { border-color: rgba(185, 162, 255, 0.45); color: #cfc0ff; }
.boss-category-rare { border-color: rgba(111, 214, 227, 0.45); color: #a8ecf4; }
.boss-category-event { border-color: rgba(255, 213, 106, 0.45); color: #ffe3a0; }

.boss-pill-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.boss-pill {
  padding: 6px 10px;
  border: 1px solid rgba(216, 173, 87, 0.3);
  border-radius: 999px;
  background: rgba(216, 173, 87, 0.07);
  color: #c9d4d2;
  font-size: 12px;
}

.boss-pill strong {
  color: #fff2cd;
}

.tool-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}

.tool-button {
  min-height: 42px;
  padding: 9px 16px;
  border: 1px solid rgba(216, 173, 87, 0.5);
  border-radius: 12px;
  background: var(--accent);
  color: #1d1606;
  font: inherit;
  font-weight: 900;
  cursor: pointer;
}

.tool-button.secondary {
  background: rgba(255, 255, 255, 0.04);
  color: #f2eee5;
}

.transfer-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.transfer-list li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.03);
}

.transfer-list code {
  flex: 1 1 260px;
  overflow-wrap: anywhere;
  color: #8ff0c3;
  font-size: 12.5px;
}

.copy-button {
  min-height: 32px !important;
  padding: 4px 10px;
  border: 1px solid rgba(124, 139, 145, 0.4);
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.05);
  color: #f2eee5;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  box-shadow: none !important;
}

.result-big {
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 900;
}

.tool-check {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  color: #d8e0dc;
  font-weight: 700;
  cursor: pointer;
}

.tool-check input {
  width: 18px;
  height: 18px;
  min-height: 0;
  accent-color: var(--accent);
}