:root{
  --bg:#f8f9fc;            /* sfondo chiaro, più neutro */
  --surface:#ffffff;       /* card */
  --surface-2:#f4f5f9;     /* superfici soft, più neutre */
  --text:#1a1c2e;          /* testo scuro */
  --muted:#6b7280;         /* testo secondario */
  --accent:#6449EC;        /* viola brand */
  --accent-light:rgba(100,73,236,.08);  /* viola molto leggero */
  --border:rgba(20,22,43,.08);
  --shadow: 0 2px 8px rgba(20,22,43,.06);
  --radius:16px;
}

*{ box-sizing:border-box; }

html{ min-height:100%; background:var(--bg); }

body{
  margin:0;
  min-height:100%;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text);
  background: var(--bg);
}

/* ===== HEADER (banner viola) ===== */
.topbar{
  position:sticky; top:0; z-index:10;
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 14px;
  background: var(--accent);
  color:#fff;
  border-bottom:none;
  box-shadow: 0 4px 12px rgba(100,73,236,.15);
}

.topbar__actions{
  display:flex;
  align-items:center;
  gap:10px;
}

.icon-btn{
  width:42px;
  height:42px;
  border-radius:14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.28);
  background: rgba(255,255,255,.16);
  color:#fff;
  font-size:18px;
  text-decoration:none;
  transition: transform .15s ease, background .2s ease, color .2s ease;
}

.icon-btn i{
  line-height:1;
}

.icon-btn:active{
  transform:scale(.95);
}

.icon-btn--profile{
  background: rgba(255,255,255,.14);
}

.icon-btn--profile.is-active{
  background:#fff;
  color: var(--accent);
  border-color: rgba(255,255,255,.90);
}

.icon-btn--logout{
  background: rgba(255,77,77,.16);
  border-color: rgba(255,77,77,.32);
  color: #ffeff0;
}

.icon-btn--logout i{
  color:#ff4d4d;
}

.icon-btn--primary{
  background: var(--accent);
  border-color: rgba(0,0,0,.08);
  color:#fff;
  box-shadow: 0 4px 12px rgba(100,73,236,.18);
}

.icon-btn--primary i{
  color:#fff;
}

/* ===============================
   LOGO HEADER – auto formattato
   =============================== */

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  color:#fff;
  min-height:44px; /* stabilizza header */
}

/* Contenitore logo */
.brand__logo-img{
  height:36px;          /* altezza standard logo */
  width:auto;           /* larghezza automatica */
  max-width:160px;      /* evita loghi troppo larghi */
  object-fit:contain;   /* mantiene proporzioni */
  display:block;
	/* forzatura colore */
  filter: brightness(0) invert(1);
}

/* Testi accanto al logo */
.brand__text{
  display:flex;
  flex-direction:column;
  justify-content:center;
  line-height:1.1;
}

.brand__title{
  font-weight:800;
  font-size:15px;
  letter-spacing:.2px;
}

.brand__sub{
  font-size:12px;
  color:rgba(255,255,255,.80);
  margin-top:2px;
}
@media (max-width: 420px){
  .brand__logo-img{
    height:32px;
    max-width:120px;
  }

  .brand__title{
    font-size:14px;
  }
}

.container{
  padding:16px 14px 92px;
  max-width:760px;
  margin:0 auto;

  padding-bottom: 110px;
}

/* ===== CARD ===== */
.card{
  background: var(--surface);
  border:1px solid var(--border);
  border-radius: var(--radius);
  padding:14px;
  box-shadow: var(--shadow);
}

.h1{ font-size:20px; margin:0 0 12px; }
.h2{ font-size:16px; margin:0 0 10px; }
.p{ color:var(--muted); margin:6px 0 0; font-size:14px; }

/* ===== KPI GRID ===== */
.kpi{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:10px;
}

.kpi__item{
  padding:12px;
  border-radius:16px;
  border:1px solid var(--border);
  background: var(--surface-2);
}

.kpi__label{ color:var(--muted); font-size:12px; }
.kpi__value{ font-size:18px; font-weight:800; margin-top:4px; }

/* ===== BUTTONS ===== */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 14px;
  border-radius:14px;
  text-decoration:none;
  font-weight:700;
  border:1px solid rgba(255,255,255,.30);
}

.btn--primary{
  background: var(--accent);
  color:#fff;
  border-color: rgba(0,0,0,.08);
  box-shadow: 0 4px 12px rgba(100,73,236,.18);
}

.btn--ghost{
  background: rgba(255,255,255,.16);
  color:#fff;
  border:1px solid rgba(255,255,255,.30);
}

.btn--subtle{
  background: var(--surface-2);
  color: var(--text);
  border:1px solid var(--border);
  box-shadow: var(--shadow);
}

.btn--subtle.is-disabled{
  opacity:.55;
  pointer-events:none;
}

.btn--danger{
  background: #dc3545;
  color:#fff;
  border-color: rgba(0,0,0,.08);
  box-shadow: 0 4px 12px rgba(220,53,69,.25);
}

.btn--danger i{
  margin-right:6px;
}

.btn--small{
  padding:9px 10px;
  font-size:13px;
  border-radius:12px;
}

/* ===== FORMS ===== */
.form{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.input, .select{
  width:100%;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid var(--border);
  background: var(--surface);
  color:var(--text);
  outline:none;
}

.input::placeholder{
  color:rgba(21,22,43,.45);
}

/* ===== ALERT ===== */
.alert{
  padding:12px;
  border-radius:14px;
  background: rgba(255,77,77,.10);
  border:1px solid rgba(255,77,77,.25);
  color: #a81d1d;
}

/* ===== TABLE ===== */
.table{
  width:100%;
  border-collapse: collapse;
}

.table th, .table td{
  padding:10px 8px;
  border-bottom:1px solid rgba(20,22,43,.08);
  font-size:13px;
}

.table th{
  color:var(--muted);
  font-weight:700;
  text-align:left;
}

/* ===== BADGE ===== */
.badge{
  display:inline-block;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--border);
  font-size:12px;
  font-weight:700;
  background: var(--surface-2);
  color: var(--text);
}

.badge--ok{
  background: rgba(0,160,90,.10);
  border-color: rgba(0,160,90,.18);
  color: #0b6b3b;
}

.badge--warn{
  background: rgba(255,190,0,.14);
  border-color: rgba(255,190,0,.22);
  color: #7a5a00;
}

/* ===== LIST / ROW (cards lista) ===== */
.list{
  display:grid;
  gap:10px;
}

.row{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:flex-start;
  padding:12px;
  border-radius:16px;
  border:1px solid var(--border);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.row__title{ font-weight:800; }
.row__meta{ color:var(--muted); font-size:12px; margin-top:4px; }
.row__right{ text-align:right; }

.hr{
  height:1px;
  background: rgba(20,22,43,.08);
  margin:12px 0;
}

.small{ font-size:12px; color:var(--muted); }

/* ===== TABBAR (banner viola) ===== */
.tabbar{
  position:fixed;
  left:0;
  right:0;
  bottom:0;

  display:grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: auto auto;   /* 1ª riga pulsanti, 2ª riga footer */
  row-gap: 4px;

  background: var(--accent);
  border-top:none;
  padding:10px 8px calc(6px + env(safe-area-inset-bottom));
  box-shadow: 0 -4px 12px rgba(100,73,236,.15);
}

.tab{
  text-align:center;
  padding:10px 6px;
  border-radius:14px;
  text-decoration:none;
  color: rgba(255,255,255,.88);
  font-size:12px;
  font-weight:800;
}

.tab:hover{ color:#fff; }
.tab:active{ transform:scale(.98); }

.tab.is-active{
  background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.25);
  color:#fff;
}
/* ===============================
   App meta (copyright / version)
   =============================== */

.app-meta{
  grid-column: 1 / -1;        /* prende tutta la larghezza */
  text-align:center;
  font-size:11px;
  color:rgba(255,255,255,.70);
  padding-bottom: env(safe-area-inset-bottom);
  pointer-events:none;       /* non cliccabile */
}
/* ===============================
   Dashboard "bancaria"
   =============================== */

/* ===============================
   HERO HEADER - Design unificato
   =============================== */

.card--hero{
  padding:0;
  overflow:hidden;
  border:1px solid rgba(100,73,236,.18);
}

.dash-hero{
  padding:16px;
  background: var(--accent);
  color:#fff;
  display:flex;
  align-items:center;
  gap:14px;
}

/* Icona modulo a sinistra */
.hero-icon{
  width:48px;
  height:48px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.25);
  flex:0 0 auto;
}

.hero-icon i{
  font-size:20px;
  line-height:1;
  color:#fff;
}

/* Contenuto centrale */
.hero-content{
  flex:1 1 auto;
  min-width:0;
}

.hero-title{
  font-size:17px;
  font-weight:900;
  letter-spacing:.2px;
  line-height:1.2;
}

.hero-sub{
  margin-top:4px;
  font-size:13px;
  opacity:.88;
  line-height:1.3;
}

/* Badge/info a destra */
.hero-right{
  flex:0 0 auto;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:6px;
  text-align:right;
}

.hero-amount{
  font-size:18px;
  font-weight:900;
  letter-spacing:.2px;
}

.hero-count{
  font-size:12px;
  font-weight:800;
  opacity:.88;
}

/* Mobile: stack verticale sotto 400px */
@media (max-width: 400px){
  .dash-hero{
    flex-wrap:wrap;
  }
  .hero-right{
    width:100%;
    flex-direction:row;
    justify-content:space-between;
    align-items:center;
    margin-top:4px;
    padding-top:10px;
    border-top:1px solid rgba(255,255,255,.15);
  }
}

.pill{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  border:1px solid rgba(255,255,255,.22);
  background: rgba(255,255,255,.14);
  color:#fff;
  white-space:nowrap;
}

.pill--ok{
  background: rgba(0,190,110,.16);
  border-color: rgba(0,190,110,.30);
}

.pill--warn{
  background: rgba(255,190,0,.18);
  border-color: rgba(255,190,0,.32);
  color: #856404;
}

.pill--danger{
  background: rgba(220,53,69,.20);
  border-color: rgba(220,53,69,.35);
}

.pill--neutral{
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.22);
}

.pill--dev{
  background: rgba(0,0,0,.16);
  border-color: rgba(255,255,255,.18);
}

/* KPI cliccabili */
.dash-kpi{
  margin-top:12px;
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:10px;
}

.kpi-card{
  display:block;
  text-decoration:none;
  color:var(--text);
  padding:14px;
  border-radius:16px;
  border:1px solid var(--border);
  background: var(--surface-2);
  box-shadow: var(--shadow);
}

.kpi-card:active{ transform:scale(.99); }

.kpi-card__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}

.kpi-card__label{
  color:var(--muted);
  font-size:12px;
  font-weight:800;
}

.kpi-card__value{
  margin-top:10px;
  font-size:22px;
  font-weight:900;
  letter-spacing:.2px;
}

.kpi-card__sub{
  margin-top:4px;
  font-size:12px;
  color:var(--muted);
}

.kpi-card--disabled{
  opacity:.82;
}

/* Quick actions "bancarie" */
.dash-section{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:10px;
}

.quick-actions{
  margin-top:12px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:10px;
}

.qa{
  display:block;
  text-decoration:none;
  color:var(--text);
  padding:12px;
  border-radius:16px;
  border:1px solid var(--border);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.qa:active{ transform:scale(.99); }

.qa__title{
  font-weight:900;
  font-size:14px;
}

.qa__sub{
  margin-top:4px;
  font-size:12px;
  color:var(--muted);
}

.qa--ghost{
  background: var(--surface-2);
}

/* ===============================
   App-like lists & helpers
   =============================== */

.row--tap{
  text-decoration:none;
  color:inherit;
  cursor:pointer;
}

.row--tap:active{
  transform:scale(.99);
}

.row__chev{
  margin-top:6px;
  font-size:18px;
  line-height:1;
  opacity:.45;
}

.row__amount{
  margin-top:6px;
  font-weight:900;
  font-size:14px;
}

.pager{
  display:flex;
  justify-content:space-between;
  align-items:center;
}

/* Filtri più compatti e “app” */
.filters{
  display:grid;
  gap:10px;
}

@media (min-width: 520px){
  .filters{
    grid-template-columns: 1fr 1fr auto;
    align-items:end;
  }
}

/* Empty state */
.empty{
  text-align:center;
  padding:18px 14px;
}

.empty__title{
  font-weight:900;
  font-size:15px;
}

.empty__sub{
  margin-top:6px;
  color:var(--muted);
  font-size:13px;
}

/* ===== TABBAR con icone (FA4) ===== */
.tab{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
}

.tab i.fa{
  font-size:18px;
  line-height:1;
}

.tab__label{
  font-size:10px;
  font-weight:800;
  letter-spacing:.2px;
  opacity:.92;
}

/* Se vuoi SOLO icone, decommenta:
.tab__label{ display:none; }
*/

/* ===== Fattura dettaglio: lista righe compatta ===== */
.iban-line{
  margin-top:8px;
  font-weight:900;
  letter-spacing:.6px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid var(--border);
  background: var(--surface-2);
}

.bill-list{
  display:grid;
  gap:10px;
}

.bill-item{
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:12px;
  border-radius:16px;
  border:1px solid var(--border);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.bill-item__title{
  font-weight:900;
  font-size:14px;
}

.bill-item__meta{
  margin-top:4px;
  font-size:12px;
  color:var(--muted);
}

.bill-item__right{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
  margin-left:auto;
}

.bill-item__value{
  font-weight:900;
  white-space:nowrap;
}

/* ===============================
   Contratto dettaglio
   =============================== */

.detail-grid{
  margin-top:12px;
  display:grid;
  gap:10px;
}

.detail-field{
  padding:12px;
  border-radius:14px;
  border:1px solid var(--border);
  background: var(--surface);
  box-shadow: var(--shadow);
  display:flex;
  flex-direction:column;
  gap:6px;
}

.detail-field__label{
  font-size:12px;
  font-weight:800;
  color:var(--muted);
}

.detail-field__value{
  font-size:14px;
  font-weight:900;
  color:var(--text);
}

.detail-coverage{
  margin-top:16px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px;
  border-radius:14px;
  border:1px solid var(--border);
  background: var(--surface-2);
  font-size:14px;
  font-weight:800;
}

.detail-coverage i{
  font-size:18px;
}

.detail-coverage--ok{
  border-color: rgba(0,190,110,.28);
  background: rgba(0,190,110,.12);
  color:#0b6b3b;
}

.detail-coverage--warn{
  border-color: rgba(255,190,0,.32);
  background: rgba(255,190,0,.16);
  color:#7a5a00;
}

.profile-note{
  margin-top:12px;
  font-size:12px;
  color:var(--muted);
}

/* Badge predefinito inline (stile coerente con detail-coverage--ok) */
.badge-default{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:10px;
  border:1px solid rgba(0,190,110,.28);
  background: rgba(0,190,110,.12);
  color:#0b6b3b;
  font-size:11px;
  font-weight:700;
  white-space:nowrap;
}
.badge-default i{
  font-size:12px;
}
.badge-warning{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:10px;
  border:1px solid rgba(255,193,7,.4);
  background: rgba(255,193,7,.15);
  color:#856404;
  font-size:11px;
  font-weight:700;
  white-space:nowrap;
}
.badge-warning i{
  font-size:12px;
}

.profile-note a{
  color: var(--accent);
  text-decoration:none;
  font-weight:800;
}

.profile-note a:hover{
  text-decoration:underline;
}

.profile-tabs{
  display:flex;
  gap:10px;
  margin-bottom:12px;
}

.profile-tab{
  flex:1 1 0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px;
  border-radius:16px;
  border:1px solid var(--border);
  background: var(--surface-2);
  color: var(--text);
  text-decoration:none;
  font-weight:900;
  font-size:16px;
  box-shadow: var(--shadow);
  transition: transform .15s ease, box-shadow .2s ease, border-color .2s ease;
  cursor:pointer;
  outline:none;
}

.profile-tab i{
  pointer-events:none;
}

.profile-tab i{
  font-size:20px;
}

.profile-tab:hover{
  border-color: rgba(100,73,236,.35);
  transform: translateY(-1px);
}

.profile-tab:active{
  transform: scale(.98);
}

.profile-tab.is-active{
  background: rgba(100,73,236,.10);
  border-color: rgba(100,73,236,.25);
  color: var(--accent);
  box-shadow: 0 4px 12px rgba(100,73,236,.10);
}

.profile-section{
  margin-top:18px;
}

.profile-section.is-hidden{
  display:none;
}

@media (min-width: 520px){
  .detail-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ===============================
   Dashboard unificata (tiles)
   =============================== */

.dash-grid{
  margin-top:12px;
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:10px;
}

.dash-tile{
  display:block;
  width:100%;
  min-width:0;
  text-decoration:none;
  color:var(--text);
  padding:14px;
  border-radius:16px;
  border:1px solid var(--border);
  background: var(--surface);
  box-shadow: var(--shadow);
}

@media (max-width: 540px){
  .dash-grid{
    gap:8px;
  }

  .dash-tile{
    padding:12px;
    border-radius:14px;
  }

  .dash-tile__icon{
    width:36px;
    height:36px;
  }

  .dash-tile__value{
    font-size:20px;
  }

  .dash-tile__chev{
    font-size:18px;
  }
}

.dash-tile:active{ transform:scale(.99); }

.dash-tile__top{
  display:flex;
  align-items:center;
  gap:10px;
}

.dash-tile__icon{
  width:40px;
  height:40px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: var(--surface-2);
  border:1px solid var(--border);
  color: var(--accent);
  flex:0 0 auto;
}

.dash-tile__icon i.fa{
  font-size:18px;
  line-height:1;
}

.dash-tile__meta{
  min-width:0;
  flex:1 1 auto;
}

.dash-tile__label{
  color:var(--muted);
  font-size:12px;
  font-weight:800;
}

.dash-tile__value{
  margin-top:6px;
  font-size:22px;
  font-weight:900;
  letter-spacing:.2px;
}

.dash-tile__chev{
  margin-left:auto;
  font-size:20px;
  opacity:.35;
  flex:0 0 auto;
}

.dash-tile__bottom{
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}

.dash-tile__sub{
  font-size:12px;
  color:var(--muted);
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

@media (max-width: 540px){
  .dash-tile__bottom{
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
  }

  .dash-tile__sub{
    width:100%;
    white-space:normal;
  }
}

.dash-tile--disabled{
  opacity:.82;
	  pointer-events:none;
  cursor:default;

}
/* Dashboard tiles: fallback 1 colonna solo sotto i 360px */
@media (max-width: 360px){
  .dash-grid{
    grid-template-columns: 1fr;
  }
}


/* Evita che testi/pill allarghino la tile */
.dash-tile__meta{ min-width: 0; }
.dash-tile__value{ word-break: break-word; }

@media (max-width: 420px){
  .dash-tile__bottom{
    flex-wrap: wrap;
    row-gap: 8px;
  }
}


/* ===============================
   Filtri stile "banking"
   =============================== */

.filter-bar{
  display:grid;
  gap:12px;
}

.seg{
  border:1px solid var(--border);
  background: var(--surface);
  border-radius: 16px;
  padding:12px;
  box-shadow: var(--shadow);
  overflow: hidden;              /* contiene i figli */
}

.seg__label{
  font-size:12px;
  font-weight:900;
  color:var(--muted);
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:10px;
}


.filter-row{
  display:flex;
  gap:10px;
  align-items:end;
}

.field{
  flex: 1 1 auto;
  min-width: 0;
}

.field__label{
  font-size:12px;
  font-weight:900;
  color:var(--muted);
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:8px;
}

.field__control{
  position:relative;
}

.field__control .select{
  padding-right: 40px; /* spazio per chevron */
}

.field__chev{
  position:absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  opacity: .55;
  pointer-events:none;
}

/* bottone apply compatto e tappabile */
.btn--square{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding: 12px 12px;
  min-width: 88px;
  border-radius: 16px;
}

.btn--square i.fa{
  font-size: 18px;
}

.btn__label{
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .2px;
}

/* Mobile: tutto in colonna e bottoni più grandi */
@media (max-width: 420px){
.seg__btn{
    padding: 10px 10px;
    font-size: 11px;
    gap:6px;
  }
  .filter-row{
    flex-direction:column;
    align-items:stretch;
  }
  .btn--square{
    flex-direction:row;
    justify-content:center;
    min-width: unset;
  }
  .btn__label{
    font-size: 12px;
  }
}


@media (max-width: 360px){
  .seg__btn{
    padding: 8px 10px;
    font-size: 11px;
  }
  .seg__btn i.fa{
    font-size: 14px;
  }
}


/* ===== Filtri: bottoni stato sempre tappabili e "banking" ===== */

.seg__group{
  display:flex;
  gap:8px;
  width:100%;
  flex-wrap: wrap;              /* permette wrap su mobile */
}

.seg__btn{
  flex: 1 1 auto;               /* si adatta al contenuto */
  min-width: fit-content;       /* non taglia il testo */
  text-decoration: none !important;
  color: var(--text);
  background: var(--surface-2);
  border: 1px solid var(--border);
  box-shadow: var(--shadow);

  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;

  padding: 10px 14px;
  border-radius:12px;
  font-size: 13px;
  font-weight: 700;

  -webkit-tap-highlight-color: transparent;
}

.seg__btn:hover{
  text-decoration:none !important;
}

.seg__btn:visited{
  color: var(--text); /* evita viola “link visitato” */
}

.seg__btn:active{
  transform: scale(.99);
}

/* Stato selezionato */
.seg__btn.is-active{
  color:#fff;
  background: var(--accent);
  border-color: rgba(0,0,0,.08);
  box-shadow: 0 4px 12px rgba(100,73,236,.18);
}

.seg__btn.is-active i.fa{
  color:#fff;
}


/* Mobile: bottoni più compatti */
@media (max-width: 420px){
  .seg__group{ gap:6px; }
  .seg__btn{
    padding: 8px 12px;
    font-size: 12px;
    gap:5px;
  }
}


/* Gruppo anni: scroll orizzontale */
.seg__group--years{
  flex-wrap: nowrap;           /* forza 1 riga per scroll */
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 2px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.seg__group--years::-webkit-scrollbar{
  display: none;
}

/* Bottoni anno: dimensione fissa */
.seg__group--years .seg__btn{
  flex: 0 0 auto;
  padding: 8px 12px;
}

/* ===============================
   Alert Insolute (Dashboard)
   =============================== */

.alert-insolute{
  background: rgba(220,53,69,.06);
  border:1px solid rgba(220,53,69,.25);
}

.alert-insolute__header{
  display:flex;
  align-items:center;
  gap:10px;
}

.alert-insolute__icon{
  width:36px;
  height:36px;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(220,53,69,.15);
  color:#dc3545;
  flex:0 0 auto;
}

.alert-insolute__icon i{
  font-size:16px;
}

.alert-insolute__title{
  font-size:14px;
  font-weight:700;
  color:#a71d2a;
}

.alert-insolute__sub{
  font-size:12px;
  color:#721c24;
  opacity:.85;
  margin-top:6px;
}

.alert-insolute__list{
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid rgba(220,53,69,.18);
  display:flex;
  flex-direction:column;
  gap:8px;
}

.alert-insolute__item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 12px;
  border-radius:10px;
  background:#fff;
  border:1px solid rgba(220,53,69,.18);
  text-decoration:none;
  color:var(--text);
  font-size:13px;
}

.alert-insolute__item:active{
  transform:scale(.99);
}

.alert-insolute__item strong{
  color:#a71d2a;
}

.alert-insolute__item-right{
  display:flex;
  align-items:center;
  gap:10px;
}

.alert-insolute__item-right i{
  color:#dc3545;
  font-size:12px;
}

/* ===== LOGIN / RESET PAGE STYLES ===== */
.login-container{
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:16px;
  min-height:100%;
  justify-content:center;
}

.login-header{
  text-align:center;
  margin-bottom:20px;
}

.login-logo{
  width:64px;
  height:64px;
  background:var(--accent);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 12px;
  box-shadow: 0 6px 20px rgba(100,73,236,.25);
}

.login-logo i{
  font-size:30px;
  color:#fff;
}

.login-title{
  font-size:22px;
  font-weight:700;
  color:var(--text);
  margin:0 0 2px;
}

.login-subtitle{
  font-size:13px;
  color:var(--muted);
  margin:0;
  text-transform:uppercase;
  letter-spacing:1px;
}

.login-card{
  width:100%;
  max-width:360px;
}

.login-card .form{
  gap:10px;
}

.input-group{
  position:relative;
  display:flex;
  align-items:center;
}

.input-group i{
  position:absolute;
  left:14px;
  color:var(--muted);
  font-size:15px;
  z-index:1;
}

.input-group .input{
  padding-left:40px;
}

.btn--full{
  width:100%;
  justify-content:center;
}

@media (max-width: 480px){
  .login-container{
    padding:12px;
    justify-content:flex-start;
    padding-top:10vh;
  }

  .login-logo{
    width:56px;
    height:56px;
  }

  .login-logo i{
    font-size:26px;
  }

  .login-title{
    font-size:20px;
  }

  .login-subtitle{
    font-size:12px;
  }

  .login-card{
    max-width:100%;
  }

  .login-card .card{
    padding:14px;
  }
}