/* =====================================================================
   LUME — Brand multi-marca design system
   Palette derivata da:
     • energiaverdeitalia.it   → verde #22c55e + blu corporate
     • energiasostenibilespa.it → verde #22c55e dominante
     • protettaservizi.it      → blu navy #4a7ab8 + coral #e85a3d
   Pairing tipografico: Fraunces (display) + Geist Sans/Mono.
   Dual mode: dark (default) + light via html.light-mode body.lume.
   Use: <link rel="stylesheet" href="lume.css?v=8"> after Bootstrap.
   ===================================================================== */

/* =====================================================================
   @FONT-FACE — self-hosted (no Google Fonts CDN dependency)
   Riduce 200-400ms su prima visita + funziona dietro firewall.
   ===================================================================== */
/* Fraunces — display variabile (latin) */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('fonts/fraunces-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('fonts/fraunces-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Geist — body */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/geist-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/geist-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/geist-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url('fonts/geist-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Geist Mono — code/numeric */
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url('fonts/geist-mono-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url('fonts/geist-mono-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ---------- Tokens DARK (default) ---------- */
:root,
body.lume {
  /* Surfaces — navy-tinted off-black, NON cool blu Github */
  --lm-bg-0: #0b0e13;            /* page bg base */
  --lm-bg-1: #131822;            /* card surface */
  --lm-bg-2: #1a2030;            /* card hover / nested */
  --lm-bg-3: #243047;            /* elevated */
  --lm-line: #1e2535;
  --lm-line-strong: #2c3754;

  /* Text — off-white cool con tinta brand */
  --lm-text:    #e8edf5;
  --lm-text-2:  #b3bcce;
  --lm-text-3:  #7a8597;
  --lm-label:   #5e6878;

  /* Accents brand */
  --lm-energia:        #22c55e;  /* verde EVI + ESS */
  --lm-energia-soft:   #16a34a;
  --lm-energia-glow:   rgba(34,197,94,.32);
  --lm-protetta:       #4a7ab8;  /* blu navy Protetta */
  --lm-protetta-soft:  #3d6499;
  --lm-protetta-glow:  rgba(74,122,184,.32);
  --lm-iban:           #e85a3d;  /* coral CTA Protetta */
  --lm-iban-soft:      #d44429;
  --lm-positive:       #4ade80;  /* delta + verde light */
  --lm-negative:       #ef6b58;  /* delta − coral, NON pure red */
  --lm-warning:        #f99c00;
  --lm-blue-corp:      #2563eb;  /* secondary EVI */

  /* Atmosphere glow */
  --lm-glow-1: rgba(34,197,94,.06);
  --lm-glow-2: rgba(74,122,184,.05);
  --lm-grain-opacity: .03;
  --lm-grain-blend: overlay;

  /* Radii / shadow / blur */
  --lm-r-sm:   6px;
  --lm-r-md:   12px;
  --lm-r-lg:   20px;
  --lm-r-pill: 999px;
  --lm-shadow-1: 0 1px 0 rgba(255,255,255,.04) inset, 0 12px 36px -16px rgba(0,0,0,.55);
  --lm-shadow-2: 0 1px 0 rgba(255,255,255,.06) inset, 0 24px 72px -28px rgba(0,0,0,.7);
  --lm-shadow-card: 0 1px 0 rgba(255,255,255,.03) inset, 0 4px 24px -10px rgba(0,0,0,.45);

  /* Hairline accent */
  --lm-hairline: rgba(255,255,255,.12);

  /* Motion */
  --lm-ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --lm-ease-out:    cubic-bezier(.16, 1, .3, 1);
  --lm-dur-1: 200ms;
  --lm-dur-2: 380ms;
  --lm-dur-3: 720ms;

  /* Type stack */
  --lm-font-display: "Fraunces", ui-serif, Georgia, "Times New Roman", serif;
  --lm-font-body:    "Geist", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --lm-font-mono:    "Geist Mono", ui-monospace, "JetBrains Mono", "SF Mono", Consolas, monospace;
}

/* ---------- Tokens LIGHT (override quando html.light-mode body.lume) ---------- */
html.light-mode body.lume {
  --lm-bg-0: #f7f8fb;
  --lm-bg-1: #ffffff;
  --lm-bg-2: #eff2f7;
  --lm-bg-3: #e5eaf3;
  --lm-line: #e1e6ee;
  --lm-line-strong: #c8d0dd;

  --lm-text:    #0f1924;          /* navy Protetta scuro */
  --lm-text-2:  #2d4a6b;
  --lm-text-3:  #5a6b80;
  --lm-label:   #7a8597;

  /* Accent leggermente più scuri per AAA contrast su sfondo chiaro */
  --lm-energia:        #16a34a;
  --lm-energia-soft:   #15803d;
  --lm-energia-glow:   rgba(22,163,74,.18);
  --lm-protetta:       #3d6499;
  --lm-protetta-soft:  #2d4a6b;
  --lm-protetta-glow:  rgba(61,100,153,.16);
  --lm-iban:           #d44429;
  --lm-iban-soft:      #b13520;
  --lm-positive:       #16a34a;
  --lm-negative:       #d44429;
  --lm-warning:        #b45309;
  --lm-blue-corp:      #1e40af;

  --lm-glow-1: rgba(34,197,94,.08);
  --lm-glow-2: rgba(74,122,184,.07);
  --lm-grain-opacity: 0;          /* niente grain in light */
  --lm-grain-blend: normal;

  --lm-shadow-1: 0 1px 0 rgba(255,255,255,1) inset, 0 1px 3px rgba(15,25,36,.06), 0 8px 24px -12px rgba(15,25,36,.12);
  --lm-shadow-2: 0 1px 0 rgba(255,255,255,1) inset, 0 4px 12px rgba(15,25,36,.08), 0 24px 48px -16px rgba(15,25,36,.18);
  --lm-shadow-card: 0 1px 2px rgba(15,25,36,.04), 0 4px 16px -6px rgba(15,25,36,.08);

  --lm-hairline: rgba(15,25,36,.08);
}

/* ---------- Page atmosphere ---------- */
body.lume {
  background:
    radial-gradient(1200px 600px at 20% -10%, var(--lm-glow-1), transparent 60%),
    radial-gradient(900px 500px at 110% 10%, var(--lm-glow-2), transparent 60%),
    var(--lm-bg-0);
  color: var(--lm-text);
  font-family: var(--lm-font-body);
  font-feature-settings: "ss01", "cv11";
  -webkit-font-smoothing: antialiased;
}
body.lume::before {
  content: "";
  position: fixed; inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: var(--lm-grain-opacity);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .9 0'/></filter><rect width='180' height='180' filter='url(%23n)'/></svg>");
  mix-blend-mode: var(--lm-grain-blend);
  transition: opacity var(--lm-dur-2) var(--lm-ease-out);
}

/* ---------- Banner LUME — editorial header ---------- */
.lm-banner {
  position: relative;
  background:
    linear-gradient(180deg, color-mix(in oklab, var(--lm-bg-2) 55%, transparent), color-mix(in oklab, var(--lm-bg-1) 75%, transparent)),
    var(--lm-bg-1);
  border: 1px solid var(--lm-line);
  border-radius: var(--lm-r-lg);
  padding: 22px 28px 20px;
  box-shadow: var(--lm-shadow-1);
  overflow: hidden;
  z-index: 1;
}
.lm-banner::after {
  /* hairline luminoso in alto */
  content: "";
  position: absolute; left: 0; right: 0; top: 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--lm-hairline) 30%, var(--lm-hairline) 70%, transparent);
}
.lm-banner-head {
  display: flex; align-items: baseline; justify-content: space-between;
  margin-bottom: 14px;
  border-bottom: 1px solid var(--lm-line);
  padding-bottom: 10px;
}
.lm-banner-eyebrow {
  font-family: var(--lm-font-mono);
  font-size: .68rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--lm-label);
}
.lm-banner-eyebrow .dot {
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--lm-energia);
  box-shadow: 0 0 12px var(--lm-energia-glow);
  margin-right: 10px;
  vertical-align: middle;
  animation: lm-pulse 2.4s ease-in-out infinite;
}
.lm-banner-meta {
  font-family: var(--lm-font-mono);
  font-size: .7rem;
  color: var(--lm-text-3);
  letter-spacing: .08em;
}

.lm-banner-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr 1fr 1fr 1fr;
  gap: 0;
  align-items: stretch;
}
.lm-banner-grid.cols-4 { grid-template-columns: 1.4fr 1fr 1fr 1fr; }
.lm-banner-grid.cols-3 { grid-template-columns: 1.4fr 1fr 1fr; }
.lm-banner-grid.cols-5 { grid-template-columns: 1.3fr 1fr 1fr 1fr 1fr; }
.lm-banner-grid > .lm-tile + .lm-tile {
  border-left: 1px solid var(--lm-line);
}
.lm-tile {
  padding: 4px 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  opacity: 0;
  transform: translateY(8px);
  animation: lm-rise var(--lm-dur-3) var(--lm-ease-out) forwards;
  position: relative;
}
.lm-banner-grid > .lm-tile:nth-child(1) { animation-delay: 60ms;  padding-left: 0; }
.lm-banner-grid > .lm-tile:nth-child(2) { animation-delay: 130ms; }
.lm-banner-grid > .lm-tile:nth-child(3) { animation-delay: 200ms; }
.lm-banner-grid > .lm-tile:nth-child(4) { animation-delay: 270ms; }
.lm-banner-grid > .lm-tile:nth-child(5) { animation-delay: 340ms; }
.lm-banner-grid > .lm-tile:nth-child(6) { animation-delay: 410ms; padding-right: 0; }
.lm-banner-grid.cols-4 > .lm-tile:nth-child(4) { padding-right: 0; }
.lm-banner-grid.cols-5 > .lm-tile:nth-child(5) { padding-right: 0; }

.lm-tile-label {
  font-family: var(--lm-font-mono);
  font-size: .62rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--lm-label);
  display: flex; align-items: center; gap: 6px;
}
.lm-tile-num {
  font-family: var(--lm-font-display);
  font-variation-settings: "opsz" 144, "SOFT" 30, "WONK" 0, "wght" 540;
  font-size: clamp(1.6rem, 1.4rem + .8vw, 2.4rem);
  line-height: 1;
  letter-spacing: -.015em;
  color: var(--lm-text);
  font-feature-settings: "tnum" 1, "lnum" 1;
}
.lm-tile-num.is-energia  { color: var(--lm-energia); }
.lm-tile-num.is-protetta { color: var(--lm-protetta); }
.lm-tile-num.is-iban     { color: var(--lm-iban); }
.lm-tile-num.is-positive { color: var(--lm-positive); }
.lm-tile-num.is-negative { color: var(--lm-negative); }
.lm-tile-num.is-blue     { color: var(--lm-protetta); }   /* alias */

.lm-tile-sub {
  font-family: var(--lm-font-mono);
  font-size: .72rem;
  color: var(--lm-text-3);
  display: flex; align-items: baseline; gap: 8px;
  letter-spacing: .02em;
}
.lm-tile-sub .real {
  color: var(--lm-text-2);
  font-variant-numeric: tabular-nums;
}
.lm-tile-sub .delta {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0;
}
.lm-tile-sub .delta.up   { color: var(--lm-positive); }
.lm-tile-sub .delta.down { color: var(--lm-negative); }
.lm-tile-sub .delta::before {
  content: "";
  display: inline-block;
  width: 0; height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  margin-right: 4px;
  transform: translateY(-1px);
}
.lm-tile-sub .delta.up::before   { border-bottom: 6px solid var(--lm-positive); }
.lm-tile-sub .delta.down::before { border-top: 6px solid var(--lm-negative); }

.lm-tile-bar {
  position: relative;
  height: 3px;
  border-radius: 2px;
  background: var(--lm-bg-3);
  overflow: hidden;
}
.lm-tile-bar > i {
  position: absolute; inset: 0;
  width: var(--p, 0%);
  background: linear-gradient(90deg, currentColor 0%, color-mix(in oklab, currentColor 70%, white) 100%);
  border-radius: 2px;
  transform-origin: left center;
  animation: lm-barfill var(--lm-dur-3) var(--lm-ease-out) both;
  animation-delay: 480ms;
}
.lm-tile-target {
  font-family: var(--lm-font-mono);
  font-size: .68rem;
  color: var(--lm-text-3);
}
/* Trend mese-su-mese — versione SOBRIA: nessun badge colorato grosso accanto al numero,
   solo una riga "vs Apr: 2.827 ▼ -94%" minuscola sotto il sub. */
.lm-trend-tip {
  font-family: var(--lm-font-mono);
  font-size: .62rem;
  color: var(--lm-text-3);
  letter-spacing: .06em;
  margin-top: 4px;
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  font-variant-numeric: tabular-nums;
}
.lm-trend-delta {
  font-weight: 500;
  letter-spacing: .02em;
  opacity: .85;
}
.lm-trend-delta.is-up   { color: var(--lm-positive); }
.lm-trend-delta.is-down { color: var(--lm-negative); }

/* Sparkline 14gg — angolo top-right del tile, subdued di default, full on hover */
.lm-spark {
  position: absolute;
  top: 6px;
  right: 14px;
  pointer-events: none;
  opacity: .72;
  transform-origin: right center;
  transition: opacity .25s ease, transform .25s ease;
  display: block;
}
.lm-tile:hover .lm-spark { opacity: 1; transform: scale(1.04); }
.lm-tile.is-hero .lm-spark { top: 4px; }
@media (max-width: 720px) {
  .lm-spark { width: 56px; height: 18px; }
}

/* =====================================================================
   BANNER — vivace dark mode (contrasto + luminosità senza perdere eleganza)
   In light mode rimane com'è (già abbastanza brillante).
   ===================================================================== */
body.lume:not(.light-mode) .lm-banner,
html:not(.light-mode) body.lume .lm-banner {
  background:
    radial-gradient(ellipse 60% 80% at 12% -10%,
      color-mix(in oklab, var(--lm-energia) 14%, transparent), transparent 55%),
    radial-gradient(ellipse 70% 90% at 88% 110%,
      color-mix(in oklab, var(--lm-protetta) 12%, transparent), transparent 55%),
    linear-gradient(180deg,
      color-mix(in oklab, var(--lm-bg-2) 65%, transparent),
      color-mix(in oklab, var(--lm-bg-1) 80%, transparent)),
    var(--lm-bg-1);
  border-color: color-mix(in oklab, var(--lm-line-strong) 80%, var(--lm-energia) 4%);
  box-shadow:
    0 1px 0 color-mix(in oklab, var(--lm-text) 6%, transparent) inset,
    0 12px 36px -16px rgba(0,0,0,.55),
    0 0 0 1px color-mix(in oklab, var(--lm-text) 3%, transparent) inset;
}
html:not(.light-mode) body.lume .lm-banner .lm-banner-eyebrow,
body.lume:not(.light-mode) .lm-banner .lm-banner-eyebrow {
  color: color-mix(in oklab, var(--lm-text-2) 85%, var(--lm-text));
}
html:not(.light-mode) body.lume .lm-banner .lm-banner-meta,
body.lume:not(.light-mode) .lm-banner .lm-banner-meta {
  color: var(--lm-text-2);
}
html:not(.light-mode) body.lume .lm-banner .lm-tile-label,
body.lume:not(.light-mode) .lm-banner .lm-tile-label {
  color: color-mix(in oklab, var(--lm-text-2) 80%, var(--lm-text));
}
html:not(.light-mode) body.lume .lm-banner .lm-tile-num,
body.lume:not(.light-mode) .lm-banner .lm-tile-num {
  text-shadow: 0 0 28px color-mix(in oklab, currentColor 38%, transparent);
}
html:not(.light-mode) body.lume .lm-banner .lm-tile-sub .real,
body.lume:not(.light-mode) .lm-banner .lm-tile-sub .real {
  color: var(--lm-text);
}
html:not(.light-mode) body.lume .lm-banner .lm-tile-sub,
body.lume:not(.light-mode) .lm-banner .lm-tile-sub {
  color: var(--lm-text-2);
}
html:not(.light-mode) body.lume .lm-banner .lm-trend-tip,
body.lume:not(.light-mode) .lm-banner .lm-trend-tip {
  color: var(--lm-text-2);
}
html:not(.light-mode) body.lume .lm-banner .lm-trend-delta,
body.lume:not(.light-mode) .lm-banner .lm-trend-delta {
  opacity: 1;
  font-weight: 600;
}
html:not(.light-mode) body.lume .lm-banner .lm-spark,
body.lume:not(.light-mode) .lm-banner .lm-spark {
  opacity: .82;
  filter: drop-shadow(0 0 6px color-mix(in oklab, currentColor 35%, transparent));
}
html:not(.light-mode) body.lume .lm-banner .lm-tile:hover .lm-spark,
body.lume:not(.light-mode) .lm-banner .lm-tile:hover .lm-spark {
  opacity: 1;
}

/* Hero tile (più grande, prima posizione) */
.lm-tile.is-hero {
  flex: 1.2;
}
.lm-tile.is-hero .lm-tile-num {
  font-size: clamp(2.1rem, 1.6rem + 1.2vw, 3rem);
  font-variation-settings: "opsz" 144, "SOFT" 50, "WONK" 1, "wght" 580;
}
.lm-tile.is-hero .lm-tile-num small {
  font-family: var(--lm-font-mono);
  font-size: .8rem;
  font-weight: 400;
  color: var(--lm-text-3);
  letter-spacing: .04em;
  margin-left: 4px;
}

@keyframes lm-rise {
  0%   { opacity: 0; transform: translateY(10px); }
  100% { opacity: 1; transform: translateY(0); }
}
@keyframes lm-barfill {
  0%   { width: 0%; }
  100% { width: var(--p, 0%); }
}
@keyframes lm-pulse {
  0%, 100% { transform: scale(1);   opacity: 1;   }
  50%      { transform: scale(1.4); opacity: .55; }
}

/* ---------- Card LUME generica ---------- */
.lm-card {
  background: var(--lm-bg-1);
  border: 1px solid var(--lm-line);
  border-radius: var(--lm-r-lg);
  box-shadow: var(--lm-shadow-card);
  overflow: hidden;
  position: relative;
}
.lm-card::after {
  content: "";
  position: absolute; left: 0; right: 0; top: 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--lm-hairline), transparent);
}
.lm-card-head {
  padding: 14px 22px 12px;
  border-bottom: 1px solid var(--lm-line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.lm-card-title {
  font-family: var(--lm-font-display);
  font-variation-settings: "opsz" 90, "SOFT" 30, "wght" 540;
  font-size: 1.05rem;
  letter-spacing: -.01em;
  color: var(--lm-text);
  display: flex;
  align-items: center;
  gap: 10px;
}
.lm-card-title .ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px; height: 28px;
  border-radius: 8px;
  background: var(--lm-bg-3);
  color: var(--lm-energia);
  font-size: .82rem;
}
.lm-card-title .ico.is-protetta { color: var(--lm-protetta); }
.lm-card-title .ico.is-iban     { color: var(--lm-iban); }
.lm-card-title .ico.is-warning  { color: var(--lm-warning); }
.lm-card-eyebrow {
  font-family: var(--lm-font-mono);
  font-size: .64rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--lm-label);
}
.lm-card-body {
  padding: 0;
}

/* Numero inline grosso (per dentro card body) */
.lm-num {
  font-family: var(--lm-font-display);
  font-variation-settings: "opsz" 144, "SOFT" 30, "wght" 540;
  line-height: 1;
  letter-spacing: -.015em;
  font-feature-settings: "tnum" 1, "lnum" 1;
}
.lm-num.lg  { font-size: clamp(2.4rem, 2rem + 1.2vw, 3.2rem); }
.lm-num.md  { font-size: 1.6rem; }
.lm-num.is-energia  { color: var(--lm-energia); }
.lm-num.is-protetta { color: var(--lm-protetta); }
.lm-num.is-iban     { color: var(--lm-iban); }
.lm-num.is-blue     { color: var(--lm-blue-corp); }

/* Pill metric (PAF / IBAN) sotto al numero */
.lm-metric-row {
  display: flex;
  gap: 18px;
  align-items: baseline;
  font-family: var(--lm-font-mono);
  font-size: .74rem;
  color: var(--lm-text-3);
  letter-spacing: .04em;
}
.lm-metric-row strong {
  color: var(--lm-text);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.lm-metric-row .label {
  color: var(--lm-label);
  font-size: .62rem;
  letter-spacing: .2em;
  text-transform: uppercase;
}

/* Override tabelle Bootstrap dentro lm-card */
body.lume .lm-card .table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--lm-text);
  --bs-table-border-color: var(--lm-line);
  --bs-table-hover-bg: var(--lm-bg-2);
  --bs-table-hover-color: var(--lm-text);
  --bs-table-striped-bg: rgba(255,255,255,.015);
}
html.light-mode body.lume .lm-card .table {
  --bs-table-striped-bg: rgba(15,25,36,.02);
}
body.lume .lm-card .table thead {
  background: var(--lm-bg-2);
}
body.lume .lm-card .table thead th {
  font-family: var(--lm-font-mono);
  font-size: .66rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--lm-label);
  font-weight: 500;
  border-bottom: 1px solid var(--lm-line);
  padding: 10px 14px;
}
body.lume .lm-card .table tbody td {
  border-bottom: 1px solid var(--lm-line);
  padding: 10px 14px;
}
body.lume .lm-card .table tbody tr:last-child td { border-bottom: none; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .lm-banner-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px 0;
  }
  .lm-banner-grid > .lm-tile + .lm-tile { border-left: none; }
  .lm-banner-grid > .lm-tile:nth-child(odd)  { padding-left: 0; padding-right: 14px; border-right: 1px solid var(--lm-line); }
  .lm-banner-grid > .lm-tile:nth-child(even) { padding-left: 14px; padding-right: 0; }
}
@media (max-width: 560px) {
  .lm-banner-grid { grid-template-columns: 1fr !important; }
  .lm-banner-grid > .lm-tile {
    padding: 12px 0 !important;
    border-left: none !important;
    border-right: none !important;
    border-top: 1px solid var(--lm-line);
  }
  .lm-banner-grid > .lm-tile:first-child { border-top: none; }
}

/* =====================================================================
   BOOTSTRAP OVERRIDE — auto-applies to ALL pages with body.lume
   (cards, buttons, tables, forms, alerts, modals, badges, progress…)
   Uses --bs-* CSS variables when possible to preserve Bootstrap behavior.
   ===================================================================== */

/* ---------- Bootstrap variables ---------- */
body.lume {
  --bs-body-bg:    var(--lm-bg-0);
  --bs-body-color: var(--lm-text);
  --bs-border-color: var(--lm-line);
  --bs-border-color-translucent: var(--lm-line);
  --bs-secondary-color: var(--lm-text-2);
  --bs-tertiary-color:  var(--lm-text-3);
  --bs-emphasis-color:  var(--lm-text);
  --bs-secondary-bg:    var(--lm-bg-2);
  --bs-tertiary-bg:     var(--lm-bg-1);
  --bs-link-color:        var(--lm-energia);
  --bs-link-hover-color:  var(--lm-energia-soft);
  --bs-primary: var(--lm-blue-corp);
  --bs-success: var(--lm-energia);
  --bs-warning: var(--lm-warning);
  --bs-danger:  var(--lm-negative);
  --bs-info:    var(--lm-protetta);
}

/* ---------- Cards ---------- */
body.lume .card {
  background-color: var(--lm-bg-1);
  border: 1px solid var(--lm-line);
  border-radius: var(--lm-r-md);
  box-shadow: var(--lm-shadow-card);
  color: var(--lm-text);
  position: relative;
  overflow: hidden;
  transition: transform var(--lm-dur-2) var(--lm-ease-out),
              box-shadow var(--lm-dur-2) var(--lm-ease-out),
              border-color var(--lm-dur-2) var(--lm-ease-out);
}
/* Hover lift sottile per dare "tatto" — opt-out con .no-lift */
body.lume .card:hover:not(.no-lift),
body.lume .lm-card:hover:not(.no-lift) {
  transform: translateY(-2px);
  box-shadow: var(--lm-shadow-2);
  border-color: var(--lm-line-strong);
}
body.lume .lm-card {
  transition: transform var(--lm-dur-2) var(--lm-ease-out),
              box-shadow var(--lm-dur-2) var(--lm-ease-out),
              border-color var(--lm-dur-2) var(--lm-ease-out);
}
body.lume .card::after {
  content: "";
  position: absolute; left: 0; right: 0; top: 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--lm-hairline), transparent);
  pointer-events: none;
}
body.lume .card.shadow-sm { box-shadow: var(--lm-shadow-card); }
body.lume .card-header {
  background: linear-gradient(180deg, var(--lm-bg-2), var(--lm-bg-1)) !important;
  border-bottom: 1px solid var(--lm-line) !important;
  color: var(--lm-text);
  padding: 12px 18px;
  font-family: var(--lm-font-display);
  font-variation-settings: "opsz" 90, "SOFT" 30, "wght" 540;
  font-size: .98rem;
  letter-spacing: -.005em;
}
body.lume .card-header h5,
body.lume .card-header .h5,
body.lume .card-header .card-title {
  font-family: var(--lm-font-display);
  font-variation-settings: "opsz" 90, "SOFT" 30, "wght" 540;
  letter-spacing: -.005em;
  color: var(--lm-text) !important;
}
body.lume .card-body { color: var(--lm-text); padding: 14px 18px; }
body.lume .card-footer { background: var(--lm-bg-2); border-top: 1px solid var(--lm-line); color: var(--lm-text-2); }

/* Color-headers presenti nel codice (ch-energia, ch-protetta, ecc) */
body.lume .ch-energia,
body.lume .ch-energia-mese {
  background: linear-gradient(180deg, color-mix(in oklab, var(--lm-energia) 18%, var(--lm-bg-2)), var(--lm-bg-1)) !important;
  color: var(--lm-text) !important;
  border-bottom: 1px solid color-mix(in oklab, var(--lm-energia) 30%, var(--lm-line)) !important;
}
body.lume .ch-protetta,
body.lume .ch-protetta-mese {
  background: linear-gradient(180deg, color-mix(in oklab, var(--lm-protetta) 18%, var(--lm-bg-2)), var(--lm-bg-1)) !important;
  color: var(--lm-text) !important;
  border-bottom: 1px solid color-mix(in oklab, var(--lm-protetta) 30%, var(--lm-line)) !important;
}
body.lume .ch-oggi {
  background: linear-gradient(180deg, color-mix(in oklab, var(--lm-blue-corp) 16%, var(--lm-bg-2)), var(--lm-bg-1)) !important;
  color: var(--lm-text) !important;
  border-bottom: 1px solid color-mix(in oklab, var(--lm-blue-corp) 28%, var(--lm-line)) !important;
}
body.lume .ch-campagne {
  background: linear-gradient(180deg, color-mix(in oklab, var(--lm-iban) 16%, var(--lm-bg-2)), var(--lm-bg-1)) !important;
  color: var(--lm-text) !important;
  border-bottom: 1px solid color-mix(in oklab, var(--lm-iban) 28%, var(--lm-line)) !important;
}
body.lume .ch-ora {
  background: linear-gradient(180deg, color-mix(in oklab, var(--lm-warning) 16%, var(--lm-bg-2)), var(--lm-bg-1)) !important;
  color: var(--lm-text) !important;
  border-bottom: 1px solid color-mix(in oklab, var(--lm-warning) 28%, var(--lm-line)) !important;
}

/* ---------- Numeri "value" presenti nel codice (.val-green, .val-purple, .val-blue) ---------- */
body.lume .val-green, body.lume .val-purple, body.lume .val-blue {
  font-family: var(--lm-font-display);
  font-variation-settings: "opsz" 144, "SOFT" 30, "wght" 540;
  font-size: clamp(2rem, 1.6rem + 1vw, 2.6rem);
  line-height: 1;
  letter-spacing: -.015em;
  font-feature-settings: "tnum" 1, "lnum" 1;
}
body.lume .val-green  { color: var(--lm-energia) !important; }
body.lume .val-purple { color: var(--lm-protetta) !important; }
body.lume .val-blue   { color: var(--lm-blue-corp) !important; }

/* ---------- Buttons ---------- */
body.lume .btn {
  font-family: var(--lm-font-body);
  font-weight: 500;
  letter-spacing: -.005em;
  border-radius: var(--lm-r-sm);
  transition: all var(--lm-dur-1) var(--lm-ease-out);
  --bs-btn-border-radius: var(--lm-r-sm);
}
body.lume .btn:hover { transform: translateY(-1px); }
body.lume .btn-primary {
  --bs-btn-bg: var(--lm-blue-corp);
  --bs-btn-border-color: var(--lm-blue-corp);
  --bs-btn-hover-bg: color-mix(in oklab, var(--lm-blue-corp) 80%, white);
  --bs-btn-hover-border-color: color-mix(in oklab, var(--lm-blue-corp) 70%, white);
  --bs-btn-active-bg: color-mix(in oklab, var(--lm-blue-corp) 75%, black);
}
body.lume .btn-success {
  --bs-btn-bg: var(--lm-energia);
  --bs-btn-border-color: var(--lm-energia);
  --bs-btn-color: #062a14;
  --bs-btn-hover-bg: color-mix(in oklab, var(--lm-energia) 85%, white);
  --bs-btn-hover-color: #062a14;
}
body.lume .btn-warning {
  --bs-btn-bg: var(--lm-warning);
  --bs-btn-border-color: var(--lm-warning);
  --bs-btn-color: #1a1004;
  --bs-btn-hover-bg: color-mix(in oklab, var(--lm-warning) 88%, white);
}
body.lume .btn-danger {
  --bs-btn-bg: var(--lm-negative);
  --bs-btn-border-color: var(--lm-negative);
  --bs-btn-color: white;
}
body.lume .btn-info {
  --bs-btn-bg: var(--lm-protetta);
  --bs-btn-border-color: var(--lm-protetta);
  --bs-btn-color: white;
  --bs-btn-hover-bg: color-mix(in oklab, var(--lm-protetta) 80%, white);
}
body.lume .btn-secondary {
  --bs-btn-bg: var(--lm-bg-3);
  --bs-btn-border-color: var(--lm-line-strong);
  --bs-btn-color: var(--lm-text);
  --bs-btn-hover-bg: var(--lm-bg-2);
  --bs-btn-hover-color: var(--lm-text);
  --bs-btn-hover-border-color: var(--lm-line-strong);
}
body.lume .btn-outline-primary,
body.lume .btn-outline-secondary,
body.lume .btn-outline-success,
body.lume .btn-outline-warning,
body.lume .btn-outline-danger,
body.lume .btn-outline-info {
  --bs-btn-bg: transparent;
  --bs-btn-color: var(--lm-text);
  --bs-btn-border-color: var(--lm-line-strong);
}

/* ---------- Tables ---------- */
body.lume .table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--lm-text);
  --bs-table-border-color: var(--lm-line);
  --bs-table-hover-bg: var(--lm-bg-2);
  --bs-table-hover-color: var(--lm-text);
  --bs-table-striped-bg: rgba(255,255,255,.018);
  --bs-table-striped-color: var(--lm-text);
  margin-bottom: 0;
}
html.light-mode body.lume .table {
  --bs-table-striped-bg: rgba(15,25,36,.025);
}
body.lume .table > :not(caption) > * > * {
  background-color: transparent !important;
  color: var(--lm-text) !important;
  border-bottom-color: var(--lm-line) !important;
}
body.lume .table thead th,
body.lume .table-dark th,
body.lume .table-dark thead th {
  background: var(--lm-bg-2) !important;
  color: var(--lm-label) !important;
  font-family: var(--lm-font-mono);
  font-size: .66rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-weight: 500;
  border-bottom: 1px solid var(--lm-line) !important;
  padding: 11px 14px;
}
body.lume .table-dark { --bs-table-bg: var(--lm-bg-2); }
body.lume .table tbody td {
  padding: 9px 14px;
  font-variant-numeric: tabular-nums;
}
/* Hover row — alta specificità + color esplicito per battere ogni inline / class */
body.lume .table-hover > tbody > tr:hover > *,
body.lume .table-hover > tbody > tr:hover > td,
body.lume .table-hover > tbody > tr:hover > th,
body.lume table.table-hover tbody tr:hover > *,
body.lume table.table-hover tbody tr:hover td,
body.lume table.table-hover tbody tr:hover th {
  background-color: var(--lm-bg-3) !important;
  color: var(--lm-text) !important;
  --bs-table-bg-state: var(--lm-bg-3);
  --bs-table-color-state: var(--lm-text);
  box-shadow: inset 0 0 0 9999px var(--lm-bg-3) !important;
}
/* Outline sulla riga hover per indicare meglio la selezione */
body.lume .table-hover > tbody > tr:hover {
  outline: 1px solid color-mix(in oklab, var(--lm-energia) 35%, var(--lm-line));
  outline-offset: -1px;
}
/* Hover anche sulle table senza .table-hover (clickable-row pattern) */
body.lume tr.clickable-row:hover > *,
body.lume tr.clickable-row:hover td {
  background-color: var(--lm-bg-3) !important;
  color: var(--lm-text) !important;
  cursor: pointer;
}
body.lume .table-warning,
body.lume .table-info,
body.lume .table-success {
  font-weight: 600;
}
body.lume .table-warning > * { background: color-mix(in oklab, var(--lm-warning) 10%, transparent) !important; }
body.lume .table-info > *    { background: color-mix(in oklab, var(--lm-protetta) 10%, transparent) !important; }
body.lume .table-success > * { background: color-mix(in oklab, var(--lm-energia) 10%, transparent) !important; }
/* Hover sulle righe colored (warning/info/success) */
body.lume .table-hover > tbody > tr.table-warning:hover > * { background: color-mix(in oklab, var(--lm-warning) 22%, var(--lm-bg-3)) !important; box-shadow: none !important; }
body.lume .table-hover > tbody > tr.table-info:hover > *    { background: color-mix(in oklab, var(--lm-protetta) 22%, var(--lm-bg-3)) !important; box-shadow: none !important; }
body.lume .table-hover > tbody > tr.table-success:hover > * { background: color-mix(in oklab, var(--lm-energia) 22%, var(--lm-bg-3)) !important; box-shadow: none !important; }

/* ---------- Tabelle compatte (.lm-compact) ---------- */
body.lume .table.lm-compact { font-size: .8rem; }
body.lume .table.lm-compact thead th {
  padding: 6px 10px;
  font-size: .58rem;
  letter-spacing: .14em;
}
body.lume .table.lm-compact tbody td {
  padding: 4px 10px;
  line-height: 1.25;
}
body.lume .table.lm-compact tbody td .badge {
  padding: .14em .42em;
  font-size: .62rem;
}
body.lume .table.lm-compact tbody td i.fas,
body.lume .table.lm-compact tbody td i.far {
  font-size: .68rem;
}
body.lume .table.lm-compact tbody tr td:first-child {
  font-weight: 500;
}

/* Selettore CSS più "duro" per battere stili che usano .table > :not(caption) > * > * con !important */
body.lume .table-hover tbody tr:hover > td,
body.lume .table-hover tbody tr:hover > th,
body.lume table tbody tr:hover > td:not(.no-hover):not([class*="bg-"]),
body.lume table tbody tr:hover > th:not(.no-hover):not([class*="bg-"]) {
  background-color: var(--lm-bg-3) !important;
}

/* ---------- Forms ---------- */
body.lume .form-control,
body.lume .form-select {
  background-color: var(--lm-bg-2) !important;
  border: 1px solid var(--lm-line-strong) !important;
  color: var(--lm-text) !important;
  border-radius: var(--lm-r-sm);
  font-family: var(--lm-font-body);
  transition: border-color var(--lm-dur-1) var(--lm-ease-out), box-shadow var(--lm-dur-1) var(--lm-ease-out);
}
body.lume .form-control:focus,
body.lume .form-select:focus {
  border-color: var(--lm-energia) !important;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--lm-energia) 20%, transparent) !important;
  background-color: var(--lm-bg-2) !important;
  color: var(--lm-text) !important;
}
body.lume .form-control::placeholder { color: var(--lm-text-3); }
body.lume .form-label,
body.lume label {
  color: var(--lm-text-2);
  font-family: var(--lm-font-mono);
  font-size: .68rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 500;
}
body.lume .form-check-input {
  background-color: var(--lm-bg-2);
  border-color: var(--lm-line-strong);
}
body.lume .form-check-input:checked {
  background-color: var(--lm-energia);
  border-color: var(--lm-energia);
}
body.lume .input-group-text {
  background: var(--lm-bg-3);
  border-color: var(--lm-line-strong);
  color: var(--lm-text-2);
}

/* ---------- Floating labels (Bootstrap .form-floating) ---------- */
body.lume .form-floating > .form-control,
body.lume .form-floating > .form-select {
  height: 56px;
  padding-top: 1.625rem;
  padding-bottom: .375rem;
}
body.lume .form-floating > label {
  color: var(--lm-text-3) !important;
  font-family: var(--lm-font-mono);
  font-size: .68rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  padding: 1rem .75rem;
  transition: opacity var(--lm-dur-1) var(--lm-ease-out),
              transform var(--lm-dur-1) var(--lm-ease-out),
              color var(--lm-dur-1) var(--lm-ease-out);
}
body.lume .form-floating > .form-control:focus ~ label,
body.lume .form-floating > .form-control:not(:placeholder-shown) ~ label,
body.lume .form-floating > .form-select ~ label {
  color: var(--lm-energia) !important;
  transform: scale(.78) translateY(-.65rem) translateX(.15rem);
  opacity: .9;
}

/* ---------- Validation: real-time invalid feedback ---------- */
body.lume .form-control:invalid:not(:placeholder-shown):not(:focus),
body.lume .form-select:invalid:not(:placeholder-shown):not(:focus) {
  border-color: var(--lm-negative) !important;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--lm-negative) 18%, transparent) !important;
}
body.lume .form-control:valid:not(:placeholder-shown):not(:focus) {
  border-color: color-mix(in oklab, var(--lm-energia) 60%, var(--lm-line-strong)) !important;
}
body.lume .invalid-feedback {
  color: var(--lm-negative) !important;
  font-family: var(--lm-font-mono);
  font-size: .72rem;
  letter-spacing: .04em;
}
body.lume .valid-feedback {
  color: var(--lm-energia) !important;
  font-family: var(--lm-font-mono);
  font-size: .72rem;
  letter-spacing: .04em;
}

/* ---------- Alerts ---------- */
body.lume .alert {
  border-radius: var(--lm-r-md);
  border-width: 1px;
  font-family: var(--lm-font-body);
}
body.lume .alert-success {
  background: color-mix(in oklab, var(--lm-energia) 12%, var(--lm-bg-1)) !important;
  border-color: color-mix(in oklab, var(--lm-energia) 30%, var(--lm-line)) !important;
  color: var(--lm-energia) !important;
}
body.lume .alert-warning {
  background: color-mix(in oklab, var(--lm-warning) 12%, var(--lm-bg-1)) !important;
  border-color: color-mix(in oklab, var(--lm-warning) 30%, var(--lm-line)) !important;
  color: var(--lm-warning) !important;
}
body.lume .alert-danger {
  background: color-mix(in oklab, var(--lm-negative) 12%, var(--lm-bg-1)) !important;
  border-color: color-mix(in oklab, var(--lm-negative) 30%, var(--lm-line)) !important;
  color: var(--lm-negative) !important;
}
body.lume .alert-info {
  background: color-mix(in oklab, var(--lm-protetta) 12%, var(--lm-bg-1)) !important;
  border-color: color-mix(in oklab, var(--lm-protetta) 30%, var(--lm-line)) !important;
  color: var(--lm-protetta) !important;
}

/* ---------- Badges ---------- */
body.lume .badge {
  font-family: var(--lm-font-mono);
  font-weight: 500;
  letter-spacing: .04em;
  border-radius: var(--lm-r-sm);
  font-size: .7rem;
  padding: .32em .6em;
}
body.lume .badge.bg-success { background: var(--lm-energia) !important; color: #062a14 !important; }
body.lume .badge.bg-warning { background: var(--lm-warning) !important; color: #1a1004 !important; }
body.lume .badge.bg-danger  { background: var(--lm-negative) !important; color: #ffffff !important; }
body.lume .badge.bg-info    { background: var(--lm-protetta) !important; color: #ffffff !important; }
body.lume .badge.bg-primary { background: var(--lm-blue-corp) !important; color: #ffffff !important; }
body.lume .badge.text-dark  { color: #1a1004 !important; }   /* override per Bootstrap text-dark dentro badge */

/* ---------- Modals (editorial premium) ---------- */
body.lume .modal-backdrop.show {
  --bs-backdrop-bg: rgba(8, 10, 16, .72);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  opacity: 1;
}
html.light-mode body.lume .modal-backdrop.show {
  --bs-backdrop-bg: rgba(15, 25, 36, .35);
}
body.lume .modal-dialog {
  animation: lm-modal-in var(--lm-dur-2) var(--lm-ease-spring);
}
@keyframes lm-modal-in {
  0%   { opacity: 0; transform: translateY(14px) scale(.97); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}
body.lume .modal-content {
  background: var(--lm-bg-1);
  border: 1px solid var(--lm-line);
  border-radius: var(--lm-r-lg);
  box-shadow: var(--lm-shadow-2);
  color: var(--lm-text);
  overflow: hidden;
  position: relative;
}
body.lume .modal-content::after {
  content: "";
  position: absolute; left: 0; right: 0; top: 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--lm-hairline), transparent);
  pointer-events: none;
}
body.lume .modal-header {
  background: linear-gradient(180deg, var(--lm-bg-2), var(--lm-bg-1));
  border-bottom: 1px solid var(--lm-line);
  font-family: var(--lm-font-display);
  font-variation-settings: "opsz" 90, "SOFT" 30, "wght" 580;
  padding: 16px 22px 14px;
  letter-spacing: -.005em;
}
body.lume .modal-title {
  font-family: var(--lm-font-display) !important;
  font-variation-settings: "opsz" 90, "SOFT" 30, "wght" 580;
  letter-spacing: -.005em;
  color: var(--lm-text) !important;
  font-weight: 580 !important;
  display: flex;
  align-items: center;
  gap: 10px;
}
body.lume .modal-title i.fas,
body.lume .modal-title i.far {
  color: var(--lm-energia);
  font-size: .85em;
}
body.lume .modal-body {
  padding: 18px 22px;
  color: var(--lm-text);
}
body.lume .modal-body label,
body.lume .modal-body .form-label {
  color: var(--lm-label);
  font-family: var(--lm-font-mono);
  font-size: .66rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  margin-bottom: .35rem;
}
body.lume .modal-footer {
  background: var(--lm-bg-1);
  border-top: 1px solid var(--lm-line);
  padding: 12px 22px;
  gap: .5rem;
}
body.lume .btn-close {
  filter: invert(86%) sepia(8%) saturate(343%) hue-rotate(187deg) brightness(95%) contrast(86%);
  opacity: .7;
  transition: opacity var(--lm-dur-1) var(--lm-ease-out);
}
body.lume .btn-close:hover { opacity: 1; }
html.light-mode body.lume .btn-close { filter: none; }

/* ---------- Progress bars ---------- */
body.lume .progress {
  background: var(--lm-bg-3);
  border-radius: var(--lm-r-pill);
  overflow: hidden;
}
body.lume .progress-bar {
  background: linear-gradient(90deg, var(--lm-energia), color-mix(in oklab, var(--lm-energia) 70%, white));
  border-radius: var(--lm-r-pill);
}

/* ---------- Pagination ---------- */
body.lume .page-link {
  background: var(--lm-bg-2);
  border-color: var(--lm-line);
  color: var(--lm-text);
}
body.lume .page-link:hover { background: var(--lm-bg-3); color: var(--lm-text); }
body.lume .page-item.active .page-link {
  background: var(--lm-energia);
  border-color: var(--lm-energia);
  color: #062a14;
}

/* ---------- Dropdowns ---------- */
body.lume .dropdown-menu {
  background: var(--lm-bg-1);
  border: 1px solid var(--lm-line);
  border-radius: var(--lm-r-md);
  box-shadow: var(--lm-shadow-2);
  --bs-dropdown-link-color: var(--lm-text);
  --bs-dropdown-link-hover-bg: var(--lm-bg-2);
  --bs-dropdown-link-hover-color: var(--lm-text);
}
body.lume .dropdown-divider { border-top-color: var(--lm-line); }

/* ---------- Tabs ---------- */
body.lume .nav-tabs {
  border-bottom: 1px solid var(--lm-line);
}
body.lume .nav-tabs .nav-link {
  color: var(--lm-text-2);
  border: 1px solid transparent;
  border-bottom: none;
  background: transparent;
  font-family: var(--lm-font-mono);
  font-size: .76rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
body.lume .nav-tabs .nav-link.active {
  color: var(--lm-text);
  background: var(--lm-bg-1);
  border-color: var(--lm-line);
}

/* ---------- Container/section spacing ---------- */
body.lume .container-fluid,
body.lume .container { z-index: 1; position: relative; }

/* =====================================================================
   NAVBAR (navbar.php) — override degli inline styles + sticky
   ===================================================================== */
body.lume #gn-mob,
body.lume #gn-desk {
  background: color-mix(in oklab, var(--lm-bg-1) 78%, transparent) !important;
  border-bottom: 1px solid var(--lm-line) !important;
  backdrop-filter: blur(14px) saturate(140%);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  position: sticky !important;
  top: 0;
  z-index: 100;
  transition: background var(--lm-dur-2) var(--lm-ease-out),
              border-bottom-color var(--lm-dur-2) var(--lm-ease-out),
              box-shadow var(--lm-dur-2) var(--lm-ease-out);
}
html.light-mode body.lume #gn-mob,
html.light-mode body.lume #gn-desk {
  background: color-mix(in oklab, var(--lm-bg-1) 88%, transparent) !important;
}
body.lume.is-scrolled #gn-mob,
body.lume.is-scrolled #gn-desk {
  border-bottom-color: var(--lm-line-strong) !important;
  box-shadow: 0 8px 24px -16px rgba(0,0,0,.4);
}
body.lume #gn-mob::after,
body.lume #gn-desk::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--lm-hairline), transparent);
}
body.lume #gn-mob .gn-brand,
body.lume #gn-desk .gn-brand {
  font-family: var(--lm-font-display) !important;
  font-variation-settings: "opsz" 90, "SOFT" 30, "wght" 580;
  font-weight: 600 !important;
  letter-spacing: -.005em;
}
body.lume #gn-desk .gn-user,
body.lume #gn-mob .gn-mob-user {
  font-family: var(--lm-font-mono) !important;
  font-size: .68rem !important;
  letter-spacing: .08em;
  color: var(--lm-text-3) !important;
}
body.lume #gn-mob-menu {
  background: var(--lm-bg-1) !important;
  border-top-color: var(--lm-line) !important;
}
body.lume #gn-mob-menu a {
  color: var(--lm-text) !important;
  font-family: var(--lm-font-body) !important;
  transition: background var(--lm-dur-1) var(--lm-ease-out);
}
body.lume #gn-mob-menu a:hover { background: var(--lm-bg-2); }
body.lume #gn-mob-menu a[href="logout.php"] { color: var(--lm-negative) !important; }
body.lume #gn-mob-menu button { color: var(--lm-text) !important; font-family: var(--lm-font-body) !important; }
body.lume #gn-mob-menu button:hover { background: var(--lm-bg-2) !important; }
body.lume #gn-mob .gn-ham-btn,
body.lume #gn-desk .gn-theme-btn {
  background: var(--lm-bg-2) !important;
  border: 1px solid var(--lm-line-strong) !important;
  color: var(--lm-text) !important;
  transition: all var(--lm-dur-1) var(--lm-ease-out);
}
body.lume #gn-mob .gn-ham-btn:hover,
body.lume #gn-desk .gn-theme-btn:hover {
  background: var(--lm-bg-3) !important;
  border-color: var(--lm-line-strong) !important;
}
body.lume #gn-mob .gn-ham-btn i { color: var(--lm-text) !important; }
body.lume #gn-desk .gn-link {
  background: var(--lm-bg-2) !important;
  border: 1px solid var(--lm-line) !important;
  color: var(--lm-text-2) !important;
  font-family: var(--lm-font-body) !important;
  font-weight: 500 !important;
  transition: all var(--lm-dur-1) var(--lm-ease-out);
}
body.lume #gn-desk .gn-link:hover {
  background: var(--lm-bg-3) !important;
  border-color: var(--lm-line-strong) !important;
  transform: translateY(-1px);
}
body.lume #gn-desk .gn-link-logout { color: var(--lm-negative) !important; }

/* =====================================================================
   GENERIC INLINE-STYLE OVERRIDES — catch i colori GitHub-style più diffusi
   per non lasciare aree "fuori tema" dentro pagine con inline styles
   ===================================================================== */
body.lume *[style*="background:#0d1117"],
body.lume *[style*="background: #0d1117"],
body.lume *[style*="background:#161b22"],
body.lume *[style*="background: #161b22"] {
  background: var(--lm-bg-1) !important;
}
body.lume *[style*="background:#21262d"],
body.lume *[style*="background: #21262d"] {
  background: var(--lm-bg-2) !important;
}
body.lume *[style*="border:1px solid #30363d"],
body.lume *[style*="border: 1px solid #30363d"],
body.lume *[style*="border:1px solid #21262d"] {
  border-color: var(--lm-line) !important;
}
body.lume *[style*="color:#c9d1d9"],
body.lume *[style*="color: #c9d1d9"] {
  color: var(--lm-text) !important;
}
body.lume *[style*="color:#8b949e"],
body.lume *[style*="color: #8b949e"],
body.lume *[style*="color:#6b7280"],
body.lume *[style*="color: #6b7280"],
body.lume *[style*="color:#9ca3af"],
body.lume *[style*="color:#94a3b8"] {
  color: var(--lm-text-3) !important;
}
/* TEXT colors comuni nei vari inline styles → tokens lume */
body.lume *[style*="color:#4ade80"],
body.lume *[style*="color: #4ade80"],
body.lume *[style*="color:#86efac"],
body.lume *[style*="color:#3fb950"] {
  color: var(--lm-energia) !important;
}
body.lume *[style*="color:#f85149"],
body.lume *[style*="color: #f85149"],
body.lume *[style*="color:#f87171"],
body.lume *[style*="color: #f87171"],
body.lume *[style*="color:#ef4444"] {
  color: var(--lm-negative) !important;
}
body.lume *[style*="color:#fbbf24"],
body.lume *[style*="color: #fbbf24"],
body.lume *[style*="color:#facc15"],
body.lume *[style*="color:#fde047"],
body.lume *[style*="color:#f59e0b"] {
  color: var(--lm-warning) !important;
}
body.lume *[style*="color:#fb923c"],
body.lume *[style*="color: #fb923c"] {
  color: var(--lm-iban) !important;
}
body.lume *[style*="color:#60a5fa"],
body.lume *[style*="color: #60a5fa"],
body.lume *[style*="color:#58a6ff"],
body.lume *[style*="color:#93c5fd"] {
  color: var(--lm-protetta) !important;
}
body.lume *[style*="color:#a78bfa"],
body.lume *[style*="color:#c084fc"],
body.lume *[style*="color:#d8b4fe"],
body.lume *[style*="color:#c4b5fd"] {
  color: var(--lm-protetta) !important;
}
body.lume *[style*="color:#2dd4bf"] {
  color: color-mix(in oklab, var(--lm-energia) 70%, var(--lm-protetta)) !important;
}
/* BACKGROUND colors comuni inline → tokens */
body.lume *[style*="background:#1f2937"],
body.lume *[style*="background: #1f2937"],
body.lume *[style*="background:#1e293b"],
body.lume *[style*="background: #1e293b"],
body.lume *[style*="background:#374151"] {
  background: var(--lm-bg-2) !important;
}
body.lume *[style*="background:#0f1924"],
body.lume *[style*="background:#1a2540"] {
  background: var(--lm-bg-3) !important;
}
body.lume *[style*="background:#2d333b"] {
  background: var(--lm-bg-3) !important;
}
/* BORDER colors comuni inline → tokens */
body.lume *[style*="border-color:#30363d"],
body.lume *[style*="border-color: #30363d"],
body.lume *[style*="border:1px solid #2d333b"],
body.lume *[style*="border-color:#2d333b"] {
  border-color: var(--lm-line) !important;
}

/* =====================================================================
   SCROLLBAR ESTETICA
   ===================================================================== */
body.lume ::-webkit-scrollbar { width: 10px; height: 10px; }
body.lume ::-webkit-scrollbar-track { background: var(--lm-bg-0); }
body.lume ::-webkit-scrollbar-thumb {
  background: var(--lm-bg-3);
  border-radius: 5px;
  border: 2px solid var(--lm-bg-0);
}
body.lume ::-webkit-scrollbar-thumb:hover { background: var(--lm-line-strong); }
body.lume * { scrollbar-color: var(--lm-bg-3) var(--lm-bg-0); scrollbar-width: thin; }

/* =====================================================================
   SMOOTH DARK/LIGHT transition
   Applica fade su body/card/text quando html.light-mode toggle.
   ===================================================================== */
body.lume,
body.lume .card,
body.lume .lm-card,
body.lume .lm-banner,
body.lume #gn-mob,
body.lume #gn-desk,
body.lume .table,
body.lume .form-control,
body.lume .form-select,
body.lume .modal-content,
body.lume .modal-header,
body.lume .modal-footer {
  transition-property: background-color, border-color, color, box-shadow;
  transition-duration: 220ms;
  transition-timing-function: var(--lm-ease-out);
}

/* =====================================================================
   VIEW TRANSITIONS API (Chrome 111+/Edge 111+ — degrada gracefully)
   Cross-fade automatico tra navigazioni della MPA.
   ===================================================================== */
@view-transition {
  navigation: auto;
}
::view-transition-old(root),
::view-transition-new(root) {
  animation-duration: 280ms;
  animation-timing-function: var(--lm-ease-out);
}

/* =====================================================================
   GLOBAL RESPONSIVE — applica a TUTTE le pagine body.lume
   Risolve i pain point più comuni: tabelle che debordano, card con
   padding eccessivo, multi-col grid che si rompe su schermi stretti.
   ===================================================================== */

/* Tablet medio (<=960px) */
@media (max-width: 960px) {
  body.lume .container,
  body.lume .container-fluid {
    padding-left: .75rem !important;
    padding-right: .75rem !important;
  }
  body.lume .card-body { padding: .9rem !important; }
  body.lume .card-header { padding: .65rem .9rem !important; font-size: .9rem; }
  body.lume .lm-banner { padding: 14px !important; }
  /* Bootstrap col gutters un po' più stretti */
  body.lume .row { --bs-gutter-x: .8rem; }
  /* H1/H2 più piccoli su mobile per non sfondare */
  body.lume h1 { font-size: 1.4rem; }
  body.lume h2 { font-size: 1.15rem; }
  body.lume h3 { font-size: 1rem; }
}

/* Tablet small / mobile landscape (<=720px) */
@media (max-width: 720px) {
  body.lume {
    font-size: 14px;
  }
  /* TUTTE le tabelle Bootstrap diventano scrollable orizzontalmente
     senza intervento sui singoli file. */
  body.lume .table-responsive,
  body.lume .card-body > .table,
  body.lume .table {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  body.lume .table {
    font-size: .82rem;
  }
  body.lume .table th, body.lume .table td {
    padding: .35rem .45rem !important;
    white-space: nowrap;
  }
  /* Bottoni piccoli + spacing più stretto */
  body.lume .btn { padding: .35rem .7rem; font-size: .82rem; }
  body.lume .btn-sm { padding: .25rem .5rem; font-size: .75rem; }
  /* Form input più piccoli */
  body.lume .form-control, body.lume .form-select {
    font-size: .85rem; padding: .35rem .55rem;
  }
  /* Lume tile padding ridotto */
  body.lume .lm-tile { padding: .6rem .7rem; }
  body.lume .lm-tile-label { font-size: .68rem; }
  body.lume .lm-tile-val   { font-size: 1.4rem; }
  /* KPI card */
  body.lume .kpi-card { padding: .7rem .85rem; }
}

/* Mobile portrait (<=480px) */
@media (max-width: 480px) {
  body.lume {
    font-size: 13.5px;
  }
  body.lume .container,
  body.lume .container-fluid {
    padding-left: .5rem !important;
    padding-right: .5rem !important;
  }
  body.lume .card { border-radius: 8px !important; }
  body.lume .card-body { padding: .7rem !important; }
  body.lume .card-header { padding: .55rem .7rem !important; font-size: .85rem; }
  body.lume h1 { font-size: 1.2rem; }
  body.lume h2 { font-size: 1.05rem; }
  body.lume .table { font-size: .76rem; }
  body.lume .table th { font-size: .65rem; }
  body.lume .lm-banner { padding: 12px 10px !important; border-radius: 10px; }
  body.lume .lm-banner-eyebrow { font-size: .7rem !important; }
  body.lume .lm-banner h1, body.lume .lm-banner .lm-banner-h1 { font-size: 1.5rem !important; }
  /* Badge testo ridotto */
  body.lume .badge { font-size: .68rem; padding: .25em .45em; }
  /* Bootstrap "row" diventa stack: meno gutter */
  body.lume .row { --bs-gutter-x: .55rem; --bs-gutter-y: .55rem; }
  /* Default Bootstrap col-md-X diventa full-width — già gestito, ma aggiungo
     fallback per col-sm-X che alcuni layout usano. */
  body.lume [class*="col-md-"]:not([class*="col-sm-"]) { width: 100% !important; }
}

/* =====================================================================
   PRINT STYLESHEET — pulizia per stampa report
   ===================================================================== */
@media print {
  body.lume {
    background: white !important;
    color: #111 !important;
  }
  body.lume::before { display: none !important; }
  body.lume #gn-mob, body.lume #gn-desk,
  body.lume .lm-cmdk-overlay, body.lume #lm-toast-container, body.lume .lm-toast-container,
  body.lume .btn, body.lume button,
  body.lume .modal, body.lume .modal-backdrop {
    display: none !important;
  }
  body.lume .card, body.lume .lm-card, body.lume .lm-banner {
    background: white !important;
    color: #111 !important;
    border: 1px solid #ccc !important;
    box-shadow: none !important;
    page-break-inside: avoid;
  }
  body.lume .card-header, body.lume .lm-card-head, body.lume .lm-banner-head {
    background: #f3f4f6 !important;
    color: #111 !important;
    border-bottom: 1px solid #ccc !important;
  }
  body.lume .table thead th { background: #f3f4f6 !important; color: #444 !important; }
  body.lume .table > :not(caption) > * > * { color: #111 !important; border-bottom-color: #ddd !important; }
  body.lume .lm-tile-num, body.lume .lm-num, body.lume .val-green, body.lume .val-purple, body.lume .val-blue {
    color: #111 !important;
  }
  body.lume .badge.bg-success { background: #15803d !important; color: white !important; }
  body.lume .badge.bg-danger  { background: #b91c1c !important; color: white !important; }
  body.lume .badge.bg-warning { background: #d97706 !important; color: white !important; }
  body.lume .progress-bar { background: #555 !important; }
  body.lume a { text-decoration: none; color: inherit; }
  @page {
    size: A4 portrait;
    margin: 12mm;
  }
}

/* =====================================================================
   TYPOGRAPHY HEADINGS — applica Fraunces a h1-h4 dentro lume
   ===================================================================== */
body.lume h1, body.lume h2, body.lume h3, body.lume h4,
body.lume .h1, body.lume .h2, body.lume .h3, body.lume .h4 {
  font-family: var(--lm-font-display);
  font-variation-settings: "opsz" 144, "SOFT" 40, "wght" 580;
  letter-spacing: -.012em;
  color: var(--lm-text);
}
body.lume h5, body.lume h6, body.lume .h5, body.lume .h6 {
  font-family: var(--lm-font-display);
  font-variation-settings: "opsz" 90, "SOFT" 30, "wght" 540;
  letter-spacing: -.005em;
  color: var(--lm-text);
}

/* =====================================================================
   TOAST NOTIFICATIONS — bottom-right slot, auto-dismiss
   API JS: window.lmToast.success('msg'), .error, .warning, .info
   ===================================================================== */
.lm-toast-container {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 10000;
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-width: calc(100vw - 48px);
  pointer-events: none;
}
.lm-toast {
  pointer-events: auto;
  background: var(--lm-bg-1);
  border: 1px solid var(--lm-line);
  border-left: 3px solid var(--lm-energia);
  border-radius: var(--lm-r-md);
  box-shadow: var(--lm-shadow-2);
  padding: 12px 16px 12px 14px;
  color: var(--lm-text);
  font-family: var(--lm-font-body);
  font-size: .88rem;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  min-width: 280px;
  max-width: 420px;
  position: relative;
  overflow: hidden;
  animation: lm-toast-in var(--lm-dur-2) var(--lm-ease-spring) forwards;
}
.lm-toast.is-leaving {
  animation: lm-toast-out var(--lm-dur-2) var(--lm-ease-out) forwards;
}
.lm-toast::after {
  content: "";
  position: absolute; left: 0; right: 0; top: 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--lm-hairline), transparent);
}
.lm-toast .lm-toast-icon {
  flex-shrink: 0;
  width: 24px; height: 24px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in oklab, var(--lm-energia) 15%, var(--lm-bg-2));
  color: var(--lm-energia);
  font-size: .76rem;
}
.lm-toast .lm-toast-body {
  flex: 1;
  line-height: 1.4;
}
.lm-toast .lm-toast-title {
  font-family: var(--lm-font-display);
  font-variation-settings: "opsz" 90, "SOFT" 30, "wght" 540;
  font-size: .92rem;
  margin-bottom: 2px;
  letter-spacing: -.005em;
}
.lm-toast .lm-toast-text { color: var(--lm-text-2); font-size: .82rem; }
.lm-toast .lm-toast-close {
  background: transparent;
  border: none;
  color: var(--lm-text-3);
  cursor: pointer;
  padding: 0;
  font-size: .8rem;
  align-self: flex-start;
  margin-top: 2px;
  transition: color var(--lm-dur-1) var(--lm-ease-out);
}
.lm-toast .lm-toast-close:hover { color: var(--lm-text); }
.lm-toast .lm-toast-bar {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 2px;
  background: currentColor;
  opacity: .4;
  transform-origin: left center;
  animation: lm-toast-bar var(--lm-toast-dur, 4s) linear forwards;
}
.lm-toast.is-success { border-left-color: var(--lm-energia); }
.lm-toast.is-success .lm-toast-icon { color: var(--lm-energia); background: color-mix(in oklab, var(--lm-energia) 15%, var(--lm-bg-2)); }
.lm-toast.is-error { border-left-color: var(--lm-negative); }
.lm-toast.is-error .lm-toast-icon { color: var(--lm-negative); background: color-mix(in oklab, var(--lm-negative) 15%, var(--lm-bg-2)); }
.lm-toast.is-warning { border-left-color: var(--lm-warning); }
.lm-toast.is-warning .lm-toast-icon { color: var(--lm-warning); background: color-mix(in oklab, var(--lm-warning) 15%, var(--lm-bg-2)); }
.lm-toast.is-info { border-left-color: var(--lm-protetta); }
.lm-toast.is-info .lm-toast-icon { color: var(--lm-protetta); background: color-mix(in oklab, var(--lm-protetta) 15%, var(--lm-bg-2)); }
@keyframes lm-toast-in {
  0%   { opacity: 0; transform: translateX(20px); }
  100% { opacity: 1; transform: translateX(0); }
}
@keyframes lm-toast-out {
  0%   { opacity: 1; transform: translateX(0); }
  100% { opacity: 0; transform: translateX(20px); }
}
@keyframes lm-toast-bar {
  0%   { transform: scaleX(1); }
  100% { transform: scaleX(0); }
}

/* =====================================================================
   COMMAND PALETTE (Cmd+K / Ctrl+K)
   ===================================================================== */
.lm-cmdk-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(8, 10, 16, .55);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 12vh;
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--lm-dur-2) var(--lm-ease-out);
}
html.light-mode body.lume .lm-cmdk-overlay { background: rgba(15, 25, 36, .35); }
.lm-cmdk-overlay.is-open {
  opacity: 1;
  pointer-events: auto;
}
.lm-cmdk-panel {
  width: 92%;
  max-width: 600px;
  background: var(--lm-bg-1);
  border: 1px solid var(--lm-line);
  border-radius: var(--lm-r-lg);
  box-shadow: 0 24px 80px -24px rgba(0,0,0,.7), 0 1px 0 rgba(255,255,255,.05) inset;
  overflow: hidden;
  transform: scale(.96) translateY(-8px);
  opacity: 0;
  transition: transform var(--lm-dur-2) var(--lm-ease-spring), opacity var(--lm-dur-2) var(--lm-ease-out);
  position: relative;
}
.lm-cmdk-overlay.is-open .lm-cmdk-panel {
  transform: scale(1) translateY(0);
  opacity: 1;
}
.lm-cmdk-panel::after {
  content: "";
  position: absolute; left: 0; right: 0; top: 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--lm-hairline), transparent);
}
.lm-cmdk-input-wrap {
  display: flex;
  align-items: center;
  padding: 14px 16px;
  border-bottom: 1px solid var(--lm-line);
  gap: 10px;
}
.lm-cmdk-input-wrap i.fas {
  color: var(--lm-text-3);
  font-size: .9rem;
}
.lm-cmdk-input {
  flex: 1;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  color: var(--lm-text) !important;
  font-family: var(--lm-font-body);
  font-size: 1rem;
  font-weight: 400;
  padding: 0 !important;
}
.lm-cmdk-input::placeholder { color: var(--lm-text-3); }
.lm-cmdk-kbd {
  font-family: var(--lm-font-mono);
  font-size: .68rem;
  padding: 2px 6px;
  border: 1px solid var(--lm-line);
  border-radius: 4px;
  background: var(--lm-bg-2);
  color: var(--lm-text-3);
}
.lm-cmdk-results {
  max-height: 360px;
  overflow-y: auto;
  padding: 6px;
}
.lm-cmdk-results:empty::after {
  content: "Nessun risultato";
  display: block;
  text-align: center;
  padding: 20px;
  color: var(--lm-text-3);
  font-size: .85rem;
  font-family: var(--lm-font-mono);
}
.lm-cmdk-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: var(--lm-r-sm);
  cursor: pointer;
  font-size: .9rem;
  color: var(--lm-text);
  text-decoration: none;
  transition: background var(--lm-dur-1) var(--lm-ease-out);
}
.lm-cmdk-item:hover,
.lm-cmdk-item.is-active {
  background: var(--lm-bg-2);
  color: var(--lm-text);
}
.lm-cmdk-item i.fas {
  width: 18px;
  text-align: center;
  font-size: .82rem;
  color: var(--lm-text-2);
}
.lm-cmdk-item-label {
  flex: 1;
}
.lm-cmdk-item-meta {
  font-family: var(--lm-font-mono);
  font-size: .68rem;
  color: var(--lm-text-3);
  letter-spacing: .04em;
}
.lm-cmdk-section {
  font-family: var(--lm-font-mono);
  font-size: .6rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--lm-label);
  padding: 8px 12px 4px;
}
.lm-cmdk-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 16px;
  border-top: 1px solid var(--lm-line);
  background: var(--lm-bg-2);
  font-family: var(--lm-font-mono);
  font-size: .68rem;
  color: var(--lm-text-3);
}
.lm-cmdk-footer-keys {
  display: flex;
  gap: 12px;
  align-items: center;
}
.lm-cmdk-footer-keys span {
  display: flex;
  gap: 4px;
  align-items: center;
}

/* =====================================================================
   SKELETON / EMPTY / LOADING STATES
   ===================================================================== */

/* Skeleton: per placeholder shimmer durante load */
.lm-skeleton {
  display: block;
  background: linear-gradient(90deg,
    var(--lm-bg-2) 0%,
    color-mix(in oklab, var(--lm-bg-2) 80%, var(--lm-line-strong)) 40%,
    var(--lm-bg-2) 80%);
  background-size: 200% 100%;
  border-radius: var(--lm-r-sm);
  animation: lm-shimmer 1.6s ease-in-out infinite;
  color: transparent !important;
  user-select: none;
  pointer-events: none;
}
.lm-skeleton.line     { height: .9em; margin: .35em 0; }
.lm-skeleton.line-sm  { height: .7em; margin: .25em 0; }
.lm-skeleton.line-lg  { height: 1.4em; margin: .5em 0; }
.lm-skeleton.circle   { width: 32px; height: 32px; border-radius: 50%; }
.lm-skeleton.box      { height: 100px; border-radius: var(--lm-r-md); }
.lm-skeleton.w-25     { width: 25%; }
.lm-skeleton.w-50     { width: 50%; }
.lm-skeleton.w-75     { width: 75%; }
.lm-skeleton.w-100    { width: 100%; }
@keyframes lm-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Loading pulse indicator (small) */
.lm-loading-dot {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--lm-energia);
  margin-right: 8px;
  vertical-align: middle;
  animation: lm-pulse 1.6s ease-in-out infinite;
}
.lm-loading-text {
  font-family: var(--lm-font-mono);
  font-size: .72rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--lm-text-3);
}

/* Empty state — quando non ci sono dati */
.lm-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 48px 24px;
  color: var(--lm-text-3);
  min-height: 220px;
}
.lm-empty-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--lm-bg-2);
  border: 1px solid var(--lm-line);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
  color: var(--lm-text-3);
  margin-bottom: 18px;
}
.lm-empty-title {
  font-family: var(--lm-font-display);
  font-variation-settings: "opsz" 90, "SOFT" 30, "wght" 540;
  font-size: 1.1rem;
  color: var(--lm-text-2);
  margin-bottom: 6px;
  letter-spacing: -.005em;
}
.lm-empty-text {
  font-family: var(--lm-font-body);
  font-size: .82rem;
  color: var(--lm-text-3);
  max-width: 320px;
}
.lm-empty .btn {
  margin-top: 18px;
}

/* Error state — banner rosso editorial */
.lm-error {
  background: color-mix(in oklab, var(--lm-negative) 10%, var(--lm-bg-1));
  border: 1px solid color-mix(in oklab, var(--lm-negative) 30%, var(--lm-line));
  border-left: 3px solid var(--lm-negative);
  border-radius: var(--lm-r-md);
  padding: 12px 18px;
  color: var(--lm-text);
  font-family: var(--lm-font-body);
  font-size: .88rem;
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.lm-error i.fas { color: var(--lm-negative); margin-top: 2px; }

/* =====================================================================
   PERIODO PILL (mese/anno selector usato ovunque)
   ===================================================================== */
body.lume .periodo-pill {
  font-family: var(--lm-font-mono) !important;
  letter-spacing: .04em;
}
body.lume .periodo-pill.active-pill,
body.lume .periodo-pill.active {
  background: var(--lm-energia) !important;
  border-color: var(--lm-energia) !important;
  color: #062a14 !important;
}

/* =====================================================================
   TEXT helper colors (Bootstrap text-muted, text-primary, ecc)
   ===================================================================== */
body.lume .text-muted     { color: var(--lm-text-3) !important; }
body.lume .text-primary   { color: var(--lm-blue-corp) !important; }
body.lume .text-success   { color: var(--lm-energia) !important; }
body.lume .text-warning   { color: var(--lm-warning) !important; }
body.lume .text-danger    { color: var(--lm-negative) !important; }
body.lume .text-info      { color: var(--lm-protetta) !important; }
body.lume .text-white     { color: var(--lm-text) !important; }
body.lume .text-secondary { color: var(--lm-text-2) !important; }

/* =====================================================================
   LIGHT MODE — GLOBAL PATCHES (per stili inline hardcoded)
   ---------------------------------------------------------------------
   Molti file PHP usano color/background/border inline con codici esa
   pensati per il dark (es. style="background:#0e1420;color:#c9d1d9").
   In light mode questi resterebbero scuri-su-scuri o chiari-su-chiari
   diventando illeggibili. Qui li intercettiamo con selettori attributo
   [style*="..."] e li riportiamo ai token --lm-* del tema.
   Solo regole !important perché devono battere lo style="" inline.
   ===================================================================== */

/* ---- Backgrounds scuri (dark-mode panels) → lume bg-1/bg-2 ---- */
html.light-mode body.lume [style*="background:#0e1420"],
html.light-mode body.lume [style*="background: #0e1420"],
html.light-mode body.lume [style*="background:#0d1117"],
html.light-mode body.lume [style*="background: #0d1117"],
html.light-mode body.lume [style*="background:#0b0e13"],
html.light-mode body.lume [style*="background: #0b0e13"],
html.light-mode body.lume [style*="background:#0a0e17"],
html.light-mode body.lume [style*="background: #0a0e17"] {
  background: var(--lm-bg-1) !important;
  color: var(--lm-text) !important;
}
html.light-mode body.lume [style*="background-color:#0e1420"],
html.light-mode body.lume [style*="background-color: #0e1420"],
html.light-mode body.lume [style*="background-color:#0d1117"],
html.light-mode body.lume [style*="background-color: #0d1117"],
html.light-mode body.lume [style*="background-color:#0b0e13"] {
  background-color: var(--lm-bg-1) !important;
  color: var(--lm-text) !important;
}

html.light-mode body.lume [style*="background:#131822"],
html.light-mode body.lume [style*="background:#161b22"],
html.light-mode body.lume [style*="background: #161b22"],
html.light-mode body.lume [style*="background:#1a2030"],
html.light-mode body.lume [style*="background:#1f2937"],
html.light-mode body.lume [style*="background: #1f2937"] {
  background: var(--lm-bg-1) !important;
  color: var(--lm-text) !important;
}
html.light-mode body.lume [style*="background-color:#161b22"],
html.light-mode body.lume [style*="background-color: #161b22"],
html.light-mode body.lume [style*="background-color:#1f2937"] {
  background-color: var(--lm-bg-1) !important;
}

html.light-mode body.lume [style*="background:#21262d"],
html.light-mode body.lume [style*="background: #21262d"],
html.light-mode body.lume [style*="background:#243047"],
html.light-mode body.lume [style*="background: #243047"],
html.light-mode body.lume [style*="background:#2c3754"],
html.light-mode body.lume [style*="background:#374151"] {
  background: var(--lm-bg-2) !important;
  color: var(--lm-text) !important;
}
html.light-mode body.lume [style*="background-color:#21262d"],
html.light-mode body.lume [style*="background-color:#374151"] {
  background-color: var(--lm-bg-2) !important;
}

/* Backgrounds rgba(255,255,255,.0X) - dark glass effects → trasparenze scure su light */
html.light-mode body.lume [style*="background:rgba(255,255,255,0.02)"],
html.light-mode body.lume [style*="background:rgba(255,255,255,.02)"],
html.light-mode body.lume [style*="background:rgba(255,255,255,0.03)"],
html.light-mode body.lume [style*="background:rgba(255,255,255,.03)"] {
  background: rgba(15,25,36,.02) !important;
}
html.light-mode body.lume [style*="background:rgba(255,255,255,0.05)"],
html.light-mode body.lume [style*="background:rgba(255,255,255,.05)"],
html.light-mode body.lume [style*="background:rgba(255,255,255,0.06)"],
html.light-mode body.lume [style*="background:rgba(255,255,255,.06)"],
html.light-mode body.lume [style*="background:rgba(255,255,255,0.08)"],
html.light-mode body.lume [style*="background:rgba(255,255,255,.08)"] {
  background: rgba(15,25,36,.04) !important;
}
html.light-mode body.lume [style*="background:rgba(255,255,255,0.1)"],
html.light-mode body.lume [style*="background:rgba(255,255,255,.1)"],
html.light-mode body.lume [style*="background:rgba(255,255,255,0.12)"],
html.light-mode body.lume [style*="background:rgba(255,255,255,.12)"],
html.light-mode body.lume [style*="background:rgba(255,255,255,0.15)"],
html.light-mode body.lume [style*="background:rgba(255,255,255,.15)"],
html.light-mode body.lume [style*="background:rgba(255,255,255,0.18)"],
html.light-mode body.lume [style*="background:rgba(255,255,255,.18)"] {
  background: rgba(15,25,36,.06) !important;
}

/* ---- Testi chiari (dark-mode body text) → lume text ----
   NB: NON tocchiamo color:#fff / color:white / color:#ffffff perché
   sono quasi sempre voluti su sfondi accent colorati (badge, button,
   gradient header) che restano scuri/colorati anche in light mode.
   Remappiamo solo i grigi-chiari tipici del dark body text. */
html.light-mode body.lume [style*="color:#e8edf5"],
html.light-mode body.lume [style*="color: #e8edf5"],
html.light-mode body.lume [style*="color:#f0f6fc"],
html.light-mode body.lume [style*="color: #f0f6fc"],
html.light-mode body.lume [style*="color:#fafafa"],
html.light-mode body.lume [style*="color: #fafafa"],
html.light-mode body.lume [style*="color:#f8fafc"],
html.light-mode body.lume [style*="color: #f8fafc"],
html.light-mode body.lume [style*="color:#f1f5f9"],
html.light-mode body.lume [style*="color: #f1f5f9"] {
  color: var(--lm-text) !important;
}

html.light-mode body.lume [style*="color:#c9d1d9"],
html.light-mode body.lume [style*="color: #c9d1d9"],
html.light-mode body.lume [style*="color:#b3bcce"],
html.light-mode body.lume [style*="color: #b3bcce"],
html.light-mode body.lume [style*="color:#d1d5db"],
html.light-mode body.lume [style*="color: #d1d5db"] {
  color: var(--lm-text-2) !important;
}

html.light-mode body.lume [style*="color:#8b949e"],
html.light-mode body.lume [style*="color: #8b949e"],
html.light-mode body.lume [style*="color:#7a8597"],
html.light-mode body.lume [style*="color: #7a8597"],
html.light-mode body.lume [style*="color:#9ca3af"],
html.light-mode body.lume [style*="color: #9ca3af"],
html.light-mode body.lume [style*="color:#6b7280"],
html.light-mode body.lume [style*="color: #6b7280"],
html.light-mode body.lume [style*="color:#a1a1aa"],
html.light-mode body.lume [style*="color: #a1a1aa"],
html.light-mode body.lume [style*="color:#5e6878"],
html.light-mode body.lume [style*="color: #5e6878"] {
  color: var(--lm-text-3) !important;
}

/* Accent indigo/violet text (chiari per dark) → darker per leggibilità su bianco
   ECCETTO quando l'antenato ha sfondo scuro/gradient esplicito */
html.light-mode body.lume [style*="color:#a5b4fc"],
html.light-mode body.lume [style*="color: #a5b4fc"],
html.light-mode body.lume [style*="color:#818cf8"],
html.light-mode body.lume [style*="color: #818cf8"],
html.light-mode body.lume [style*="color:#c7d2fe"],
html.light-mode body.lume [style*="color: #c7d2fe"] {
  color: #4338ca !important; /* indigo-700 */
}
html.light-mode body.lume [style*="color:#c4b5fd"],
html.light-mode body.lume [style*="color: #c4b5fd"],
html.light-mode body.lume [style*="color:#ddd6fe"],
html.light-mode body.lume [style*="color: #ddd6fe"] {
  color: #6d28d9 !important; /* violet-700 */
}
/* Mantieni colori chiari ORIGINALI dentro card-header con gradient inline scuro */
html.light-mode body.lume .card-header [style*="color:#a5b4fc"],
html.light-mode body.lume .card-header [style*="color:#818cf8"],
html.light-mode body.lume .card-header [style*="color:#c4b5fd"],
html.light-mode body.lume .card-header [style*="color:#c7d2fe"] {
  color: inherit !important;
  filter: brightness(1.4);
}

/* Accent giallo/oro chiaro → darker */
html.light-mode body.lume [style*="color:#fde047"],
html.light-mode body.lume [style*="color: #fde047"],
html.light-mode body.lume [style*="color:#fef08a"],
html.light-mode body.lume [style*="color: #fef08a"],
html.light-mode body.lume [style*="color:#fbbf24"],
html.light-mode body.lume [style*="color: #fbbf24"] {
  color: #b45309 !important; /* amber-700 */
}

/* Accent verde chiaro → darker (mantieni leggibilità su bianco) */
html.light-mode body.lume [style*="color:#4ade80"],
html.light-mode body.lume [style*="color: #4ade80"],
html.light-mode body.lume [style*="color:#86efac"],
html.light-mode body.lume [style*="color: #86efac"],
html.light-mode body.lume [style*="color:#bbf7d0"] {
  color: #15803d !important; /* green-700 */
}
html.light-mode body.lume .card-header [style*="color:#4ade80"] {
  color: inherit !important;
  filter: brightness(1.4);
}

/* Accent rosso chiaro → darker */
html.light-mode body.lume [style*="color:#fca5a5"],
html.light-mode body.lume [style*="color: #fca5a5"],
html.light-mode body.lume [style*="color:#f87171"],
html.light-mode body.lume [style*="color: #f87171"],
html.light-mode body.lume [style*="color:#ef6b58"],
html.light-mode body.lume [style*="color: #ef6b58"] {
  color: #b91c1c !important; /* red-700 */
}

/* Accent celeste chiaro → darker (sky) */
html.light-mode body.lume [style*="color:#7dd3fc"],
html.light-mode body.lume [style*="color: #7dd3fc"],
html.light-mode body.lume [style*="color:#bae6fd"] {
  color: #0369a1 !important; /* sky-700 */
}

/* ---- Bordi scuri → border lume ---- */
html.light-mode body.lume [style*="border:1px solid #30363d"],
html.light-mode body.lume [style*="border: 1px solid #30363d"],
html.light-mode body.lume [style*="border:1px solid #21262d"],
html.light-mode body.lume [style*="border: 1px solid #21262d"],
html.light-mode body.lume [style*="border:1px solid #1f2937"],
html.light-mode body.lume [style*="border:1px solid #2c3754"],
html.light-mode body.lume [style*="border:1px solid #1e2535"],
html.light-mode body.lume [style*="border:1px solid #d0d7de"] {
  border-color: var(--lm-line) !important;
}
html.light-mode body.lume [style*="border-color:#30363d"],
html.light-mode body.lume [style*="border-color: #30363d"],
html.light-mode body.lume [style*="border-color:#21262d"],
html.light-mode body.lume [style*="border-color:#1f2937"],
html.light-mode body.lume [style*="border-color:#2c3754"],
html.light-mode body.lume [style*="border-color:#1e2535"] {
  border-color: var(--lm-line) !important;
}
html.light-mode body.lume [style*="border-top:1px solid #30363d"],
html.light-mode body.lume [style*="border-bottom:1px solid #30363d"],
html.light-mode body.lume [style*="border-left:1px solid #30363d"],
html.light-mode body.lume [style*="border-right:1px solid #30363d"],
html.light-mode body.lume [style*="border-top:1px solid #21262d"],
html.light-mode body.lume [style*="border-bottom:1px solid #21262d"],
html.light-mode body.lume [style*="border-top:1px solid #1f2937"],
html.light-mode body.lume [style*="border-bottom:1px solid #1f2937"] {
  border-color: var(--lm-line) !important;
}

/* Stat-card stats: numeri grandi che usano text inline chiaro su dark
   Esempio: .val-green / .val-purple / etc. */
html.light-mode body.lume .val-green   { color: #15803d !important; }
html.light-mode body.lume .val-purple  { color: #6d28d9 !important; }
html.light-mode body.lume .val-blue    { color: #1d4ed8 !important; }
html.light-mode body.lume .val-orange  { color: #c2410c !important; }
html.light-mode body.lume .val-red     { color: #b91c1c !important; }
html.light-mode body.lume .val-cyan    { color: #0e7490 !important; }
html.light-mode body.lume .val-pink    { color: #be185d !important; }

/* Bootstrap dark utilities → keep "dark accent" feel ma con contrasto giusto */
html.light-mode body.lume .table > :not(caption) > * > * { color: var(--lm-text); }
html.light-mode body.lume .table-dark,
html.light-mode body.lume .table-dark > th,
html.light-mode body.lume .table-dark > td,
html.light-mode body.lume table .table-dark th,
html.light-mode body.lume table thead.table-dark th,
html.light-mode body.lume table thead.table-dark tr th {
  background-color: #1f2937 !important;   /* slate-800 */
  color: #f1f5f9 !important;
  border-color: #334155 !important;
}
html.light-mode body.lume .badge.bg-dark {
  background-color: #1f2937 !important;
  color: #f1f5f9 !important;
}
html.light-mode body.lume .badge.bg-secondary {
  background-color: #64748b !important;
  color: #f8fafc !important;
}
html.light-mode body.lume .table-success {
  --bs-table-bg: #ecfdf5 !important;
  --bs-table-color: #064e3b !important;
  background-color: #ecfdf5 !important;
  color: #064e3b !important;
}
html.light-mode body.lume .table-success td,
html.light-mode body.lume .table-success th,
html.light-mode body.lume tr.table-success td,
html.light-mode body.lume tr.table-success th {
  background-color: #ecfdf5 !important;
  color: #064e3b !important;
  border-color: #a7f3d0 !important;
}
html.light-mode body.lume .table-primary {
  --bs-table-bg: #eff6ff !important;
  --bs-table-color: #1e3a8a !important;
  background-color: #eff6ff !important;
  color: #1e3a8a !important;
}
html.light-mode body.lume .table-primary td,
html.light-mode body.lume .table-primary th,
html.light-mode body.lume tr.table-primary td,
html.light-mode body.lume tr.table-primary th {
  background-color: #eff6ff !important;
  color: #1e3a8a !important;
  border-color: #bfdbfe !important;
}
html.light-mode body.lume .table-warning td,
html.light-mode body.lume .table-warning th,
html.light-mode body.lume tr.table-warning td,
html.light-mode body.lume tr.table-warning th {
  background-color: #fef3c7 !important;
  color: #78350f !important;
  border-color: #fde68a !important;
}
html.light-mode body.lume .table-danger td,
html.light-mode body.lume .table-danger th,
html.light-mode body.lume tr.table-danger td,
html.light-mode body.lume tr.table-danger th {
  background-color: #fee2e2 !important;
  color: #7f1d1d !important;
  border-color: #fecaca !important;
}

/* Forms in light mode — input/select/textarea su sfondo bianco */
html.light-mode body.lume .form-control,
html.light-mode body.lume .form-select,
html.light-mode body.lume input[type=text],
html.light-mode body.lume input[type=number],
html.light-mode body.lume input[type=email],
html.light-mode body.lume input[type=password],
html.light-mode body.lume input[type=date],
html.light-mode body.lume input[type=search],
html.light-mode body.lume select,
html.light-mode body.lume textarea {
  background-color: #fff !important;
  color: var(--lm-text) !important;
  border-color: var(--lm-line-strong) !important;
}
html.light-mode body.lume .form-control::placeholder,
html.light-mode body.lume input::placeholder,
html.light-mode body.lume textarea::placeholder {
  color: var(--lm-text-3) !important;
  opacity: .8;
}
html.light-mode body.lume .form-control:focus,
html.light-mode body.lume .form-select:focus,
html.light-mode body.lume input:focus,
html.light-mode body.lume select:focus,
html.light-mode body.lume textarea:focus {
  border-color: var(--lm-energia) !important;
  box-shadow: 0 0 0 .2rem rgba(22,163,74,.12) !important;
}

/* Modal in light mode */
html.light-mode body.lume .modal-content {
  background-color: var(--lm-bg-1) !important;
  color: var(--lm-text) !important;
  border-color: var(--lm-line) !important;
}
html.light-mode body.lume .modal-header,
html.light-mode body.lume .modal-footer {
  border-color: var(--lm-line) !important;
  background-color: var(--lm-bg-1) !important;
}

/* DataTables search/wrapper in light */
html.light-mode body.lume .dataTables_wrapper input[type=search],
html.light-mode body.lume .dataTables_filter input {
  background-color: #fff !important;
  color: var(--lm-text) !important;
  border: 1px solid var(--lm-line-strong) !important;
}
html.light-mode body.lume .dataTables_wrapper .dataTables_info,
html.light-mode body.lume .dataTables_wrapper .dataTables_length,
html.light-mode body.lume .dataTables_wrapper .dataTables_filter {
  color: var(--lm-text-2) !important;
}
html.light-mode body.lume .dataTables_wrapper .dataTables_paginate .paginate_button {
  color: var(--lm-text-2) !important;
}
html.light-mode body.lume .dataTables_wrapper .dataTables_paginate .paginate_button.current {
  background: var(--lm-energia) !important;
  color: #fff !important;
  border-color: var(--lm-energia) !important;
}

/* Audit allegati - sfondi e bordi card scuri */
html.light-mode body.lume .aa-card {
  background: var(--lm-bg-1) !important;
  border-color: var(--lm-line) !important;
  color: var(--lm-text) !important;
}
html.light-mode body.lume .aa-card-head {
  background: var(--lm-bg-2) !important;
  border-color: var(--lm-line) !important;
  color: var(--lm-text) !important;
}
html.light-mode body.lume .aa-card-head h3,
html.light-mode body.lume .aa-card-head h4,
html.light-mode body.lume .aa-card-head .h3,
html.light-mode body.lume .aa-card-head .h4 {
  color: var(--lm-text) !important;
}
html.light-mode body.lume .aa-tab {
  background: var(--lm-bg-1) !important;
  color: var(--lm-text-2) !important;
  border-color: var(--lm-line) !important;
}
html.light-mode body.lume .aa-tab.active {
  background: var(--lm-energia) !important;
  color: #fff !important;
  border-color: var(--lm-energia) !important;
}

/* Tabella in audit/dashboard quando ha sfondo scuro hardcoded */
html.light-mode body.lume .table tbody tr {
  background-color: transparent;
}
html.light-mode body.lume .lm-banner.is-loading,
html.light-mode body.lume .lm-skeleton {
  background: linear-gradient(90deg, var(--lm-bg-2), var(--lm-bg-3), var(--lm-bg-2)) !important;
}

/* Buttons "ghost"/dark inline */
html.light-mode body.lume button[style*="background:#21262d"],
html.light-mode body.lume button[style*="background: #21262d"],
html.light-mode body.lume button[style*="background:#161b22"],
html.light-mode body.lume button[style*="background: #161b22"],
html.light-mode body.lume a[style*="background:#21262d"],
html.light-mode body.lume a[style*="background: #21262d"],
html.light-mode body.lume a[style*="background:#161b22"] {
  background: var(--lm-bg-2) !important;
  color: var(--lm-text) !important;
  border-color: var(--lm-line-strong) !important;
}

/* Periodo-pill / classifica pill non-active in light */
html.light-mode body.lume .periodo-pill:not(.active):not(.active-pill) {
  background: var(--lm-bg-2) !important;
  color: var(--lm-text-2) !important;
  border-color: var(--lm-line-strong) !important;
}

/* Code blocks in light */
html.light-mode body.lume code {
  background: #f1f5f9 !important;
  color: #be185d !important;
  border: 1px solid var(--lm-line) !important;
  padding: 1px 5px;
  border-radius: 4px;
}

/* Override colore link che diventano illeggibili */
html.light-mode body.lume a:not(.btn):not(.dropdown-item):not(.gn-link):not(.gn-link-logout):not(.aa-tab):not(.periodo-pill):not(.nav-link):not([style*="color"]) {
  color: var(--lm-energia-soft);
}
html.light-mode body.lume a:not(.btn):not(.dropdown-item):hover {
  color: var(--lm-energia);
}

/* Card-header in LIGHT mode: testo SEMPRE scuro.
   Motivo: lume.css base forza `background: linear-gradient(180deg,
   var(--lm-bg-2), var(--lm-bg-1)) !important` su TUTTI i .card-header,
   quindi in light mode il bg diventa pale-gray indipendentemente dal
   gradient inline (a meno che il file non lo riesponga con !important).
   Su pale-gray il testo bianco è invisibile → forziamo sempre dark.
   Battiamo le classi Bootstrap `.text-white` e gli inline color:#fff
   tramite specificità (html.light-mode body.lume + 3 classi) + !important. */
html.light-mode body.lume .card-header,
html.light-mode body.lume .card-header.text-white,
html.light-mode body.lume .card-header h1,
html.light-mode body.lume .card-header h2,
html.light-mode body.lume .card-header h3,
html.light-mode body.lume .card-header h4,
html.light-mode body.lume .card-header h5,
html.light-mode body.lume .card-header h6,
html.light-mode body.lume .card-header .h1,
html.light-mode body.lume .card-header .h2,
html.light-mode body.lume .card-header .h3,
html.light-mode body.lume .card-header .h4,
html.light-mode body.lume .card-header .h5,
html.light-mode body.lume .card-header .h6,
html.light-mode body.lume .card-header > span,
html.light-mode body.lume .card-header > div,
html.light-mode body.lume .card-header > a,
html.light-mode body.lume .card-header > strong,
html.light-mode body.lume .card-header span:not(.badge):not([style*="background"]),
html.light-mode body.lume .card-header strong,
html.light-mode body.lume .card-header small,
html.light-mode body.lume .card-header label {
  color: var(--lm-text) !important;
}
/* Le icone fa- dentro il card-header: se hanno color inline accent, viene
   già gestito dalla sezione "Accent" sopra (rimappato a versione darker
   leggibile su bianco). Quelle SENZA color inline ereditano il dark del
   testo via "color: inherit" (default per <i>). */
html.light-mode body.lume .card-header i.fas:not([style*="color"]),
html.light-mode body.lume .card-header i.far:not([style*="color"]),
html.light-mode body.lume .card-header i.fab:not([style*="color"]) {
  color: var(--lm-text-2) !important;
}

/* Bordo tabelle in light mode → linea visibile */
html.light-mode body.lume .table,
html.light-mode body.lume .table > :not(caption) > * > *,
html.light-mode body.lume .table > thead > tr > th,
html.light-mode body.lume .table > tbody > tr > td {
  border-color: var(--lm-line) !important;
}
html.light-mode body.lume .table-hover > tbody > tr:hover > * {
  background-color: rgba(15,25,36,.03) !important;
  color: var(--lm-text) !important;
}

/* (Le rules ridondanti per .card-header.text-white sono state unificate
   nella sezione "Card-header in LIGHT mode" più sopra: tutti i card-header
   in light hanno testo --lm-text scuro a prescindere da .text-white o
   gradient inline.) */

/* Outlines/box-shadow rgba dark → lighter */
html.light-mode body.lume [style*="box-shadow: 0 8px 24px rgba(0,0,0,.6)"],
html.light-mode body.lume [style*="box-shadow:0 8px 24px rgba(0,0,0,.6)"] {
  box-shadow: 0 8px 24px rgba(15,25,36,.15) !important;
}

/* End LIGHT MODE GLOBAL PATCHES =========================================== */
