/* glass-cloud.css: apply glassmorphism to cloud UI */

body{
  background:
    radial-gradient(circle at top left,#1e293b 0,#020617 45%),
    radial-gradient(circle at bottom right,#0f172a 0,#020617 55%);
  color:var(--text);
}

/* App shell sits slightly off the background */
.app{
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

/* Top bar uses glassy pill */
.topbar{
  padding:4px 10px;
  background:linear-gradient(90deg,var(--glass-bg-strong),rgba(30,64,175,0.25));
  border-radius:8px;
  border:1px solid var(--glass-border-soft);
  backdrop-filter:blur(var(--glass-blur)) saturate(150%);
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(150%);
  box-shadow:0 14px 40px rgba(15,23,42,0.9);
}

/* Main panels */
.left,.right{
  gap:10px;
}

/* Any generic dashboard panel */
.panel{
  background:linear-gradient(135deg,var(--glass-bg-subtle),rgba(30,64,175,0.32));
  border-radius:var(--glass-radius-lg);
  border:1px solid var(--glass-border);
  backdrop-filter:blur(var(--glass-blur)) saturate(150%);
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(150%);
  box-shadow:var(--glass-shadow-lg);
}

/* Tabs row floats over panel edge */
.tabs-list{
  background:rgba(15,23,42,0.65);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.tab.active{
  background:radial-gradient(circle at top,var(--glass-highlight),rgba(15,23,42,0.9));
}

.game-row{
  background:linear-gradient(135deg,rgba(15,23,42,0.92),rgba(30,64,175,0.35));
  border:1px solid var(--glass-border-soft);
  box-shadow:0 18px 40px rgba(15,23,42,0.85);
}

/* Token price badge & small labels */
.game-price,
.badge{
  background:radial-gradient(circle at top left,rgba(56,189,248,0.25),rgba(15,23,42,0.9));
  border-radius:8px;
  border:1px solid var(--glass-border-soft);
  padding-inline:8px;
}

/* Overlay when panels are loading */
.panel-loading-overlay{
  background:radial-gradient(circle at top,#0b1120aa,#020617ee);
  backdrop-filter:blur(24px) saturate(160%);
  -webkit-backdrop-filter:blur(24px) saturate(160%);
}
