/* ═══ EMPIRE WALLET v3.0 — Clean, Beautiful, Organized ═══ */

/* Wallet Panel — slide from right */
#ew-panel {
  position:fixed; top:0; right:-380px; width:370px; height:100vh;
  background:linear-gradient(180deg, #0d0d0d 0%, #111 50%, #0a0a0a 100%);
  border-left:2px solid rgba(212,175,55,0.3);
  z-index:999999; transition:right 0.35s cubic-bezier(.4,0,.2,1);
  display:flex; flex-direction:column; overflow-y:auto;
  box-shadow:-10px 0 40px rgba(0,0,0,0.8);
  font-family:'Inter',-apple-system,sans-serif;
}
#ew-panel.ew-open { right:0; }

/* Header */
.ew-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 18px 12px; border-bottom:1px solid rgba(212,175,55,0.15);
}
.ew-title { font-size:16px; font-weight:800; color:#ffd700; letter-spacing:1.5px; }
.ew-close-btn {
  background:none; border:1px solid rgba(255,255,255,0.15); color:#fff;
  width:32px; height:32px; border-radius:8px; cursor:pointer; font-size:16px;
  transition:all 0.2s;
}
.ew-close-btn:hover { border-color:#ffd700; color:#ffd700; }

/* Connect Area */
.ew-connect-area { padding:8px 18px; }
.ew-connect-btn {
  width:100%; padding:12px; background:linear-gradient(135deg,#ffd700,#b8860b);
  color:#000; border:none; border-radius:10px; font-size:14px; font-weight:700;
  cursor:pointer; transition:all 0.2s;
}
.ew-connect-btn:hover { transform:translateY(-1px); box-shadow:0 4px 15px rgba(255,215,0,0.3); }
.ew-connected-badge {
  text-align:center; padding:8px; color:#00ff88; font-size:13px; font-weight:600;
  background:rgba(0,255,136,0.06); border:1px solid rgba(0,255,136,0.15); border-radius:8px;
}

/* ── BALANCE HERO — Big, prominent ── */
.ew-balance-hero {
  padding:16px 18px; text-align:center;
  background:linear-gradient(180deg, rgba(212,175,55,0.06) 0%, transparent 100%);
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.ew-total-balance { margin:12px 0 8px; }
.ew-balance-label { font-size:11px; color:#888; text-transform:uppercase; letter-spacing:2px; }
.ew-balance-amount {
  font-size:32px; font-weight:800; color:#fff; margin-top:4px;
  text-shadow:0 0 20px rgba(255,215,0,0.15);
}
.ew-balance-symbol { font-size:18px; color:#ffd700; font-weight:600; }
.ew-addr-display { font-size:11px; color:#666; margin-top:4px; }
.ew-refresh-btn {
  background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1);
  color:#aaa; padding:5px 14px; border-radius:6px; font-size:11px; cursor:pointer;
  margin-top:6px; transition:all 0.2s;
}
.ew-refresh-btn:hover { border-color:#ffd700; color:#ffd700; }

/* ── CHAIN DROPDOWN (tiny, clean) ── */
.ew-chain-dropdown-wrap { position:relative; display:inline-block; margin-bottom:4px; }
.ew-chain-dropdown-btn {
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(255,255,255,0.05); border:1px solid rgba(255,215,0,0.2);
  color:#fff; padding:7px 14px; border-radius:20px; cursor:pointer;
  font-size:13px; font-weight:600; transition:all 0.2s;
}
.ew-chain-dropdown-btn:hover { border-color:#ffd700; background:rgba(255,215,0,0.08); }
.ew-dd-arrow { font-size:10px; color:#888; transition:transform 0.2s; }
.ew-chain-dropdown-list {
  position:absolute; top:100%; left:50%; transform:translateX(-50%);
  width:280px; max-height:300px; overflow-y:auto;
  background:#1a1a1a; border:1px solid rgba(255,215,0,0.2); border-radius:12px;
  margin-top:6px; z-index:100; box-shadow:0 10px 40px rgba(0,0,0,0.8);
  padding:6px;
}
.ew-dd-item {
  display:flex; align-items:center; gap:8px; width:100%;
  background:none; border:none; color:#ccc; padding:9px 12px;
  border-radius:8px; cursor:pointer; font-size:13px; text-align:left;
  transition:all 0.15s;
}
.ew-dd-item:hover { background:rgba(255,215,0,0.08); color:#fff; }
.ew-dd-item.ew-dd-active { background:rgba(255,215,0,0.12); color:#ffd700; font-weight:600; }

/* ── TABS ── */
.ew-tab-bar {
  display:flex; border-bottom:1px solid rgba(255,255,255,0.06);
  padding:0 8px;
}
.ew-tab {
  flex:1; background:none; border:none; border-bottom:2px solid transparent;
  color:#666; padding:10px 4px; font-size:16px; cursor:pointer;
  transition:all 0.2s;
}
.ew-tab:hover { color:#ccc; }
.ew-tab.active { color:#ffd700; border-bottom-color:#ffd700; }

/* ── CONTENT AREA ── */
.ew-content { flex:1; padding:14px 18px; overflow-y:auto; }

/* Portfolio */
.ew-portfolio { }
.ew-token-row {
  display:flex; align-items:center; gap:12px;
  background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06);
  border-radius:12px; padding:14px; margin-bottom:10px;
}
.ew-token-icon { font-size:28px; }
.ew-token-info { flex:1; }
.ew-token-name { font-size:15px; font-weight:700; color:#fff; }
.ew-token-chain { font-size:11px; color:#888; }
.ew-token-bal { font-size:16px; font-weight:700; color:#ffd700; }
.ew-explorer-link {
  display:block; text-align:center; color:#888; font-size:12px; margin-top:12px;
  text-decoration:none; transition:color 0.2s;
}
.ew-explorer-link:hover { color:#ffd700; }

/* Send */
.ew-send { }
.ew-send-chain, .ew-receive-chain, .ew-swap-chain { font-size:13px; color:#aaa; margin-bottom:12px; }
.ew-label { display:block; font-size:11px; color:#888; margin-bottom:4px; text-transform:uppercase; letter-spacing:1px; }
.ew-input {
  width:100%; background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.1);
  color:#fff; padding:11px 14px; border-radius:10px; font-size:14px;
  margin-bottom:10px; outline:none; transition:border-color 0.2s;
}
.ew-input:focus { border-color:rgba(255,215,0,0.4); }
.ew-fee-info { font-size:12px; color:#ffd700; margin-bottom:8px; min-height:16px; }
.ew-send-btn {
  width:100%; padding:13px; background:linear-gradient(135deg,#ffd700,#b8860b);
  color:#000; border:none; border-radius:10px; font-size:15px; font-weight:700;
  cursor:pointer; transition:all 0.2s;
}
.ew-send-btn:hover { transform:translateY(-1px); box-shadow:0 4px 15px rgba(255,215,0,0.3); }
.ew-send-note, .ew-receive-note, .ew-swap-note {
  text-align:center; font-size:11px; color:#555; margin-top:10px;
}

/* Receive */
.ew-receive { text-align:center; }
.ew-qr-container { margin:12px auto; }
.ew-qr-placeholder {
  width:160px; height:160px; display:flex; align-items:center; justify-content:center;
  background:rgba(255,215,0,0.04); border:2px solid rgba(255,215,0,0.2);
  border-radius:16px; margin:0 auto; color:#ffd700; font-size:13px;
}
.ew-addr-box { display:flex; gap:6px; margin-top:10px; }
.ew-addr-input { flex:1; font-size:11px !important; }
.ew-copy-btn {
  background:rgba(255,215,0,0.1); border:1px solid rgba(255,215,0,0.2);
  color:#ffd700; padding:8px 12px; border-radius:10px; cursor:pointer;
  font-size:16px; transition:all 0.2s;
}
.ew-copy-btn:hover { background:rgba(255,215,0,0.2); }

/* Swap */
.ew-swap { text-align:center; padding:20px 0; }
.ew-swap-launch-btn {
  display:inline-block; padding:16px 40px;
  background:linear-gradient(135deg,#ffd700,#b8860b);
  color:#000; font-size:16px; font-weight:800; border-radius:14px;
  text-decoration:none; transition:all 0.2s;
  box-shadow:0 4px 20px rgba(255,215,0,0.25);
}
.ew-swap-launch-btn:hover { transform:translateY(-2px); box-shadow:0 6px 25px rgba(255,215,0,0.4); }

/* Activity */
.ew-activity { }
.ew-activity-item {
  padding:10px 0; border-bottom:1px solid rgba(255,255,255,0.05);
  display:flex; flex-wrap:wrap; align-items:center; gap:8px;
}
.ew-act-desc { flex:1; font-size:13px; color:#ddd; }
.ew-act-time { font-size:11px; color:#666; }
.ew-act-link { font-size:11px; color:#ffd700; text-decoration:none; }
.ew-empty { text-align:center; color:#555; font-size:13px; padding:30px 0; }

/* Notification */
.ew-notify {
  position:fixed; top:20px; right:20px; padding:12px 20px;
  border-radius:10px; font-size:13px; font-weight:600; z-index:9999999;
  transform:translateX(120%); transition:transform 0.3s; max-width:320px;
}
.ew-notify-show { transform:translateX(0); }
.ew-notify-success { background:#0d2818; color:#00ff88; border:1px solid rgba(0,255,136,0.3); }
.ew-notify-error { background:#2d0a0a; color:#ff4444; border:1px solid rgba(255,68,68,0.3); }
.ew-notify-info { background:#0a1a2d; color:#4da6ff; border:1px solid rgba(77,166,255,0.3); }

/* ── FLOATING WALLET BUTTON ── */
  .ew-balance-amount { font-size:26px; }
  .ew-chain-dropdown-list { width:240px; }
}

/* ═══ END EMPIRE WALLET CSS ═══ */

/* Token selector in Send tab */
.ew-token-select { background:#1a1a2e!important; color:#fff!important; border:1px solid #ffd700!important; padding:10px!important; font-size:14px!important; border-radius:8px!important; cursor:pointer; }
.ew-token-select option { padding:8px; background:#1a1a2e; color:#fff; }
.ew-selected-token-logo { padding:8px 4px; font-size:15px; display:flex; align-items:center; }
.ew-token-select:focus { border-color:#ffd700!important; outline:none; box-shadow:0 0 8px rgba(255,215,0,0.3); }
