/* Account/Dashboard styles */

.auth-section {
  padding: 80px 0;
  min-height: calc(100vh - 200px);
  display: flex;
  align-items: center;
}
.auth-card {
  max-width: 460px;
  margin: 0 auto;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  padding: 36px;
}
.auth-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-bottom: 28px;
  background: rgba(0,0,0,0.2);
  border-radius: 10px;
  padding: 4px;
  gap: 4px;
}
.auth-tab {
  background: transparent;
  border: 0;
  padding: 10px;
  cursor: pointer;
  color: var(--text-muted, #94a3b8);
  font-family: inherit;
  font-size: 0.95rem;
  font-weight: 500;
  border-radius: 8px;
  transition: all .2s ease;
}
.auth-tab.active {
  background: rgba(99,102,241,0.2);
  color: #fff;
}
.auth-form h2 {
  font-size: 1.4rem;
  margin: 0 0 24px;
  text-align: center;
}

/* Dashboard */
.dashboard-section {
  padding: 60px 0;
}
.dash-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 36px;
  flex-wrap: wrap;
  gap: 16px;
}
.dash-header h1 { margin: 0; font-size: 1.8rem; }
.dash-header .user-info {
  display: flex;
  align-items: center;
  gap: 16px;
}
.dash-header .user-info .balance {
  background: rgba(16,185,129,0.1);
  border: 1px solid rgba(16,185,129,0.3);
  color: #6ee7b7;
  padding: 8px 14px;
  border-radius: 999px;
  font-weight: 600;
}
.btn-logout {
  background: rgba(239,68,68,0.1);
  border: 1px solid rgba(239,68,68,0.3);
  color: #fca5a5;
  padding: 8px 14px;
  border-radius: 8px;
  font-family: inherit;
  cursor: pointer;
  font-size: 0.9rem;
}

.dash-actions {
  margin-bottom: 24px;
}

.orders-list {
  display: grid;
  gap: 14px;
}
.order-row {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px;
  padding: 20px 24px;
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1.2fr 1fr;
  gap: 16px;
  align-items: center;
}
@media (max-width: 800px) {
  .order-row {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .order-row > div { font-size: 0.85rem; }
}
.order-row .o-id {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.85rem;
  color: var(--text-muted, #94a3b8);
}
.order-row .o-plan strong { color: #fff; }
.order-row .o-price { color: #6ee7b7; font-weight: 600; }
.order-row .o-status {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 600;
  background: rgba(255,255,255,0.05);
}
.order-row .o-status.pending    { background: rgba(252,211,77,0.15); color: #fcd34d; }
.order-row .o-status.paid       { background: rgba(165,180,252,0.15); color: #a5b4fc; }
.order-row .o-status.processing { background: rgba(253,186,116,0.15); color: #fdba74; }
.order-row .o-status.completed  { background: rgba(110,231,183,0.15); color: #6ee7b7; }
.order-row .o-status.failed     { background: rgba(252,165,165,0.15); color: #fca5a5; }

.empty-state {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-muted, #94a3b8);
}
.empty-state h3 { color: #fff; margin-bottom: 12px; }

.user-menu-link {
  margin-left: 8px;
  color: #a5b4fc;
  text-decoration: none;
  font-size: 0.95rem;
}
.user-menu-link:hover { text-decoration: underline; }

/* Change password modal */
.change-pw-modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  backdrop-filter: blur(6px);
}
.change-pw-box {
  background: #0f1320;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 14px;
  padding: 32px;
  width: 90%;
  max-width: 440px;
}
