/* Стили для страницы пополнения Steam */

#app,
.lk-container,
.lk-content,
.form-group,
.fieldset {
  overflow: visible !important;
}

.fieldset .ddown.deposit-region-ddown {
  position: relative;
  z-index: 1000000 !important;
}

.fieldset .ddown.deposit-region-ddown .ddown-content.deposit-region-content {
  z-index: 1000000 !important;
  position: absolute !important;
  transform: none !important;
  overflow-y: auto !important;
  overflow-x: visible !important;
  max-height: 220px !important;
  top: 100% !important;
  left: 0 !important;
  right: 0 !important;
  background-color: #272626 !important;
  border: 1px solid #2d2d2d !important;
  border-radius: 12px !important;
}

.currency-symbol {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  font-weight: 500;
  color: var(--text-secondary);
}

.exchange-rate-text {
  margin-top: 10px;
  font-size: 14px;
  color: var(--text-secondary);
  text-align: center;
}

.limit-warning-text {
  margin-top: 5px;
  font-size: 14px;
  font-weight: 500;
  text-align: center;
}

.fieldset {
  position: relative;
}

.fieldset input:disabled,
.fieldset select:disabled {
  background-color: var(--bg-disabled, #f5f5f5);
  color: var(--text-disabled, #999);
  cursor: not-allowed;
  opacity: 0.6;
}

.fieldset input.valid {
  border: 1px solid #4CAF50;
  box-shadow: 0 0 8px 4px rgba(0, 200, 0, 0.3);
}

.fieldset input.invalid {
  border: 1px solid #dc3545;
  box-shadow: 0 0 8px 4px rgba(255, 0, 0, 0.3);
}

.fieldset input.validating {
  border: 1px solid #ff9800;
  box-shadow: 0 0 8px 4px rgba(255, 152, 0, 0.3);
}

#steamLogin {
  transition: border 0.3s ease, box-shadow 0.3s ease;
}

#profileDataCheckbox {
  margin-top: 15px;
  animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

#addToCartButton:disabled {
  background-color: var(--bg-disabled, #cccccc);
  color: var(--text-disabled, #666666);
  cursor: not-allowed;
  opacity: 0.6;
}

.inform li .head {
  font-weight: 500;
  color: var(--text-secondary);
}

.inform li .text {
  font-weight: 600;
  color: var(--text-primary);
}