/* ═══════════════════════════════════════════════════════════
   UI Icons — Lucide SVG  (v2 — shared across all pages)
   Loaded by: app.html, gallery.html, game.html, admin.html,
              analytics.html, campaign.html, card-prompts.html
   ═══════════════════════════════════════════════════════════ */

/* ── Base icon — invert black stroke → white on dark UI ── */
.ui-icon {
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
  filter: invert(1) brightness(0.95);
  opacity: 0.90;
  position: relative;
  top: -1px;
  pointer-events: none;
}

/* ── Nav tab icons: subtle cyan glow ── */
.tab-icon .ui-icon {
  width: 20px; height: 20px;
  opacity: 0.85;
  filter: invert(1) brightness(0.92) drop-shadow(0 0 3px rgba(0, 200, 255, 0.45));
}
.tab-btn.active .tab-icon .ui-icon {
  opacity: 1;
  filter: invert(1) brightness(1.1) drop-shadow(0 0 6px rgba(0, 220, 255, 0.75));
}

/* ── Mode select screen icons: teal glow ── */
.mm-mode-icon .ui-icon,
.mm-mode-icon > img.ui-icon {
  width: 36px; height: 36px; opacity: 1; top: 0;
  filter: invert(1) brightness(1.05) drop-shadow(0 0 5px rgba(0, 210, 255, 0.55));
}

/* ── Skirmish mode icons ── */
.skirmish-mode-icon .ui-icon,
.skirmish-mode-icon > img.ui-icon {
  width: 28px; height: 28px; opacity: 1; top: 0;
  filter: invert(1) brightness(1.0) drop-shadow(0 0 4px rgba(0, 210, 255, 0.5));
}

/* ── Deploy cost badge: amber tint ── */
.tcg-cost-badge .ui-icon,
.pdv-card-cost .ui-icon {
  width: 11px; height: 11px; top: 0;
  filter: invert(1) sepia(1) saturate(4) hue-rotate(10deg) brightness(1.3);
  opacity: 1;
}

/* ── Deck stat pills ── */
.di-stats-pills .ui-icon { width: 11px; height: 11px; top: 0; }

/* ── In-deck checkmark: green tint ── */
.tcg-deck-check .ui-icon {
  width: 11px; height: 11px; top: 0;
  filter: invert(1) sepia(1) saturate(8) hue-rotate(90deg) brightness(1.3);
  opacity: 1;
}

/* ── Warning pills: red tint ── */
.bld-warning-pill .ui-icon {
  width: 11px; height: 11px; top: 0;
  filter: invert(1) sepia(1) saturate(6) hue-rotate(-20deg);
}

/* ── Battle perk pills ── */
.bt-perk-pill .ui-icon { width: 11px; height: 11px; top: 0; }

/* ── Tactical ability buttons: amber glow ── */
.bt-tac-btn .ui-icon,
.bt-tac-ready .ui-icon {
  width: 11px; height: 11px; top: 0;
  filter: invert(1) brightness(1.05) drop-shadow(0 0 3px rgba(255, 170, 0, 0.5));
}

/* ── Inspect stat blocks ── */
.isb-icon .ui-icon,
.isb-icon > img.ui-icon { width: 14px; height: 14px; top: 0; }

/* ── Ability names ── */
.uci-ability-name .ui-icon,
.ia-name .ui-icon { width: 13px; height: 13px; top: 0; }

/* ── Auth gate icon (large, centered) ── */
.auth-gate-icon .ui-icon,
.auth-gate-icon > img.ui-icon {
  width: 40px; height: 40px; top: 0; opacity: 0.7;
  filter: invert(1) brightness(0.9) drop-shadow(0 0 6px rgba(0, 200, 255, 0.4));
}

/* ── HQ avatar level indicator ── */
#hq-avatar .ui-icon,
#hq-avatar > img.ui-icon { width: 28px; height: 28px; top: 0; }

/* ── Quick-play loadout icon ── */
#qplo-icon .ui-icon,
#qplo-icon > img.ui-icon {
  width: 28px; height: 28px; top: 0; opacity: 1;
  filter: invert(1) brightness(1.05) drop-shadow(0 0 4px rgba(0, 200, 255, 0.5));
}

/* ── BDS deck icon ── */
#bds-icon .ui-icon,
#bds-icon > img.ui-icon {
  width: 22px; height: 22px; top: 0;
  filter: invert(1) brightness(1.0) drop-shadow(0 0 4px rgba(255, 100, 50, 0.5));
}

/* ── Sort/filter buttons ── */
.sort-btn .ui-icon,
.filter-tab .ui-icon { width: 12px; height: 12px; top: 0; opacity: 0.8; }

/* ── Damage floats ── */
.damage-float .ui-icon { width: 10px; height: 10px; top: 0; filter: invert(1); }

/* ── Field full warning: red glow ── */
.field-full-warning .ui-icon {
  width: 14px; height: 14px; top: 0;
  filter: invert(0.8) sepia(1) saturate(6) hue-rotate(330deg) drop-shadow(0 0 3px rgba(255, 60, 60, 0.6));
}

/* ── Combat log icons ── */
span.ability .ui-icon,
span.kill .ui-icon { width: 11px; height: 11px; top: 0; opacity: 0.8; }

/* ── Close buttons ── */
.deck-picker-close .ui-icon,
.drm-close .ui-icon,
.di-header-close .ui-icon,
.uci-close-btn .ui-icon { width: 12px; height: 12px; top: 0; }

/* ── Deploy / attack action buttons: green glow ── */
.bt-deploy-btn .ui-icon,
.bt-attack-btn .ui-icon,
.bt-action-btn .ui-icon {
  filter: invert(1) brightness(1.05) drop-shadow(0 0 4px rgba(0, 255, 100, 0.55));
}

/* ── Gallery / Arsenal button icons ── */
.sort-btn:hover .ui-icon,
.filter-tab.active .ui-icon {
  filter: invert(1) brightness(1.1) drop-shadow(0 0 3px rgba(0, 200, 255, 0.5));
  opacity: 1;
}

/* ── CSS background-image pseudo-elements (stealth, etc.) ── */
/* These use background: url() so can't be targeted here directly */
/* They get filter: invert(1) applied where declared in game.css */