/* =============================================================================
   Home KPI proximity glow — all midnight users.
   Home tiles: cursor follow inside only (no wash). List quick stats keep wash.
   Template: proximity-glow-cards (CodePen jh3y/QWYPaax).
   ============================================================================= */

@property --start {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

.nx-home-top-stats-row
  > [class*="col-"]
  > .card.nx-home-apple-stat-card.nx-home-kpi-proximity {
  --active: 0;
  --start: 0;
  --spread: 56;
  --blur: 0;
  --nx-kpi-border-w: 1.5px;
  --nx-kpi-radius: 16px;
  --nx-kpi-accent: #24d2b5;
  --nx-kpi-accent-mid: #5ee8d4;
  --nx-kpi-accent-soft: #9af5ea;
  --nx-kpi-gradient: conic-gradient(
    from 180deg at 50% 70%,
    hsla(0, 0%, 100%, 0.92) 0deg,
    var(--nx-kpi-accent) 72deg,
    var(--nx-kpi-accent-mid) 144deg,
    var(--nx-kpi-accent-soft) 216deg,
    var(--nx-kpi-accent) 288deg,
    hsla(0, 0%, 100%, 0.92) 1turn
  );
  position: relative !important;
  isolation: isolate;
  overflow: hidden !important;
}

html:is(.midnight, [data-bs-theme*="midnight"])
  .nx-home-top-stats-row
  > [class*="col-"]
  > .card.nx-home-apple-stat-card.nx-home-kpi-proximity {
  background-color: #121212 !important;
}

.nx-home-top-stats-row
  > [class*="col-"]
  > .card.nx-home-apple-stat-card.nx-home-kpi-proximity:has(> .progress .progress-bar.bg-success) {
  --nx-kpi-accent: #24d2b5;
  --nx-kpi-accent-mid: #5ee8d4;
  --nx-kpi-accent-soft: #9af5ea;
  --nx-home-kpi-glow: rgba(24, 110, 95, 0.09);
}

.nx-home-top-stats-row
  > [class*="col-"]
  > .card.nx-home-apple-stat-card.nx-home-kpi-proximity:has(> .progress .progress-bar.bg-info) {
  --nx-kpi-accent: #20aee3;
  --nx-kpi-accent-mid: #5cc8f0;
  --nx-kpi-accent-soft: #9adff7;
  --nx-home-kpi-glow: rgba(26, 95, 130, 0.09);
}

.nx-home-top-stats-row
  > [class*="col-"]
  > .card.nx-home-apple-stat-card.nx-home-kpi-proximity:has(> .progress .progress-bar.bg-warning) {
  --nx-kpi-accent: #ff9041;
  --nx-kpi-accent-mid: #ffab70;
  --nx-kpi-accent-soft: #ffd0a8;
  --nx-home-kpi-glow: rgba(130, 75, 30, 0.08);
}

.nx-home-top-stats-row
  > [class*="col-"]
  > .card.nx-home-apple-stat-card.nx-home-kpi-proximity:has(> .progress .progress-bar.bg-danger) {
  --nx-kpi-accent: #ff5c6c;
  --nx-kpi-accent-mid: #ff8a96;
  --nx-kpi-accent-soft: #ffb8c0;
  --nx-home-kpi-glow: rgba(130, 45, 55, 0.08);
}

.nx-home-top-stats-row
  > [class*="col-"]
  > .card.nx-home-apple-stat-card.nx-home-kpi-proximity:has(> .progress .progress-bar.bg-primary) {
  --nx-kpi-accent: #6772e5;
  --nx-kpi-accent-mid: #8b94ec;
  --nx-kpi-accent-soft: #b4baf5;
  --nx-home-kpi-glow: rgba(55, 60, 130, 0.09);
}

/* Hide hard accent strip — glow takes over (markup kept for color hooks) */
.nx-home-top-stats-row
  > [class*="col-"]
  > .card.nx-home-apple-stat-card.nx-home-kpi-proximity
  > .progress {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

.nx-home-top-stats-row
  > [class*="col-"]
  > .card.nx-home-apple-stat-card.nx-home-kpi-proximity
  > .card-body {
  position: relative !important;
  z-index: 2 !important;
  background: transparent !important;
}

/* Home KPI: cursor edge only (no wash), same as wallet card */
.nx-home-top-stats-row
  > [class*="col-"]
  > .card.nx-home-apple-stat-card.nx-home-kpi-proximity
  > .nx-home-kpi-glows,
.nx-home-top-stats-row
  > [class*="col-"]
  > .card.nx-home-apple-stat-card.nx-home-kpi-proximity
  > .nx-home-kpi-edge::before {
  display: none !important;
}

.nx-home-top-stats-row
  > [class*="col-"]
  > .card.nx-home-apple-stat-card.nx-home-kpi-proximity
  > .nx-home-kpi-edge::after {
  filter: none;
}

/* Soft outer wash (template .glows) — list quick stats only */
html:is(.midnight, [data-bs-theme*="midnight"])
  .nx-home-kpi-glows {
  pointer-events: none;
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: inherit;
  filter: blur(calc(var(--blur) * 1px));
  opacity: 1;
}

html:is(.midnight, [data-bs-theme*="midnight"])
  .nx-home-kpi-glows::before,
html:is(.midnight, [data-bs-theme*="midnight"])
  .nx-home-kpi-glows::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 8px solid transparent;
  border-radius: inherit;
  background: var(--nx-kpi-gradient);
  background-attachment: fixed;
  opacity: var(--active);
  transition: opacity 0.85s ease;
  mask:
    linear-gradient(#0000, #0000),
    conic-gradient(
      from calc((var(--start) - (var(--spread) * 0.5)) * 1deg),
      #000 0deg,
      #fff,
      #0000 calc(var(--spread) * 1deg)
    );
  mask-composite: intersect;
  -webkit-mask:
    linear-gradient(#0000, #0000),
    conic-gradient(
      from calc((var(--start) - (var(--spread) * 0.5)) * 1deg),
      #000 0deg,
      #fff,
      #0000 calc(var(--spread) * 1deg)
    );
  -webkit-mask-composite: source-in, xor;
  mask-clip: padding-box, border-box;
  -webkit-mask-clip: padding-box, border-box;
}

/* Crisp proximity edge (template article::before / ::after) */
.nx-home-kpi-edge {
  pointer-events: none;
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
}

.nx-home-kpi-edge::before {
  content: "";
  position: absolute;
  inset: 0;
  border: var(--nx-kpi-border-w, 1.5px) solid transparent;
  border-radius: inherit;
  pointer-events: none;
  background: rgba(255, 255, 255, 0.14);
  background-attachment: fixed;
  opacity: var(--active);
  transition: opacity 0.85s ease;
  mask:
    linear-gradient(#0000, #0000),
    conic-gradient(
      from calc(((var(--start) + (var(--spread) * 0.25)) - (var(--spread) * 1.5)) * 1deg),
      hsl(0 0% 100% / 0.12) 0deg,
      #fff,
      hsl(0 0% 100% / 0.12) calc(var(--spread) * 2.5deg)
    );
  mask-composite: intersect;
  -webkit-mask:
    linear-gradient(#0000, #0000),
    conic-gradient(
      from calc(((var(--start) + (var(--spread) * 0.25)) - (var(--spread) * 1.5)) * 1deg),
      hsl(0 0% 100% / 0.12) 0deg,
      #fff,
      hsl(0 0% 100% / 0.12) calc(var(--spread) * 2.5deg)
    );
  -webkit-mask-composite: source-in, xor;
  mask-clip: padding-box, border-box;
  -webkit-mask-clip: padding-box, border-box;
}

.nx-home-kpi-edge::after {
  content: "";
  pointer-events: none;
  position: absolute;
  inset: 0;
  border: var(--nx-kpi-border-w, 1.5px) solid transparent;
  border-radius: inherit;
  background: var(--nx-kpi-gradient);
  background-attachment: fixed;
  opacity: var(--active);
  transition: opacity 0.85s ease;
  filter: brightness(1.25) saturate(1.05);
  mask:
    linear-gradient(#0000, #0000),
    conic-gradient(
      from calc(((var(--start) + (var(--spread) * 0.25)) - (var(--spread) * 0.5)) * 1deg),
      #0000 0deg,
      #fff,
      #0000 calc(var(--spread) * 0.55deg)
    );
  mask-composite: intersect;
  -webkit-mask:
    linear-gradient(#0000, #0000),
    conic-gradient(
      from calc(((var(--start) + (var(--spread) * 0.25)) - (var(--spread) * 0.5)) * 1deg),
      #0000 0deg,
      #fff,
      #0000 calc(var(--spread) * 0.55deg)
    );
  -webkit-mask-composite: source-in, xor;
  mask-clip: padding-box, border-box;
  -webkit-mask-clip: padding-box, border-box;
}

.card.nx-home-kpi-proximity:is(:hover, :focus-within) {
  z-index: 2;
}

@media (prefers-reduced-motion: reduce) {
  html:is(.midnight, [data-bs-theme*="midnight"])
    .card.nx-home-kpi-proximity {
    --active: 0.22;
    --start: 210;
  }

  html:is(.midnight, [data-bs-theme*="midnight"])
    .nx-home-kpi-glows,
  html:is(.midnight, [data-bs-theme*="midnight"])
    .nx-home-kpi-edge::before,
  html:is(.midnight, [data-bs-theme*="midnight"])
    .nx-home-kpi-edge::after {
    transition: none;
  }
}

/* =============================================================================
   List quick stats (#list-pages-stats-widget) — same proximity glow, all modules
   ============================================================================= */

html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity {
  --active: 0.14;
  --start: 210;
  --spread: 56;
  --blur: 14;
  --nx-kpi-border-w: 1.5px;
  --nx-kpi-accent: rgba(255, 255, 255, 0.45);
  --nx-kpi-accent-mid: rgba(255, 255, 255, 0.65);
  --nx-kpi-accent-soft: rgba(255, 255, 255, 0.85);
  --nx-kpi-gradient: conic-gradient(
    from 180deg at 50% 70%,
    hsla(0, 0%, 100%, 0.9) 0deg,
    var(--nx-kpi-accent) 72deg,
    var(--nx-kpi-accent-mid) 144deg,
    var(--nx-kpi-accent-soft) 216deg,
    var(--nx-kpi-accent) 288deg,
    hsla(0, 0%, 100%, 0.9) 1turn
  );
  --nx-home-kpi-glow: rgba(255, 255, 255, 0.05);
  isolation: isolate;
  background-image: radial-gradient(
    ellipse 90% 55% at 50% 100%,
    var(--nx-home-kpi-glow) 0%,
    transparent 70%
  ) !important;
  background-repeat: no-repeat !important;
}

html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.progress-bar.bg-success),
html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.nx-list-stats-corner-icon.text-success) {
  --nx-kpi-accent: #3dd4bd;
  --nx-kpi-accent-mid: #5ee8d4;
  --nx-kpi-accent-soft: #9af5ea;
  --nx-home-kpi-glow: rgba(24, 110, 95, 0.1);
}

html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.progress-bar.bg-info),
html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.nx-list-stats-corner-icon.text-info) {
  --nx-kpi-accent: #4db8e8;
  --nx-kpi-accent-mid: #6dd4f7;
  --nx-kpi-accent-soft: #9adff7;
  --nx-home-kpi-glow: rgba(26, 95, 130, 0.1);
}

html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.progress-bar.bg-primary),
html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.nx-list-stats-corner-icon.text-primary) {
  --nx-kpi-accent: #8b93f5;
  --nx-kpi-accent-mid: #9ba3f0;
  --nx-kpi-accent-soft: #b4baf5;
  --nx-home-kpi-glow: rgba(55, 60, 130, 0.1);
}

html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.progress-bar.bg-teal),
html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.nx-list-stats-corner-icon.text-teal) {
  --nx-kpi-accent: #2aa8b3;
  --nx-kpi-accent-mid: #4ec4ce;
  --nx-kpi-accent-soft: #8adce3;
  --nx-home-kpi-glow: rgba(20, 90, 95, 0.1);
}

html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.progress-bar.bg-lime),
html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.nx-list-stats-corner-icon.text-lime) {
  --nx-kpi-accent: #d4e05a;
  --nx-kpi-accent-mid: #e0ea7a;
  --nx-kpi-accent-soft: #eef5a8;
  --nx-home-kpi-glow: rgba(100, 110, 30, 0.09);
}

html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.progress-bar.bg-danger),
html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.nx-list-stats-corner-icon.text-danger) {
  --nx-kpi-accent: #ff6b7a;
  --nx-kpi-accent-mid: #ff8a96;
  --nx-kpi-accent-soft: #ffb8c0;
  --nx-home-kpi-glow: rgba(130, 45, 55, 0.1);
}

html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.progress-bar.bg-warning),
html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.nx-list-stats-corner-icon.text-warning) {
  --nx-kpi-accent: #ff9a4d;
  --nx-kpi-accent-mid: #ffab70;
  --nx-kpi-accent-soft: #ffd0a8;
  --nx-home-kpi-glow: rgba(130, 75, 30, 0.09);
}

html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.progress-bar.bg-brown),
html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.nx-list-stats-corner-icon.text-brown) {
  --nx-kpi-accent: #c49a78;
  --nx-kpi-accent-mid: #d4b496;
  --nx-kpi-accent-soft: #e6d0b8;
  --nx-home-kpi-glow: rgba(90, 65, 40, 0.1);
}

html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.progress-bar.bg-secondary),
html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.progress-bar.bg-default),
html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.nx-list-stats-corner-icon.text-secondary),
html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.nx-list-stats-corner-icon.text-default),
html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity:has(.nx-list-stats-corner-icon.text-muted) {
  --nx-kpi-accent: rgba(255, 255, 255, 0.42);
  --nx-kpi-accent-mid: rgba(255, 255, 255, 0.62);
  --nx-kpi-accent-soft: rgba(255, 255, 255, 0.82);
  --nx-home-kpi-glow: rgba(255, 255, 255, 0.06);
}

html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity
  > .card-body {
  position: relative !important;
  z-index: 2 !important;
  background: transparent !important;
}

html:is(.midnight, [data-bs-theme*="midnight"])
  #list-pages-stats-widget.table-stats-cards
  > .card.nx-home-kpi-proximity
  .progress.dynamic-list {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

/* =============================================================================
   Operator wallet card — same cursor proximity as fast stats.
   Idle (no OVP): avatar ring blue. With OVP: follows average fulfillment tone.
   ============================================================================= */

#nx-home-ew-live.nx-home-kpi-proximity {
  --active: 0;
  --start: 210;
  --spread: 56;
  --blur: 0;
  --nx-kpi-border-w: 1.5px;
  --nx-kpi-radius: 16px;
  --nx-kpi-accent: #4e7eb8;
  --nx-kpi-accent-mid: #6f9bcc;
  --nx-kpi-accent-soft: #9bb8dc;
  --nx-kpi-gradient: conic-gradient(
    from 180deg at 50% 70%,
    hsla(0, 0%, 100%, 0.92) 0deg,
    var(--nx-kpi-accent) 72deg,
    var(--nx-kpi-accent-mid) 144deg,
    var(--nx-kpi-accent-soft) 216deg,
    var(--nx-kpi-accent) 288deg,
    hsla(0, 0%, 100%, 0.92) 1turn
  );
  position: relative !important;
  isolation: isolate;
  overflow: hidden !important;
  background-image: none;
}

html:is(.midnight, [data-bs-theme*="midnight"])
  #nx-home-ew-live.nx-home-kpi-proximity {
  background-color: #121212;
}

#nx-home-ew-live.nx-home-kpi-proximity > .nx-home-kpi-glows,
#nx-home-ew-live .nx-home-ew-live__blobs,
#nx-home-ew-live.nx-home-kpi-proximity > .nx-home-kpi-edge::before {
  display: none !important;
}

#nx-home-ew-live.nx-home-kpi-proximity > .nx-home-kpi-edge::after {
  filter: none;
}

#nx-home-ew-live.nx-home-kpi-proximity[data-ew-glow="success"] {
  --nx-kpi-accent: #24d2b5;
  --nx-kpi-accent-mid: #5ee8d4;
  --nx-kpi-accent-soft: #9af5ea;
  --nx-home-kpi-glow: rgba(24, 110, 95, 0.09);
}

#nx-home-ew-live.nx-home-kpi-proximity[data-ew-glow="warning"] {
  --nx-kpi-accent: #ff9041;
  --nx-kpi-accent-mid: #ffab70;
  --nx-kpi-accent-soft: #ffd0a8;
  --nx-home-kpi-glow: rgba(130, 75, 30, 0.08);
}

#nx-home-ew-live.nx-home-kpi-proximity[data-ew-glow="danger"] {
  --nx-kpi-accent: #ff5c6c;
  --nx-kpi-accent-mid: #ff8a96;
  --nx-kpi-accent-soft: #ffb8c0;
  --nx-home-kpi-glow: rgba(130, 45, 55, 0.08);
}

html:is(.midnight, [data-bs-theme*="midnight"])
  #nx-home-ew-live.nx-home-kpi-proximity > .nx-home-ew-live__profile,
html:is(.midnight, [data-bs-theme*="midnight"])
  #nx-home-ew-live.nx-home-kpi-proximity > .nx-home-ew-live__kpis,
html:is(.midnight, [data-bs-theme*="midnight"])
  #nx-home-ew-live.nx-home-kpi-proximity > .nx-home-ew-live__card {
  position: relative;
  z-index: 2;
}

html:is(.midnight, [data-bs-theme*="midnight"])
  #nx-home-ew-live.nx-home-kpi-proximity .nx-home-ew-live__avatar {
  border-color: var(--nx-kpi-accent);
  transition: border-color 0.85s ease;
}

html:is(.midnight, [data-bs-theme*="midnight"])
  #nx-home-ew-live.nx-home-kpi-proximity:is(:hover, :focus-within) {
  z-index: 2;
}