/* supportModal.css - clean dark modal with pink accents */
.support-modal {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  opacity: 0;
  visibility: hidden;
  transition: opacity 240ms ease, visibility 240ms ease;
  pointer-events: none;
}
.support-modal.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.support-modal-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(2px);
}
.support-modal-content {
  position: relative;
  width: 90%;
  max-width: 480px;
  background: linear-gradient(135deg,#141414ee,#0a0a0aee);
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow:0 20px 60px rgba(0,0,0,0.7),inset 0 1px 0 rgba(255,255,255,0.1);
  transform: scale(0.92) translateY(20px);
  transition:transform 240ms cubic-bezier(0.23,1,0.32,1);
  display:flex;
  flex-direction:column;
  max-height:85vh;
  overflow-y:auto;
}
.support-modal.active .support-modal-content {transform:scale(1) translateY(0);}
.support-modal-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:24px 28px;
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.support-modal-title {
  flex:1;
  margin:0;
  font-size:22px;
  font-weight:700;
  color:#fff;
  text-align:center;
  letter-spacing:0.02em;
  text-transform:uppercase;
}
.support-modal-back,
.support-modal-close {
  appearance:none;
  background:transparent;
  border:none;
  color:rgba(255,255,255,0.6);
  cursor:pointer;
  font-size:20px;
  padding:4px;
  border-radius:6px;
  transition:color 160ms ease,background 160ms ease;
}
.support-modal-back:hover,
.support-modal-close:hover {color:#fff; background:rgba(255,0,110,0.1);}
.support-modal-back:active,
.support-modal-close:active {background:rgba(255,0,110,0.15);}
.support-modal-body {padding:28px; flex:1;}
.support-step {display:none;}
.support-step.active {display:block;}
.step-title {margin:0 0 20px 0; font-size:18px; font-weight:700; color:#fff; text-align:center;}
.options {display:flex; flex-direction:column; gap:12px;}
.category-btn,
.coin-btn,
.network-btn {
  padding:15px;
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,0,110,0.15);
  border-radius:12px;
  color:#fff;
  font-size:16px;
  cursor:pointer;
  transition:all 150ms ease;
  text-align:center;
}
.category-btn:hover,
.coin-btn:hover,
.network-btn:hover {background:rgba(255,255,255,0.06); border-color:rgba(255,0,110,0.25);}
.payment-details {text-align:center;}
.payment-coin {font-size:18px; font-weight:700; color:#ff006e; text-transform:uppercase; margin-bottom:8px;}
.payment-network {font-size:14px; color:#fff; background:rgba(255,255,255,0.1); padding:4px 8px; border-radius:4px; margin-bottom:16px;}
.payment-address {width:100%; padding:12px; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:8px; color:#fff; font-family:monospace; margin-bottom:12px;}
.copy-btn {padding:12px 20px; background:#ff006e; color:#fff; border:none; border-radius:8px; cursor:pointer; transition:background 150ms ease;}
.copy-btn:hover {background:#e6005d;}
.copy-btn.copied {background:#0f0; color:#000;}
.placeholder-text {text-align:center; color:rgba(255,255,255,0.7);}
.skins-content {text-align:center;}
.steam-icon {font-size:48px; margin-bottom:16px;}
.skins-description {color:rgba(255,255,255,0.8); margin-bottom:24px; line-height:1.5;}
.steam-trade-btn {
  padding:16px 32px;
  background: linear-gradient(135deg, #4CAF50, #45a049);
  border: none;
  border-radius: 12px;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  cursor: pointer;
  transition: all 200ms ease;
  box-shadow: 0 4px 15px rgba(76, 175, 80, 0.3);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.steam-trade-btn:hover {
  background: linear-gradient(135deg, #45a049, #3d8b40);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(76, 175, 80, 0.4);
}
.trade-link-section {margin-top:24px;}
.trade-link-label {font-size:14px; color:rgba(255,255,255,0.6); margin-bottom:8px; text-align:left;}
.trade-link-container {display:flex; gap:8px; align-items:center;}
.trade-link-input {
  flex:1;
  padding:10px 12px;
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:6px;
  color:#fff;
  font-family:monospace;
  font-size:12px;
}
.copy-trade-link-btn {
  padding:10px 16px;
  background:#ff006e;
  color:#fff;
  border:none;
  border-radius:6px;
  cursor:pointer;
  transition:background 150ms ease;
}
.copy-trade-link-btn:hover {background:#e6005d;}
.copy-trade-link-btn.copied {background:#0f0; color:#000;}
@media(max-width:600px){.support-modal-content{width:95%;max-height:90vh;}.support-modal-header{padding:20px 24px;}.support-modal-body{padding:24px;}}