/* FINAL: streamer/privacy eye button */
.privacyNavBtn {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  margin: 0 8px !important;
  padding: 0 !important;

  border: 1px solid rgba(76, 245, 255, .45) !important;
  border-radius: 14px !important;
  background:
    radial-gradient(circle at 50% 25%, rgba(75,255,230,.18), transparent 58%),
    linear-gradient(180deg, rgba(5,28,42,.96), rgba(2,12,22,.98)) !important;

  color: #eaffff !important;
  font-size: 21px !important;
  line-height: 1 !important;
  cursor: pointer !important;

  box-shadow:
    0 0 12px rgba(0, 240, 255, .24),
    inset 0 0 12px rgba(0, 230, 255, .14) !important;
}

.privacyNavBtn:hover {
  filter:
    drop-shadow(0 0 10px rgba(78,255,220,.45))
    brightness(1.08);
}

.privacyNavBtn.privacy-on {
  border-color: rgba(255, 210, 90, .72) !important;
  box-shadow:
    0 0 14px rgba(255, 190, 70, .32),
    inset 0 0 12px rgba(255, 190, 70, .16) !important;
}

/* FINAL: privacy button SVG icon styling */
#privacyNavIcon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important;
  height: 22px !important;
}

#privacyNavIcon svg {
  display: block !important;
  width: 22px !important;
  height: 22px !important;
}

#privacyNavIcon svg path,
#privacyNavIcon svg circle {
  stroke: currentColor !important;
  stroke-width: 2 !important;
  fill: none !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

/* FINAL: individual Balance / Wallet / Email privacy buttons */
.privacyControls {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  margin: 0 8px !important;
}

.privacyControls .privacyNavBtn {
  position: relative !important;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
}

.privacyControls .privacyTinyLabel {
  position: absolute !important;
  top: 2px !important;
  left: 4px !important;
  font-size: 9px !important;
  line-height: 1 !important;
  font-weight: 1000 !important;
  color: rgba(235,255,255,.82) !important;
  text-shadow: 0 1px 4px rgba(0,0,0,.75) !important;
  pointer-events: none !important;
}

.privacyControls .privacyIcon,
.privacyControls #privacyBalanceIcon,
.privacyControls #privacyWalletIcon,
.privacyControls #privacyEmailIcon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 20px !important;
  height: 20px !important;
}

.privacyControls .privacyIcon svg,
.privacyControls #privacyBalanceIcon svg,
.privacyControls #privacyWalletIcon svg,
.privacyControls #privacyEmailIcon svg {
  display: block !important;
  width: 20px !important;
  height: 20px !important;
}

.privacyControls .privacyIcon svg path,
.privacyControls .privacyIcon svg circle,
.privacyControls #privacyBalanceIcon svg path,
.privacyControls #privacyBalanceIcon svg circle,
.privacyControls #privacyWalletIcon svg path,
.privacyControls #privacyWalletIcon svg circle,
.privacyControls #privacyEmailIcon svg path,
.privacyControls #privacyEmailIcon svg circle {
  stroke: currentColor !important;
  stroke-width: 2 !important;
  fill: none !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

/* FINAL POLISH: move wallet/email privacy eyes inside fields and shrink all eyes ~33% */

/* Keep only the balance eye in the center group */
.privacyControls {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  margin: 0 8px !important;
}

/* Shrink all privacy buttons by ~33% */
.privacyNavBtn,
.privacyControls .privacyNavBtn,
#privacyBalanceBtn,
#privacyWalletBtn,
#privacyEmailBtn {
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  min-height: 26px !important;
  max-width: 26px !important;
  max-height: 26px !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 9px !important;
}

/* Make icon itself smaller too */
.privacyNavBtn .privacyIcon,
.privacyControls .privacyIcon,
#privacyBalanceIcon,
#privacyWalletIcon,
#privacyEmailIcon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 14px !important;
  height: 14px !important;
}

.privacyNavBtn .privacyIcon svg,
.privacyControls .privacyIcon svg,
#privacyBalanceIcon svg,
#privacyWalletIcon svg,
#privacyEmailIcon svg {
  display: block !important;
  width: 14px !important;
  height: 14px !important;
}

/* Clean icon-only look */
.privacyNavBtn .privacyTinyLabel,
.privacyControls .privacyTinyLabel {
  display: none !important;
}

/* Wallet/email rows become anchors for inline eye buttons */
.png-wallet-card .wallet-line {
  position: relative !important;
}

/* Put wallet/email eye buttons inside the field, just left of the copy icon */
#privacyWalletBtn,
#privacyEmailBtn {
  position: absolute !important;
  right: 22px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 4 !important;
}

/* Keep balance eye centered where it already lives */
#privacyBalanceBtn {
  position: static !important;
  transform: none !important;
}

/* Optional: slightly tighter balance control spacing now that only one eye remains */
.privacyControls .privacyNavBtn {
  margin: 0 !important;
}

/* FINAL POLISH: move wallet/email privacy eyes to the LEFT of the wallet/email text */
#privacyWalletBtn,
#privacyEmailBtn {
  left: 29px !important;
  right: auto !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 4 !important;
}

/* Push wallet/email text right so it starts after the inline privacy eye */
.png-wallet-card .wallet-line #navAddr,
.png-wallet-card .wallet-line #navEmail,
#navAddr.clickcopy,
#navEmail.clickcopy {
  margin-left: 28px !important;
}

/* FINAL POLISH: move inline privacy eyes/text left and protect copy icon */
#privacyWalletBtn,
#privacyEmailBtn {
  left: 14px !important;
  right: auto !important;
}

/* Text starts after the eye, but less pushed right than before */
.png-wallet-card .wallet-line #navAddr,
.png-wallet-card .wallet-line #navEmail,
#navAddr.clickcopy,
#navEmail.clickcopy {
  margin-left: -6px !important;
  max-width: 220px !important;
}

/* FINAL POLISH: show more wallet/email text while keeping eye + copy icon clear */
.png-wallet-card .wallet-line #navAddr,
.png-wallet-card .wallet-line #navEmail,
#navAddr.clickcopy,
#navEmail.clickcopy {
  margin-left: -6px !important;
  max-width: 242px !important;
}

/* SAFE TUNE: wallet/email text lane, no size changes, no text transform */
.png-wallet-card .wallet-line {
  position: relative !important;
  overflow: hidden !important;
}

/* Keep wallet/email privacy eyes on the left inside each field */
#privacyWalletBtn,
#privacyEmailBtn {
  left: 29px !important;
  right: auto !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 5 !important;
}

/* Wallet/email text starts after eye and stops before copy icon */
.png-wallet-card .wallet-line #navAddr,
.png-wallet-card .wallet-line #navEmail,
#navAddr.clickcopy,
#navEmail.clickcopy {
  margin-left: -6px !important;
  max-width: 240px !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: clip !important;
}

/* FINAL: make wallet/email privacy eyes clickable above text */
#privacyWalletBtn,
#privacyEmailBtn {
  z-index: 999 !important;
  pointer-events: auto !important;
}

/* Keep the eye icon itself clickable too */
#privacyWalletBtn *,
#privacyEmailBtn * {
  pointer-events: none !important;
}

/* FINAL: make wallet/email privacy eyes match the balance eye */
#privacyWalletBtn,
#privacyEmailBtn {
  color: #eaffff !important;
  background:
    radial-gradient(circle at 35% 30%, rgba(80,255,235,.22), rgba(0,0,0,0) 45%),
    linear-gradient(180deg, rgba(5,28,42,.96), rgba(2,12,22,.98)) !important;
  border: 1px solid rgba(76, 245, 255, .45) !important;
  box-shadow:
    0 0 12px rgba(0, 240, 255, .24),
    inset 0 0 12px rgba(0, 230, 255, .14) !important;
}

/* Force the wallet/email SVG eye strokes to be bright, not black */
#privacyWalletIcon,
#privacyEmailIcon,
#privacyWalletIcon svg,
#privacyEmailIcon svg {
  color: #eaffff !important;
  stroke: #eaffff !important;
}

#privacyWalletIcon svg path,
#privacyWalletIcon svg circle,
#privacyEmailIcon svg path,
#privacyEmailIcon svg circle {
  stroke: #eaffff !important;
  fill: none !important;
}

/* FINAL: wallet/email privacy eyes 10% smaller than current */
#privacyWalletBtn,
#privacyEmailBtn {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  max-width: 24px !important;
  max-height: 24px !important;
}

/* Shrink the wallet/email eye icon too */
#privacyWalletIcon,
#privacyEmailIcon,
#privacyWalletIcon svg,
#privacyEmailIcon svg {
  width: 13px !important;
  height: 13px !important;
}

/* FINAL: wallet/email privacy eyes borderless */
#privacyWalletBtn,
#privacyEmailBtn {
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Remove any focus/active outline on wallet/email eyes */
#privacyWalletBtn:focus,
#privacyWalletBtn:focus-visible,
#privacyWalletBtn:active,
#privacyEmailBtn:focus,
#privacyEmailBtn:focus-visible,
#privacyEmailBtn:active {
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

/* FINAL CLEAN: balance privacy eye slot stays in navbar; actual eye is live-aligned by JS */
#privacyControls.privacyControls {
  flex: 0 0 26px !important;
  width: 26px !important;
  min-width: 26px !important;
  max-width: 26px !important;
  height: 26px !important;
  min-height: 26px !important;
  max-height: 26px !important;

  margin-left: 8px !important;
  margin-right: 8px !important;

  position: relative !important;
  transform: none !important;
  z-index: 9999 !important;
  pointer-events: none !important;
}

/* The button itself is positioned over the KAS window by JS */
#privacyBalanceBtn {
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  min-height: 26px !important;
  max-width: 26px !important;
  max-height: 26px !important;

  margin: 0 !important;
  transform: none !important;
  z-index: 10000 !important;
  pointer-events: auto !important;
}

/* Balance text: keep it inside the balance PNG */
#balancePill #balanceValue,
#balancePill #balanceHint {
  transform: none !important;
}

/* FINAL TUNE: move Shop / Inventory / Buy KAS up-left and enlarge ~15% */
.png-shop-frame #shopNavBtn .nav-btn-img,
.png-shop-frame #inventoryNavBtn .nav-btn-img,
.png-shop-frame #buyKasNavBtn .nav-btn-img {
  height: 106px !important;
  max-height: 106px !important;
  max-width: 133px !important;
  transform: translate(-8px, -2px) !important;
}

/* keep individual Shop/BuyKAS nudges from old rules from fighting this */
.png-shop-frame #shopNavBtn .nav-btn-img,
.png-shop-frame #inventoryNavBtn .nav-btn-img,
.png-shop-frame #buyKasNavBtn .nav-btn-img {
  translate: none !important;
}

