/* FYC Banking · base stylesheet
 * Palette:
 *   navy        #1a3a5c   (primary)
 *   navy-dark   #0f2540
 *   gold        #d4af37   (accent / CTA)
 *   teal        #2aa6a0   (positive / info)
 *   coral       #e26c5a   (negative / warning)
 *   bg          #f5f7fa
 *   surface     #ffffff
 *   text        #1f2937
 *   text-mute   #6b7280
 *   border      #e5e7eb
 */

:root {
  --fyc-navy:       #1a3a5c;
  --fyc-navy-dark:  #0f2540;
  --fyc-gold:       #d4af37;
  --fyc-teal:       #2aa6a0;
  --fyc-coral:      #e26c5a;
  --fyc-bg:         #f5f7fa;
  --fyc-surface:    #ffffff;
  --fyc-text:       #1f2937;
  --fyc-text-mute:  #6b7280;
  --fyc-border:     #e5e7eb;
  --fyc-radius:     12px;
  --fyc-shadow-sm:  0 1px 2px rgba(15, 37, 64, 0.06);
  --fyc-shadow-md:  0 4px 12px rgba(15, 37, 64, 0.08);
  --fyc-shadow-lg:  0 10px 30px rgba(15, 37, 64, 0.12);
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--fyc-bg);
  color: var(--fyc-text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  font-size: 15px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a { color: var(--fyc-navy); text-decoration: none; }
a:hover { text-decoration: underline; }

/* --- Layout --- */
.fyc-app {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.fyc-header {
  background: var(--fyc-navy);
  color: #fff;
  padding: 14px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-shadow: var(--fyc-shadow-sm);
}

.fyc-header .brand {
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.fyc-header .brand-mark {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--fyc-gold), #b8902b);
  display: grid;
  place-items: center;
  color: var(--fyc-navy-dark);
  font-weight: 800;
}

.fyc-header .brand-title { font-size: 16px; }
.fyc-header .brand-sub   { font-size: 12px; opacity: 0.75; font-weight: 500; }

.fyc-user {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
}

.fyc-user img {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.2);
}

.fyc-user button {
  background: transparent;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.3);
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 12px;
  cursor: pointer;
}

.fyc-user button:hover { background: rgba(255, 255, 255, 0.1); }

.fyc-main {
  flex: 1;
  padding: 24px 20px 40px;
  max-width: 1280px;
  margin: 0 auto;
  width: 100%;
}

.fyc-footer {
  padding: 16px 20px;
  text-align: center;
  font-size: 12px;
  color: var(--fyc-text-mute);
}

/* --- Login screen --- */
.fyc-login {
  min-height: 100vh;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, var(--fyc-navy) 0%, var(--fyc-navy-dark) 100%);
  padding: 20px;
}

.fyc-login-card {
  background: var(--fyc-surface);
  border-radius: var(--fyc-radius);
  padding: 36px 32px;
  width: 100%;
  max-width: 420px;
  box-shadow: var(--fyc-shadow-lg);
  text-align: center;
}

.fyc-login-card .logo {
  width: 64px;
  height: 64px;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--fyc-gold), #b8902b);
  margin: 0 auto 18px;
  display: grid;
  place-items: center;
  color: var(--fyc-navy-dark);
  font-weight: 800;
  font-size: 24px;
}

.fyc-login-card h1 {
  margin: 0 0 6px;
  font-size: 22px;
  color: var(--fyc-navy);
}

.fyc-login-card .subtitle {
  color: var(--fyc-text-mute);
  font-size: 14px;
  margin-bottom: 24px;
}

.fyc-login-card .gbtn { display: flex; justify-content: center; margin: 8px 0 6px; }

.fyc-login-card .footnote {
  margin-top: 24px;
  font-size: 12px;
  color: var(--fyc-text-mute);
}

/* --- KPI cards --- */
.fyc-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  margin-bottom: 28px;
}

.fyc-kpi {
  background: var(--fyc-surface);
  border-radius: var(--fyc-radius);
  padding: 18px 20px;
  box-shadow: var(--fyc-shadow-sm);
  border: 1px solid var(--fyc-border);
  display: flex;
  flex-direction: column;
  gap: 6px;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.fyc-kpi:hover {
  transform: translateY(-1px);
  box-shadow: var(--fyc-shadow-md);
}

.fyc-kpi .label {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--fyc-text-mute);
  font-weight: 600;
}

.fyc-kpi .value {
  font-size: 26px;
  font-weight: 700;
  color: var(--fyc-navy);
  letter-spacing: -0.01em;
}

.fyc-kpi .delta {
  font-size: 12px;
  color: var(--fyc-text-mute);
}

.fyc-kpi.accent .value { color: var(--fyc-gold); }
.fyc-kpi.positive .value { color: var(--fyc-teal); }
.fyc-kpi.negative .value { color: var(--fyc-coral); }

/* --- Section + meta --- */
.fyc-section-title {
  margin: 8px 0 14px;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--fyc-text-mute);
  font-weight: 700;
}

.fyc-meta-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 8px;
  padding: 12px 16px;
  background: var(--fyc-surface);
  border-radius: var(--fyc-radius);
  border: 1px solid var(--fyc-border);
  font-size: 12px;
  color: var(--fyc-text-mute);
}

.fyc-meta-bar strong {
  color: var(--fyc-text);
  font-weight: 600;
}

/* --- States --- */
.fyc-loading,
.fyc-error {
  padding: 28px;
  text-align: center;
  background: var(--fyc-surface);
  border-radius: var(--fyc-radius);
  border: 1px solid var(--fyc-border);
}

.fyc-error {
  border-color: var(--fyc-coral);
  color: var(--fyc-coral);
}

.fyc-loading::after {
  content: '';
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-left: 8px;
  border: 2px solid var(--fyc-border);
  border-top-color: var(--fyc-navy);
  border-radius: 50%;
  animation: fyc-spin 0.8s linear infinite;
  vertical-align: middle;
}

@keyframes fyc-spin {
  to { transform: rotate(360deg); }
}

.hidden { display: none !important; }

/* --- Responsive --- */
@media (max-width: 640px) {
  .fyc-header { padding: 12px 14px; }
  .fyc-header .brand-title { font-size: 14px; }
  .fyc-header .brand-sub { display: none; }
  .fyc-main { padding: 16px 14px 32px; }
  .fyc-kpi .value { font-size: 22px; }
  .fyc-login-card { padding: 28px 22px; }
}

/* =========================================================================
   View: Saldi
   ========================================================================= */

/* 3 card grandi (BA1, BA2, Consolidato). Layout dedicato, niente auto-fit. */
.fyc-saldi-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 24px;
}
@media (max-width: 900px) {
  .fyc-saldi-grid { grid-template-columns: 1fr; }
}

.fyc-kpi--big {
  position: relative;
  padding: 22px 22px 20px;
  gap: 8px;
}
.fyc-kpi--big .value { font-size: 30px; }
.fyc-kpi--big .row {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: var(--fyc-text-mute);
}
.fyc-kpi--big .row strong { color: var(--fyc-text); font-weight: 600; }

/* Variante cliccabile con stato attivo */
.fyc-kpi--clickable {
  cursor: pointer;
  user-select: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.fyc-kpi--active {
  border-color: var(--fyc-navy);
  box-shadow: 0 0 0 2px rgba(26, 58, 92, 0.18), var(--fyc-shadow-md);
}

/* Semaforo (pallino colorato + etichetta) */
.fyc-semaforo {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.fyc-semaforo::before {
  content: '';
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}
.fyc-semaforo--verde  { color: #1f8a85; }
.fyc-semaforo--verde::before  { background: var(--fyc-teal); }
.fyc-semaforo--giallo { color: #8a6c1a; }
.fyc-semaforo--giallo::before { background: var(--fyc-gold); }
.fyc-semaforo--rosso  { color: #b04432; }
.fyc-semaforo--rosso::before  { background: var(--fyc-coral); }

/* Chart container */
.fyc-chart-wrap {
  position: relative;
  height: 360px;
  background: var(--fyc-surface);
  border-radius: var(--fyc-radius);
  border: 1px solid var(--fyc-border);
  padding: 16px 16px 12px;
  margin-bottom: 28px;
  box-shadow: var(--fyc-shadow-sm);
}
@media (max-width: 640px) {
  .fyc-chart-wrap { height: 300px; padding: 12px; }
}

/* Icona "espandi a tutto schermo" nell'angolo top-right del .fyc-chart-wrap.
   Posizionata sopra il canvas Chart.js via z-index; il listener è SOLO sul
   bottone per non interferire con il tooltip di Chart.js. */
.fyc-chart-zoom-btn {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--fyc-border);
  border-radius: 6px;
  color: var(--fyc-text-mute);
  cursor: pointer;
  padding: 0;
  z-index: 2;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}
.fyc-chart-zoom-btn:hover {
  background: #fff;
  color: var(--fyc-navy);
  border-color: var(--fyc-navy);
  transform: translateY(-1px);
}
.fyc-chart-zoom-btn:focus-visible {
  outline: 2px solid var(--fyc-navy);
  outline-offset: 2px;
}

/* Tabella */
.fyc-table-wrap {
  background: var(--fyc-surface);
  border-radius: var(--fyc-radius);
  border: 1px solid var(--fyc-border);
  overflow: hidden;
  box-shadow: var(--fyc-shadow-sm);
}
.fyc-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.fyc-table th,
.fyc-table td {
  padding: 10px 14px;
  text-align: left;
  border-bottom: 1px solid var(--fyc-border);
  vertical-align: middle;
}
.fyc-table thead th {
  background: #f9fafb;
  font-weight: 600;
  color: var(--fyc-text-mute);
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.06em;
  border-bottom: 1px solid var(--fyc-border);
}
.fyc-table tbody tr:last-child td { border-bottom: none; }
.fyc-table tbody tr:hover { background: #fafbfc; }
.fyc-table td.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.fyc-table td.neg { color: var(--fyc-coral); font-weight: 600; }
.fyc-table td.pos { color: var(--fyc-teal); font-weight: 600; }
.fyc-table .codpdc-pill {
  display: inline-block;
  padding: 2px 7px;
  font-size: 11px;
  border-radius: 4px;
  background: #eef2f6;
  color: var(--fyc-navy);
  font-family: ui-monospace, "SF Mono", Consolas, monospace;
}

/* Breadcrumb nel sub-title dell'header */
.fyc-back {
  color: #fff;
  font-size: 13px;
  opacity: 0.85;
  margin-right: 14px;
  text-decoration: none;
}
.fyc-back:hover { opacity: 1; text-decoration: underline; }

/* Navigazione tra schermate (Home Hub) */
.fyc-nav-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}
.fyc-nav-tile {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 16px 18px;
  background: var(--fyc-surface);
  border: 1px solid var(--fyc-border);
  border-radius: var(--fyc-radius);
  text-decoration: none;
  color: var(--fyc-text);
  box-shadow: var(--fyc-shadow-sm);
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.fyc-nav-tile:hover {
  text-decoration: none;
  transform: translateY(-1px);
  box-shadow: var(--fyc-shadow-md);
  border-color: var(--fyc-navy);
}
.fyc-nav-tile .tag {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--fyc-gold);
  text-transform: uppercase;
}
.fyc-nav-tile .title {
  font-size: 16px;
  font-weight: 700;
  color: var(--fyc-navy);
}
.fyc-nav-tile .hint {
  font-size: 12px;
  color: var(--fyc-text-mute);
}
.fyc-nav-tile--soon { opacity: 0.55; }
.fyc-nav-tile--soon:hover { transform: none; border-color: var(--fyc-border); box-shadow: var(--fyc-shadow-sm); }

/* =========================================================================
   View: Flussi OIC 10
   ========================================================================= */

/* Filter bar */
.fyc-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  align-items: center;
  margin-bottom: 16px;
  padding: 12px 16px;
  background: var(--fyc-surface);
  border: 1px solid var(--fyc-border);
  border-radius: var(--fyc-radius);
  box-shadow: var(--fyc-shadow-sm);
}
.fyc-filter-group {
  display: flex;
  align-items: center;
  gap: 6px;
}
.fyc-filter-group > .label {
  font-size: 11px;
  text-transform: uppercase;
  color: var(--fyc-text-mute);
  font-weight: 700;
  letter-spacing: 0.06em;
  margin-right: 6px;
}
.fyc-pill {
  background: transparent;
  border: 1px solid var(--fyc-border);
  border-radius: 999px;
  padding: 5px 12px;
  font-size: 12.5px;
  color: var(--fyc-text);
  cursor: pointer;
  transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}
.fyc-pill:hover { background: #f4f6f8; }
.fyc-pill.active {
  background: var(--fyc-navy);
  color: #fff;
  border-color: var(--fyc-navy);
}

/* Pivot table */
.fyc-pivot-wrap {
  background: var(--fyc-surface);
  border: 1px solid var(--fyc-border);
  border-radius: var(--fyc-radius);
  overflow: auto;
  margin-bottom: 24px;
  box-shadow: var(--fyc-shadow-sm);
  max-width: 100%;
}
.fyc-pivot {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.fyc-pivot thead th {
  background: #f9fafb;
  font-weight: 600;
  font-size: 11px;
  text-transform: uppercase;
  color: var(--fyc-text-mute);
  letter-spacing: 0.05em;
  position: sticky;
  top: 0;
  z-index: 2;
  border-bottom: 1px solid var(--fyc-border);
  padding: 8px 10px;
  text-align: right;
  white-space: nowrap;
}
.fyc-pivot thead th:first-child { text-align: left; }
.fyc-pivot tbody td,
.fyc-pivot tfoot td {
  padding: 6px 10px;
  border-bottom: 1px solid #f0f3f6;
  white-space: nowrap;
}
.fyc-pivot tbody tr:last-child td { border-bottom: none; }

.fyc-pivot td.num,
.fyc-pivot td.total {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.fyc-pivot td.total {
  border-left: 1px solid var(--fyc-border);
  font-weight: 600;
}
.fyc-pivot td.neg { color: var(--fyc-coral); }
.fyc-pivot td.pos { color: var(--fyc-teal); }
.fyc-pivot td.zero { color: #bcc3cc; }

/* Branch rows (L1, L2, L3) */
.fyc-pivot-row--branch { cursor: pointer; }
.fyc-pivot-row--branch:hover td { background: #f8fafb; }

.fyc-pivot-row--d1 td {
  background: #eef3f9;
  font-weight: 700;
  color: var(--fyc-navy);
}
.fyc-pivot-row--d1:hover td { background: #e3ecf5; }

.fyc-pivot-row--d2 td { font-weight: 600; color: var(--fyc-text); }
.fyc-pivot-row--d3 td { color: var(--fyc-text); }
.fyc-pivot-row--d4 td { color: var(--fyc-text-mute); }

.fyc-pivot-toggle {
  display: inline-block;
  width: 10px;
  margin-right: 6px;
  color: var(--fyc-text-mute);
  font-size: 9px;
}
.fyc-pivot-label .label-text { vertical-align: middle; }
.fyc-pivot-row--d4 .fyc-pivot-label {
  /* spazio del toggle riservato anche per i leaf, per allineare le colonne */
  padding-left: 0;
}

/* Drill-through (solo celle leaf con valore non zero) */
.fyc-pivot td.drillable {
  cursor: pointer;
  text-decoration: underline dotted;
  text-underline-offset: 2px;
}
.fyc-pivot td.drillable:hover { background: #fff8e1; }

/* Footer row: saldo del periodo */
.fyc-pivot tfoot tr td {
  background: var(--fyc-navy);
  color: #fff;
  font-weight: 700;
  border-top: 2px solid var(--fyc-gold);
}
.fyc-pivot tfoot tr td.neg { color: #f3a89c; }
.fyc-pivot tfoot tr td.pos { color: #b4f0eb; }
.fyc-pivot tfoot tr td.total { color: var(--fyc-gold); font-size: 13px; }

/* Colonna "Totale" evidenziata (header + tutte le celle dati) */
.fyc-pivot th.col-totale,
.fyc-pivot td.col-totale {
  background: rgba(26, 58, 92, 0.07);
  border-left: 3px solid var(--fyc-gold);
  font-weight: 600;
}
.fyc-pivot th.col-totale {
  font-weight: 700;
  color: var(--fyc-navy);
}
/* Macro L1 e sub-macro L2: totale in grassetto pieno */
.fyc-pivot tr.fyc-pivot-row--d1 td.col-totale,
.fyc-pivot tr.fyc-pivot-row--d2 td.col-totale {
  font-weight: 700;
}
/* Riga "Saldo del periodo": cella Totale in oro pieno per max evidenza */
.fyc-pivot tfoot tr.saldo-periodo td.col-totale {
  background: var(--fyc-gold);
  color: var(--fyc-navy);
  font-weight: 800;
  font-size: 1.05em;
  border-left: 3px solid var(--fyc-gold);
}

/* ============================================================
   OIC 10 · Pivot mensile · fit a UNA FACCIATA su desktop
   ============================================================
   Quando la modalità attiva è "Pivot mensile" (toggle JS in
   client/03-flussi-oic10.html: setMode → body.classList.toggle
   .oic10-pivot-fullwidth) applichiamo:
   1. Label "Valori in €" SOPRA la tabella (dichiara l'unità una
      volta sola, le celle perdono il simbolo €).
   2. Breakout del max-width:1280px del .fyc-main → la pivot wrap
      occupa tutta la viewport con 8px di margine ciascun lato.
   3. Font 11px + padding compatto sulle celle.
   4. Colonna "Voce" con max-width + ellipsis (label completa nel
      title attribute, tooltip nativo al hover).
   Sotto ~1100px viewport (laptop piccoli, tablet, mobile) torniamo
   al layout standard + overflow-x:auto già su .fyc-pivot-wrap.
   ============================================================ */

.fyc-pivot-currency-note {
  font-size: 10.5px;
  color: var(--fyc-text-mute);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0 4px 6px;
  font-weight: 600;
}

/* (2) Breakout fullwidth · pattern "margin negativo + 50vw" che esce
   dal max-width:1280px del parent .fyc-main centrato. Funziona solo
   se il parent ha margin auto (vero per .fyc-main). */
body.oic10-pivot-fullwidth .fyc-pivot-wrap {
  margin-left: calc(50% - 50vw + 8px);
  margin-right: calc(50% - 50vw + 8px);
  max-width: none;
}

/* (3) Font + padding compatti SOLO in modalità pivot · le altre
   modalità (matrice, qc) NON sono toccate. */
body.oic10-pivot-fullwidth .fyc-pivot {
  font-size: 11px;
}
body.oic10-pivot-fullwidth .fyc-pivot thead th {
  padding: 6px 6px;
  font-size: 10px;
  letter-spacing: 0.04em;
}
body.oic10-pivot-fullwidth .fyc-pivot tbody td,
body.oic10-pivot-fullwidth .fyc-pivot tfoot td {
  padding: 4px 6px;
}

/* (4) Colonna "Voce" stretta con ellipsis · la label completa è nel
   title="..." attribute (tooltip nativo HTML, vedi renderBody JS).
   max-width 240px è un buon compromesso: vede ~30-35 char prima
   dell'ellissi, abbastanza per la maggioranza delle voci PDC OIC 10. */
body.oic10-pivot-fullwidth .fyc-pivot-label {
  max-width: 240px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.oic10-pivot-fullwidth .fyc-pivot-label .label-text {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}

/* Fallback su schermi stretti: ripristina layout standard.
   La .fyc-pivot-wrap ha già overflow:auto (linea ~568), quindi su
   viewport sotto soglia la pivot scrolla orizzontalmente invece
   di rompersi. Reset il breakout per riportare la pivot dentro
   il container e ricondurre font/padding a valori più leggibili. */
@media (max-width: 1100px) {
  body.oic10-pivot-fullwidth .fyc-pivot-wrap {
    margin-left: 0;
    margin-right: 0;
    max-width: 100%;
  }
  body.oic10-pivot-fullwidth .fyc-pivot {
    font-size: 12px;   /* torna al default per leggibilità su small */
  }
  body.oic10-pivot-fullwidth .fyc-pivot thead th {
    padding: 8px 10px;
    font-size: 11px;
  }
  body.oic10-pivot-fullwidth .fyc-pivot tbody td,
  body.oic10-pivot-fullwidth .fyc-pivot tfoot td {
    padding: 6px 10px;
  }
  body.oic10-pivot-fullwidth .fyc-pivot-label {
    max-width: none;       /* niente truncate · si va in scroll */
    white-space: nowrap;
  }
}

/* Separatore visivo tra gruppi di pill nei filtri (anni vs range rolling) */
.fyc-pill-sep {
  color: var(--fyc-border);
  padding: 0 6px;
  user-select: none;
  align-self: center;
  font-size: 14px;
}

/* Mini macro tiles */
.fyc-macros-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
  margin-bottom: 28px;
}
.fyc-macro-tile {
  background: var(--fyc-surface);
  border: 1px solid var(--fyc-border);
  border-radius: var(--fyc-radius);
  padding: 14px 16px;
  box-shadow: var(--fyc-shadow-sm);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.fyc-macro-tile h3 {
  margin: 0;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--fyc-text-mute);
  font-weight: 700;
}
.fyc-macro-tile .total-value {
  font-size: 20px;
  font-weight: 700;
  color: var(--fyc-navy);
  font-variant-numeric: tabular-nums;
}
.fyc-macro-tile .total-value.neg { color: var(--fyc-coral); }
.fyc-macro-tile .total-value.pos { color: var(--fyc-teal); }
.fyc-macro-tile .chart-host {
  position: relative;
  height: 110px;
  margin-top: 4px;
}
.fyc-macro-tile--excluded { opacity: 0.85; }
.fyc-macro-tile--excluded h3::after {
  content: ' · escluso dal saldo';
  font-weight: 500;
  text-transform: none;
  color: var(--fyc-text-mute);
  letter-spacing: 0;
}

/* Click-to-zoom: tile cliccabile apre modal grafico ingrandito */
.fyc-macro-tile--clickable {
  cursor: pointer;
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}
.fyc-macro-tile--clickable:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(26, 58, 92, 0.12);
}

/* =========================================================================
   View: Movimenti-lite (T_movimenti)
   ========================================================================= */

/* Barra filtri sticky · layout a 3 righe per dare aria al campo Cerca e
   per evitare che il dropdown CODPDC strabordi sulla colonna accanto. */
.fyc-mov-filters {
  position: sticky;
  top: 0;
  z-index: 5;
  background: var(--fyc-surface);
  border: 1px solid var(--fyc-border);
  border-radius: var(--fyc-radius);
  padding: 14px 16px;
  box-shadow: var(--fyc-shadow-sm);
  margin-bottom: 12px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Riga 1 (6 filtri principali): grid auto-fit responsive */
.fyc-mov-filters-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px 20px;          /* col-gap 20px per separare bene il dropdown CODPDC */
  align-items: end;
}

/* Riga 2 (cerca): full width, single column */
.fyc-mov-filters-row--search {
  grid-template-columns: 1fr;
}

/* Riga 3 (actions): flex right-aligned */
.fyc-mov-filters-row--actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.fyc-mov-filter {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.fyc-mov-filter > label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--fyc-text-mute);
}
.fyc-mov-filter input[type="date"],
.fyc-mov-filter input[type="text"],
.fyc-mov-filter input[type="number"] {
  border: 1px solid var(--fyc-border);
  border-radius: 6px;
  padding: 7px 10px;
  font-size: 13px;
  background: #fff;
  color: var(--fyc-text);
  font-family: inherit;
  min-width: 0;
  width: 100%;
}
.fyc-mov-filter input:focus {
  outline: none;
  border-color: var(--fyc-navy);
  box-shadow: 0 0 0 2px rgba(26, 58, 92, 0.12);
}
.fyc-mov-filter-pills {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}

/* Bottoni filtri */
.fyc-btn {
  background: var(--fyc-navy);
  color: #fff;
  border: 1px solid var(--fyc-navy);
  padding: 7px 14px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
}
.fyc-btn:hover { background: var(--fyc-navy-dark); }
.fyc-btn--ghost {
  background: transparent;
  color: var(--fyc-text);
  border-color: var(--fyc-border);
  font-weight: 500;
}
.fyc-btn--ghost:hover { background: #f4f6f8; }

/* Dropdown CODPDC multi-select via <details> */
.fyc-mov-codpdc {
  position: relative;
}
.fyc-mov-codpdc summary {
  list-style: none;
  cursor: pointer;
  border: 1px solid var(--fyc-border);
  border-radius: 6px;
  padding: 7px 10px;
  font-size: 13px;
  background: #fff;
  color: var(--fyc-text);
  display: flex;
  align-items: center;
  justify-content: space-between;
  user-select: none;
}
.fyc-mov-codpdc summary::-webkit-details-marker { display: none; }
.fyc-mov-codpdc summary::after {
  content: '▾';
  color: var(--fyc-text-mute);
  font-size: 11px;
  margin-left: 6px;
}
.fyc-mov-codpdc[open] summary::after { content: '▴'; }
.fyc-mov-codpdc[open] summary { border-color: var(--fyc-navy); }

.fyc-mov-codpdc-panel {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  /* Niente right: 0 / min-width: 320px: causavano overflow sulla colonna
     adiacente (campo Cerca). Ora la larghezza è almeno quella del summary
     ma può espandersi fino a 360px se serve, con ellipsis sulle voci. */
  width: max(100%, 260px);
  max-width: 360px;
  z-index: 20;
  background: #fff;
  border: 1px solid var(--fyc-border);
  border-radius: 6px;
  max-height: 320px;
  overflow-y: auto;
  box-shadow: var(--fyc-shadow-lg);
  padding: 6px;
}
.fyc-mov-codpdc-panel .toolbar {
  display: flex;
  justify-content: space-between;
  padding: 4px 6px 8px;
  border-bottom: 1px solid var(--fyc-border);
  font-size: 12px;
}
.fyc-mov-codpdc-panel .toolbar a {
  color: var(--fyc-navy);
  cursor: pointer;
  text-decoration: underline;
}
.fyc-mov-codpdc-panel label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 8px;
  font-size: 12.5px;
  border-radius: 4px;
  cursor: pointer;
  overflow: hidden;             /* contiene l'ellipsis del child */
}
.fyc-mov-codpdc-panel label:hover { background: #f4f6f8; }
.fyc-mov-codpdc-panel label .pdc-code {
  font-family: ui-monospace, "SF Mono", Consolas, monospace;
  font-size: 11.5px;
  color: var(--fyc-navy);
  background: #eef2f6;
  padding: 1px 6px;
  border-radius: 3px;
  flex-shrink: 0;
}
.fyc-mov-codpdc-panel label .pdc-label {
  flex: 1 1 auto;
  min-width: 0;                 /* permette al testo di ridursi/ellipsizzare */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Breadcrumb dei filtri attivi */
.fyc-mov-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 16px;
  font-size: 13px;
  color: var(--fyc-text-mute);
}
.fyc-mov-breadcrumb .label {
  font-weight: 600;
  color: var(--fyc-text);
  margin-right: 4px;
}
.fyc-mov-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--fyc-surface);
  border: 1px solid var(--fyc-border);
  border-radius: 999px;
  padding: 3px 10px;
  font-size: 12px;
  color: var(--fyc-text);
}
.fyc-mov-chip strong { font-weight: 600; }

/* Paginazione */
.fyc-mov-pagination {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 0 4px;
  gap: 12px;
  flex-wrap: wrap;
}
.fyc-mov-pagination .pages {
  font-size: 13px;
  color: var(--fyc-text-mute);
}
.fyc-mov-pagination .pages strong {
  color: var(--fyc-text);
  font-weight: 600;
}
.fyc-mov-pagination .nav {
  display: flex;
  gap: 8px;
  align-items: center;
}

/* Pulsanti tabella header (per sort) */
.fyc-table th.sortable {
  cursor: pointer;
  user-select: none;
}
.fyc-table th.sortable::after {
  content: ' \2195';   /* ↕ */
  opacity: 0.4;
  font-size: 10px;
}
.fyc-table th.sortable.sort-desc::after {
  content: ' \25BE';   /* ▾ */
  opacity: 0.9;
}
.fyc-table th.sortable.sort-asc::after {
  content: ' \25B4';   /* ▴ */
  opacity: 0.9;
}

/* Pulsante CSV */
.fyc-mov-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 12px;
}

/* =========================================================================
   View: AI Chat (T_chat)
   ========================================================================= */

.fyc-chat-container {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 60vh;
}

/* Box messaggi scrollabile · scrolla internamente, non l'intera pagina */
.fyc-chat-messages {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 16px;
  background: var(--fyc-surface);
  border: 1px solid var(--fyc-border);
  border-radius: var(--fyc-radius);
  box-shadow: var(--fyc-shadow-sm);
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 360px;
  max-height: calc(100vh - 360px);
  scroll-behavior: smooth;
}
@media (max-width: 640px) {
  .fyc-chat-messages { max-height: calc(100vh - 420px); min-height: 280px; }
}

/* Welcome state · centrato, prompts pill */
.fyc-chat-welcome {
  margin: auto;
  padding: 20px 8px;
  text-align: center;
  max-width: 720px;
}
.fyc-chat-welcome h3 {
  margin: 0 0 6px;
  font-size: 18px;
  color: var(--fyc-navy);
}
.fyc-chat-welcome p {
  margin: 0 0 20px;
  font-size: 13.5px;
  color: var(--fyc-text-mute);
}
.fyc-chat-suggestions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 8px;
}
.fyc-chat-suggestion {
  text-align: left;
  padding: 10px 14px;
  background: #fff;
  border: 1px solid var(--fyc-border);
  border-radius: 10px;
  font-size: 13px;
  color: var(--fyc-text);
  cursor: pointer;
  font-family: inherit;
  line-height: 1.4;
  transition: border-color 0.12s ease, background 0.12s ease, transform 0.12s ease;
}
.fyc-chat-suggestion:hover {
  border-color: var(--fyc-navy);
  background: #f7f9fc;
  transform: translateY(-1px);
}

/* Bubbles */
.fyc-chat-msg {
  display: flex;
  gap: 10px;
  max-width: 88%;
  align-items: flex-start;
}
.fyc-chat-msg .avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  flex-shrink: 0;
  background: #eef2f6;
  object-fit: cover;
}
.fyc-chat-msg .bubble {
  padding: 10px 14px;
  border-radius: 12px;
  line-height: 1.5;
  font-size: 14px;
  white-space: pre-wrap;
  word-wrap: break-word;
  overflow-wrap: anywhere;
}

.fyc-chat-msg--user {
  align-self: flex-end;
  flex-direction: row-reverse;
}
.fyc-chat-msg--user .bubble {
  background: var(--fyc-navy);
  color: #fff;
  border-bottom-right-radius: 3px;
}

.fyc-chat-msg--assistant {
  align-self: flex-start;
}
.fyc-chat-msg--assistant .avatar {
  background: linear-gradient(135deg, var(--fyc-gold), #b8902b);
  padding: 4px;
}
.fyc-chat-msg--assistant .bubble {
  background: #eef2f6;
  color: var(--fyc-navy);
  border-bottom-left-radius: 3px;
}

.fyc-chat-msg--error {
  align-self: center;
  max-width: 90%;
}
.fyc-chat-msg--error .bubble {
  background: #fef2f0;
  color: var(--fyc-coral);
  border: 1px solid #f6c4bd;
  font-size: 13px;
}

/* Citation chip nei messaggi assistant */
.fyc-chat-citation {
  color: var(--fyc-navy);
  text-decoration: underline dotted;
  text-underline-offset: 2px;
  cursor: pointer;
  font-weight: 600;
}
.fyc-chat-citation:hover {
  background: #fff8e1;
  border-radius: 3px;
  padding: 0 2px;
}

/* Typing dots */
.fyc-chat-typing {
  display: inline-flex;
  gap: 4px;
  padding: 4px 0;
  align-items: center;
}
.fyc-chat-typing > span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--fyc-navy);
  opacity: 0.4;
  animation: fyc-chat-bounce 1.4s infinite ease-in-out both;
}
.fyc-chat-typing > span:nth-child(2) { animation-delay: 0.18s; }
.fyc-chat-typing > span:nth-child(3) { animation-delay: 0.36s; }
@keyframes fyc-chat-bounce {
  0%, 80%, 100% { transform: translateY(0); opacity: 0.4; }
  40%          { transform: translateY(-5px); opacity: 1; }
}

/* Input area */
.fyc-chat-input {
  display: flex;
  gap: 8px;
  align-items: flex-end;
  background: var(--fyc-surface);
  border: 1px solid var(--fyc-border);
  border-radius: var(--fyc-radius);
  padding: 10px 12px;
  box-shadow: var(--fyc-shadow-sm);
}
.fyc-chat-input textarea {
  flex: 1 1 auto;
  border: 0;
  outline: 0;
  background: transparent;
  font-family: inherit;
  font-size: 14px;
  color: var(--fyc-text);
  resize: none;
  min-height: 24px;
  max-height: 160px;
  line-height: 1.4;
  padding: 6px 4px;
}
.fyc-chat-input textarea::placeholder { color: var(--fyc-text-mute); }
.fyc-chat-input .send-btn {
  background: var(--fyc-navy);
  color: #fff;
  border: 0;
  padding: 8px 16px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
}
.fyc-chat-input .send-btn:hover { background: var(--fyc-navy-dark); }
.fyc-chat-input .send-btn:disabled {
  background: var(--fyc-border);
  color: var(--fyc-text-mute);
  cursor: not-allowed;
}
.fyc-chat-input .clear-btn {
  background: transparent;
  color: var(--fyc-text-mute);
  border: 1px solid var(--fyc-border);
  width: 38px;
  height: 38px;
  border-radius: 8px;
  font-size: 16px;
  cursor: pointer;
  font-family: inherit;
}
.fyc-chat-input .clear-btn:hover { background: #f4f6f8; color: var(--fyc-coral); }

.fyc-chat-footer-hint {
  font-size: 11px;
  color: var(--fyc-text-mute);
  text-align: center;
  margin-top: 4px;
}
.fyc-chat-footer-hint kbd {
  background: #eef2f6;
  border: 1px solid var(--fyc-border);
  border-radius: 3px;
  padding: 0 4px;
  font-family: ui-monospace, "SF Mono", Consolas, monospace;
  font-size: 10px;
}

/* Chart inline nelle risposte dell'assistant */
.fyc-chat-chart {
  max-width: 480px;
  margin-top: 12px;
  background: #fff;
  border: 1px solid var(--fyc-border);
  border-radius: 8px;
  padding: 12px;
  box-shadow: var(--fyc-shadow-sm);
}
.fyc-chat-chart-title {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--fyc-text-mute);
  margin-bottom: 8px;
}
.fyc-chat-chart-canvas {
  position: relative;
  height: 240px;
}
.fyc-chat-chart-canvas canvas {
  max-width: 100%;
}

/* Print button discreto sulle bubble assistant */
.fyc-chat-msg .bubble { position: relative; }
.fyc-chat-msg--assistant .bubble { padding-right: 70px; }
.fyc-chat-print-btn {
  position: absolute;
  top: 6px;
  right: 8px;
  background: transparent;
  border: 0;
  font-size: 11px;
  padding: 2px 8px;
  color: var(--fyc-text-mute);
  cursor: pointer;
  border-radius: 4px;
  opacity: 0.5;
  font-family: inherit;
  transition: opacity 0.15s ease, background 0.15s ease, color 0.15s ease;
}
.fyc-chat-print-btn:hover {
  opacity: 1;
  background: rgba(26, 58, 92, 0.08);
  color: var(--fyc-navy);
}
.fyc-chat-msg--assistant:hover .fyc-chat-print-btn { opacity: 0.85; }

/* Chart cliccabile per zoom modal */
.fyc-chat-msg--assistant .fyc-chat-chart {
  cursor: zoom-in;
  transition: box-shadow 0.15s ease, transform 0.15s ease;
}
.fyc-chat-msg--assistant .fyc-chat-chart:hover {
  box-shadow: var(--fyc-shadow-md);
  transform: translateY(-1px);
}

/* Modal lightbox per zoom grafico */
.fyc-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.75);
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  animation: fyc-modal-fade 0.18s ease;
}
@keyframes fyc-modal-fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.fyc-modal {
  position: relative;
  background: #fff;
  border-radius: 12px;
  padding: 24px;
  width: min(1200px, 95vw);
  max-height: 95vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.4);
}
.fyc-modal-close {
  position: absolute;
  top: 10px;
  right: 12px;
  background: transparent;
  border: 0;
  font-size: 24px;
  line-height: 1;
  padding: 4px 10px;
  border-radius: 6px;
  color: var(--fyc-text-mute);
  cursor: pointer;
  font-family: inherit;
}
.fyc-modal-close:hover { background: #f4f6f8; color: var(--fyc-coral); }
.fyc-modal-title {
  margin: 0 36px 16px 0;
  font-size: 16px;
  font-weight: 700;
  color: var(--fyc-navy);
  letter-spacing: 0.02em;
}
.fyc-modal-chart {
  position: relative;
  flex: 1 1 auto;
  height: 60vh;
  max-height: 600px;
  min-height: 320px;
}
.fyc-modal-chart canvas { max-width: 100%; max-height: 100%; }
.fyc-modal-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 16px;
  gap: 8px;
}
@media (max-width: 640px) {
  .fyc-modal { padding: 16px; width: 95vw; max-height: 90vh; }
  .fyc-modal-chart { height: 55vh; min-height: 240px; }
  .fyc-modal-title { font-size: 14px; }
}

/* Bar di toggle "Vedi domande suggerite" tra messaggi e input */
.fyc-chat-suggestions-bar {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
}
.fyc-chat-toggle-suggestions {
  background: transparent;
  border: 1px solid var(--fyc-border);
  border-radius: 999px;
  padding: 5px 14px;
  font-size: 12px;
  color: var(--fyc-text-mute);
  cursor: pointer;
  font-family: inherit;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}
.fyc-chat-toggle-suggestions:hover {
  background: #f4f6f8;
  border-color: var(--fyc-navy);
  color: var(--fyc-text);
}
/* Wrapper delle pill nel bar toggle (separato dal welcome) */
.fyc-chat-suggestions-bar .fyc-chat-suggestions {
  width: 100%;
}

/* =========================================================================
   View: Flusso Operativo (T6)
   ========================================================================= */

/* Hub: gauge a sinistra, 3 KPI card a destra */
.fyc-flusso-hub {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 20px;
  margin-bottom: 24px;
}
@media (max-width: 820px) {
  .fyc-flusso-hub { grid-template-columns: 1fr; }
}

.fyc-gauge-card {
  background: var(--fyc-surface);
  border: 1px solid var(--fyc-border);
  border-radius: var(--fyc-radius);
  box-shadow: var(--fyc-shadow-sm);
  padding: 24px 24px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
.fyc-gauge-svg {
  width: 100%;
  max-width: 360px;
  height: auto;
  display: block;
}
/*
  Needle: animiamo gli attributi geometrici SVG x2/y2 come proprietà CSS
  (SVG2: supportato in Chrome 77+, Firefox 72+, Safari 16+). In browser
  più vecchi degrada elegantemente a snap senza animazione.

  IMPORTANTE: NON usare `transform-origin` / `transform-box` qui.
  In passato la rotazione con SVG `transform="rotate(angle cx cy)"`
  veniva interpretata come CSS transform e la transform-origin
  CSS sovrascriveva il pivot esplicito, mandando il needle fuori arco.
*/
.fyc-gauge-svg #gaugeNeedle {
  transition: x2 0.6s cubic-bezier(.16, 1, .3, 1),
              y2 0.6s cubic-bezier(.16, 1, .3, 1);
}
.fyc-gauge-value {
  font-size: 34px;
  font-weight: 800;
  color: var(--fyc-navy);
  letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
  margin-top: -6px;
}
.fyc-gauge-value.neg { color: var(--fyc-coral); }
.fyc-gauge-value.pos { color: var(--fyc-teal); }
.fyc-gauge-sub {
  font-size: 13px;
  color: var(--fyc-text-mute);
  margin-bottom: 6px;
}
.fyc-gauge-extras {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  justify-content: center;
  font-size: 12px;
  color: var(--fyc-text-mute);
}
.fyc-gauge-extras strong {
  color: var(--fyc-text);
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

.fyc-flusso-aside {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.fyc-flusso-aside .fyc-kpi { padding: 14px 16px; }
.fyc-flusso-aside .fyc-kpi .value { font-size: 22px; }
.fyc-flusso-aside .fyc-kpi .delta { font-size: 11px; }

/*
  Ritorno operativo cumulato YTD · chart 3-year (v1.2).
  Sostituisce il vecchio gauge tachimetro in .fyc-flusso-hub. Le dimensioni
  e il padding ricalcano .fyc-gauge-card per preservare l'altezza dell'hub.
*/
.fyc-cum-chart-card {
  background: var(--fyc-surface);
  border: 1px solid var(--fyc-border);
  border-radius: var(--fyc-radius);
  box-shadow: var(--fyc-shadow-sm);
  padding: 20px 22px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 360px;
}
.fyc-cum-chart-card .fyc-cum-title {
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--fyc-text);
  font-weight: 700;
  margin: 0;
}
.fyc-cum-chart-card .fyc-cum-toggles {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.fyc-cum-chart-card .fyc-cum-toggles .fyc-pill {
  padding-left: 8px;   /* spazio per la barretta colore */
}
.fyc-cum-chart-card .fyc-cum-chart-wrap {
  position: relative;
  flex: 1;
  min-height: 260px;
}

/* Toggle granularità */
.fyc-chart-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.fyc-chart-toolbar .title {
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--fyc-text-mute);
  font-weight: 700;
}

/* Top 10 table (riusa .fyc-table) — solo qualche ritocco */
.fyc-pct-bar {
  display: inline-block;
  height: 6px;
  background: linear-gradient(90deg, var(--fyc-navy), var(--fyc-gold));
  border-radius: 3px;
  vertical-align: middle;
  margin-right: 6px;
}
.fyc-pct-bar-wrap {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 120px;
}

/* =========================================================================
   Tipografia delle risposte AI nella chat (anche su schermo, NON solo stampa).
   Le AI emettono markdown (## heading, - bullet, **bold**) che il
   frontend converte in HTML strutturato dentro .ai-content. Senza
   queste regole il render appare appiccicato.
   ========================================================================= */
.fyc-chat-msg--assistant .ai-content p { margin: 0.6em 0; }
.fyc-chat-msg--assistant .ai-content p:first-child { margin-top: 0; }
.fyc-chat-msg--assistant .ai-content p:last-child  { margin-bottom: 0; }
.fyc-chat-msg--assistant .ai-content ul,
.fyc-chat-msg--assistant .ai-content ol {
  margin: 0.6em 0;
  padding-left: 1.6em;
}
.fyc-chat-msg--assistant .ai-content li { margin: 0.25em 0; }
.fyc-chat-msg--assistant .ai-content h2 {
  font-size: 1.15em;
  font-weight: 700;
  color: var(--fyc-navy);
  margin: 1em 0 0.5em;
}
.fyc-chat-msg--assistant .ai-content h3 {
  font-size: 1.05em;
  font-weight: 600;
  color: var(--fyc-navy);
  margin: 0.8em 0 0.4em;
}
.fyc-chat-msg--assistant .ai-content strong { color: var(--fyc-navy); }

/* =========================================================================
   Print mode (chat response print + chart-only landscape print)
   Attivata da JS che inietta .print-area nel body + body.print-mode.
   Per la stampa chart-only viene anche iniettato dinamicamente uno
   <style> con `@page { size: A4 landscape; ... }` rimosso a fine stampa.
   ========================================================================= */
@media print {
  /* Nasconde TUTTO tranne la print-area */
  body * { visibility: hidden; }
  .print-area, .print-area * { visibility: visible; }

  .print-area {
    position: absolute;
    left: 0; top: 0;
    width: 100%;
    max-width: 18cm !important;
    margin: 0 auto !important;
    padding: 24px 24px 60px !important;
    font-family: Georgia, serif !important;
    font-size: 11pt !important;
    line-height: 1.7 !important;
    color: #1f2937 !important;
  }

  /* Header */
  .print-header {
    border-bottom: 2px solid #1a3a5c;
    padding-bottom: 12px;
    margin-bottom: 32px !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .print-header img { height: 40px; }
  .print-header .cliente { font-size: 14pt; font-weight: 600; color: #1a3a5c; }
  .print-header .data    { font-size: 9pt;  color: #94a3b8; }

  /* Body: tipografia leggibile e respiro */
  .print-body { font-family: Georgia, serif; }
  .print-body .domanda {
    background: #f1f5f9;
    padding: 12px 16px;
    border-left: 3px solid #d4af37;
    margin: 16px 0 24px;
    font-style: italic;
  }
  .print-body .risposta { margin: 16px 0; }

  /* Paragrafi, liste, heading dentro .print-area */
  .print-area p {
    margin: 0.8em 0 !important;
    text-align: justify !important;
    hyphens: auto !important;
    orphans: 3 !important;
    widows: 3 !important;
  }
  .print-area ul,
  .print-area ol {
    margin: 0.8em 0 !important;
    padding-left: 1.8em !important;
  }
  .print-area li { margin: 0.4em 0 !important; }

  .print-area h1,
  .print-area h2 {
    color: #1a3a5c !important;
    font-weight: 700 !important;
    margin-top: 1.4em !important;
    margin-bottom: 0.6em !important;
    page-break-after: avoid !important;
    border-bottom: 1px solid #e5e7eb !important;
    padding-bottom: 6px !important;
  }
  .print-area h1 { font-size: 18pt !important; }
  .print-area h2 { font-size: 14pt !important; }
  .print-area h3 {
    color: #1a3a5c !important;
    font-weight: 600 !important;
    font-size: 12pt !important;
    margin-top: 1em !important;
    margin-bottom: 0.4em !important;
    page-break-after: avoid !important;
  }
  /* Heading immediatamente seguito da contenuto → meno gap */
  .print-area h2 + p,
  .print-area h2 + ul,
  .print-area h2 + ol,
  .print-area h3 + p,
  .print-area h3 + ul,
  .print-area h3 + ol { margin-top: 0.4em !important; }

  /* Citazioni CODPDC in stampa: navy bold senza underline (anteprima pulita) */
  .print-area a {
    color: #1a3a5c !important;
    text-decoration: none !important;
    font-weight: 600 !important;
  }

  /* Bold/strong sempre in navy per coerenza visiva */
  .print-area strong,
  .print-area b { color: #1a3a5c !important; font-weight: 700 !important; }

  /* Grafico inline nel testo: container con titolo + img.chart-print */
  .fyc-print-chart-block {
    page-break-inside: avoid !important;
    margin: 1.2em auto !important;
    text-align: center !important;
  }
  .fyc-print-chart-title {
    font-family: Georgia, serif !important;
    font-size: 10pt !important;
    color: #6b7280 !important;
    margin-bottom: 6px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
  }
  .print-area canvas,
  .print-area img.chart-print {
    page-break-inside: avoid !important;
    max-width: 100% !important;
    max-height: 350px !important;
    margin: 0 auto !important;
    display: block !important;
  }

  /* Variante landscape per la stampa singolo grafico:
     l'altezza max viene rilassata per sfruttare l'A4 girato. */
  .print-area--chart-landscape img.chart-print {
    max-height: 15cm !important;
    max-width: 25cm !important;
    margin: 24px auto !important;
  }

  /* Footer */
  .print-footer {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    border-top: 1px solid #e5e7eb;
    padding: 16px 24px 8px !important;
    font-size: 8pt;
    color: #94a3b8;
    text-align: center;
  }

  .print-area { page-break-after: always; }

  /* Nasconde i bottoni di stampa stessi (in caso fossero ancora visibili) */
  .btn-stampa,
  .fyc-chat-print-btn { display: none !important; }
}

/* =========================================================================
   T1 Saldi v1.1 · estensione visuale
   - Banner SCD2 alert
   - Strip KPI hero (5 card)
   - Card BA1/BA2/CONS arricchite (header semaforo, sottotitolo, mini-gauge, sparkline)
   - Mini-tabella mensile + bottoni secondari
   - Sezione "Rischio fido" (contatori, heatmap, eventi)
   - FAB Esporta PDF
   ========================================================================= */

/* --- Banner alerts SCD2 --- */
.fyc-alert-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #eef4fb;
  border: 1px solid #bfd4ed;
  border-left: 4px solid var(--fyc-navy);
  color: var(--fyc-navy);
  padding: 10px 14px;
  border-radius: var(--fyc-radius);
  margin-bottom: 16px;
  font-size: 13px;
}
.fyc-alert-icon { font-size: 18px; line-height: 1; }
.fyc-alert-text { flex: 1 1 auto; }
.fyc-alert-close {
  background: transparent; border: 0;
  color: var(--fyc-text-mute);
  font-size: 18px; line-height: 1; padding: 4px 8px;
  cursor: pointer; border-radius: 4px;
}
.fyc-alert-close:hover { background: rgba(0,0,0,0.06); color: var(--fyc-text); }

/* --- Strip KPI hero --- */
.fyc-hero-toggle {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.fyc-hero-toggle-label {
  font-size: 11px; font-weight: 700; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--fyc-text-mute);
  margin-right: 4px;
}
.fyc-hero-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}
.fyc-hero-kpi {
  position: relative;
  background: var(--fyc-surface);
  border: 1px solid var(--fyc-border);
  border-radius: var(--fyc-radius);
  padding: 14px 16px;
  display: flex; flex-direction: column; gap: 4px;
  box-shadow: var(--fyc-shadow-sm);
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.fyc-hero-kpi .label {
  font-size: 11px; font-weight: 700; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--fyc-text-mute);
}
.fyc-hero-kpi .value {
  font-size: 24px; font-weight: 800; color: var(--fyc-navy);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}
.fyc-hero-kpi .value.neg { color: var(--fyc-coral); }
.fyc-hero-kpi .value.warn { color: var(--fyc-gold); }
.fyc-hero-kpi .value.pos { color: var(--fyc-teal); }
.fyc-hero-kpi .sub {
  font-size: 11px; color: var(--fyc-text-mute);
}
.fyc-hero-kpi--clickable { cursor: pointer; }
.fyc-hero-kpi--clickable:hover {
  transform: translateY(-1px);
  box-shadow: var(--fyc-shadow-md);
  border-color: var(--fyc-navy);
}
.fyc-hero-kpi--link { text-decoration: none; color: inherit; }
.fyc-hero-kpi--link:hover {
  text-decoration: none;
  transform: translateY(-1px);
  box-shadow: var(--fyc-shadow-md);
  border-color: var(--fyc-navy);
}

/* --- Card BA1/BA2/CONS arricchite --- */
.fyc-kpi-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 4px;
}
.fyc-kpi-subtitle {
  font-size: 11px; color: var(--fyc-text-mute);
  margin: 2px 0 8px;
  font-family: ui-monospace, "SF Mono", Consolas, monospace;
}

/* --- Mini-gauge --- */
.fyc-mini-gauge {
  position: relative;
  height: 8px;
  background: var(--fyc-border);
  border-radius: 4px;
  overflow: hidden;
  margin: 10px 0 6px;
}
.fyc-mini-gauge-bar {
  height: 100%;
  background: linear-gradient(to right,
    var(--fyc-teal) 0%,
    var(--fyc-gold) 22%,
    #e8a447 75%,
    var(--fyc-coral) 100%);
  transition: width 0.4s ease;
}
.fyc-mini-gauge-marker {
  position: absolute; top: -2px;
  width: 2px; height: 12px;
  background: #fff;
  /* Bordo nero esterno + ombra: ben visibile anche su sfondo arancione (B.3) */
  box-shadow: 0 0 0 1px rgba(0,0,0,0.6), 0 1px 2px rgba(0,0,0,0.4);
}
.fyc-mini-gauge--overflow .fyc-mini-gauge-bar {
  background: repeating-linear-gradient(45deg,
    var(--fyc-coral),
    var(--fyc-coral) 6px,
    #b3392b 6px,
    #b3392b 12px);
  animation: fyc-pulse 1.5s infinite;
}
@keyframes fyc-pulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.7; }
}

/* --- Sparkline 30gg --- */
.fyc-sparkline {
  width: 100%; height: 28px; margin-top: 8px;
  display: block;
}
.fyc-sparkline polyline {
  fill: none;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.fyc-sparkline-bg {
  fill: rgba(26,58,92,0.05);
  stroke: none;
}

/* --- Pulsanti toolbar secondari (mensile, CSV, ecc.) --- */
.fyc-mensile-toolbar,
.fyc-section-toolbar {
  display: flex; justify-content: space-between; align-items: center;
  margin: 24px 0 12px;
  gap: 12px;
  flex-wrap: wrap;
}
.fyc-mensile-toolbar .fyc-section-title,
.fyc-section-toolbar .fyc-section-title { margin: 0; }
.fyc-btn-secondary {
  background: transparent;
  color: var(--fyc-navy);
  border: 1px solid var(--fyc-border);
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
}
.fyc-btn-secondary:hover {
  background: #f4f6f8;
  border-color: var(--fyc-navy);
}

/* --- Bottone "📥 Stampa PDF" · export tecnico autosufficiente (T3/T6) --- */
.fyc-btn-pdf {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  background: var(--fyc-navy);
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 12.5px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease,
              transform 0.15s ease, box-shadow 0.15s ease;
}
.fyc-btn-pdf:hover {
  background: var(--fyc-gold);
  color: var(--fyc-navy);
  transform: translateY(-1px);
  box-shadow: 0 3px 8px rgba(26, 58, 92, 0.2);
}
.fyc-btn-pdf:disabled { opacity: 0.4; cursor: not-allowed; }

/* --- Tabella mensile · variante più compatta --- */
.fyc-table--mensile th,
.fyc-table--mensile td { font-size: 12.5px; padding: 8px 12px; }
.fyc-table--mensile tfoot td {
  font-weight: 700; background: #f9fafb;
  color: var(--fyc-navy);
  border-top: 2px solid var(--fyc-border);
}
.fyc-cell-warning {
  background: rgba(226,108,90,0.10);
  color: var(--fyc-coral);
  font-weight: 600;
}

/* --- Sezione rischio fido --- */
.fyc-rischio-counters {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}
.fyc-rischio-counter {
  position: relative;
  background: var(--fyc-surface);
  border: 1px solid var(--fyc-border);
  border-radius: var(--fyc-radius);
  padding: 16px 18px;
  display: flex; flex-direction: column; gap: 4px;
  box-shadow: var(--fyc-shadow-sm);
}
.fyc-rischio-counter .label {
  font-size: 11px; font-weight: 700; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--fyc-text-mute);
}
.fyc-rischio-counter .value {
  font-size: 28px; font-weight: 800; font-variant-numeric: tabular-nums;
  color: var(--fyc-navy);
}
.fyc-rischio-counter .sub { font-size: 11px; color: var(--fyc-text-mute); }
.fyc-rischio-counter--giallo { border-left: 4px solid var(--fyc-gold); }
.fyc-rischio-counter--giallo .value { color: #b8902b; }
.fyc-rischio-counter--rosso  { border-left: 4px solid var(--fyc-coral); }
.fyc-rischio-counter--rosso .value { color: var(--fyc-coral); }

/* =========================================================================
   Heat-map calendar style GitHub-style · v1.1 polish step 5 (redesign)
   - Modello standard: 7 righe (giorni settimana, lun→dom) × ~53 colonne
     (settimane). Tutti i 365 giorni visibili in un colpo d'occhio in una
     fascia orizzontale di ~90-100px di altezza.
   - Mantenuti tooltip nativo, zoom hover, scala di rischio.
   ========================================================================= */
.fyc-heatmap-wrap {
  width: 100%;
  max-width: 720px;
  margin: 0 auto;
  padding: 4px 0;
}
.fyc-heatmap-title {
  font-size: 12px;
  color: var(--fyc-text-mute);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin: 0 0 12px 0;
  font-weight: 600;
}

/* Layout interno: piccola colonna etichette giorni + grid principale */
.fyc-heatmap-container {
  display: grid;
  grid-template-columns: 16px 1fr;
  gap: 4px;
  align-items: start;
}

/* Header mesi (sopra la griglia) */
.fyc-heatmap-months {
  grid-column: 2;
  display: grid;
  font-size: 9px;
  color: var(--fyc-text-mute);
  margin-bottom: 3px;
  height: 12px;
}
.fyc-heatmap-month-label {
  font-weight: 500;
}

/* Etichette giorni della settimana (sinistra della griglia) */
.fyc-heatmap-days {
  grid-column: 1;
  grid-row: 2;
  display: grid;
  grid-template-rows: repeat(7, 1fr);
  font-size: 9px;
  color: var(--fyc-text-mute);
  align-items: center;
}

/* Griglia calendar: 7 righe (giorni settimana) × N colonne (settimane) */
.fyc-heatmap-grid {
  grid-column: 2;
  grid-row: 2;
  display: grid;
  grid-template-rows: repeat(7, 1fr);
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  gap: 2px;
  aspect-ratio: 53 / 7;
}
.fyc-heatmap-cell {
  aspect-ratio: 1 / 1;
  border-radius: 1px;
  transition: transform 0.12s ease, box-shadow 0.12s ease;
  cursor: help;
}
.fyc-heatmap-cell:hover {
  transform: scale(2.8);
  z-index: 10;
  position: relative;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
  border-radius: 2px;
}
.fyc-heatmap-cell--empty       { background: transparent; cursor: default; }
.fyc-heatmap-cell--empty:hover { transform: none; box-shadow: none; }
.fyc-heatmap-cell--safe        { background: #e8f5e8; }
.fyc-heatmap-cell--attenzione  { background: #fff4d4; }
.fyc-heatmap-cell--allerta     { background: #ffd9a8; }
.fyc-heatmap-cell--sconfino    { background: #ffb3b3; }

/* Legenda compatta · gradient "Meno → Più rischio" */
.fyc-heatmap-legend {
  display: flex;
  gap: 10px;
  margin-top: 10px;
  font-size: 10px;
  color: var(--fyc-text-mute);
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}
.fyc-heatmap-legend-scale {
  display: flex;
  gap: 2px;
  align-items: center;
}
.fyc-heatmap-legend-scale .dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border: 0.5px solid var(--fyc-border);
}
.fyc-heatmap-legend-text {
  color: var(--fyc-text-mute);
  margin-left: 8px;
}

/* Mobile */
@media (max-width: 768px) {
  .fyc-heatmap-wrap { max-width: 100%; }
  .fyc-heatmap-cell:hover { transform: none; box-shadow: none; }
  .fyc-heatmap-legend { justify-content: flex-start; font-size: 9px; }
}

/* --- Tabella eventi critici --- */
.fyc-table--eventi td { font-size: 12.5px; }

/* Badge "CR" inline: sconfino oltre fido (util > 100%) → segnalato in
   Centrale Rischi Banca d'Italia. Vedi disclaimer giuridico sotto. */
.fyc-cr-flag {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 5px;
  background: var(--fyc-coral);
  color: #fff;
  font-size: 9px;
  font-weight: 600;
  border-radius: 3px;
  cursor: help;
  vertical-align: middle;
  letter-spacing: 0.3px;
}

/* Disclaimer giuridico sotto la tabella eventi: aggancio ad art. 2086 c.c.
   e Codice della Crisi · contesto utile al commercialista. */
.fyc-eventi-disclaimer {
  margin: 12px 0 0 0;
  padding: 10px 14px;
  background: rgba(226, 108, 90, 0.08);
  border-left: 3px solid var(--fyc-coral);
  border-radius: 4px;
  font-size: 12px;
  color: var(--fyc-text-mute);
  font-style: italic;
  line-height: 1.5;
}

.fyc-success-message {
  background: #e8f5e8;
  border: 1px solid #c1e0c1;
  color: #1f8a4f;
  padding: 12px 16px;
  border-radius: var(--fyc-radius);
  font-size: 13px;
  margin-bottom: 12px;
}

/* --- FAB Esporta PDF --- */
.fyc-pdf-fab {
  position: fixed;
  bottom: 24px; right: 24px;
  z-index: 100;
  background: var(--fyc-navy);
  color: #fff;
  border: 0;
  border-radius: 24px;
  padding: 12px 18px;
  box-shadow: var(--fyc-shadow-lg);
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  font-family: inherit;
  display: inline-flex; align-items: center; gap: 8px;
}
.fyc-pdf-fab:hover { background: var(--fyc-navy-dark); }
.fyc-pdf-fab:disabled { opacity: 0.6; cursor: wait; }

/* --- Modal metodologia (riusa pattern .fyc-modal-overlay già definito) --- */
.fyc-modal-body {
  font-size: 13px;
  line-height: 1.55;
  color: var(--fyc-text);
  max-height: 60vh;
  overflow-y: auto;
}
.fyc-modal-body p { margin: 0 0 10px; }
.fyc-modal-body code {
  background: #eef2f6;
  padding: 1px 5px;
  border-radius: 3px;
  font-size: 12px;
  font-family: ui-monospace, "SF Mono", Consolas, monospace;
}

/* ============================================================
 * T6 Flusso Operativo v1.1
 * ============================================================ */

/* Strip KPI hero T6 · 3 cardini (Flusso | Entrate | Ritorno) ·
   redesign v1.3 · prima erano 5, Health/DSCR/Volatilità sono ricollocati. */
.fyc-hero-grid--t6 {
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 700px) {
  .fyc-hero-grid--t6 { grid-template-columns: repeat(2, 1fr); }
}

/* Fascia "indicatori secondari" (CV | Mesi positivi | Trend) · sotto hub.
   Stesso pattern di .fyc-hero-grid ma value 20px (gerarchia visiva). */
.fyc-hero-grid--sec {
  grid-template-columns: repeat(3, 1fr);
  margin-top: 4px;
}
.fyc-hero-grid--sec .fyc-hero-kpi .value { font-size: 20px; }
@media (max-width: 700px) {
  .fyc-hero-grid--sec { grid-template-columns: repeat(2, 1fr); }
}

/* Health Score · colore status sul .sub (residuo, ora applicato sul gauge
   HS via .fyc-hs-gauge-card[data-status]; lasciato per back-compat se la
   card hero #kpiHealth dovesse essere ripristinata). */
.fyc-hero-kpi[data-status="verde"]  .sub { color: var(--fyc-teal);  font-weight: 700; letter-spacing: 0.4px; }
.fyc-hero-kpi[data-status="giallo"] .sub { color: #b8870a;          font-weight: 700; letter-spacing: 0.4px; }
.fyc-hero-kpi[data-status="rosso"]  .sub { color: var(--fyc-coral); font-weight: 700; letter-spacing: 0.4px; }

/* Gauge Health Score (aside hub) · scala 0-100 · soglie 40/70 ·
   markup SVG con ID propri (hs*), styling tarato per stare nei 280px di
   aside. Riusa _gaugePoint del gauge flusso ma con applyHealthGaugeConfig
   separata (vedi 06-flusso-operativo.html). */
.fyc-hs-gauge-card {
  background: var(--fyc-surface);
  border: 1px solid var(--fyc-border);
  border-radius: var(--fyc-radius);
  box-shadow: var(--fyc-shadow-sm);
  padding: 14px 16px 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.fyc-hs-gauge-title {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--fyc-text-mute);
  align-self: flex-start;
}
.fyc-hs-gauge-svg {
  width: 100%;
  max-width: 240px;
  height: auto;
  display: block;
}
.fyc-hs-gauge-svg #hsGaugeNeedle {
  transition: x2 0.6s cubic-bezier(.16, 1, .3, 1),
              y2 0.6s cubic-bezier(.16, 1, .3, 1);
}
.fyc-hs-gauge-value {
  font-size: 22px;
  font-weight: 800;
  color: var(--fyc-navy);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  margin-top: -10px;          /* sale sotto la base dell'arco */
}
.fyc-hs-gauge-status {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.4px;
  color: var(--fyc-text-mute);
  text-transform: uppercase;
}
.fyc-hs-gauge-card[data-status="verde"]  .fyc-hs-gauge-status { color: var(--fyc-teal); }
.fyc-hs-gauge-card[data-status="giallo"] .fyc-hs-gauge-status { color: #b8870a; }
.fyc-hs-gauge-card[data-status="rosso"]  .fyc-hs-gauge-status { color: var(--fyc-coral); }

/* Sezione subtitle generica T6 */
.fyc-section-subtitle {
  font-size: 13px;
  font-weight: 600;
  color: var(--fyc-text);
  margin: 16px 0 8px;
  letter-spacing: 0.2px;
}

/* === Heat-map mensile 24M (T6) === */
.fyc-heatmap-mensile-wrap {
  margin: 22px 0 8px;
}
.fyc-heatmap-mensile {
  display: grid;
  grid-template-columns: repeat(24, 1fr);
  gap: 4px;
  max-width: 760px;
  margin: 0 auto;
}
.fyc-heatmap-mensile-cell {
  aspect-ratio: 1 / 1.4;
  border-radius: 4px;
  display: flex;
  align-items: end;
  justify-content: center;
  font-size: 8.5px;
  font-weight: 600;
  color: #fff;
  padding-bottom: 3px;
  cursor: help;
  transition: transform 0.15s ease;
  user-select: none;
}
.fyc-heatmap-mensile-cell:hover { transform: scale(1.18); z-index: 2; box-shadow: var(--fyc-shadow-sm); }
/* Vecchi livelli v1 (retrocompat) */
.fyc-mens-safe        { background: #2aa6a0; }
.fyc-mens-attenzione  { background: #d4af37; }
.fyc-mens-allerta     { background: #e8a447; }
.fyc-mens-sconfino    { background: #e26c5a; }
.fyc-mens-safe-text       { color: #2aa6a0; font-weight: 600; }
.fyc-mens-attenzione-text { color: #b8870a; font-weight: 600; }
.fyc-mens-allerta-text    { color: #e26c5a; font-weight: 600; }

/* Nuovi livelli v3 · classificazione per magnitudine del netto (B.8) */
.fyc-mens-positivo-forte    { background: #1a7d72; }  /* teal scuro */
.fyc-mens-positivo-debole   { background: #2aa6a0; }  /* teal */
.fyc-mens-negativo-debole   { background: #e8a447; }  /* arancio */
.fyc-mens-negativo-forte    { background: #e26c5a; }  /* coral */

/* Legenda heatmap mensile · riusa pattern T1 con stessi label */
.fyc-heatmap-mensile-wrap .fyc-heatmap-legend .dot {
  display: inline-block;
  width: 11px; height: 11px;
  border-radius: 2px;
  margin-right: 5px;
  vertical-align: middle;
}
.fyc-heatmap-mensile-wrap .fyc-heatmap-legend .legend-item {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

@media (max-width: 768px) {
  .fyc-heatmap-mensile { grid-template-columns: repeat(12, 1fr); grid-auto-rows: 1fr; }
  .fyc-heatmap-mensile-cell:hover { transform: none; }
}

/* Chart wrap small (per YoY chart) */
.fyc-chart-wrap--small { height: 240px; }

/* === Confronti temporali === */
.fyc-confronti-temporali { margin: 28px 0 10px; }

.fyc-ytd-compare {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto;
  gap: 18px;
  align-items: center;
  margin: 14px 0 18px;
  padding: 18px 22px;
  background: var(--fyc-surface);
  border-radius: 10px;
  box-shadow: var(--fyc-shadow-sm);
}
.fyc-ytd-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.fyc-ytd-card .label { font-size: 11px; color: var(--fyc-text-mute); text-transform: uppercase; letter-spacing: 0.4px; }
.fyc-ytd-card .value { font-size: 26px; font-weight: 700; color: var(--fyc-navy); line-height: 1.1; }
.fyc-ytd-card .sub   { font-size: 11px; color: var(--fyc-text-mute); }
.fyc-ytd-card--prev .value { color: var(--fyc-text-mute); }
.fyc-ytd-arrow { font-size: 22px; color: var(--fyc-text-mute); text-align: center; }
.fyc-ytd-delta {
  font-size: 15px;
  font-weight: 700;
  padding: 8px 14px;
  border-radius: 8px;
  background: rgba(0,0,0,0.04);
  text-align: center;
  white-space: nowrap;
}
.fyc-ytd-delta.positive { color: var(--fyc-teal);  background: rgba(42, 166, 160, 0.10); }
.fyc-ytd-delta.negative { color: var(--fyc-coral); background: rgba(226, 108, 90, 0.10); }

/* B.7 · Frase discorsiva YTD pronta da copiare in relazione */
.fyc-ytd-compare-wrap { margin: 14px 0 18px; }
.fyc-ytd-compare-wrap .fyc-ytd-compare { margin: 0; }
.fyc-ytd-frase {
  margin: 10px 4px 0;
  padding: 10px 14px;
  font-size: 12.5px;
  font-style: italic;
  color: var(--fyc-text-mute);
  background: rgba(26, 58, 92, 0.04);
  border-left: 3px solid var(--fyc-navy);
  border-radius: 4px;
  line-height: 1.5;
}
.fyc-ytd-frase:empty { display: none; }

/* Trailing rolling cards · 3 card + 2 frecce trend (B.11) */
.fyc-trailing-grid {
  display: grid;
  grid-template-columns: 1fr 36px 1fr 36px 1fr;
  gap: 10px;
  margin: 8px 0 22px;
  align-items: stretch;
}
.fyc-trailing-arrow {
  font-size: 22px;
  font-weight: 700;
  text-align: center;
  align-self: center;
  cursor: help;
  user-select: none;
  line-height: 1;
}
.fyc-trailing-card {
  padding: 14px 16px;
  background: var(--fyc-surface);
  border-radius: 8px;
  box-shadow: var(--fyc-shadow-sm);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.fyc-trailing-card .label { font-size: 11px; color: var(--fyc-text-mute); text-transform: uppercase; letter-spacing: 0.4px; }
.fyc-trailing-card .value { font-size: 22px; font-weight: 700; color: var(--fyc-navy); line-height: 1.1; }
.fyc-trailing-card .sub   { font-size: 11px; color: var(--fyc-text-mute); }

.fyc-yoy-wrap { margin-top: 14px; }

/* === Qualità del flusso === */
.fyc-qualita-flusso { margin: 28px 0 10px; }

.fyc-qualita-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin: 14px 0;
}
.fyc-qualita-card {
  padding: 18px 20px;
  background: var(--fyc-surface);
  border-radius: 10px;
  box-shadow: var(--fyc-shadow-sm);
}
.fyc-qualita-card .fyc-section-subtitle { margin-top: 0; }

.fyc-meta-text {
  font-size: 12px;
  color: var(--fyc-text-mute);
  margin: 4px 0 12px;
  line-height: 1.45;
}

.fyc-table--qualita td { font-size: 12.5px; padding-top: 6px; padding-bottom: 6px; }
.fyc-table--qualita .codpdc-pill { margin-right: 4px; }
.fyc-table--small td { font-size: 12.5px; padding: 6px 8px; }
.fyc-table--small tr td:first-child { color: var(--fyc-text-mute); }

/* Barra orizzontale stratificata (concentrazione) */
.fyc-concentrazione-bar {
  display: flex;
  height: 12px;
  border-radius: 6px;
  overflow: hidden;
  margin: 14px 0 8px;
  background: var(--fyc-border, #e5e7eb);
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.05);
}
.fyc-concentrazione-bar span {
  display: block;
  height: 100%;
  transition: opacity 0.15s ease;
  cursor: help;
}
.fyc-concentrazione-bar span:hover { opacity: 0.85; }

/* Gauge rigidità */
.fyc-rigidita-gauge { text-align: center; margin: 8px 0 4px; }
.fyc-rigidita-svg {
  width: 100%;
  max-width: 220px;
  height: 120px;
  margin: 0 auto;
  display: block;
}

@media (max-width: 768px) {
  .fyc-ytd-compare { grid-template-columns: 1fr; gap: 12px; }
  .fyc-ytd-arrow   { display: none; }
  .fyc-trailing-grid { grid-template-columns: 1fr; }
  .fyc-trailing-arrow { display: none; }   /* In mobile le cards sono in colonna · freccia non ha più senso direzionale */
  .fyc-qualita-grid  { grid-template-columns: 1fr; }
}

/* ============================================================
 * T3 OIC 10 v1.1 · Matrice CE (Conto Economico Finanziario)
 * Replica lo stile del Power BI di Andrea: colonne % con sfondo
 * gold tint, gerarchia visiva forte tra macro_l1 / macro_l2 /
 * sub_l3 / leaf, riga TOTALE PFN evidenziata.
 * ============================================================ */

.fyc-mode-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  padding: 10px 14px;
  background: var(--fyc-bg);
  border-radius: 8px;
  flex-wrap: wrap;
}
.fyc-mode-label {
  font-size: 11px;
  color: var(--fyc-text-mute);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-weight: 600;
  margin-right: 6px;
}

.fyc-matrice-ce-wrap {
  margin-top: 14px;
  overflow-x: auto;
  background: var(--fyc-surface, #fff);
  border-radius: 10px;
  box-shadow: var(--fyc-shadow-sm);
}
.fyc-matrice-ce {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.fyc-matrice-ce thead {
  background: var(--fyc-navy);
  color: #fff;
  position: sticky;
  top: 0;
  z-index: 5;
}
.fyc-matrice-header-anno th {
  padding: 9px 8px;
  text-align: center;
  font-weight: 600;
  border-bottom: 1px solid rgba(255,255,255,0.3);
  font-size: 12px;
  letter-spacing: 0.3px;
}
.fyc-matrice-header-tipo th {
  padding: 5px 8px;
  text-align: right;
  font-weight: 500;
  font-size: 10.5px;
  border-bottom: 1px solid rgba(255,255,255,0.4);
  background: rgba(255,255,255,0.05);
}
.fyc-matrice-header-tipo th.pct-col {
  background: rgba(212, 175, 55, 0.32);  /* gold tint sull'header % */
  color: #fff;
}
.fyc-matrice-totale-col { background: rgba(212, 175, 55, 0.18); }
.fyc-matrice-label-col  { text-align: left; padding-left: 14px; }
.fyc-anno-parziale {
  font-size: 9.5px;
  font-weight: 400;
  opacity: 0.8;
  display: block;
  margin-top: 1px;
}

.fyc-matrice-row td {
  padding: 5px 8px;
  border-bottom: 1px solid var(--fyc-border, #e5e7eb);
  white-space: nowrap;
}
.fyc-matrice-label-cell {
  font-size: 12px;
  max-width: 360px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.fyc-matrice-eur-cell {
  font-variant-numeric: tabular-nums;
  text-align: right;
  min-width: 80px;
}
/* Colonna % con sfondo gold tint (replica Power BI cliente) */
.fyc-matrice-pct-cell {
  background: rgba(212, 175, 55, 0.12);
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  text-align: right;
  min-width: 60px;
  font-size: 11.5px;
}

/* Segni: positivo navy/teal, negativo coral */
.fyc-matrice-eur-cell.positive { color: var(--fyc-navy); }
.fyc-matrice-eur-cell.negative { color: var(--fyc-coral); }
.fyc-matrice-pct-cell.positive { color: var(--fyc-navy); }
.fyc-matrice-pct-cell.negative { color: var(--fyc-coral); }

/* Macro L1 · bold + banda navy in alto */
.fyc-matrice-row--macro_l1 td {
  font-weight: 700;
  background: rgba(26, 58, 92, 0.06);
  border-top: 2px solid var(--fyc-navy);
  font-size: 12.5px;
}
.fyc-matrice-row--macro_l1 .fyc-matrice-pct-cell {
  background: rgba(212, 175, 55, 0.20);
}

/* Macro L2 · semibold, sfondo leggero */
.fyc-matrice-row--macro_l2 td {
  font-weight: 600;
  background: rgba(26, 58, 92, 0.025);
}
.fyc-matrice-row--macro_l2 .fyc-matrice-pct-cell {
  background: rgba(212, 175, 55, 0.16);
}

/* Sub L3 · medium */
.fyc-matrice-row--sub_l3 td {
  font-weight: 500;
  color: var(--fyc-text);
}

/* Leaf · normale, colore tenue */
.fyc-matrice-row--leaf td {
  font-weight: 400;
  color: var(--fyc-text);
  font-size: 11.5px;
}

/* Riga TOTALE PFN · gold pieno, bordi navy spessi */
.fyc-matrice-row--totale_pfn td {
  font-weight: 700;
  background: var(--fyc-gold);
  color: #fff;
  border-top: 3px solid var(--fyc-navy);
  border-bottom: 3px solid var(--fyc-navy);
  font-size: 13px;
}
.fyc-matrice-row--totale_pfn .fyc-matrice-pct-cell {
  background: #b8902b;  /* gold scuro per dare contrasto sul gold pieno */
  color: #fff;
}
.fyc-matrice-row--totale_pfn .fyc-matrice-eur-cell.positive,
.fyc-matrice-row--totale_pfn .fyc-matrice-eur-cell.negative,
.fyc-matrice-row--totale_pfn .fyc-matrice-pct-cell.positive,
.fyc-matrice-row--totale_pfn .fyc-matrice-pct-cell.negative {
  color: #fff;  /* override colore segno: sul fondo gold tutto bianco */
}

/* Hover row · evidenzia · ! override per le row con sfondo */
.fyc-matrice-row:hover td {
  background: rgba(26, 58, 92, 0.10) !important;
}
.fyc-matrice-row--totale_pfn:hover td {
  background: #c9a83a !important;
}

/* Selettore n_anni · pill più compatte */
.fyc-anni-selector .fyc-pill { padding: 4px 10px; font-size: 11px; min-width: 32px; }

@media (max-width: 900px) {
  .fyc-matrice-ce { font-size: 10.5px; }
  .fyc-matrice-label-cell { max-width: 180px; }
  .fyc-matrice-eur-cell, .fyc-matrice-pct-cell { min-width: 50px; }
}

/* ============================================================
 * T_movimenti-lite v1.0 · drill-through + edit CODPDC
 * ============================================================ */

/* Drill-through breadcrumb (visibile quando si arriva da T1/T3/T6) */
.fyc-mov-drill-breadcrumb {
  margin: 6px 0 12px;
  padding: 8px 14px;
  background: rgba(26, 58, 92, 0.06);
  border-left: 3px solid var(--fyc-navy);
  border-radius: 4px;
  font-size: 13px;
}
.fyc-mov-drill-breadcrumb__link {
  color: var(--fyc-navy);
  text-decoration: none;
  font-weight: 500;
}
.fyc-mov-drill-breadcrumb__link:hover { text-decoration: underline; }
.fyc-mov-drill-breadcrumb__link strong { color: var(--fyc-navy); font-weight: 700; }

/* Badge banca compatti · BA1 navy / BA2 gold */
.fyc-banca-badge {
  display: inline-block;
  padding: 2px 7px;
  font-size: 11px;
  font-weight: 600;
  border-radius: 3px;
  letter-spacing: 0.4px;
  color: #fff;
  background: var(--fyc-navy);
}
.fyc-banca-badge--ba1 { background: var(--fyc-navy); }
.fyc-banca-badge--ba2 { background: var(--fyc-gold); color: #fff; }

/* Badge fonte_classif · keyword grigio / ai teal scuro / manuale gold */
.fyc-fonte-badge {
  display: inline-block;
  padding: 2px 7px;
  font-size: 10.5px;
  font-weight: 600;
  border-radius: 3px;
  letter-spacing: 0.3px;
  text-transform: lowercase;
  white-space: nowrap;
  cursor: help;
}
.fyc-fonte-badge--keyword { background: #e5e7eb; color: #4b5563; }
.fyc-fonte-badge--ai      { background: #1a7d72; color: #fff; text-transform: uppercase; }
.fyc-fonte-badge--manuale { background: var(--fyc-gold); color: #fff; }

/* Tabella · righe cliccabili (hover evidenziato) */
.fyc-table--clickable tbody tr:hover {
  background: rgba(26, 58, 92, 0.06);
}

/* Modale dettaglio movimento */
.fyc-modal--detail { max-width: 640px; }
.fyc-modal--detail h3 { margin: 0 0 12px; color: var(--fyc-navy); }
.fyc-mov-detail-list {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 6px 14px;
  margin: 12px 0 0;
  font-size: 13px;
}
.fyc-mov-detail-list dt {
  font-weight: 600;
  color: var(--fyc-text-mute);
  font-size: 11.5px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  align-self: center;
}
.fyc-mov-detail-list dd { margin: 0; color: var(--fyc-text); word-break: break-word; }
.fyc-mov-detail-list dd.pos { color: var(--fyc-teal); font-weight: 700; }
.fyc-mov-detail-list dd.neg { color: var(--fyc-coral); font-weight: 700; }

.fyc-modal-sep {
  border: 0;
  border-top: 1px solid var(--fyc-border, #e5e7eb);
  margin: 16px 0 8px;
}

/* Sezione "Riclassifica movimento" · expandable details */
.fyc-riclassifica { margin-top: 8px; }
.fyc-riclassifica > summary {
  cursor: pointer;
  padding: 8px 12px;
  background: rgba(212, 175, 55, 0.10);
  border-left: 3px solid var(--fyc-gold);
  border-radius: 4px;
  font-weight: 600;
  font-size: 13px;
  color: var(--fyc-navy);
  user-select: none;
  list-style: none;
}
.fyc-riclassifica > summary::before {
  content: '▸ ';
  display: inline-block;
  transition: transform 0.15s ease;
}
.fyc-riclassifica[open] > summary::before {
  transform: rotate(90deg);
}
.fyc-riclassifica > summary::-webkit-details-marker { display: none; }
.fyc-form-row {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 10px 0;
}
.fyc-form-row label {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--fyc-text-mute);
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
.fyc-form-row select {
  padding: 6px 10px;
  font-size: 13px;
  border: 1px solid var(--fyc-border, #e5e7eb);
  border-radius: 4px;
  background: #fff;
  font-family: inherit;
}
.fyc-checkbox-label {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: 8px;
  text-transform: none !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  color: var(--fyc-text) !important;
  cursor: pointer;
}
.fyc-form-row--actions {
  flex-direction: row !important;
  gap: 10px !important;
  justify-content: flex-end;
  margin-top: 14px;
}

/* Feedback (success/error) */
.fyc-feedback {
  margin-top: 10px;
  padding: 10px 14px;
  border-radius: 4px;
  font-size: 12.5px;
  line-height: 1.5;
}
.fyc-feedback--ok {
  background: rgba(42, 166, 160, 0.10);
  border-left: 3px solid var(--fyc-teal);
  color: var(--fyc-navy);
}
.fyc-feedback--error {
  background: rgba(226, 108, 90, 0.10);
  border-left: 3px solid var(--fyc-coral);
  color: var(--fyc-coral);
  font-weight: 500;
}
.fyc-feedback.hidden { display: none; }

@media (max-width: 700px) {
  .fyc-mov-detail-list { grid-template-columns: 1fr; gap: 2px; }
  .fyc-mov-detail-list dt { margin-top: 8px; }
}

/* ============================================================
 * T_movimenti v1.1 · Bulk Edit
 * ============================================================ */

/* Colonna checkbox (prima cella tabella) */
.fyc-checkbox-cell {
  width: 36px;
  text-align: center;
  padding: 0 !important;
}
.fyc-checkbox-cell input[type="checkbox"] {
  cursor: pointer;
  width: 16px;
  height: 16px;
  vertical-align: middle;
  accent-color: var(--fyc-navy);
}

/* Riga selezionata (gold/8% sfondo) e in update (opacità ridotta) */
.fyc-table tr.selected td {
  background: rgba(212, 175, 55, 0.08);
}
.fyc-table tr.selected:hover td {
  background: rgba(212, 175, 55, 0.16);
}
.fyc-table tr.updating {
  opacity: 0.5;
  pointer-events: none;
  transition: opacity 0.2s ease;
}

/* Toolbar contestuale bulk · sticky in cima */
.fyc-bulk-toolbar {
  position: sticky;
  top: 0;
  z-index: 20;
  background: var(--fyc-navy);
  color: #fff;
  padding: 12px 16px;
  border-radius: var(--fyc-radius, 8px);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin: 8px 0 12px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18);
  flex-wrap: wrap;
}
.fyc-bulk-toolbar__count {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 14px;
}
.fyc-bulk-toolbar__count strong { color: #fff; font-weight: 600; }
.fyc-bulk-toolbar__actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.fyc-bulk-toolbar .fyc-bulk-label {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.85);
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
}
.fyc-bulk-toolbar select {
  padding: 6px 10px;
  font-size: 13px;
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: #fff;
  color: var(--fyc-text);
  font-family: inherit;
  max-width: 280px;
}
.fyc-bulk-toolbar input[type="checkbox"] {
  accent-color: var(--fyc-gold);
}
.fyc-bulk-toolbar .fyc-checkbox-label {
  color: #fff !important;
  font-size: 12px !important;
}
.fyc-bulk-toolbar .fyc-btn {
  background: var(--fyc-gold);
  color: #fff;
  border: 0;
  padding: 7px 14px;
  font-weight: 600;
}
.fyc-bulk-toolbar .fyc-btn:hover { filter: brightness(1.07); }

/* Banner "Seleziona tutti i N filtrati" · gold tinted, non modale */
.fyc-bulk-extend-banner {
  background: rgba(212, 175, 55, 0.12);
  border-left: 3px solid var(--fyc-gold);
  padding: 9px 14px;
  font-size: 13px;
  margin: 0 0 10px;
  border-radius: 4px;
  color: var(--fyc-text);
}
.fyc-bulk-extend-banner strong { color: var(--fyc-navy); }

/* Link inline (deselect, select-all-filtered) */
.fyc-link {
  background: none;
  border: none;
  color: var(--fyc-gold);
  text-decoration: underline;
  cursor: pointer;
  font-weight: 600;
  padding: 0;
  font-family: inherit;
  font-size: inherit;
}
.fyc-link:hover { text-decoration: none; }
.fyc-bulk-toolbar .fyc-link {
  color: rgba(255, 255, 255, 0.85);
}
.fyc-bulk-toolbar .fyc-link:hover { color: #fff; }
.fyc-bulk-extend-banner .fyc-link { color: var(--fyc-navy); }

/* Toast feedback bulk (success/warn/error) · fixed bottom-right */
.fyc-bulk-toast {
  position: fixed;
  bottom: 24px;
  right: 24px;
  max-width: 460px;
  padding: 14px 18px;
  border-radius: 8px;
  font-size: 13.5px;
  line-height: 1.45;
  z-index: 200;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18);
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.25s ease, transform 0.25s ease;
  pointer-events: none;
}
.fyc-bulk-toast--show {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.fyc-bulk-toast--ok {
  background: var(--fyc-teal);
  color: #fff;
  border-left: 4px solid #1a7d72;
}
.fyc-bulk-toast--warn {
  background: var(--fyc-gold);
  color: #fff;
  border-left: 4px solid #b8902b;
}
.fyc-bulk-toast--error {
  background: var(--fyc-coral);
  color: #fff;
  border-left: 4px solid #a04030;
}

@media (max-width: 768px) {
  .fyc-bulk-toolbar { flex-direction: column; align-items: stretch; gap: 10px; }
  .fyc-bulk-toolbar__actions { flex-direction: column; align-items: stretch; }
  .fyc-bulk-toolbar select { max-width: 100%; }
  .fyc-bulk-toast { left: 12px; right: 12px; bottom: 12px; max-width: none; }
}

/* ============================================================
 * FYC Navbar iconica condivisa v1.0
 * Sostituisce il vecchio header per-view. Variabili palette esistenti
 * (--fyc-navy, --fyc-gold). Active state = gold + barra inferiore;
 * quando arriverà il dark theme "Vital Cash Monitor" basterà cambiare
 * 2-3 regole .fyc-navbar__item--active per passare a verde fluo.
 * ============================================================ */

.fyc-navbar {
  background: var(--fyc-navy, #1a3a5c);
  color: #fff;
  padding: 14px 20px;       /* +2px verticali per dare respiro al logo 56px */
  display: flex;
  align-items: center;
  gap: 24px;
  position: sticky;
  top: 0;
  z-index: 100;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

/* Brand (logo + titolo) · link a Home */
.fyc-navbar__brand {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  color: inherit;
  min-width: 0;
  flex-shrink: 0;
}
.fyc-navbar__brand:hover { opacity: 0.9; }
/* Logo brand · pastiglia bianca con <img> del logo FYC Banking. La pastiglia
   chiara è necessaria per mantenere leggibili i navy+oro del logo sopra
   l'header navy. Sizing: pillola auto-larga, altezza fissa via padding +
   altezza img (56px) → ~70px totale. La navbar cresce di conseguenza
   (align-items: center sul flex container vertica il logo). */
.fyc-navbar__logo {
  background: #fff;
  border-radius: 12px;
  padding: 6px 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}
.fyc-navbar__logo img {
  display: block;
  height: 56px;      /* logo a piena visibilità · raddoppiato da 28px */
  width: auto;       /* preserva l'aspect ratio del PNG (3.19:1) */
  max-width: 300px;  /* safety per loghi sproporzionati */
}
.fyc-navbar__brand-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.fyc-navbar__title  { font-weight: 600; font-size: 16px; line-height: 1.15; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fyc-navbar__client { font-size: 12px; color: rgba(255, 255, 255, 0.65); line-height: 1.15; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Menu icone · flex centrato, scroll orizzontale solo se overflow */
.fyc-navbar__menu {
  display: flex;
  gap: 4px;
  flex: 1;
  justify-content: center;
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: thin;
}
.fyc-navbar__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 8px 14px;
  border-radius: 8px;
  color: rgba(255, 255, 255, 0.75);
  text-decoration: none;
  transition: color 0.15s ease, background 0.15s ease, border-color 0.15s ease;
  cursor: pointer;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  font-size: 11px;
  min-width: 64px;
  font-family: inherit;
}
.fyc-navbar__item:hover { color: #fff; background: rgba(255, 255, 255, 0.06); }
.fyc-navbar__item i { font-size: 20px; line-height: 1; }
.fyc-navbar__item span { font-weight: 500; }

/* Voce attiva · gold + barra sotto (pronto per swap a verde fluo in dark theme) */
.fyc-navbar__item--active {
  color: var(--fyc-gold, #d4af37);
  background: rgba(212, 175, 55, 0.12);
  border-bottom-color: var(--fyc-gold, #d4af37);
}
.fyc-navbar__item--active:hover {
  color: var(--fyc-gold, #d4af37);
  background: rgba(212, 175, 55, 0.18);
}

/* Voce disabilitata · grigio + cursor not-allowed, tooltip "Prossimamente" */
.fyc-navbar__item--disabled {
  color: rgba(255, 255, 255, 0.3);
  cursor: not-allowed;
}
.fyc-navbar__item--disabled:hover {
  background: transparent;
  color: rgba(255, 255, 255, 0.3);
}

/* Blocco utente a destra */
.fyc-navbar__user {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.fyc-navbar__avatar {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--fyc-gold, #d4af37);
  object-fit: cover;
}
.fyc-navbar__email {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.85);
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fyc-navbar__logout {
  background: rgba(255, 255, 255, 0.10);
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: #fff;
  padding: 5px 14px;
  border-radius: 8px;
  font-size: 12px;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.15s ease;
}
.fyc-navbar__logout:hover { background: rgba(255, 255, 255, 0.20); }

/* Responsive · ≥900px tutto · 700-900px nascondo client+email · <700px solo icone */
@media (max-width: 900px) {
  .fyc-navbar__client { display: none; }
  .fyc-navbar__email  { display: none; }
}
@media (max-width: 700px) {
  .fyc-navbar { padding: 10px 12px; gap: 12px; }
  .fyc-navbar__item { padding: 6px 8px; min-width: 52px; font-size: 10px; }
  .fyc-navbar__item span { display: none; }  /* solo icone */
  .fyc-navbar__title { font-size: 13px; }
  /* Su mobile/stretto rimpicciolisco il logo per non rubare spazio alle
     icone del menu (che resta scrollabile orizzontalmente). */
  .fyc-navbar__logo { padding: 4px 8px; border-radius: 10px; }
  .fyc-navbar__logo img { height: 36px; max-width: 180px; }
}

/* ============================================================
 * T_chat · Report PDF v1.1 · deliverable consulenziali Leo
 * ============================================================ */

.fyc-report-strip {
  background: var(--fyc-surface, #fff);
  border: 1px solid rgba(212, 175, 55, 0.30);
  border-left: 4px solid var(--fyc-gold, #d4af37);
  border-radius: 12px;
  padding: 16px 20px;
  margin: 14px 0 18px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.fyc-report-strip__header {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 12px;
}
.fyc-report-strip__title {
  font-size: 15px;
  font-weight: 600;
  color: var(--fyc-navy, #1a3a5c);
  margin: 0;
}
.fyc-report-strip__subtitle {
  font-size: 12px;
  color: rgba(0, 0, 0, 0.55);
}
.fyc-report-strip__buttons {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.fyc-report-btn {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  background: rgba(26, 58, 92, 0.04);
  border: 1px solid rgba(26, 58, 92, 0.15);
  border-radius: 10px;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
  text-align: left;
  font-family: inherit;
}
.fyc-report-btn:hover {
  background: rgba(26, 58, 92, 0.08);
  border-color: var(--fyc-gold, #d4af37);
  transform: translateY(-1px);
}
.fyc-report-btn:active { transform: translateY(0); }
.fyc-report-btn__icon {
  font-size: 28px;
  line-height: 1;
  flex-shrink: 0;
}
.fyc-report-btn__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.fyc-report-btn__text strong {
  font-size: 14px;
  color: var(--fyc-navy, #1a3a5c);
}
.fyc-report-btn__text small {
  font-size: 11px;
  color: rgba(0, 0, 0, 0.55);
}

@media (max-width: 700px) {
  .fyc-report-strip__buttons { grid-template-columns: 1fr; }
}

/* Modale selezione periodo · riusa .fyc-modal-overlay + .fyc-modal */
.fyc-modal--report { max-width: 480px; }
.fyc-modal--report h3 { margin: 0 0 8px; color: var(--fyc-navy, #1a3a5c); }
.fyc-modal--report .fyc-form-row select {
  width: 100%;
  max-width: 240px;
}

/* Loading overlay · Leo che lavora */
.fyc-report-loading {
  position: fixed;
  inset: 0;
  background: rgba(26, 58, 92, 0.85);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-align: center;
}
.fyc-report-loading.hidden { display: none; }
.fyc-report-loading__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  padding: 32px;
  max-width: 420px;
}
.fyc-report-loading__avatar-wrap {
  position: relative;
  width: 110px;
  height: 110px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.fyc-report-loading__avatar {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  object-fit: cover;
  object-position: top center;
  border: 3px solid var(--fyc-gold, #d4af37);
  background: var(--fyc-gold, #d4af37);
  position: relative;
  z-index: 2;
}
.fyc-report-loading__pulse {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 3px solid var(--fyc-gold, #d4af37);
  animation: fyc-report-pulse 1.8s ease-out infinite;
  z-index: 1;
}
@keyframes fyc-report-pulse {
  0%   { transform: scale(1);    opacity: 0.7; }
  100% { transform: scale(1.55); opacity: 0;   }
}
.fyc-report-loading__msg {
  font-size: 17px;
  font-weight: 600;
  margin: 0;
  letter-spacing: 0.2px;
  transition: opacity 0.25s ease;
  min-height: 22px;
}
.fyc-report-loading__sub {
  font-size: 12px;
  margin: 0;
  color: rgba(255, 255, 255, 0.7);
  font-style: italic;
}

/* ============================================================
 * T_chat v1.2 · AI Tutor con Leo · avatar nei bubble + pill spiegami KPI
 * ============================================================ */

/* Header chat Leo · banner identitario sopra la chat container */
.fyc-chat-leo-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  background: linear-gradient(to right, rgba(26, 58, 92, 0.06), transparent);
  border-bottom: 1px solid rgba(26, 58, 92, 0.10);
  margin-bottom: 12px;
  border-radius: 8px 8px 0 0;
}
.fyc-chat-leo-avatar-header {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  object-fit: cover;
  object-position: top center;
  border: 2px solid var(--fyc-gold, #d4af37);
  flex-shrink: 0;
}
.fyc-chat-leo-info { flex: 1; min-width: 0; }
.fyc-chat-leo-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--fyc-navy, #1a3a5c);
  line-height: 1.2;
}
.fyc-chat-leo-role {
  font-size: 11px;
  color: rgba(0, 0, 0, 0.55);
}
.fyc-chat-leo-status {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: rgba(0, 0, 0, 0.55);
  font-weight: 500;
  flex-shrink: 0;
}
.fyc-chat-leo-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--fyc-teal, #2aa6a0);
  display: inline-block;
  animation: fyc-leo-pulse 2s ease-in-out infinite;
  box-shadow: 0 0 0 0 rgba(42, 166, 160, 0.5);
}
@keyframes fyc-leo-pulse {
  0%   { box-shadow: 0 0 0 0   rgba(42, 166, 160, 0.55); opacity: 1; }
  70%  { box-shadow: 0 0 0 8px rgba(42, 166, 160, 0); opacity: 0.85; }
  100% { box-shadow: 0 0 0 0   rgba(42, 166, 160, 0); opacity: 1; }
}

/* Avatar Leo nei bubble messaggi AI · cornice gold + object-position top
   per centrare sul viso (l'avatar verticale ha il viso in alto) */
.fyc-chat-msg--assistant .avatar.avatar--leo {
  border: 2px solid var(--fyc-gold, #d4af37);
  border-radius: 50%;
  object-fit: cover;
  object-position: top center;
  background: var(--fyc-gold, #d4af37);
}

/* Pill speciale "🎓 Spiegami un KPI" · gold gradient distintiva tra le pill grigie */
.fyc-pill--tutor,
.fyc-chat-suggestion.fyc-pill--tutor {
  background: linear-gradient(135deg, var(--fyc-gold, #d4af37), #e6c25e);
  color: var(--fyc-navy, #1a3a5c) !important;
  border: 1px solid #c69c2a !important;
  font-weight: 700;
  box-shadow: 0 2px 6px rgba(212, 175, 55, 0.30);
  letter-spacing: 0.2px;
}
.fyc-pill--tutor:hover,
.fyc-chat-suggestion.fyc-pill--tutor:hover {
  background: linear-gradient(135deg, #e6c25e, var(--fyc-gold, #d4af37));
  transform: translateY(-1px);
  box-shadow: 0 3px 10px rgba(212, 175, 55, 0.42);
}

/* Pill speciale "scenario / what-if" · teal gradient distintiva dalle pill
   grigie e dalla gold tutor. Usata per le domande ipotetiche di sostenibilità
   (mutuo vs fido, mancati incassi, dilazioni fiscali, DSCR a 12m). */
.fyc-pill--scenario,
.fyc-chat-suggestion.fyc-pill--scenario {
  background: linear-gradient(135deg, #2aa6a0, #4dbfb3);
  color: #fff !important;
  border: 1px solid #1f8a85 !important;
  font-weight: 600;
  box-shadow: 0 2px 6px rgba(42, 166, 160, 0.28);
}
.fyc-pill--scenario:hover,
.fyc-chat-suggestion.fyc-pill--scenario:hover {
  background: linear-gradient(135deg, #4dbfb3, #2aa6a0);
  transform: translateY(-1px);
  box-shadow: 0 3px 10px rgba(42, 166, 160, 0.4);
}

/* Modale AI Tutor · grid 8 card KPI cliccabili */
.fyc-modal--tutor {
  max-width: 720px;
  width: 92vw;
}
.fyc-modal__leo-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(26, 58, 92, 0.10);
}
.fyc-modal__leo-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 2px solid var(--fyc-gold, #d4af37);
  object-fit: cover;
  object-position: top center;
  flex-shrink: 0;
}
.fyc-modal__leo-header h3 {
  margin: 0;
  color: var(--fyc-navy, #1a3a5c);
  font-size: 16px;
}
.fyc-tutor-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  padding: 6px 0 4px;
}
.fyc-tutor-kpi-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  padding: 14px 16px;
  background: rgba(26, 58, 92, 0.03);
  border: 1px solid rgba(26, 58, 92, 0.12);
  border-radius: 10px;
  cursor: pointer;
  text-align: left;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
  font-family: inherit;
}
.fyc-tutor-kpi-card:hover {
  background: rgba(212, 175, 55, 0.10);
  border-color: var(--fyc-gold, #d4af37);
  transform: translateY(-1px);
}
.fyc-tutor-kpi-card strong {
  font-size: 14px;
  color: var(--fyc-navy, #1a3a5c);
  font-weight: 700;
}
.fyc-tutor-kpi-card small {
  font-size: 11px;
  color: rgba(0, 0, 0, 0.55);
}
@media (max-width: 600px) {
  .fyc-tutor-grid { grid-template-columns: 1fr; }
}

/* ============================================================
 * T3 OIC 10 v1.2 · Modalità Confronto Trimestrale YoY
 * Gerarchia OIC 10 (L1/L2/L3) con Δ €/% colorati · drill-through cella.
 * ============================================================ */

/* Toolbar selettori QC · control-group con label uppercase */
.fyc-qc-toolbar { flex-wrap: wrap; gap: 14px; }
.fyc-control-group {
  display: flex;
  align-items: center;
  gap: 6px;
}
.fyc-control-label {
  font-size: 10px;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.55);
  text-transform: uppercase;
  letter-spacing: 0.6px;
  margin-right: 4px;
}
.fyc-qc-select {
  padding: 5px 10px;
  font-size: 13px;
  border: 1px solid var(--fyc-border, #e5e7eb);
  border-radius: 6px;
  background: #fff;
  font-family: inherit;
  color: var(--fyc-text, #1a3a5c);
  cursor: pointer;
}
.fyc-qc-select:focus { outline: 2px solid var(--fyc-gold, #d4af37); outline-offset: 1px; }

/* Pill disabilitate (trimestri futuri) · estende pattern esistente */
.fyc-pill:disabled,
.fyc-pill[data-disabled="true"] {
  opacity: 0.35;
  cursor: not-allowed;
  pointer-events: none;
}

/* Wrap tabella QC */
.fyc-qc-wrap {
  margin-top: 14px;
  overflow-x: auto;
  background: var(--fyc-surface, #fff);
  border-radius: 10px;
  box-shadow: var(--fyc-shadow-sm, 0 1px 3px rgba(0,0,0,0.05));
}

/* Tabella · header navy sticky */
.fyc-table--quartercompare {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}
.fyc-table--quartercompare thead {
  background: var(--fyc-navy, #1a3a5c);
  color: #fff;
  position: sticky;
  top: 0;
  z-index: 5;
}
.fyc-table--quartercompare thead th {
  padding: 9px 12px;
  font-weight: 600;
  font-size: 12px;
  text-align: left;
  border-bottom: 1px solid rgba(255, 255, 255, 0.18);
}
.fyc-table--quartercompare thead th.num {
  text-align: right;
}
.fyc-table--quartercompare tbody td {
  padding: 5px 12px;
  border-bottom: 1px solid var(--fyc-border, #e5e7eb);
  white-space: nowrap;
}
.fyc-table--quartercompare tbody td.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/* Righe per livello · indent visivo già nel testo via spazi */
.fyc-qc-row--l1 td:first-child { font-weight: 700; font-size: 13.5px; }
.fyc-qc-row--l2 td:first-child { font-weight: 600; font-size: 13px; }
.fyc-qc-row--l3 td:first-child { font-weight: 400; color: rgba(0,0,0,0.78); font-size: 12.5px; }

/* Righe TOTALE CATEGORIA (L1 macro · L2 macro) · gold tenue */
.fyc-qc-row--total-category {
  background: rgba(212, 175, 55, 0.10);
}
.fyc-qc-row--total-category td {
  border-top: 1px solid rgba(212, 175, 55, 0.30);
  border-bottom: 1px solid rgba(212, 175, 55, 0.30);
}
.fyc-qc-row--macro-l1 {
  background: rgba(212, 175, 55, 0.16);
}
.fyc-qc-row--macro-l1 td {
  border-top: 2px solid var(--fyc-navy, #1a3a5c);
}

/* Riga TOTALE COMPLESSIVO in <tfoot> · navy pieno bordo gold */
.fyc-qc-row--total-complessivo {
  background: var(--fyc-navy, #1a3a5c);
  color: #fff;
  font-weight: 700;
  font-size: 13.5px;
  border-top: 2px solid var(--fyc-gold, #d4af37);
}
.fyc-qc-row--total-complessivo td {
  padding: 10px 12px;
  border-color: var(--fyc-gold, #d4af37);
}

/* Delta colorati · teal positivo, coral negativo */
.fyc-table--quartercompare td.fyc-qc-pos {
  color: var(--fyc-teal, #2aa6a0);
  font-weight: 600;
}
.fyc-table--quartercompare td.fyc-qc-neg {
  color: var(--fyc-coral, #e26c5a);
  font-weight: 600;
}
/* Sul totale complessivo (navy bg) override leggibilità con tonalità più chiare */
.fyc-qc-row--total-complessivo td.fyc-qc-pos { color: #7be0d8; }
.fyc-qc-row--total-complessivo td.fyc-qc-neg { color: #f0a497; }

/* Hover · righe con codpdc_list popolato sono cliccabili (drill-through) */
.fyc-table--quartercompare tbody tr[data-codpdc-list]:not([data-codpdc-list=""]) {
  cursor: pointer;
}
.fyc-table--quartercompare tbody tr[data-codpdc-list]:not([data-codpdc-list=""]):hover td {
  background: rgba(26, 58, 92, 0.06);
}
.fyc-qc-row--total-category:hover td,
.fyc-qc-row--macro-l1:hover td {
  background: rgba(212, 175, 55, 0.22) !important;
}

@media (max-width: 900px) {
  .fyc-table--quartercompare { font-size: 11.5px; }
  .fyc-qc-toolbar { gap: 10px; }
}

/* ======================================================================
   T1 Saldi · Modal dettaglio conto (BA1 / BA2 / Consolidato)
   Riusa il pattern .fyc-modal-overlay + .fyc-modal + .fyc-modal--detail
   già definiti. Aggiunge gli stili dei sotto-elementi specifici.
   ====================================================================== */
.fyc-modal--detail { max-width: 760px; }

.fyc-kpi--clickable:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(26, 58, 92, 0.12), var(--fyc-shadow-md, 0 2px 8px rgba(0,0,0,0.06));
}
.fyc-kpi--clickable:focus-visible {
  outline: 2px solid var(--fyc-navy);
  outline-offset: 2px;
}

.fyc-modal-subtitle {
  margin: -6px 0 14px;
  font-size: 12.5px;
  color: var(--fyc-text-mute);
}

.fyc-modal-saldo {
  display: flex;
  align-items: baseline;
  gap: 14px;
  margin: 0 0 14px;
}
.fyc-modal-saldo-value {
  font-size: 30px;
  font-weight: 700;
  color: var(--fyc-text);
  letter-spacing: -0.01em;
}

.fyc-modal-kpi-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 0 0 16px;
  padding: 12px;
  background: var(--fyc-bg-soft, #f8fafc);
  border-radius: 8px;
  border: 1px solid var(--fyc-border, #e5e7eb);
}
.fyc-modal-kpi {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.fyc-modal-kpi .label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--fyc-text-mute);
  font-weight: 600;
}
.fyc-modal-kpi .value {
  font-size: 16px;
  font-weight: 700;
  color: var(--fyc-text);
}
.fyc-modal-kpi .sub {
  font-size: 11px;
  color: var(--fyc-text-mute);
}

.fyc-modal-section-title {
  margin: 18px 0 8px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--fyc-text-mute);
  font-weight: 700;
}

.fyc-modal-chart {
  margin: 4px 0 0;
}
.fyc-modal-chart-empty {
  padding: 24px 0;
  text-align: center;
  color: var(--fyc-text-mute);
  font-size: 12px;
}

.fyc-modal-ministats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 12px 0 0;
}
.fyc-modal-ministat {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 8px 10px;
  background: var(--fyc-bg-soft, #f8fafc);
  border-radius: 6px;
  border: 1px solid var(--fyc-border, #e5e7eb);
}
.fyc-modal-ministat .label {
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--fyc-text-mute);
  font-weight: 600;
}
.fyc-modal-ministat .value {
  font-size: 14px;
  font-weight: 700;
  color: var(--fyc-text);
}

.fyc-modal-table-wrap {
  margin: 4px 0 0;
  max-height: 220px;
  overflow-y: auto;
  border: 1px solid var(--fyc-border, #e5e7eb);
  border-radius: 6px;
}
.fyc-modal-table-wrap table { margin: 0; }

.fyc-modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin: 16px 0 0;
}

@media (max-width: 700px) {
  .fyc-modal-kpi-row { grid-template-columns: 1fr; }
  .fyc-modal-ministats { grid-template-columns: 1fr; }
  .fyc-modal-saldo-value { font-size: 24px; }
}

/* ---- T1 Saldi · modal #contoModal · footer sempre visibile ----
   Scope ristretto a #contoModal per non impattare gli altri modal
   (metodologia, dettaglio movimento, ecc.). Il .fyc-modal--detail ha
   già display:flex column + max-height:95vh: con il body flex:1
   scrollabile e il footer flex-shrink:0, il footer resta ancorato
   in fondo e il contenuto centrale prende lo scroll interno. */
#contoModal .fyc-modal-detail-body {
  overflow-y: auto;
  flex: 1 1 auto;
  min-height: 0;
}
#contoModal .fyc-modal-footer {
  flex-shrink: 0;
}

/* Grafico 90gg dentro #contoModal · altezza fissa per evitare di ereditare
   le proprietà generiche .fyc-modal-chart (height:60vh; min-height:320px)
   che causavano lo spazio bianco residuo. Il canvas Chart.js dentro è
   responsive + maintainAspectRatio:false, quindi prende l'altezza del
   contenitore. */
#contoModal .fyc-modal-chart--detail {
  position: relative;
  height: 280px;
  min-height: 0;
  max-height: 280px;
  /* respiro sotto: ~1cm di stacco tra le date (orizzontali) e le card
     "Saldo medio · min · max" subito sotto */
  margin: 4px 0 36px;
}
#contoModal .fyc-modal-chart--detail canvas {
  /* Il canvas può eccedere temporaneamente il container durante il resize:
     blocco max-width/height per evitare reflow oscillanti. */
  max-width: 100%;
  max-height: 100%;
}

/* ======================================================================
   T2 Budget · landing + Easy Budget · stili modulari .fyc-budget-* /.fyc-eb-*
   Riusa palette --fyc-navy/gold/teal/coral e pattern .fyc-kpi--clickable,
   .fyc-pill, .fyc-table, .fyc-meta-bar. Nessuna nuova dipendenza.
   ====================================================================== */

/* Lead text sotto il titolo della landing */
.fyc-page-lead {
  margin: -6px 0 18px;
  font-size: 13.5px;
  color: var(--fyc-text-mute);
  max-width: 760px;
  line-height: 1.5;
}

/* Landing · griglia 2 card affiancate (responsive) */
.fyc-budget-landing {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 18px;
  margin: 10px 0 24px;
}

.fyc-budget-card {
  display: block;
  text-decoration: none;
  color: inherit;
  padding: 22px 22px 20px;
  background: #fff;
  border: 1px solid var(--fyc-border, #e5e7eb);
  border-radius: 12px;
  box-shadow: var(--fyc-shadow-md, 0 2px 8px rgba(0,0,0,0.06));
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
  position: relative;
  min-height: 240px;
}
.fyc-budget-card.fyc-kpi--clickable:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(26, 58, 92, 0.14);
  border-color: var(--fyc-navy);
}
.fyc-budget-card--locked {
  opacity: 0.6;
  cursor: not-allowed;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f4f8 100%);
}

.fyc-budget-card__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 12px;
}
.fyc-budget-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: rgba(26, 58, 92, 0.08);
  color: var(--fyc-navy);
}
.fyc-budget-card--locked .fyc-budget-card__icon {
  background: rgba(120, 120, 120, 0.12);
  color: #6b7280;
}
.fyc-budget-card__chip {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border-radius: 999px;
}
.fyc-budget-card__chip--ready {
  background: rgba(42, 166, 160, 0.14);
  color: #1e7a76;
}
.fyc-budget-card__chip--soon {
  background: rgba(212, 175, 55, 0.18);
  color: #8a6c10;
}

.fyc-budget-card__title {
  margin: 0 0 6px;
  font-size: 19px;
  font-weight: 700;
  color: var(--fyc-navy);
}
.fyc-budget-card__subtitle {
  margin: 0 0 12px;
  font-size: 13px;
  color: var(--fyc-text-mute);
  line-height: 1.5;
}
.fyc-budget-card__bullets {
  margin: 0 0 18px;
  padding-left: 20px;
  font-size: 12.5px;
  color: var(--fyc-text);
  line-height: 1.7;
}
.fyc-budget-card__bullets li { margin-bottom: 2px; }

.fyc-budget-card__cta {
  display: inline-block;
  margin-top: auto;
  padding: 9px 14px;
  background: var(--fyc-navy);
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.15s ease;
}
.fyc-budget-card__cta:hover:not(.fyc-budget-card__cta--locked) {
  background: var(--fyc-navy-dark, #0f2540);
}
.fyc-budget-card__cta--locked {
  background: #9ca3af;
  color: #fff;
  cursor: not-allowed;
}

/* ----- Easy Budget · page-level ----- */

.fyc-eb-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
}
.fyc-eb-back {
  color: var(--fyc-text-mute);
  font-size: 12.5px;
  font-weight: 600;
  text-decoration: none;
}
.fyc-eb-back:hover { color: var(--fyc-navy); }

.fyc-eb-disclaimer {
  color: var(--fyc-coral);
  font-weight: 600;
}

.fyc-eb-recalc {
  font-size: 11.5px;
  color: var(--fyc-text-mute);
  font-style: italic;
  padding: 2px 8px;
  background: rgba(212, 175, 55, 0.12);
  border-radius: 4px;
  margin-left: auto;
}

.fyc-eb-kpi-grid {
  grid-template-columns: 2fr 1fr;
  margin-bottom: 14px;
}
@media (max-width: 700px) {
  .fyc-eb-kpi-grid { grid-template-columns: 1fr; }
}

/* ----- Easy Budget · pannello driver ----- */
.fyc-eb-drivers {
  margin: 22px 0 4px;
  padding: 16px 18px;
  background: #fff;
  border: 1px solid var(--fyc-border, #e5e7eb);
  border-radius: 10px;
  box-shadow: var(--fyc-shadow-md, 0 2px 8px rgba(0,0,0,0.06));
}
.fyc-eb-drivers-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.fyc-eb-drivers-title {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--fyc-text-mute);
}
.fyc-eb-drivers-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.fyc-eb-driver-toggle-label {
  font-size: 12px;
  color: var(--fyc-text-mute);
  margin-right: 4px;
}

.fyc-eb-driver-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px 22px;
}
.fyc-eb-driver {
  display: grid;
  grid-template-columns: 110px 1fr 50px;
  gap: 10px;
  align-items: center;
}
.fyc-eb-driver-label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--fyc-text);
}
.fyc-eb-driver-label .dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
}
.fyc-eb-driver-value {
  text-align: right;
  font-size: 13px;
  font-weight: 700;
  color: var(--fyc-navy);
  font-variant-numeric: tabular-nums;
}

/* Slider · navy track + gold thumb, cross-browser */
.fyc-eb-slider {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 6px;
  background: linear-gradient(90deg, #e5e7eb, #e5e7eb);
  border-radius: 999px;
  outline: none;
  cursor: pointer;
}
.fyc-eb-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--fyc-gold);
  border: 2px solid var(--fyc-navy);
  cursor: pointer;
  box-shadow: 0 1px 4px rgba(0,0,0,0.18);
  transition: transform 0.1s ease;
}
.fyc-eb-slider::-webkit-slider-thumb:hover { transform: scale(1.12); }
.fyc-eb-slider::-moz-range-thumb {
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--fyc-gold);
  border: 2px solid var(--fyc-navy);
  cursor: pointer;
}
.fyc-eb-slider::-moz-range-track {
  background: #e5e7eb;
  height: 6px;
  border-radius: 999px;
}
.fyc-eb-slider:focus-visible {
  outline: 2px solid var(--fyc-navy);
  outline-offset: 4px;
}

.fyc-eb-drivers-note {
  margin: 14px 0 0;
  font-size: 11.5px;
  color: var(--fyc-text-mute);
  font-style: italic;
}

/* ----- Easy Budget · banner upsell ----- */
.fyc-eb-upsell {
  margin: 26px 0 8px;
  padding: 14px 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.08) 0%, rgba(26, 58, 92, 0.05) 100%);
  border: 1px dashed rgba(212, 175, 55, 0.5);
  border-radius: 8px;
}
.fyc-eb-upsell-text {
  flex: 1;
  font-size: 12.5px;
  color: var(--fyc-text);
  line-height: 1.5;
}
.fyc-eb-upsell-text strong { color: var(--fyc-navy); margin-right: 4px; }

/* ----- Easy Budget · CTA "Continua con Leo" -----
   Callout teal (accento brand) tra il box "Cosa significa" e l'upsell
   Full Budget. Suggerisce di portare lo scenario impostato nella Chat
   AI di Leo (che lo legge automaticamente · vedi feat/leo-reads-budget). */
.fyc-leo-cta {
  margin: 22px 0 8px;
  padding: 16px 20px;
  display: flex;
  align-items: center;
  gap: 16px;
  background: linear-gradient(135deg, rgba(42, 166, 160, 0.10) 0%, rgba(77, 191, 179, 0.05) 100%);
  border: 1px solid rgba(42, 166, 160, 0.30);
  border-left: 4px solid #2aa6a0;
  border-radius: 8px;
}
.fyc-leo-cta__icon {
  font-size: 28px;
  line-height: 1;
  flex-shrink: 0;
}
.fyc-leo-cta__body { flex: 1; min-width: 0; }
.fyc-leo-cta__title {
  margin: 0 0 6px;
  font-size: 14px;
  font-weight: 700;
  color: var(--fyc-navy);
  letter-spacing: 0.01em;
}
.fyc-leo-cta__text {
  margin: 0;
  font-size: 12.5px;
  color: var(--fyc-text);
  line-height: 1.55;
}
.fyc-leo-cta__btn {
  flex-shrink: 0;
  padding: 10px 18px;
  background: var(--fyc-navy);
  color: #fff !important;
  border-radius: 8px;
  text-decoration: none !important;
  font-weight: 600;
  font-size: 13px;
  white-space: nowrap;
  transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
  box-shadow: 0 1px 3px rgba(26, 58, 92, 0.20);
}
.fyc-leo-cta__btn:hover {
  background: #14304a;
  transform: translateY(-1px);
  box-shadow: 0 3px 8px rgba(26, 58, 92, 0.32);
}
@media (max-width: 640px) {
  .fyc-leo-cta { flex-direction: column; align-items: flex-start; }
  .fyc-leo-cta__btn { width: 100%; text-align: center; }
}

/* ----- Report header (PDF + a schermo) ----- */
.fyc-eb-report-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 6px 0 14px;
  padding: 14px 16px;
  background: linear-gradient(135deg, var(--fyc-navy) 0%, #234975 100%);
  color: #fff;
  border-radius: 10px;
  box-shadow: var(--fyc-shadow-md, 0 2px 8px rgba(0,0,0,0.06));
}
.fyc-eb-report-title-block {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  flex: 1;
}
.fyc-eb-report-title {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  color: #fff;
  letter-spacing: -0.01em;
}
.fyc-eb-report-meta {
  font-size: 12.5px;
  color: rgba(255,255,255,0.78);
}
.fyc-eb-report-badge {
  display: inline-flex;
  align-items: center;
  padding: 5px 12px;
  background: var(--fyc-coral);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border-radius: 999px;
  white-space: nowrap;
}

/* ----- Box Ipotesi ----- */
.fyc-eb-hypothesis {
  margin: 0 0 16px;
  padding: 14px 16px;
  background: rgba(212, 175, 55, 0.08);
  border: 1px solid rgba(212, 175, 55, 0.35);
  border-radius: 8px;
}
.fyc-eb-hypothesis-title {
  margin: 0 0 10px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--fyc-navy);
}
.fyc-eb-hypothesis-grid {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 16px 24px;
}
.fyc-eb-hypothesis-block { min-width: 0; }
.fyc-eb-hypothesis-label {
  font-size: 11px;
  font-weight: 700;
  color: var(--fyc-text-mute);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 6px;
}
.fyc-eb-hypothesis-list {
  margin: 0;
  padding-left: 18px;
  font-size: 12px;
  line-height: 1.6;
  color: var(--fyc-text);
}
.fyc-eb-hypothesis-list li { margin-bottom: 2px; }
.fyc-eb-hypothesis-list strong { color: var(--fyc-navy); }
@media (max-width: 760px) {
  .fyc-eb-hypothesis-grid { grid-template-columns: 1fr; }
}

/* ----- Cascata OIC 10 12M · sempre aperta (no <details>) ----- */
.fyc-eb-cascata {
  margin: 22px 0 16px;
  background: #fff;
  border: 1px solid var(--fyc-border, #e5e7eb);
  border-radius: 8px;
  overflow: hidden;
}
.fyc-eb-cascata-header {
  padding: 12px 18px;
  display: flex;
  align-items: center;
  gap: 12px;
  background: rgba(26, 58, 92, 0.05);
  border-bottom: 1px solid var(--fyc-border, #e5e7eb);
}
.fyc-eb-cascata-title {
  margin: 0;
  font-weight: 700;
  font-size: 13.5px;
  color: var(--fyc-navy);
}

.fyc-eb-cascata-intro {
  padding: 10px 18px 6px;
  font-size: 11.5px;
  color: var(--fyc-text-mute);
  line-height: 1.55;
}
.fyc-eb-cascata-table-wrap {
  padding: 4px 12px 14px;
  overflow-x: auto;
}
.fyc-eb-cascata-table {
  width: 100%;
  font-size: 11.5px;
  border-collapse: collapse;
}
.fyc-eb-cascata-table th {
  padding: 8px 6px;
  background: var(--fyc-navy);
  color: #fff;
  font-weight: 700;
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
  text-align: center;
}
.fyc-eb-cascata-table th.fyc-eb-cascata-th-label {
  text-align: left;
  min-width: 220px;
}
.fyc-eb-cascata-table th.fyc-eb-cascata-th-total {
  background: var(--fyc-gold);
  color: var(--fyc-navy);
}
.fyc-eb-cascata-table td {
  padding: 6px 6px;
  border-bottom: 1px solid #eef2f6;
  white-space: nowrap;
}
.fyc-eb-cascata-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.fyc-eb-cascata-table td.pos { color: var(--fyc-teal); }
.fyc-eb-cascata-table td.neg { color: var(--fyc-coral); }
.fyc-eb-cascata-table td.fyc-eb-cascata-total {
  font-weight: 700;
  background: rgba(212, 175, 55, 0.08);
}

.fyc-eb-cascata-row--lvl1 td {
  background: rgba(26, 58, 92, 0.04);
  font-weight: 700;
  color: var(--fyc-navy);
}
.fyc-eb-cascata-row--lvl2 td {
  font-weight: 500;
}
.fyc-eb-cascata-code {
  display: inline-block;
  font-family: ui-monospace, SFMono-Regular, monospace;
  font-size: 10.5px;
  font-weight: 600;
  color: var(--fyc-text-mute);
  margin-right: 8px;
  min-width: 32px;
}
.fyc-eb-cascata-label-text { color: inherit; }
.fyc-eb-cascata-row--lvl2 .fyc-eb-cascata-label-text {
  padding-left: 14px;
  color: var(--fyc-text);
}

.fyc-eb-cascata-saldo td {
  background: var(--fyc-navy);
  color: #fff;
  font-weight: 700;
  padding: 9px 6px;
  border-top: 2px solid var(--fyc-gold);
}
.fyc-eb-cascata-saldo td.pos { color: #b6f0e4; }
.fyc-eb-cascata-saldo td.neg { color: #ffc4b8; }
.fyc-eb-cascata-saldo .fyc-eb-cascata-saldo-label {
  display: inline-block;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.fyc-eb-cascata-saldo .fyc-eb-cascata-saldo-note {
  display: inline-block;
  margin-left: 8px;
  font-size: 10.5px;
  font-weight: 400;
  color: rgba(255,255,255,0.7);
}
.fyc-eb-cascata-saldo td.fyc-eb-cascata-total {
  background: var(--fyc-gold);
  color: var(--fyc-navy);
}

/* ----- Disclaimer box ----- */
.fyc-eb-disclaimer-box {
  margin: 18px 0 0;
  padding: 12px 16px;
  background: rgba(226, 108, 90, 0.08);
  border-left: 3px solid var(--fyc-coral);
  border-radius: 6px;
  font-size: 12px;
  color: var(--fyc-text);
  line-height: 1.55;
}
.fyc-eb-disclaimer-box strong { color: var(--fyc-coral); }

/* ----- "Proponi con Leo" · button gold + callout proposta ----- */
.fyc-btn-leo {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 13px;
  background: linear-gradient(135deg, var(--fyc-gold) 0%, #b8902b 100%);
  color: var(--fyc-navy);
  border: 1px solid #a87f1f;
  border-radius: 6px;
  font-size: 12.5px;
  font-weight: 700;
  cursor: pointer;
  margin-right: 6px;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.fyc-btn-leo:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 3px 10px rgba(212, 175, 55, 0.35);
}
.fyc-btn-leo:disabled {
  cursor: wait;
  opacity: 0.7;
}
.fyc-btn-leo-icon { font-size: 13px; line-height: 1; }
.fyc-btn-leo--loading .fyc-btn-leo-icon {
  animation: fyc-leo-spin 1.4s linear infinite;
}
@keyframes fyc-leo-spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

.fyc-eb-leo-callout {
  margin: 14px 0 0;
  padding: 12px 14px 12px 16px;
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.10) 0%, rgba(26, 58, 92, 0.06) 100%);
  border: 1px solid rgba(212, 175, 55, 0.45);
  border-radius: 8px;
  position: relative;
}
.fyc-eb-leo-callout--fallback {
  background: rgba(226, 108, 90, 0.08);
  border-color: rgba(226, 108, 90, 0.35);
}
.fyc-eb-leo-callout-head {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
}
.fyc-eb-leo-callout-icon { font-size: 14px; }
.fyc-eb-leo-callout-title {
  font-size: 11.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--fyc-navy);
  flex: 1;
}
.fyc-eb-leo-callout-close {
  background: transparent;
  border: 0;
  color: var(--fyc-text-mute);
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  padding: 0 4px;
}
.fyc-eb-leo-callout-close:hover { color: var(--fyc-coral); }
.fyc-eb-leo-callout-rationale {
  margin: 0 0 6px;
  font-size: 13px;
  line-height: 1.55;
  color: var(--fyc-text);
}
.fyc-eb-leo-callout-note {
  margin: 0 0 6px;
  font-size: 12px;
  color: var(--fyc-navy);
  font-style: italic;
  line-height: 1.5;
}
.fyc-eb-leo-callout-disclaimer {
  margin: 8px 0 0;
  font-size: 11px;
  color: var(--fyc-text-mute);
  font-style: italic;
}

/* ----- Header callout v2 · tag cache + bottone Rigenera ----- */
.fyc-eb-leo-cache-tag {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--fyc-text-mute);
  padding: 1px 6px;
  border: 1px solid var(--fyc-border);
  border-radius: 999px;
}
.fyc-eb-leo-cache-tag:empty { display: none; }
.fyc-eb-leo-regen {
  font-size: 11.5px;
  padding: 4px 10px;
}

/* ----- 3 scenari probabilistici di Leo · griglia di card ----- */
.fyc-eb-leo-scenarios {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 4px 0 6px;
}
.fyc-eb-leo-empty {
  grid-column: 1 / -1;
  margin: 4px 0;
  font-size: 12.5px;
  color: var(--fyc-text-mute);
  font-style: italic;
}
.fyc-eb-scenario {
  display: flex;
  flex-direction: column;
  background: var(--fyc-surface, #fff);
  border: 1px solid var(--fyc-border);
  border-top: 3px solid var(--fyc-navy);   /* tono di default · override per id */
  border-radius: 8px;
  padding: 12px 12px 10px;
}
/* Accenti per scenario · prudente=coral, base=navy, ottimistico=teal */
.fyc-eb-scenario--prudente    { border-top-color: var(--fyc-coral); }
.fyc-eb-scenario--base        { border-top-color: var(--fyc-navy); }
.fyc-eb-scenario--ottimistico { border-top-color: var(--fyc-teal); }

.fyc-eb-scenario--active {
  box-shadow: 0 0 0 2px var(--fyc-gold) inset, 0 4px 12px rgba(212, 175, 55, 0.25);
  border-color: var(--fyc-gold);
}
.fyc-eb-scenario-head {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 4px;
}
.fyc-eb-scenario-name {
  font-size: 13px;
  font-weight: 700;
  color: var(--fyc-navy);
}
.fyc-eb-scenario-desc {
  margin: 0 0 8px;
  font-size: 11.5px;
  line-height: 1.45;
  color: var(--fyc-text-mute);
}
.fyc-eb-scenario-drivers {
  list-style: none;
  margin: 0 0 8px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.fyc-eb-scenario-drivers li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 12px;
}
.fyc-eb-scenario-drv-k {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--fyc-text);
}
.fyc-eb-scenario-drv-k .dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  display: inline-block;
}
.fyc-eb-scenario-drv-v {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--fyc-navy);
}
.fyc-eb-scenario-razionale {
  margin: 0 0 10px;
  font-size: 11px;
  line-height: 1.5;
  color: var(--fyc-text-mute);
  flex: 1;
}
.fyc-eb-scenario-apply {
  width: 100%;
  font-size: 12px;
  padding: 6px 10px;
}
.fyc-eb-scenario--active .fyc-eb-scenario-apply {
  background: var(--fyc-gold);
  border-color: var(--fyc-gold);
  color: var(--fyc-navy);
  font-weight: 600;
}

/* Responsive · sotto i 720px le 3 card si impilano */
@media (max-width: 720px) {
  .fyc-eb-leo-scenarios { grid-template-columns: 1fr; }
}

/* ----- Sezione "Proposta di Leo" dentro box ipotesi (per il PDF) ----- */
.fyc-eb-hypothesis-leo {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed rgba(212, 175, 55, 0.45);
}
.fyc-eb-hypothesis-leo-text {
  margin: 4px 0 4px;
  font-size: 12px;
  line-height: 1.55;
  color: var(--fyc-text);
}
.fyc-eb-hypothesis-leo-note {
  margin: 0;
  font-size: 11.5px;
  font-style: italic;
  color: var(--fyc-navy);
}

/* ----- Trend line · overlay etichetta sul chart ----- */
.fyc-eb-chart-wrap {
  position: relative;
}
.fyc-eb-trend-label {
  position: absolute;
  top: 8px;
  right: 12px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  background: #fff;
  border: 1px solid var(--fyc-text-mute, #6b7280);
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--fyc-text);
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
  z-index: 4;
  pointer-events: none;
}
.fyc-eb-trend-arrow {
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
}
.fyc-eb-trend-text strong { font-weight: 700; }

/* ----- Box "Cosa significa questo risultato" ----- */
.fyc-eb-interpret {
  margin: 18px 0 0;
  padding: 14px 16px 12px;
  background: #fff;
  border-radius: 8px;
  border: 1px solid var(--fyc-border, #e5e7eb);
  border-left-width: 4px;
  box-shadow: var(--fyc-shadow-md, 0 2px 8px rgba(0,0,0,0.06));
}
.fyc-eb-interpret--neg {
  border-left-color: var(--fyc-coral);
  background: linear-gradient(180deg, rgba(226,108,90,0.06) 0%, #fff 60%);
}
.fyc-eb-interpret--pos {
  border-left-color: var(--fyc-teal);
  background: linear-gradient(180deg, rgba(42,166,160,0.06) 0%, #fff 60%);
}
.fyc-eb-interpret-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.fyc-eb-interpret-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(26, 58, 92, 0.08);
  font-size: 16px;
  font-weight: 700;
}
.fyc-eb-interpret--neg .fyc-eb-interpret-icon {
  background: rgba(226, 108, 90, 0.16);
  color: var(--fyc-coral);
}
.fyc-eb-interpret--pos .fyc-eb-interpret-icon {
  background: rgba(42, 166, 160, 0.16);
  color: var(--fyc-teal);
}
.fyc-eb-interpret-title {
  margin: 0;
  flex: 1;
  font-size: 14px;
  font-weight: 700;
  color: var(--fyc-navy);
}
.fyc-eb-interpret-body p {
  margin: 0 0 8px;
  font-size: 13px;
  line-height: 1.55;
  color: var(--fyc-text);
}
.fyc-eb-interpret-body p:last-child { margin-bottom: 0; }
.fyc-eb-interpret-body strong { color: var(--fyc-navy); }
.fyc-eb-interpret--neg .fyc-eb-interpret-body strong { color: var(--fyc-coral); }
.fyc-eb-interpret--pos .fyc-eb-interpret-body strong { color: var(--fyc-teal); }
.fyc-eb-interpret-note {
  display: block;
  margin-top: 4px;
  font-size: 11.5px;
  color: var(--fyc-text-mute);
  font-style: italic;
}

/* ----- PAGINA 2 del PDF · layout compatto verticale -----
   Le 3 sezioni (cascata + interpretazione + disclaimer/upsell) sono
   wrappate in #pdfPage2All e catturate come singolo screenshot per
   restare in una sola pagina landscape. Riduco margini, padding e
   font della tabella cascata per starci comodamente.
*/
#pdfPage2All > .fyc-eb-cascata { margin-top: 0; margin-bottom: 10px; }
#pdfPage2All .fyc-eb-cascata-table { font-size: 10.5px; }
#pdfPage2All .fyc-eb-cascata-table th { padding: 6px 5px; font-size: 9.5px; }
#pdfPage2All .fyc-eb-cascata-table td { padding: 4px 5px; }
#pdfPage2All .fyc-eb-cascata-saldo td { padding: 6px 5px; }
#pdfPage2All #pdfPage2b { margin-top: 0; }
#pdfPage2All .fyc-eb-interpret { margin-top: 0; padding: 11px 14px 9px; }
#pdfPage2All .fyc-eb-interpret-body p { margin-bottom: 5px; font-size: 12px; line-height: 1.45; }
#pdfPage2All #pdfPage3 { margin-top: 8px; }
#pdfPage2All .fyc-eb-disclaimer-box { margin: 8px 0 0; padding: 9px 14px; font-size: 11.5px; line-height: 1.45; }
#pdfPage2All .fyc-eb-upsell { margin: 8px 0 0; padding: 10px 14px; }
#pdfPage2All .fyc-eb-upsell-text { font-size: 11.5px; line-height: 1.45; }

/* ----- Stampa A4: hint per il PDF (html2canvas non usa @media print
   ma le regole sotto migliorano la stampa diretta browser se l'utente
   lancia Ctrl+P direttamente sulla pagina) ----- */
@media print {
  .fyc-pdf-fab, .fyc-eb-drivers, .fyc-eb-recalc { display: none !important; }
  .fyc-eb-cascata { background: #fff; }
}

/* ============================================================
   COMPONENTE INFO-TOOLTIP RIUSABILE (.fyc-info)
   Icona ⓘ con bolla esplicativa. Hover (desktop) + tap/click (mobile).
   Agnostico: si inserisce in qualsiasi card.
   ============================================================ */
.fyc-info {
  position: absolute; top: 10px; right: 10px;
  width: 18px; height: 18px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--fyc-border); border-radius: 50%;
  background: var(--fyc-surface); color: var(--fyc-text-mute);
  font-size: 11px; font-weight: 700; font-style: italic;
  font-family: Georgia, 'Times New Roman', serif; line-height: 1;
  cursor: help; user-select: none; z-index: 2;
  transition: color 0.15s ease, border-color 0.15s ease;
}
.fyc-info:hover, .fyc-info:focus-visible, .fyc-info.is-open {
  color: var(--fyc-navy); border-color: var(--fyc-navy); outline: none;
}
.fyc-info__icon { pointer-events: none; }

/* Bolla · position:fixed con top/left settati da JS via
   getBoundingClientRect dell'icona. Sfugge da QUALSIASI overflow
   (tabelle scrollabili, toolbar, modal) e ha z-index altissimo
   per stare sopra a tutto.

   PORTALE (v3) · all'apertura JS sposta la bolla in document.body per
   neutralizzare antenati con transform/filter/will-change (che
   creerebbero un containing block per i figli fixed → clipping).
   Per questo i due selettori di visibilità sotto sono PARALLELI:
   - .fyc-info.is-open .fyc-info__bubble  → bolla NON ancora portalata
                                            (caso fallback / momento
                                            transitorio prima del portale)
   - .fyc-info__bubble.is-open            → bolla portalata in body
                                            (non più descendant dell'info)
*/
.fyc-info__bubble {
  position: fixed;
  top: 0;
  left: 0;
  width: max-content;
  max-width: 300px;
  background: var(--fyc-navy-dark);
  color: #fff;
  font-size: 12px;
  font-weight: 400;
  font-style: normal;
  line-height: 1.4;
  text-align: left;
  text-transform: none;
  letter-spacing: normal;
  white-space: normal;
  padding: 10px 12px;
  border-radius: 8px;
  box-shadow: var(--fyc-shadow-lg);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.15s ease, visibility 0.15s;
  z-index: 99999;
  pointer-events: none;
}
.fyc-info.is-open .fyc-info__bubble,
.fyc-info__bubble.is-open {
  opacity: 1;
  visibility: visible;
}

/* Variante inline: icona accanto a un titolo di sezione (non nell'angolo) */
.fyc-info--inline {
  position: relative;
  top: auto; right: auto;
  display: inline-flex;
  vertical-align: middle;
  margin-left: 6px;
}
.fyc-info--inline .fyc-info__bubble { right: auto; left: 0; }
.fyc-info--inline .fyc-info__bubble::before { right: auto; left: 6px; }

/* ============================================================================
   HOME REDESIGN v2 · token estesi + classi premium (premium fintech feel)
   ----------------------------------------------------------------------------
   Implementazione del design "FYC Banking - Home" (Claude Design handoff,
   2026-05-25). Approccio additive: aggiungiamo TOKEN estesi e CLASSI NUOVE
   senza riscrivere le esistenti. La home adotta queste classi; le altre
   pagine sono invariate (le classi base .fyc-kpi, .fyc-nav-tile vengono
   estese solo via modifier o sub-classi nuove).
   ============================================================================ */

:root {
  /* Palette estesa: hover/tint per ogni colore brand */
  --fyc-navy-700:      #14304d;
  --fyc-navy-800:      #0f2540;
  --fyc-navy-50:       #eef3f9;
  --fyc-gold-600:      #b8902b;
  --fyc-gold-50:       #fbf6e6;
  --fyc-teal-700:      #1f8a85;
  --fyc-teal-50:       #e6f5f4;
  --fyc-coral-700:     #b04432;
  --fyc-coral-50:      #fcebe7;

  /* Superfici aggiuntive */
  --fyc-surface-2:     #f9fafb;
  --fyc-surface-3:     #eef2f6;

  /* Testi soft */
  --fyc-text-soft:     #9ca3af;

  /* Borders */
  --fyc-border-strong: #d1d5db;

  /* Raggi extra */
  --fyc-radius-sm:     6px;
  --fyc-radius-lg:     16px;
  --fyc-radius-pill:   999px;

  /* Font mono per dati numerici / etichette tecniche */
  --fyc-font-mono:     "IBM Plex Mono", ui-monospace, "SF Mono", Consolas, "Liberation Mono", monospace;
}

/* Numeri tabulari · classe utility globale */
.fyc-num {
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}

/* Section head · eyebrow gold + meta destra */
.fyc-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 18px;
}
.fyc-eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fyc-text-mute);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0;
}
.fyc-eyebrow::before {
  content: '';
  width: 14px;
  height: 1px;
  background: var(--fyc-gold);
}
.fyc-section-meta {
  font-size: 12px;
  color: var(--fyc-text-soft);
}

/* ============================================================
   KPI HERO · variante "premium" per la home
   La classe base .fyc-kpi è in uso in altre pagine; estendiamo
   SOLO via modifier .fyc-kpi--hero per non rompere il resto.
   La grid wrapper .fyc-kpi-grid--home definisce 3 col × 2 righe.
   ============================================================ */

.fyc-kpi-grid--home {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 16px;
  margin-bottom: 16px;
}
.fyc-kpi-grid--home > .fyc-kpi { grid-column: span 2; }

.fyc-kpi--hero {
  background: var(--fyc-surface);
  border: 1px solid var(--fyc-border);
  border-radius: var(--fyc-radius);
  padding: 20px 22px 18px;
  box-shadow: var(--fyc-shadow-sm);
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 168px;
  text-decoration: none;
  color: inherit;
}
.fyc-kpi--hero:hover {
  transform: translateY(-2px);
  box-shadow: var(--fyc-shadow-md);
  border-color: var(--fyc-border-strong);
}

/* Children · classi nuove (sostituiscono nella home .label/.value/.delta) */
.fyc-kpi-label {
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  color: var(--fyc-text-mute);
  display: flex;
  align-items: center;
  gap: 8px;
}
.fyc-kpi-value {
  font-size: 28px;
  font-weight: 700;
  color: var(--fyc-navy);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  line-height: 1.1;
  margin: 12px 0 4px;
}
.fyc-kpi-value .cur {
  font-weight: 500;
  color: var(--fyc-text-mute);
  font-size: 0.62em;
  margin-left: 4px;
  vertical-align: 0.06em;
}
.fyc-kpi-sub {
  font-size: 12.5px;
  color: var(--fyc-text-mute);
  line-height: 1.45;
  flex: 1;
}
.fyc-kpi-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 14px;
  gap: 12px;
}

/* Variant: positivo (entrate teal) */
.fyc-kpi--hero.positive .fyc-kpi-value { color: var(--fyc-teal-700); }

/* Variant: critico (DSCR alert) · accento coral con stripe top + alert corner */
.fyc-kpi--hero.critical {
  border-color: var(--fyc-coral);
  background: linear-gradient(180deg, #fff 0%, #fff 60%, #fdf3f1 100%);
  box-shadow: 0 1px 2px rgba(15, 37, 64, 0.05), 0 0 0 1px rgba(226, 108, 90, 0.06);
}
.fyc-kpi--hero.critical:hover {
  border-color: var(--fyc-coral-700);
  box-shadow: 0 10px 28px -10px rgba(226, 108, 90, 0.35), 0 2px 8px rgba(15, 37, 64, 0.06);
}
.fyc-kpi--hero.critical::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--fyc-coral) 0%, #e88a7c 100%);
}
.fyc-kpi--hero.critical .fyc-kpi-value { color: var(--fyc-coral-700); }
.fyc-kpi--hero .alert-corner {
  position: absolute;
  top: 14px;
  right: 14px;
  display: none;
  align-items: center;
  gap: 5px;
  padding: 4px 9px 4px 7px;
  border-radius: var(--fyc-radius-pill);
  background: var(--fyc-coral-50);
  color: var(--fyc-coral-700);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  border: 1px solid rgba(226, 108, 90, 0.30);
}
.fyc-kpi--hero.critical .alert-corner { display: inline-flex; }
.fyc-kpi--hero .alert-corner i { font-size: 12px; }

.fyc-kpi-explainer {
  font-size: 11.5px;
  color: var(--fyc-coral-700);
  margin-top: 8px;
  line-height: 1.45;
  border-top: 1px dashed rgba(226, 108, 90, 0.30);
  padding-top: 8px;
  display: none;
  gap: 6px;
  align-items: flex-start;
}
.fyc-kpi--hero.critical .fyc-kpi-explainer { display: flex; }
.fyc-kpi-explainer i {
  color: var(--fyc-coral);
  margin-top: 1px;
  font-size: 12px;
  flex-shrink: 0;
}

/* Pills semaforo · OK/WARN/CRIT con bollino colorato e bordo soft */
.fyc-pill-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 9px 3px 8px;
  border-radius: var(--fyc-radius-pill);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border: 1px solid transparent;
  line-height: 1.4;
}
.fyc-pill-status::before {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 50%;
}
.fyc-pill-status.ok {
  color: var(--fyc-teal-700);
  background: var(--fyc-teal-50);
  border-color: rgba(42, 166, 160, 0.25);
}
.fyc-pill-status.ok::before {
  background: var(--fyc-teal);
  box-shadow: 0 0 0 3px rgba(42, 166, 160, 0.18);
}
.fyc-pill-status.warn {
  color: var(--fyc-gold-600);
  background: var(--fyc-gold-50);
  border-color: rgba(212, 175, 55, 0.30);
}
.fyc-pill-status.warn::before { background: var(--fyc-gold); }
.fyc-pill-status.crit {
  color: var(--fyc-coral-700);
  background: var(--fyc-coral-50);
  border-color: rgba(226, 108, 90, 0.30);
}
.fyc-pill-status.crit::before {
  background: var(--fyc-coral);
  box-shadow: 0 0 0 3px rgba(226, 108, 90, 0.18);
}

/* Fido bar minimal per la card Utilizzo fido */
.fyc-fido-bar {
  display: flex;
  align-items: center;
  gap: 8px;
}
.fyc-fido-bar__track {
  width: 100px;
  height: 6px;
  border-radius: 999px;
  background: var(--fyc-surface-3);
  position: relative;
  overflow: hidden;
}
.fyc-fido-bar__fill {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background: var(--fyc-teal);
  border-radius: 999px;
  transition: width 0.3s ease, background 0.3s ease;
}
.fyc-fido-bar__fill.warn { background: var(--fyc-gold); }
.fyc-fido-bar__fill.crit { background: var(--fyc-coral); }
.fyc-fido-bar__label {
  font-size: 10.5px;
  color: var(--fyc-text-soft);
  font-variant-numeric: tabular-nums;
}

/* ============================================================
   METABAR · pill orizzontale con icone + bank chips
   Coabita con la .fyc-meta-bar legacy (usata altrove); è una
   classe SEPARATA per evitare side-effect cross-page.
   ============================================================ */

.fyc-metabar {
  margin-top: 8px;
  background: var(--fyc-surface);
  border: 1px solid var(--fyc-border);
  border-radius: var(--fyc-radius);
  padding: 12px 20px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 24px;
  align-items: center;
  box-shadow: var(--fyc-shadow-sm);
  font-size: 12.5px;
  color: var(--fyc-text-mute);
}
.fyc-metabar .meta-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.fyc-metabar .meta-item i {
  color: var(--fyc-text-soft);
  font-size: 14px;
}
.fyc-metabar .meta-label { color: var(--fyc-text-soft); }
.fyc-metabar .meta-value { color: var(--fyc-text); font-weight: 500; }
.fyc-metabar .meta-value.mono {
  font-family: var(--fyc-font-mono);
  font-size: 11.5px;
}
.fyc-metabar .meta-sep {
  width: 1px;
  height: 14px;
  background: var(--fyc-border);
}
.fyc-metabar .banks {
  display: inline-flex;
  gap: 6px;
  align-items: center;
}
.fyc-bank-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 8px;
  border-radius: var(--fyc-radius-pill);
  background: var(--fyc-navy-50);
  color: var(--fyc-navy);
  font-size: 11px;
  font-weight: 500;
}
.fyc-bank-chip .dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--fyc-gold);
}

/* ============================================================
   TILE SCHERMATE v2 · estende .fyc-nav-tile (usata solo nella home)
   Aggiunge sub-elementi BEM: __head / __num / __icon / __title /
   __hint / __arrow. Mantiene retrocompatibilità con .tag/.title/
   .hint legacy (cambiamo il markup nella home, ma se qualcuno
   carica index.html cache vecchio non si rompe).
   ============================================================ */

.fyc-nav-grid--home {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.fyc-nav-tile--v2 {
  /* Override del .fyc-nav-tile · stile premium */
  padding: 22px 22px 20px;
  border-radius: var(--fyc-radius-lg);
  min-height: 124px;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: all 0.15s ease;
}
.fyc-nav-tile--v2:hover {
  border-color: var(--fyc-navy);
  box-shadow: var(--fyc-shadow-md);
  transform: translateY(-2px);
}
.fyc-nav-tile__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.fyc-nav-tile__num {
  font-family: var(--fyc-font-mono);
  font-size: 12px;
  font-weight: 500;
  color: var(--fyc-text-soft);
  letter-spacing: 0.08em;
  transition: color 0.15s ease;
}
.fyc-nav-tile--v2:hover .fyc-nav-tile__num { color: var(--fyc-gold); }
.fyc-nav-tile__icon {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: var(--fyc-navy-50);
  color: var(--fyc-navy);
  display: grid;
  place-items: center;
  font-size: 17px;
  transition: all 0.15s ease;
}
.fyc-nav-tile--v2:hover .fyc-nav-tile__icon {
  background: var(--fyc-navy);
  color: var(--fyc-gold);
}
.fyc-nav-tile__title {
  font-size: 17px;
  font-weight: 600;
  color: var(--fyc-navy);
  letter-spacing: -0.01em;
  margin-bottom: 4px;
}
.fyc-nav-tile__hint {
  font-size: 12.5px;
  color: var(--fyc-text-mute);
  line-height: 1.45;
  flex: 1;
}
.fyc-nav-tile__arrow {
  align-self: flex-end;
  color: var(--fyc-text-soft);
  font-size: 18px;
  transition: all 0.15s ease;
  margin-top: 8px;
}
.fyc-nav-tile--v2:hover .fyc-nav-tile__arrow {
  color: var(--fyc-gold);
  transform: translateX(2px);
}

/* ============================================================
   RESPONSIVE · Home redesign v2
   ============================================================ */
@media (max-width: 1080px) {
  .fyc-kpi-grid--home { grid-template-columns: repeat(4, 1fr); }
  .fyc-kpi-grid--home > .fyc-kpi { grid-column: span 2; }
  .fyc-nav-grid--home { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .fyc-kpi-grid--home { grid-template-columns: 1fr; }
  .fyc-kpi-grid--home > .fyc-kpi { grid-column: span 1; }
  .fyc-nav-grid--home { grid-template-columns: 1fr; }
}
