/* static/css/game/3c-equipbox.css */

.screen-right {
  display: flex;
  flex-direction: row;
}

.equipbox-section {
  padding: 16px;
  font-family: sans-serif;
  color: white;
}

.equipbox-header {
  margin-bottom: 12px;
}

.equipbox-header h2 {
  font-size: 20px;
  margin-bottom: 4px;
}

.ingame-date,
.current-event {
  font-size: 14px;
  margin-bottom: 2px;
}

.box-options {
  display: flex;
  gap: 8px;
  margin: 12px 0;
}

.equipbox-button {
  padding: 8px 12px;
  background: #444;
  color: white;
  border: none;
  border-radius: 6px;
  cursor: pointer;
}

.equipbox-button:hover {
  background: #666;
}

.equipbox-button.selected {
  border: 2px solid gold;
}


.box-item-list {
  max-height: 400px;
  overflow-y: auto;
  background: #222;
  padding: 8px;
  border-radius: 6px;
  font-size: 14px;
}

.equipbox-item {
  padding: 4px 0;
  border-bottom: 1px solid #444;
}

.equipbox-actions {
  margin-top: 12px;
}

#draw-equipbox {
  padding: 8px 16px;
  background: #1e88e5;
  border: none;
  color: white;
  border-radius: 6px;
  cursor: pointer;
}

#draw-equipbox:hover {
  background: #1565c0;
}

#draw-equipbox-icon {
  width: 20px;
  height: 20px;
  vertical-align: middle;
}

.equipbox-result {
  margin-top: 10px;
  font-weight: bold;
  color: gold;
}

.collection-point {
  margin-top: 16px;
  font-size: 14px;
  color: lightgreen;
}

.equipbox-actions {
  margin-bottom: 100px;
}

@media (max-width: 600px) {
  .shop-section {
    margin-bottom: 240px;
  }
}