/* Charge history list — cs_center visual language */

.deposit_list_board {
  margin-top: 8px;
}

.deposit_list_board .board_list.qna_board_wrap {
  min-height: 280px;
}

.charge-list-amount {
  color: #ffb020 !important;
  font-weight: 700;
}

.charge-list-date {
  color: #c9b090 !important;
  font-size: 12px;
}

.charge-list-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 72px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}

.charge-list-status--wait {
  color: #ff6b6b;
  background: rgba(255, 107, 107, 0.12);
  border: 1px solid rgba(255, 107, 107, 0.35);
}

.charge-list-status--done {
  color: #ffb020;
  background: rgba(255, 176, 32, 0.12);
  border: 1px solid rgba(255, 176, 32, 0.35);
}

.charge-list-status--cancel {
  color: #9ca3af;
  background: rgba(156, 163, 175, 0.12);
  border: 1px solid rgba(156, 163, 175, 0.25);
}

.charge-list-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 58px;
  height: 30px;
  padding: 0 8px;
  border: none;
  border-radius: 5px;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  color: #fff;
  background: linear-gradient(to bottom, #573c28, #51341f);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.45);
}

.charge-list-action:hover {
  background: linear-gradient(to bottom, #684530, #624020);
}

.charge-list-action--cancel {
  background: linear-gradient(to bottom, #5a3030, #4a2525);
}

.charge-list-action--cancel:hover {
  background: linear-gradient(to bottom, #6a3838, #5a3030);
}

.charge-list-action-cell {
  white-space: nowrap;
}

@media (max-width: 767px) {
  .deposit_list_board .qna_list_head td:nth-child(1),
  .deposit_list_board .qna_list_table_wrap table.t1 tr td:first-child {
    display: none;
  }

  .deposit_list_board .qna_list_head td,
  .deposit_list_board .qna_list_table_wrap table.t1 td {
    font-size: 12px;
    padding: 8px 4px !important;
  }

  .charge-list-action {
    min-width: 48px;
    height: 28px;
    padding: 0 6px;
    font-size: 10px;
  }
}