/* ============================================================
   CessioniItalia — admin.css
   Estratto da index.html senza modificare regole o ordine di cascata.
   ============================================================ */
/* ── ADMIN ── */
.awrap{max-width:1260px;margin:0 auto;padding:32px 24px;display:flex;gap:24px;align-items:flex-start}
.asb{width:224px;flex-shrink:0;background:#fff;border-radius:16px;border:1px solid var(--border);overflow:hidden;position:sticky;top:74px;box-shadow:var(--shadow)}
.asbt{background:var(--dark);padding:18px;display:flex;align-items:center;gap:12px}
.asbt .av{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--mid),var(--soft));display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:17px}
.asbt .an{color:#fff;font-size:13px;font-weight:700}
.asbt .ar{color:#5a7f9a;font-size:11px}
.anav{padding:8px 0}
.ani{display:flex;align-items:center;gap:10px;padding:11px 18px;cursor:pointer;font-size:13px;color:var(--muted);font-weight:500;transition:all .12s;border-left:3px solid transparent}
.ani:hover{background:var(--ice);color:var(--dark)}
.ani.on{background:var(--pale);color:var(--mid);font-weight:700;border-left-color:var(--mid)}
.ani .ni{font-size:16px;width:20px;text-align:center}
.anisep{border-top:1px solid var(--border);margin:6px 0}
.acon{flex:1;min-width:0}
.asec{display:none}.asec.on{display:block}
.shdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;flex-wrap:wrap;gap:10px}
.shdr h2{font-size:22px;font-weight:900;letter-spacing:-.5px}

/* KPI cards */
.kgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;margin-bottom:28px}
.kcard{background:#fff;border-radius:14px;border:1px solid var(--border);padding:20px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.kcard::before{content:'';position:absolute;top:0;left:0;right:0;height:3px}
.kcard-blue::before{background:linear-gradient(90deg,var(--navy),var(--mid))}
.kcard-green::before{background:linear-gradient(90deg,#1a6b42,var(--green))}
.kcard-amber::before{background:linear-gradient(90deg,#8a6200,var(--amber))}
.kcard-purple::before{background:linear-gradient(90deg,#4a1a9a,var(--purple))}
.kcard .ki{font-size:22px;margin-bottom:10px}
.kcard .kv{font-size:30px;font-weight:900;margin-bottom:2px;letter-spacing:-.8px}
.kcard .kl{font-size:12px;color:var(--muted)}
.kcard .kt{font-size:11px;font-weight:600;margin-top:6px}
.kcard .kt.up{color:var(--green)}.kcard .kt.warn{color:var(--amber)}

/* Charts */
.charts-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:24px}
.chart-box{background:#fff;border-radius:14px;border:1px solid var(--border);padding:20px;box-shadow:var(--shadow)}
.chart-title{font-size:13px;font-weight:700;color:var(--navy);margin-bottom:16px;display:flex;justify-content:space-between;align-items:center}
.chart-title span{font-size:11px;font-weight:500;color:var(--muted)}

/* Activity feed */
.activity-feed{background:#fff;border-radius:14px;border:1px solid var(--border);padding:20px;box-shadow:var(--shadow);margin-bottom:24px}
.af-title{font-size:13px;font-weight:700;color:var(--navy);margin-bottom:16px}
.af-item{display:flex;align-items:flex-start;gap:12px;padding:10px 0;border-bottom:1px solid #f0f5fa}
.af-item:last-child{border:none;padding-bottom:0}
.af-dot{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;margin-top:1px}
.af-dot-blue{background:var(--pale)}.af-dot-green{background:#d1fae5}.af-dot-amber{background:#fef3c7}
.af-text{flex:1;font-size:13px;color:var(--slate);line-height:1.5}
.af-text strong{color:var(--dark);font-weight:700}
.af-time{font-size:11px;color:var(--muted);white-space:nowrap;margin-top:1px}

.tbox{background:#fff;border-radius:14px;border:1px solid var(--border);overflow:hidden;box-shadow:var(--shadow);margin-bottom:24px}
.tbar{padding:14px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.tbar h3{font-size:14px;font-weight:700;flex:1}
.tsch{flex:1;min-width:150px;padding:8px 12px;border:1.5px solid var(--border);border-radius:9px;font-size:13px;outline:none;font-family:inherit;background:var(--ice)}
.tsch:focus{border-color:var(--mid)}
table{width:100%;border-collapse:collapse}
th{padding:10px 16px;text-align:left;font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.6px;border-bottom:1px solid var(--border);background:var(--ice);white-space:nowrap}
td{padding:12px 16px;font-size:13px;border-bottom:1px solid #f0f5fa;vertical-align:middle}
tr:last-child td{border-bottom:none}
tr:hover td{background:#f6fbff}
.sp{padding:3px 10px;border-radius:20px;font-size:10px;font-weight:700;white-space:nowrap;letter-spacing:.3px}
.sp-ok{background:#d1fae5;color:#065f46}
.sp-pend{background:#fef3c7;color:#92400e}
.sp-no{background:#fee2e2;color:#991b1b}
.sp-admin{background:#ede9fe;color:#5b21b6}
.sp-user{background:#f0f9ff;color:#0369a1}
.abts{display:flex;gap:5px;flex-wrap:wrap}
.pcard{background:#fff;border-radius:14px;border:1px solid var(--border);padding:22px;margin-bottom:16px;box-shadow:var(--shadow)}
.pcard-top{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:14px}

/* ── TOAST ── */
.tw{position:fixed;bottom:22px;right:22px;z-index:9999;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.toast{padding:12px 18px;border-radius:11px;color:#fff;font-size:13px;font-weight:600;box-shadow:0 8px 28px rgba(0,0,0,.2);animation:tin .25s ease;display:flex;align-items:center;gap:8px;max-width:320px;pointer-events:auto}
.t-ok{background:var(--green)}.t-err{background:var(--red)}.t-info{background:var(--mid)}

/* ── HOW IT WORKS ── */
.hiw{background:#fff;padding:64px 24px;border-top:1px solid var(--border)}
.hiw-inner{max-width:960px;margin:0 auto;text-align:center}
.section-eyebrow{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--soft);margin-bottom:10px}
.section-title{font-size:clamp(22px,4vw,34px);font-weight:900;letter-spacing:-.8px;color:var(--navy)}
.hiw-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:28px;margin-top:44px}
.hiw-item .hiw-icon{width:64px;height:64px;background:linear-gradient(135deg,var(--pale),#d4ecf7);border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:28px;margin:0 auto 16px;box-shadow:0 4px 12px rgba(45,111,168,.1)}
.hiw-item .hiw-title{font-size:15px;font-weight:800;margin-bottom:8px;color:var(--navy)}
.hiw-item .hiw-desc{font-size:13px;color:var(--muted);line-height:1.6}

/* ── CTA ── */
.cta-sec{background:linear-gradient(135deg,var(--navy) 0%,#16304f 50%,#1d4a72 100%);padding:64px 24px;text-align:center;position:relative;overflow:hidden}
.cta-sec::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 80% at 80% 50%,rgba(74,142,194,.12),transparent);pointer-events:none}
.cta-sec h2{color:#fff;font-size:clamp(22px,4vw,36px);font-weight:900;letter-spacing:-.8px;margin-bottom:12px;position:relative}
.cta-sec p{color:#7aa0be;font-size:16px;margin-bottom:30px;position:relative}

/* ── FOOTER ── */
footer{background:var(--dark);padding:48px 24px 28px}
.ftr{max-width:1200px;margin:0 auto}
.ftop{display:flex;justify-content:space-between;flex-wrap:wrap;gap:36px;margin-bottom:36px}
.fbrand-name{color:#fff;font-size:17px;font-weight:900;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.mini-mark{width:26px;height:26px;border-radius:7px;background:linear-gradient(135deg,var(--mid),var(--soft));display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.fbrand-desc{color:#3d607a;font-size:13px;line-height:1.65;max-width:270px}
.fcols{display:flex;gap:52px;flex-wrap:wrap}
.fcol h4{color:#6a8fa8;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;margin-bottom:14px}
.fcol a{display:block;color:#2d4f68;font-size:13px;margin-bottom:9px;text-decoration:none;cursor:pointer;transition:color .12s}
.fcol a:hover{color:#94a3b8}
.fbot{border-top:1px solid #1a2e45;padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
.fbot span{color:#253a4d;font-size:12px}

@media(max-width:900px){.hero-inner{flex-direction:column}.hero-right{width:100%}.charts-row{grid-template-columns:1fr}}
@media(max-width:780px){
  .main{flex-direction:column}
  .sb{position:static;width:100%;top:auto}   /* i filtri restano accessibili su mobile */
  /* Area admin su smartphone: la barra laterale diventa una barra di navigazione
     ORIZZONTALE scorrevole in alto, così TUTTE le sezioni (Feedback, In attesa,
     Utenti, Richieste, NDA…) restano raggiungibili anche da mobile. */
  .awrap{flex-direction:column;padding:14px 13px}
  .asb{display:block;width:100%;position:static;top:auto;border-radius:14px;margin-bottom:4px}
  .asbt{display:none}
  .anav{display:flex;gap:4px;padding:8px;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .anav .ani{flex:0 0 auto;white-space:nowrap;border-left:none;border-radius:9px;padding:9px 13px}
  .anav .ani.on{border-left:none;background:var(--pale)}
  .anav .anisep{display:none}
  .frow{grid-template-columns:1fr}
  .det-kpis{grid-template-columns:1fr 1fr}
  /* ── Area riservata su smartphone: niente overflow orizzontale ── */
  .acon,.asec{max-width:100%;min-width:0;width:100%}
  /* Le tabelle scorrono DENTRO il proprio riquadro, non allargano la pagina */
  .tbox table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .tbox th,.tbox td{padding:10px 12px}
  .shdr h2{font-size:19px}
  .kgrid{grid-template-columns:1fr 1fr;gap:10px}
  .kcard{padding:14px}
  .kcard .kv{font-size:24px}
  .charts-row{grid-template-columns:1fr}
  .chart-box{max-width:100%;overflow:hidden}
  .chart-box canvas{max-width:100%!important;height:auto!important}
  .pcard{padding:16px}
}
/* ════════════════════════════════════════════
   LIQUID GLASS — tema premium (override finale)
════════════════════════════════════════════ */
:root{
  --glass:rgba(255,255,255,.60);
  --glass-strong:rgba(255,255,255,.78);
  --glass-brd:rgba(255,255,255,.65);
  --glass-shadow:0 10px 34px rgba(20,52,92,.12),0 2px 8px rgba(20,52,92,.06),inset 0 1px 0 rgba(255,255,255,.65);
  --radius:18px;
}
body{
  background:
    radial-gradient(900px 620px at 8% -10%, rgba(120,170,235,.30) 0%, transparent 55%),
    radial-gradient(820px 560px at 98% 0%, rgba(150,205,240,.28) 0%, transparent 52%),
    radial-gradient(900px 680px at 55% 116%, rgba(120,210,190,.22) 0%, transparent 55%),
    linear-gradient(180deg,#eef4fb 0%,#f3f8fd 100%);
  background-attachment:fixed;
}
/* Superfici in vetro */
.card,.sb,.kcard,.socio-card,.pcard,.tbox,.activity-feed,.chart-box,.form-card{
  background:var(--glass);
  -webkit-backdrop-filter:blur(20px) saturate(1.5);backdrop-filter:blur(20px) saturate(1.5);
  border:1px solid var(--glass-brd);
  box-shadow:var(--glass-shadow);
  border-radius:var(--radius);
}
.card:hover{box-shadow:0 22px 50px rgba(20,52,92,.20),inset 0 1px 0 rgba(255,255,255,.7);transform:translateY(-3px);border-color:rgba(255,255,255,.85)}
.sb{border-radius:var(--radius)}
/* Header in vetro scuro */
header{background:rgba(12,23,40,.66);-webkit-backdrop-filter:blur(18px) saturate(1.3);backdrop-filter:blur(18px) saturate(1.3);border-bottom:1px solid rgba(255,255,255,.08)}
/* Trust bar e divisori in vetro chiaro */
.trust-bar{background:rgba(255,255,255,.5);-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);border-bottom:1px solid rgba(255,255,255,.5)}
/* Anteprima hero "mercato" in vetro */
.hero-card-preview{background:rgba(255,255,255,.10);-webkit-backdrop-filter:blur(22px) saturate(1.4);backdrop-filter:blur(22px) saturate(1.4);border:1px solid rgba(255,255,255,.22);box-shadow:0 20px 50px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.25)}
/* Pillola utente / pulsanti in vetro */
.upill{background:rgba(255,255,255,.08);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.14)}
.upill:hover{background:rgba(255,255,255,.16)}
/* Modali in vetro */
.ov{background:rgba(10,22,40,.42);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}
.modal{background:var(--glass-strong);-webkit-backdrop-filter:blur(28px) saturate(1.6);backdrop-filter:blur(28px) saturate(1.6);border:1px solid rgba(255,255,255,.6);box-shadow:0 30px 70px rgba(15,35,70,.35),inset 0 1px 0 rgba(255,255,255,.7);border-radius:24px}
.xbtn{background:rgba(255,255,255,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
/* Bottoni: profondità "liquid" */
.btn{border-radius:11px;letter-spacing:.2px}
.btn-primary{background:linear-gradient(135deg,#3a82c0,#255f9c);box-shadow:0 6px 18px rgba(37,95,156,.34),inset 0 1px 0 rgba(255,255,255,.3)}
.btn-purple{background:linear-gradient(135deg,#7d4fd0,#5b2fb0);box-shadow:0 6px 18px rgba(109,63,192,.32),inset 0 1px 0 rgba(255,255,255,.25)}
.btn-success{background:linear-gradient(135deg,#34a06e,#23824f)}
.btn-navy{background:linear-gradient(135deg,#28537f,#1b3a5c)}
.btn:hover{filter:brightness(1.04);transform:translateY(-1px)}
.btn-ghost{border-color:rgba(255,255,255,.18)}
.btn-outline{background:rgba(255,255,255,.4);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
/* Tag/badge sulle card: vetro scuro uniforme */
.ctag{background:rgba(10,24,44,.55);-webkit-backdrop-filter:blur(8px) saturate(1.3);backdrop-filter:blur(8px) saturate(1.3);border:1px solid rgba(255,255,255,.16);display:inline-flex;align-items:center;gap:4px}
.ckpi{background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.5)}
.dtrust,.det-kpi,.dmi{background:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
/* Titoli: tono premium */
.section-title,.hero h1{letter-spacing:-1px}
/* Allineamento icone inline */
.btn svg,.ctag svg,.dtrust svg,.sblbl svg,.tb-item svg,.fl svg,.ani svg,.an-ico svg,.hcp-label svg{flex-shrink:0}
[data-ic]{display:inline-flex;align-items:center}
.chat-li .ava{color:#fff}