/* Shop room chips, loadout tab, compact room modal slots */

.shop-item--room .item-desc {
  font-size: 11px !important;
  line-height: 1.45 !important;
}

.shop-rule-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 8px 0 4px;
}

.shop-rule-chip {
  font-family: var(--font-pixel);
  font-size: 6px;
  letter-spacing: 0.05em;
  padding: 5px 8px;
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(0, 0, 0, 0.45);
}

.shop-rule-chip--tier {
  border-color: rgba(204, 255, 0, 0.35);
  color: var(--secondary);
}

.shop-rule-chip--mult {
  border-color: rgba(255, 200, 0, 0.35);
  color: var(--accent);
}

.shop-rule-chip--cap {
  border-color: rgba(0, 200, 5, 0.35);
  color: var(--primary);
}

.loadout-header-card {
  grid-column: 1 / -1;
  text-align: left;
  border-left: 3px solid var(--primary);
}

.loadout-miner-card.blocked {
  opacity: 0.55;
  border-color: rgba(245, 158, 11, 0.45) !important;
}

.loadout-miner-card.blocked .item-name::after {
  content: ' · TOO HIGH';
  font-size: 8px;
  color: #f59e0b;
}

.miner-slots-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
  max-height: 280px;
  overflow-y: auto;
  padding-right: 4px;
}

.miner-slot {
  aspect-ratio: auto !important;
  min-height: 88px;
  padding: 8px 4px;
}

.miner-slot-icon {
  width: 40px !important;
  height: 40px !important;
  font-size: 20px !important;
  margin-bottom: 4px !important;
}

.miner-slot-label {
  font-size: 6px !important;
  line-height: 1.3;
}

.room-card-stats {
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.room-card-stat {
  min-width: calc(33% - 8px);
  flex: 1 1 auto !important;
}

.room-card-capacity {
  font-size: 7px !important;
  line-height: 1.35;
  max-width: 58%;
  text-align: right;
}

.room-modal-stats {
  grid-template-columns: repeat(2, 1fr) !important;
}

@media (min-width: 640px) {
  .room-modal-stats {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}