/* ==========================================================================
   Tema GNC per il gestionale neeos2
   v1.3 - ultima modifica 01/10/2026 (pacchetto per integrazione nel sorgente)
   Colori dal logo GNC Light for Life: nero #1D1D1B, blu #008BD2, rosso #E30613
   Sovrascrive solo variabili e aspetto Mantine: nessuna modifica ai componenti.
   Collegato da index.html (<link ... href="/gnc/gnc-theme.css?v=...">): file statico, nella
   build si trova in dist/gnc/gnc-theme.css. Immagini e font sono in /gnc/ (percorsi assoluti).
   ========================================================================== */

/* --- Font Figtree (self-hosted, nessuna chiamata a Google) --------------- */
@font-face {
  font-family: "Figtree GNC";
  font-style: normal;
  font-display: swap;
  font-weight: 300 900;
  src: url(/gnc/fonts/figtree-latin-ext-wght-normal.woff2) format("woff2-variations");
  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;
}
@font-face {
  font-family: "Figtree GNC";
  font-style: normal;
  font-display: swap;
  font-weight: 300 900;
  src: url(/gnc/fonts/figtree-latin-wght-normal.woff2) format("woff2-variations");
  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;
}

/* --- Variabili --------------------------------------------------------- */
:root:root {
  --gnc-black: #1D1D1B;
  --gnc-blue: #008BD2;
  --gnc-blue-dark: #027AB8;
  --gnc-red: #E30613;

  --mantine-font-family: "Figtree GNC", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mantine-font-family-headings: "Figtree GNC", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mantine-heading-font-weight: 700;

  --mantine-radius-default: calc(0.5rem * var(--mantine-scale));

  --mantine-primary-color-0: #EBF6FB;
  --mantine-primary-color-1: #D1EAF7;
  --mantine-primary-color-2: #A8D8F0;
  --mantine-primary-color-3: #7AC3E8;
  --mantine-primary-color-4: #47ABDF;
  --mantine-primary-color-5: #1F99D7;
  --mantine-primary-color-6: #008BD2;
  --mantine-primary-color-7: #027AB8;
  --mantine-primary-color-8: #04689D;
  --mantine-primary-color-9: #065783;

  /* anche la scala "blue" di Mantine, usata da alcuni componenti */
  --mantine-color-blue-0: #EBF6FB;
  --mantine-color-blue-1: #D1EAF7;
  --mantine-color-blue-2: #A8D8F0;
  --mantine-color-blue-3: #7AC3E8;
  --mantine-color-blue-4: #47ABDF;
  --mantine-color-blue-5: #1F99D7;
  --mantine-color-blue-6: #008BD2;
  --mantine-color-blue-7: #027AB8;
  --mantine-color-blue-8: #04689D;
  --mantine-color-blue-9: #065783;

  /* palette scura coerente con il nero GNC */
  --mantine-color-dark-0: #CFCFCC;
  --mantine-color-dark-1: #B3B3B0;
  --mantine-color-dark-2: #8E8E8B;
  --mantine-color-dark-3: #62625F;
  --mantine-color-dark-4: #41413F;
  --mantine-color-dark-5: #30302E;
  --mantine-color-dark-6: #262624;
  --mantine-color-dark-7: #1D1D1B;
  --mantine-color-dark-8: #151514;
  --mantine-color-dark-9: #0E0E0D;
}

:root:root[data-mantine-color-scheme="light"],
:root:root:not([data-mantine-color-scheme="dark"]) {
  --mantine-primary-color-filled: #008BD2;
  --mantine-primary-color-filled-hover: #027AB8;
  --mantine-primary-color-light: rgba(0, 139, 210, 0.10);
  --mantine-primary-color-light-hover: rgba(0, 139, 210, 0.16);
  --mantine-primary-color-light-color: #027AB8;
  --mantine-color-blue-filled: #008BD2;
  --mantine-color-blue-filled-hover: #027AB8;
  --mantine-color-blue-light: rgba(0, 139, 210, 0.10);
  --mantine-color-blue-light-hover: rgba(0, 139, 210, 0.16);
  --mantine-color-blue-light-color: #027AB8;
  --mantine-color-anchor: #027AB8;
  --mantine-color-text: #1D1D1B;
  --mantine-color-body: #FFFFFF;
  --gnc-page: #F6F7F8;
  --gnc-surface: #FFFFFF;
  --gnc-line: #E6E7E8;
}

:root:root[data-mantine-color-scheme="dark"] {
  --mantine-primary-color-filled: #008BD2;
  --mantine-primary-color-filled-hover: #1F99D7;
  --mantine-primary-color-light: rgba(0, 139, 210, 0.18);
  --mantine-primary-color-light-hover: rgba(0, 139, 210, 0.26);
  --mantine-primary-color-light-color: #7AC3E8;
  --mantine-color-blue-filled: #008BD2;
  --mantine-color-blue-filled-hover: #1F99D7;
  --mantine-color-blue-light: rgba(0, 139, 210, 0.18);
  --mantine-color-blue-light-hover: rgba(0, 139, 210, 0.26);
  --mantine-color-blue-light-color: #7AC3E8;
  --mantine-color-anchor: #7AC3E8;
  --mantine-color-body: #151514;
  --gnc-page: #151514;
  --gnc-surface: #1D1D1B;
  --gnc-line: #30302E;
}

body {
  font-feature-settings: "ss01";
  -webkit-font-smoothing: antialiased;
}

/* --- Barra superiore: nero GNC con logo neeos ------------------------- */
.mantine-AppShell-header {
  background: var(--gnc-black);
  border-bottom: 0 !important;
  color: #fff;
}
.mantine-AppShell-header::after {
  /* filo blu/rosso, richiamo ai due quadrati del logo GNC */
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--gnc-blue) 0 calc(100% - 72px), transparent calc(100% - 72px) calc(100% - 64px), var(--gnc-red) calc(100% - 64px));
}
.mantine-AppShell-header .mantine-Title-root {
  font-size: 0;
  line-height: 0;
  display: flex;
  align-items: center;
  gap: 14px;
}
.mantine-AppShell-header .mantine-Title-root::before {
  content: "";
  display: block;
  width: 104px;
  height: 22px;
  background: url(/gnc/neeos-white.svg) left center / contain no-repeat;
}
.mantine-AppShell-header .mantine-Title-root::after {
  content: "Gestionale";
  font-size: 11px;
  line-height: 20px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.62);
  padding-left: 14px;
  border-left: 1px solid rgba(255, 255, 255, 0.22);
}
.mantine-AppShell-header .mantine-Group-root { flex-wrap: nowrap; }
@media (max-width: 47.99em) {
  .mantine-AppShell-header .mantine-Title-root::before { width: 85px; height: 18px; }
  .mantine-AppShell-header .mantine-Title-root::after { display: none; }
}
.mantine-AppShell-header .mantine-Burger-root { --burger-color: #fff; }
.mantine-AppShell-header .mantine-ActionIcon-root {
  --ai-bg: transparent;
  --ai-hover: rgba(255, 255, 255, 0.08);
  --ai-color: #fff;
  --ai-bd: 1px solid rgba(255, 255, 255, 0.22);
  background: transparent;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.22);
}
.mantine-AppShell-header .mantine-ActionIcon-root:hover { background: rgba(255, 255, 255, 0.08); }
.mantine-AppShell-header .mantine-Avatar-root {
  --avatar-bg: var(--gnc-blue);
  --avatar-color: #fff;
  cursor: pointer;
}
.mantine-AppShell-header .mantine-Avatar-placeholder {
  background: var(--gnc-blue);
  color: #fff;
  font-weight: 700;
}

/* --- Menu laterale ------------------------------------------------------- */
.mantine-AppShell-navbar {
  background: var(--gnc-surface);
  border-right-color: var(--gnc-line) !important;
  padding-top: 12px !important;
}
.mantine-AppShell-navbar .mantine-NavLink-root {
  position: relative;
  border-radius: 8px;
  margin-bottom: 2px;
  font-weight: 500;
  transition: background-color 120ms ease, color 120ms ease;
}
.mantine-AppShell-navbar .mantine-NavLink-root[data-active] {
  font-weight: 650;
}
.mantine-AppShell-navbar .mantine-NavLink-root[data-active]::before {
  content: "";
  position: absolute;
  left: -16px;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: var(--gnc-blue);
}
.mantine-AppShell-navbar .mantine-NavLink-label { font-size: 14.5px; }
.mantine-AppShell-navbar .mantine-Divider-label {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mantine-color-dimmed);
}
/* logo GNC in fondo al menu */
.mantine-AppShell-navbar::after {
  content: "";
  display: block;
  margin-top: auto;
  flex: 0 0 auto;
  height: 46px;
  margin-bottom: 8px;
  background: url(/gnc/gnc-logo.png) center / contain no-repeat;
  opacity: 0.9;
}
[data-mantine-color-scheme="dark"] .mantine-AppShell-navbar::after {
  background-image: url(/gnc/gnc-logo-white.png);
}

/* --- Area contenuti -------------------------------------------------------- */
.mantine-AppShell-main { background: var(--gnc-page); }
.mantine-AppShell-main .mantine-Title-root {
  letter-spacing: -0.015em;
  font-weight: 750;
}
.mantine-Breadcrumbs-root,
.mantine-AppShell-main .mantine-Breadcrumbs-breadcrumb {
  font-size: 12.5px;
  letter-spacing: 0.02em;
}
.mantine-AppShell-main .mantine-Table-table {
  background: var(--gnc-surface);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 0 0 1px var(--gnc-line), 0 1px 2px rgba(29, 29, 27, 0.04);
}
.mantine-AppShell-main .mantine-Table-th {
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mantine-color-dimmed);
  background: var(--gnc-surface);
}
.mantine-AppShell-main .mantine-Table-th :is(button, span, p, div, .mantine-Text-root) {
  font-size: inherit !important;
  font-weight: inherit !important;
  letter-spacing: inherit;
  text-transform: inherit;
  color: inherit;
}
.mantine-AppShell-main .mantine-Table-tr[data-striped="odd"],
.mantine-AppShell-main .mantine-Table-tbody .mantine-Table-tr:nth-of-type(odd) {
  --table-striped-color: transparent;
}
.mantine-AppShell-main .mantine-Table-tbody .mantine-Table-tr:hover {
  background: var(--mantine-primary-color-light);
}
.mantine-AppShell-main .mantine-Input-input {
  background: var(--gnc-surface);
}
.mantine-Badge-root { font-weight: 700; letter-spacing: 0.04em; }
.mantine-Button-root { font-weight: 650; }

/* --- Pagina di login ------------------------------------------------------ */
.mantine-Center-root:has(> .mantine-Paper-root form) {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background: var(--gnc-black);
}
.mantine-Center-root:has(> .mantine-Paper-root form)::before,
.mantine-Center-root:has(> .mantine-Paper-root form)::after {
  content: "";
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  filter: blur(40px);
  pointer-events: none;
}
.mantine-Center-root:has(> .mantine-Paper-root form)::before {
  width: 70vmax; height: 60vmax;
  left: -22vmax; top: -24vmax;
  background: radial-gradient(closest-side, rgba(0, 139, 210, 0.55), transparent);
  animation: gnc-drift-a 22s ease-in-out infinite alternate;
}
.mantine-Center-root:has(> .mantine-Paper-root form)::after {
  width: 50vmax; height: 44vmax;
  right: -18vmax; bottom: -20vmax;
  background: radial-gradient(closest-side, rgba(227, 6, 19, 0.30), transparent);
  animation: gnc-drift-b 26s ease-in-out infinite alternate;
}
.mantine-Center-root > .mantine-Paper-root:has(form) {
  border: 0 !important;
  border-radius: 18px !important;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45), 0 0 0 1px rgba(255, 255, 255, 0.04) !important;
  padding: 40px 36px 28px !important;
  background: var(--gnc-surface);
}
.mantine-Center-root > .mantine-Paper-root:has(form) > .mantine-Title-root {
  font-size: 0 !important;
  line-height: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 28px !important;
}
.mantine-Center-root > .mantine-Paper-root:has(form) > .mantine-Title-root::before {
  content: "";
  display: block;
  width: 166px;
  height: 35px;
  background: url(/gnc/neeos.svg) left center / contain no-repeat;
}
.mantine-Center-root > .mantine-Paper-root:has(form) > .mantine-Title-root::after {
  content: "Gestionale · accesso riservato";
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mantine-color-dimmed);
}
[data-mantine-color-scheme="dark"] .mantine-Center-root > .mantine-Paper-root:has(form) > .mantine-Title-root::before {
  background-image: url(/gnc/neeos-white.svg);
}
.mantine-Center-root > .mantine-Paper-root:has(form) .mantine-Button-root {
  height: 44px;
  margin-top: 6px;
}
.mantine-Center-root > .mantine-Paper-root:has(form)::after {
  content: "";
  display: block;
  height: 34px;
  margin-top: 26px;
  padding-top: 18px;
  border-top: 1px solid var(--gnc-line);
  background: url(/gnc/gnc-logo.png) center bottom / auto 34px no-repeat;
  background-origin: content-box;
}
[data-mantine-color-scheme="dark"] .mantine-Center-root > .mantine-Paper-root:has(form)::after {
  background-image: url(/gnc/gnc-logo-white.png);
}

/* ==========================================================================
   Animazioni (v1.1)
   Discrete, brevi, e disattivate se l'utente chiede "riduci movimento".
   ========================================================================== */
@keyframes gnc-drift-a { to { transform: translate(14vmax, 10vmax) scale(1.15); } }
@keyframes gnc-drift-b { to { transform: translate(-12vmax, -8vmax) scale(1.2); } }
@keyframes gnc-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes gnc-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes gnc-row { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes gnc-bar { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes gnc-sweep { 0% { background-position: -40% 0; } 55%, 100% { background-position: 140% 0; } }

/* Login: la card sale, logo e campi compaiono in sequenza */
.mantine-Center-root > .mantine-Paper-root:has(form) {
  position: relative;
  animation: gnc-rise 600ms cubic-bezier(.2, .8, .2, 1) both;
}
.mantine-Center-root > .mantine-Paper-root:has(form) > .mantine-Title-root { animation: gnc-fade 700ms 150ms both; }
.mantine-Center-root > .mantine-Paper-root:has(form) form .mantine-Stack-root > * { animation: gnc-rise 500ms cubic-bezier(.2, .8, .2, 1) both; }
.mantine-Center-root > .mantine-Paper-root:has(form) form .mantine-Stack-root > :nth-child(1) { animation-delay: 220ms; }
.mantine-Center-root > .mantine-Paper-root:has(form) form .mantine-Stack-root > :nth-child(2) { animation-delay: 290ms; }
.mantine-Center-root > .mantine-Paper-root:has(form) form .mantine-Stack-root > :nth-child(3) { animation-delay: 360ms; }
.mantine-Center-root > .mantine-Paper-root:has(form) form .mantine-Stack-root > :nth-child(n+4) { animation-delay: 430ms; }
.mantine-Center-root > .mantine-Paper-root:has(form)::after { animation: gnc-fade 800ms 500ms both; }
/* riflesso di luce che attraversa il pulsante Accedi */
.mantine-Center-root > .mantine-Paper-root:has(form) .mantine-Button-root {
  position: relative;
  overflow: hidden;
  transition: transform 150ms ease, box-shadow 150ms ease, background-color 150ms ease;
}
.mantine-Center-root > .mantine-Paper-root:has(form) .mantine-Button-root::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, 0.35) 50%, transparent 65%) no-repeat;
  background-size: 50% 100%;
  animation: gnc-sweep 4.5s 1.2s ease-in-out infinite;
  pointer-events: none;
}
.mantine-Center-root > .mantine-Paper-root:has(form) .mantine-Button-root:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 22px rgba(0, 139, 210, 0.35);
}

/* Barra superiore: un impulso di luce scorre sul filo blu, come un LED */
.mantine-AppShell-header::before {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: calc(100% - 72px);
  height: 3px;
  z-index: 1;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.85), transparent) no-repeat;
  background-size: 180px 100%;
  animation: gnc-sweep 7s 1s ease-in-out infinite;
  pointer-events: none;
}

/* Menu: la barretta blu cresce sulla voce attiva, le icone si spostano al passaggio */
.mantine-AppShell-navbar .mantine-NavLink-root[data-active]::before {
  animation: gnc-bar 280ms cubic-bezier(.2, .8, .2, 1) both;
}
.mantine-AppShell-navbar .mantine-NavLink-section {
  transition: transform 180ms cubic-bezier(.2, .8, .2, 1);
}
.mantine-AppShell-navbar .mantine-NavLink-root:hover .mantine-NavLink-section[data-position="left"] {
  transform: translateX(2px) scale(1.08);
}
.mantine-AppShell-navbar::after { animation: gnc-fade 900ms 300ms both; }

/* Pagine: il contenuto entra dal basso a ogni cambio pagina */
.mantine-AppShell-main > * { animation: gnc-rise 420ms cubic-bezier(.2, .8, .2, 1) both; }

/* Tabelle: le righe compaiono in cascata */
.mantine-AppShell-main .mantine-Table-tbody .mantine-Table-tr { animation: gnc-row 360ms cubic-bezier(.2, .8, .2, 1) both; }
.mantine-AppShell-main .mantine-Table-tbody .mantine-Table-tr:nth-child(2) { animation-delay: 30ms; }
.mantine-AppShell-main .mantine-Table-tbody .mantine-Table-tr:nth-child(3) { animation-delay: 60ms; }
.mantine-AppShell-main .mantine-Table-tbody .mantine-Table-tr:nth-child(4) { animation-delay: 90ms; }
.mantine-AppShell-main .mantine-Table-tbody .mantine-Table-tr:nth-child(5) { animation-delay: 120ms; }
.mantine-AppShell-main .mantine-Table-tbody .mantine-Table-tr:nth-child(6) { animation-delay: 150ms; }
.mantine-AppShell-main .mantine-Table-tbody .mantine-Table-tr:nth-child(7) { animation-delay: 180ms; }
.mantine-AppShell-main .mantine-Table-tbody .mantine-Table-tr:nth-child(8) { animation-delay: 210ms; }
.mantine-AppShell-main .mantine-Table-tbody .mantine-Table-tr:nth-child(9) { animation-delay: 240ms; }
.mantine-AppShell-main .mantine-Table-tbody .mantine-Table-tr:nth-child(n+10) { animation-delay: 270ms; }
.mantine-AppShell-main .mantine-Table-tbody .mantine-Table-tr { transition: background-color 140ms ease; }

/* Pulsanti e icone: piccolo sollevamento al passaggio */
.mantine-AppShell-main .mantine-Button-root,
.mantine-AppShell-main .mantine-ActionIcon-root {
  transition: transform 140ms ease, box-shadow 140ms ease, background-color 140ms ease;
}
.mantine-AppShell-main .mantine-Button-root:hover:not(:disabled),
.mantine-AppShell-main .mantine-ActionIcon-root:hover:not(:disabled) {
  transform: translateY(-1px);
}
.mantine-AppShell-main .mantine-Button-root[data-variant="filled"]:hover:not(:disabled) {
  box-shadow: 0 6px 16px rgba(0, 139, 210, 0.28);
}
.mantine-Avatar-root { transition: transform 160ms ease, box-shadow 160ms ease; }
.mantine-Avatar-root:hover { transform: scale(1.06); box-shadow: 0 0 0 3px rgba(0, 139, 210, 0.35); }

/* MODIFICA LOCALE (neeos2-admin-web, 06/10/2026): rimosso il blocco
   @media (prefers-reduced-motion: reduce) del pacchetto v1.3, che azzerava tutte le animazioni
   (anche lo spinner dei Loader Mantine). Scelta di prodotto: animazioni sempre visibili.
   Da NON reintrodurre aggiornando il tema a una versione successiva del pacchetto. */
