﻿.wallet-panel {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 6002;
  display: none;
  opacity: 0;
  transform: translateY(-10px) scale(0.96);
  transition: all 0.35s cubic-bezier(.19, 1, .22, 1);
}

.premium-wallet {
  width: 280px;
  padding: 16px 14px 14px;
  border-radius: 20px;
  background: linear-gradient(
    145deg,
    rgba(13, 34, 59, 0.97),
    rgba(22, 48, 73, 0.95)
  );
  border: 1px solid rgba(126, 230, 255, 0.24);
  box-shadow:
    0 20px 42px rgba(0, 0, 0, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(10px);
  text-align: center;
}

.wallet-head {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  margin-bottom: 10px;
  font-size: 14px;
  font-weight: 700;
  color: #ebf8ff;
}

.wallet-eye {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #d9f1ff;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(126, 230, 255, 0.26);
  cursor: pointer;
}

.wallet-amount {
  font-size: 44px;
  font-weight: 800;
  text-align: center;
  color: #ffffff;
  margin-bottom: 18px;
  letter-spacing: 0.5px;
}

.wallet-actions {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
}

.transactions-box {
  margin-top: 14px;
  padding: 12px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.055);
  border: 1px solid rgba(126, 230, 255, 0.18);
  text-align: left;
  max-height: 340px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(114, 231, 205, 0.65) rgba(255, 255, 255, 0.08);
}

.transactions-box::-webkit-scrollbar {
  width: 7px;
}

.transactions-box::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.08);
  border-radius: 999px;
}

.transactions-box::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #8af2c0, #2dd8a4);
  border-radius: 999px;
}

.tx-title {
  margin-bottom: 10px;
  color: #effaff;
  font-size: 15px;
  font-weight: 850;
}

#txList {
  display: grid;
  gap: 10px;
}

.tx-state {
  min-height: 96px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 6px;
  padding: 16px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px dashed rgba(137, 226, 255, 0.26);
  color: #d9f3ff;
  text-align: center;
}

.tx-state strong {
  color: #ffffff;
  font-size: 15px;
}

.tx-state small {
  color: #a9cce0;
  line-height: 1.35;
}

.tx-loader {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 3px solid rgba(255, 255, 255, 0.18);
  border-top-color: #8af2c0;
  animation: txSpin 0.8s linear infinite;
}

@keyframes txSpin {
  to { transform: rotate(360deg); }
}

.tx-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.04));
  border: 1px solid rgba(137, 226, 255, 0.18);
}

.tx-note {
  color: #f4fbff;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.25;
}

.tx-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.tx-meta span {
  padding: 3px 7px;
  border-radius: 999px;
  color: #b9d9ea;
  background: rgba(255, 255, 255, 0.07);
  font-size: 11px;
  font-weight: 750;
}

.tx-amount {
  white-space: nowrap;
  font-size: 15px;
  font-weight: 900;
}

.tx-credit {
  color: #8af2c0;
}

.tx-debit {
  color: #ffb4b4;
}

.tx-pending {
  color: #ffe39a;
}

.wallet-primary,
.wallet-secondary {
  width: 100%;
  max-width: 248px;
  min-height: 46px;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.2px;
  box-shadow: 0 10px 18px rgba(0, 0, 0, 0.24);
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    filter 0.2s ease;
}

.wallet-primary {
  background: linear-gradient(135deg, #84efb5, #2fd59f);
  color: #062738;
}

.wallet-secondary {
  background: linear-gradient(135deg, rgba(83, 171, 255, 0.28), rgba(255, 255, 255, 0.08));
  color: #dff3ff;
  border: 1px solid rgba(116, 205, 255, 0.4);
}

.wallet-primary:hover,
.wallet-secondary:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 22px rgba(0, 0, 0, 0.3);
  filter: brightness(1.04);
}

.wallet-panel.show {
  display: block;
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* ===== Standalone wallet page ===== */
.wallet-page-body {
  min-height: 100vh;
  padding-top: 168px !important;
  color: #f3f9ff;
  background:
    radial-gradient(circle at 12% 0, rgba(76, 231, 255, 0.14), transparent 36%),
    radial-gradient(circle at 88% 8%, rgba(255, 217, 79, 0.1), transparent 30%),
    linear-gradient(128deg, #071115, #083642 52%, #173052);
}

.wallet-page-header {
  display: grid;
  grid-template-columns: minmax(220px, 0.7fr) minmax(260px, 1fr) auto;
  align-items: center;
  gap: 14px;
}

.wallet-page-header .header-left,
.wallet-page-header .header-right {
  display: flex;
  align-items: center;
  gap: 10px;
}

.wallet-page-header .header-left img {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  border: 2px solid rgba(141, 247, 208, 0.72);
}

.wallet-page-header .header-left strong,
.wallet-page-header .header-left span {
  display: block;
}

.wallet-page-header .header-left strong {
  font-size: 24px;
  color: #dffef7;
}

.wallet-page-header .header-left span,
.wallet-page-header .header-center p {
  color: #b7cedf;
  font-size: 12px;
}

.wallet-page-header .header-center {
  text-align: center;
}

.wallet-page-header .header-center h1 {
  font-size: clamp(28px, 2.5vw, 44px);
}

.wallet-page-shell {
  width: min(1320px, calc(100% - 28px));
  margin: 0 auto;
  padding: 34px 0 40px;
  display: grid;
  gap: 18px;
}

.wallet-page-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 0.42fr);
  gap: 18px;
  align-items: stretch;
  border-radius: 16px;
  border: 1px solid rgba(134, 245, 230, 0.22);
  padding: 22px;
  background:
    linear-gradient(120deg, rgba(9, 48, 55, 0.94), rgba(20, 45, 70, 0.9)),
    radial-gradient(circle at 100% 0, rgba(255, 217, 79, 0.1), transparent 40%);
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.34);
}

.wallet-kicker {
  display: inline-flex;
  border-radius: 999px;
  padding: 6px 12px;
  color: #062923;
  background: #bdfdea;
  font-size: 12px;
  font-weight: 900;
}

.wallet-page-copy h2 {
  margin-top: 12px;
  max-width: 760px;
  font-size: clamp(34px, 4vw, 68px);
  line-height: 1.05;
}

.wallet-page-copy p {
  margin-top: 12px;
  max-width: 620px;
  color: #b7cedf;
  font-size: 17px;
  line-height: 1.6;
}

.wallet-panel.wallet-page-card {
  position: relative;
  display: block;
  opacity: 1;
  inset: auto;
  transform: none;
  width: 100%;
  min-height: 310px;
  padding: 22px;
}

.wallet-page-card .wallet-amount {
  font-size: clamp(48px, 5vw, 74px);
}

.wallet-page-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.wallet-info-card {
  border-radius: 12px;
  border: 1px solid rgba(124, 228, 255, 0.14);
  padding: 18px;
  background: linear-gradient(140deg, rgba(15, 34, 59, 0.94), rgba(30, 43, 64, 0.9));
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.26);
}

.wallet-info-card span {
  color: #8df7d0;
  font-size: 13px;
  font-weight: 900;
}

.wallet-info-card strong {
  display: block;
  margin-top: 8px;
  color: #fff;
  font-size: 20px;
}

.wallet-info-card p {
  margin-top: 8px;
  color: #b7cedf;
  line-height: 1.45;
}

.wallet-info-card button {
  width: 100%;
  min-height: 42px;
  margin-top: 12px;
}

@media (max-width: 980px) {
  .wallet-page-body {
    padding-top: 230px !important;
  }

  .wallet-page-header,
  .wallet-page-hero,
  .wallet-page-grid {
    grid-template-columns: 1fr;
  }

  .wallet-page-header .header-center,
  .wallet-page-header .header-left,
  .wallet-page-header .header-right,
  .wallet-page-copy {
    justify-content: center;
    text-align: center;
  }
}

/* ===== Service Header User ===== */
.service-user {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.22);
  white-space: nowrap;
}

.service-user-avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background-size: cover;
  background-position: center;
  background-color: rgba(255, 255, 255, 0.2);
  background-image: url("../img/indonline.png");
  border: 2px solid rgba(255, 255, 255, 0.35);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.35);
}

.service-user-avatar.avatar-loaded {
  opacity: 1;
}

.service-user-info {
  display: flex;
  flex-direction: column;
  line-height: 1.1;
  max-width: 200px;
  overflow: hidden;
}

.service-user-name {
  font-size: 13px;
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.service-user-email {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.75);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ===== Service Header Layout ===== */
.header-right,
.bbps-right,
.header-top .header-right,
.app-header .header-actions,
.voter-nav .nav-right,
.passport-header .right,
.passport-header .header-right,
.simple-header .right,
.simple-header .header-right,
.page-header .header-right,
.neo-right,
.gst-main-header .header-right {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
/* UNIFORM-THEME-LOCK START */
:root {
  --u-bg-a: #021418;
  --u-bg-b: #07323a;
  --u-panel-a: rgba(12, 55, 62, 0.94);
  --u-panel-b: rgba(22, 48, 73, 0.92);
  --u-card-a: rgba(15, 34, 59, 0.94);
  --u-card-b: rgba(30, 43, 64, 0.92);
  --u-line: rgba(255, 255, 255, 0.12);
  --u-text: #f3f9ff;
  --u-muted: #b7cedf;
  --u-mint-1: #35f2c0;
  --u-mint-2: #1fcfa1;
}

html, body {
  color: var(--u-text);
  background:
    radial-gradient(circle at 14% 10%, rgba(78, 255, 214, 0.12), transparent 36%),
    radial-gradient(circle at 86% 2%, rgba(152, 114, 255, 0.15), transparent 30%),
    linear-gradient(120deg, var(--u-bg-a), var(--u-bg-b));
}

header.nav,
.bbps-header,
.voter-nav,
.gst-main-header,
.app-header,
.page-header,
.update-pan-header,
.insurance-header,
.neo-header,
.passport-header,
.simple-header,
.profile-header,
.gst-header {
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: min(1320px, calc(100% - 28px));
  margin-top: 0;
  padding: 16px 20px;
  border-radius: 20px;
  border: 1px solid rgba(134, 245, 230, 0.22);
  background:
    radial-gradient(circle at 30% 0, rgba(124, 255, 233, 0.15), transparent 42%),
    linear-gradient(130deg, var(--u-panel-a), var(--u-panel-b));
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.42);
  overflow: hidden;
  z-index: 1000;
}

header.nav::after,
.bbps-header::after,
.voter-nav::after,
.gst-main-header::after,
.app-header::after,
.page-header::after,
.update-pan-header::after,
.insurance-header::after,
.neo-header::after,
.passport-header::after,
.simple-header::after,
.profile-header::after,
.gst-header::after {
  content: "";
  position: absolute;
  inset: -120% -24%;
  background: conic-gradient(
    from 0deg,
    transparent 0deg,
    rgba(124, 255, 233, 0.12) 70deg,
    transparent 140deg,
    rgba(150, 110, 255, 0.12) 230deg,
    transparent 320deg
  );
  animation: uniformHeaderSpin 16s linear infinite;
  pointer-events: none;
}

@keyframes uniformHeaderSpin {
  to { transform: rotate(360deg); }
}

header.nav nav,
.bbps-header > *,
.voter-nav > *,
.gst-main-header > *,
.app-header > *,
.page-header > *,
.update-pan-header > *,
.insurance-header > *,
.neo-header > *,
.passport-header > *,
.simple-header > *,
.profile-header > *,
.gst-header > * {
  position: relative;
  z-index: 2;
}

body,
.gst-page,
.itr-page,
.pan-page,
.insurance-page,
.aeps-page,
.passport-page,
.recharge-page,
.voter-page,
.bbps-page,
.profile-page {
  padding-top: 108px;
}

.service-card,
.itr-service-card,
.pan-card,
.bbps-card,
.voter-card,
.gst-card,
.recharge-option,
.passport-card,
.cards-grid > *,
.workspace,
.form,
.form-box,
.pan-form-box,
.itr-wrapper,
.gst-form-5d,
.history-panel,
.history-section,
.itr-history-section,
.gst-history-section,
.voter-history-hero,
.service-history-hero,
.hero-left,
.hero-promo,
.about-left,
.about-right,
.modal-panel,
.welcome-card,
.card {
  border-radius: 18px;
  border: 1px solid rgba(124, 228, 255, 0.12);
  background: linear-gradient(140deg, var(--u-card-a), var(--u-card-b));
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.32);
}

.service-card,
.itr-service-card,
.pan-card,
.bbps-card,
.voter-card,
.gst-card,
.recharge-option,
.passport-card,
.cards-grid > *,
.card {
  position: relative;
  overflow: hidden;
}

.service-card::before,
.itr-service-card::before,
.pan-card::before,
.bbps-card::before,
.voter-card::before,
.gst-card::before,
.recharge-option::before,
.passport-card::before,
.cards-grid > *::before,
.card::before {
  content: "";
  position: absolute;
  inset: -60% -20%;
  background: conic-gradient(from 0deg, transparent 0deg, rgba(113, 236, 224, 0.2) 70deg, transparent 150deg);
  animation: uniformCardSpin 10s linear infinite;
}

@keyframes uniformCardSpin {
  to { transform: rotate(360deg); }
}

.service-card > *,
.itr-service-card > *,
.pan-card > *,
.bbps-card > *,
.voter-card > *,
.gst-card > *,
.recharge-option > *,
.passport-card > *,
.cards-grid > * > *,
.card > * {
  position: relative;
  z-index: 1;
}

input,
select,
textarea,
.form input,
.form select,
.form textarea,
.gst-form input,
.gst-form select,
.gst-form textarea,
#itrForm input,
#itrForm select,
#itrForm textarea {
  border-radius: 12px;
  border: 1px solid rgba(126, 230, 255, 0.22);
  background: #f7fbff;
  color: #122634;
  min-height: 42px;
}

input:focus,
select:focus,
textarea:focus,
.form input:focus,
.form select:focus,
.form textarea:focus {
  outline: none;
  border-color: rgba(54, 239, 198, 0.65);
  box-shadow:
    0 0 0 2px rgba(54, 239, 198, 0.18),
    0 12px 24px rgba(0, 0, 0, 0.28);
}

button,
.nav-btn,
.header-btn,
.action-btn,
.apply-btn,
.form-submit,
.service-btn,
.nav-link-btn,
.bbps-btn,
.pay-btn,
.gst-home-btn,
.home-btn,
.back-btn,
.history-toggle-btn,
.gst-history-toggle-btn,
.itr-history-toggle-btn,
.passport-history-toggle-btn,
.recharge-history-toggle-btn,
.welcome-btn {
  position: relative;
  overflow: hidden;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  font-weight: 700;
  color: #07261f;
  background: linear-gradient(130deg, var(--u-mint-1), var(--u-mint-2));
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

button:hover,
.nav-btn:hover,
.header-btn:hover,
.action-btn:hover,
.apply-btn:hover,
.form-submit:hover,
.service-btn:hover,
.nav-link-btn:hover,
.bbps-btn:hover,
.pay-btn:hover,
.gst-home-btn:hover,
.home-btn:hover,
.back-btn:hover,
.history-toggle-btn:hover,
.gst-history-toggle-btn:hover,
.itr-history-toggle-btn:hover,
.passport-history-toggle-btn:hover,
.recharge-history-toggle-btn:hover,
.welcome-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 20px rgba(54, 239, 198, 0.34);
}

button::after,
.nav-btn::after,
.header-btn::after,
.action-btn::after,
.apply-btn::after,
.form-submit::after,
.service-btn::after,
.nav-link-btn::after,
.bbps-btn::after,
.pay-btn::after,
.gst-home-btn::after,
.home-btn::after,
.back-btn::after,
.history-toggle-btn::after,
.gst-history-toggle-btn::after,
.itr-history-toggle-btn::after,
.passport-history-toggle-btn::after,
.recharge-history-toggle-btn::after,
.welcome-btn::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.45), transparent);
  transform: translateX(-120%);
  transition: transform 0.55s ease;
}

button:hover::after,
.nav-btn:hover::after,
.header-btn:hover::after,
.action-btn:hover::after,
.apply-btn:hover::after,
.form-submit:hover::after,
.service-btn:hover::after,
.nav-link-btn:hover::after,
.bbps-btn:hover::after,
.pay-btn:hover::after,
.gst-home-btn:hover::after,
.home-btn:hover::after,
.back-btn:hover::after,
.history-toggle-btn:hover::after,
.gst-history-toggle-btn:hover::after,
.itr-history-toggle-btn:hover::after,
.passport-history-toggle-btn:hover::after,
.recharge-history-toggle-btn:hover::after,
.welcome-btn:hover::after {
  transform: translateX(120%);
}

#headerTimer,
.header-timer {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 88px;
  height: 38px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(130deg, #7440ff, #9d57ff 64%, #6b35eb);
  box-shadow: 0 10px 24px rgba(131, 88, 255, 0.46);
  animation: uniformTimerPulse 1.8s ease-in-out infinite;
}

@keyframes uniformTimerPulse {
  50% { transform: translateY(-2px); }
}

.service-user {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid rgba(133, 239, 255, 0.34);
  background: rgba(5, 23, 38, 0.56);
}

.service-user-avatar {
  width: 38px;
  height: 38px;
  min-width: 38px;
  border-radius: 50%;
  background-image: url("../img/indonline.png");
  background-size: cover;
  background-position: center;
  border: 2px solid rgba(132, 231, 255, 0.6);
}

.service-user-info {
  display: grid;
  line-height: 1.1;
  max-width: 150px;
}

.service-user-name {
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.service-user-email {
  font-size: 11px;
  color: rgba(224, 241, 255, 0.74);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 900px) {
  header.nav,
  .bbps-header,
  .voter-nav,
  .gst-main-header,
  .app-header,
  .page-header,
  .update-pan-header,
  .insurance-header,
  .neo-header,
  .passport-header,
  .simple-header,
  .profile-header,
  .gst-header {
    width: calc(100% - 12px);
    padding: 10px;
  }

  .gst-card-grid,
  .cards-grid,
  .itr-option-wrapper,
  .bbps-container,
  .recharge-grid-box,
  .passport-wrapper,
  .footer-container,
  .welcome-actions {
    grid-template-columns: 1fr;
  }

  .service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
/* UNIFORM-THEME-LOCK END */

/* ===== Wallet page compact launch override ===== */
.wallet-page-body {
  padding-top: 112px !important;
}

.wallet-page-header.simple-header {
  min-height: 86px;
  padding: 10px 16px !important;
  border-radius: 14px !important;
  grid-template-columns: minmax(210px, 0.75fr) minmax(220px, 1fr) auto;
}

.wallet-page-header .header-left img {
  width: 46px;
  height: 46px;
}

.wallet-page-header .header-left strong {
  font-size: 21px;
  line-height: 1;
}

.wallet-page-header .header-left span,
.wallet-page-header .header-center p {
  font-size: 11px;
}

.wallet-page-header .header-center h1 {
  font-size: clamp(25px, 2vw, 34px);
  line-height: 1.05;
}

.wallet-page-header .header-right {
  gap: 8px;
}

.wallet-page-header .service-user {
  min-height: 50px !important;
  padding: 4px 10px !important;
}

.wallet-page-header .service-user-avatar {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  flex-basis: 44px !important;
}

.wallet-page-header .header-timer {
  height: 36px;
  min-width: 82px;
  font-size: 14px;
}

.wallet-page-header .action-btn {
  min-width: 58px;
  height: 34px;
  padding: 0 12px;
  font-size: 13px;
}

.wallet-page-shell {
  padding-top: 16px;
}

.wallet-page-hero {
  min-height: 360px;
  align-items: center;
  padding: 20px 22px;
}

.wallet-page-copy h2 {
  font-size: clamp(38px, 4.4vw, 76px);
  line-height: 0.98;
}

.wallet-page-copy p {
  font-size: 16px;
}

.wallet-panel.wallet-page-card {
  max-width: 410px;
  justify-self: end;
  min-height: 278px;
  padding: 20px;
}

.wallet-page-card .wallet-head {
  margin-bottom: 8px;
}

.wallet-page-card .wallet-amount {
  margin-bottom: 20px;
  font-size: clamp(48px, 5vw, 68px);
  line-height: 1;
}

.wallet-page-card .wallet-actions {
  gap: 10px;
}

.wallet-page-card .wallet-primary,
.wallet-page-card .wallet-secondary {
  min-height: 44px;
  max-width: 280px;
}

.wallet-page-grid {
  align-items: stretch;
}

.wallet-info-card {
  padding: 16px;
}

.wallet-info-card strong {
  font-size: 18px;
  line-height: 1.25;
}

@media (max-width: 980px) {
  .wallet-page-body {
    padding-top: 188px !important;
  }

  .wallet-page-header.simple-header {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .wallet-page-header .header-right {
    justify-content: center;
    flex-wrap: wrap;
  }

  .wallet-panel.wallet-page-card {
    max-width: 100%;
    justify-self: stretch;
  }

.wallet-page-hero {
    min-height: auto;
  }
}

/* ===== Wallet modal hard override ===== */
.wt-modal .wt-chip,
.wt-modal .wt-method {
  background: linear-gradient(180deg, rgba(12, 38, 63, 0.96), rgba(9, 28, 48, 0.98)) !important;
  color: #eaf8ff !important;
}

.wt-modal .wt-chip.active,
.wt-modal .wt-method.active {
  background: linear-gradient(135deg, #84efb5, #2fd59f) !important;
  color: #062738 !important;
}

.wt-modal .wt-btn.cancel {
  background: linear-gradient(135deg, rgba(255, 93, 93, 0.22), rgba(99, 24, 34, 0.34)) !important;
  color: #ffdede !important;
  border: 1px solid rgba(255, 139, 139, 0.42) !important;
}

.wt-modal .wt-btn.secondary {
  background: linear-gradient(135deg, rgba(69, 149, 255, 0.34), rgba(13, 52, 90, 0.58)) !important;
  color: #dff3ff !important;
  border: 1px solid rgba(116, 205, 255, 0.46) !important;
}

.wt-modal .wt-btn.primary {
  background: linear-gradient(135deg, #84efb5, #2fd59f) !important;
  color: #062738 !important;
}






