/* ENOVA LINK — stile famiglia ENOVA (blu/acqua), stesso spirito di ENOVA CALL/FISCALE */
:root{
  --blu:#0b2e9e; --blu-scuro:#071c63; --blu-chiaro:#1547d6; --acqua:#0fc0aa; --acqua-scuro:#0a9c8a;
  --testo:#1b2530; --grigio:#5f6f80; --bordo:#d9e0ea; --sfondo:#f3f6fb; --bianco:#fff;
  --rosso:#d64545; --verde:#1f9d57; --giallo:#d9a300; --arancio:#e07a2b; --viola:#6b46c1;
  --ombra:0 10px 30px rgba(7,20,60,.10); --raggio:12px;
}
*{box-sizing:border-box} html,body{margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--testo);background:var(--sfondo);font-size:15px;line-height:1.45}
a{color:var(--blu);text-decoration:none} a:hover{text-decoration:underline}
h1,h2,h3,h4{margin:0 0 .5em} h2{font-size:20px;color:var(--blu)} h3{font-size:16px;color:var(--blu-scuro)}
.piccolo{font-size:12.5px;color:var(--grigio)} .vuoto{padding:30px;text-align:center;color:var(--grigio)}
code{background:#eef2f9;border:1px solid var(--bordo);border-radius:5px;padding:1px 6px;font-size:12.5px;font-family:ui-monospace,Menlo,Consolas,monospace;word-break:break-all}
pre{background:#0d1b3e;color:#e7eefc;border-radius:10px;padding:14px;overflow:auto;font-size:12.5px;line-height:1.5}

/* bottoni */
.btn{display:inline-flex;align-items:center;gap:7px;border:0;border-radius:9px;padding:9px 16px;font-size:14px;font-weight:600;cursor:pointer;background:#e7ecf5;color:var(--testo);transition:.12s}
.btn:hover{filter:brightness(.97)} .btn:disabled{opacity:.5;cursor:default}
.btn-primario{background:linear-gradient(135deg,var(--blu) 0%,var(--blu-chiaro) 100%);color:#fff}
.btn-acqua{background:linear-gradient(135deg,var(--acqua-scuro),var(--acqua));color:#fff}
.btn-chiaro{background:#eef2f9;color:var(--blu)} .btn-rosso{background:var(--rosso);color:#fff}
.btn-largo{width:100%;justify-content:center;padding:12px} .btn-piccolo{padding:5px 11px;font-size:12.5px}
.btn-ghost{background:transparent;border:1px solid var(--bordo);color:var(--blu)}

/* login */
#schermata-login,#schermata-password{display:none;min-height:100vh;align-items:center;justify-content:center;padding:20px;background:linear-gradient(146deg,var(--blu-scuro) 0%,#0a2a92 52%,var(--blu-chiaro) 100%)}
#schermata-login.attiva,#schermata-password.attiva{display:flex}
.box-login{background:#fff;max-width:430px;width:100%;border-radius:18px;padding:34px 30px;box-shadow:0 24px 60px rgba(4,16,60,.4)}
.logo-login{text-align:center;margin-bottom:8px} .logo-login img{max-width:230px;width:80%}
.sottotitolo{text-align:center;color:var(--grigio);font-size:13.5px;margin-bottom:20px}
.campo{margin-bottom:14px} .campo label{display:block;font-weight:600;font-size:13px;margin-bottom:5px;color:var(--blu-scuro)}
.campo input,.campo select,.campo textarea,.modale-corpo input,.modale-corpo select,.modale-corpo textarea{width:100%;border:1px solid var(--bordo);border-radius:9px;padding:10px 12px;font-size:14px;font-family:inherit;background:#fff}
.campo input:focus{outline:2px solid var(--blu-chiaro);border-color:var(--blu-chiaro)}
.campo-occhio{position:relative} .campo-occhio .occhio{position:absolute;right:8px;top:7px;background:0;border:0;cursor:pointer;font-size:17px}
.avviso{border-radius:9px;padding:10px 12px;font-size:13.5px;margin-top:10px}
.avviso.errore{background:#fdeaea;color:#a12b2b;border:1px solid #f2b8b8}
.piede{margin-top:16px;text-align:center;color:var(--grigio);font-size:12px}

/* struttura app */
#schermata-app{display:none} #schermata-app.attiva{display:block}
.barra-alta{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:14px;background:#fff;border-bottom:1px solid var(--bordo);padding:8px 18px;box-shadow:0 2px 10px rgba(7,20,60,.05)}
.barra-alta .marchio img{height:42px;display:block} .spazio{flex:1}
.utente-info{display:flex;flex-direction:column;align-items:flex-end;background:0;border:0;cursor:pointer;line-height:1.15}
.utente-info b{font-size:13.5px} .utente-info small{font-size:11.5px;color:var(--grigio)}
.esci{background:#eef2f9;border:0;border-radius:8px;padding:8px 12px;cursor:pointer;font-size:13px;font-weight:600;color:var(--blu)}
.menu{display:flex;gap:4px;flex-wrap:wrap;padding:10px 18px 0;background:#fff;border-bottom:1px solid var(--bordo);position:sticky;top:51px;z-index:40}
.menu button{background:0;border:0;border-bottom:3px solid transparent;padding:9px 14px;cursor:pointer;font-size:14px;font-weight:600;color:var(--grigio);display:flex;align-items:center;gap:7px;border-radius:8px 8px 0 0}
.menu button:hover{background:#f3f6fb;color:var(--blu)} .menu button.attivo{color:var(--blu);border-bottom-color:var(--acqua)}
.menu .mi{font-size:16px}
.contenuto{max-width:1180px;margin:0 auto;padding:22px 18px 60px}

/* schede/riquadri */
.riquadro{background:#fff;border:1px solid var(--bordo);border-radius:var(--raggio);box-shadow:var(--ombra);padding:18px;margin-bottom:18px}
.riquadro>h3{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.griglia{display:grid;gap:16px} .g2{grid-template-columns:repeat(2,1fr)} .g3{grid-template-columns:repeat(3,1fr)} .g4{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.griglia-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}
.tile{background:linear-gradient(135deg,#fff,#f7faff);border:1px solid var(--bordo);border-radius:12px;padding:16px}
.tile .n{font-size:26px;font-weight:800;color:var(--blu)} .tile .e{font-size:12.5px;color:var(--grigio)}

/* tabelle */
table.tab{width:100%;border-collapse:collapse;font-size:13.5px}
table.tab th,table.tab td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--bordo);vertical-align:middle}
table.tab th{color:var(--grigio);font-size:12px;text-transform:uppercase;letter-spacing:.3px;background:#fafcff}
table.tab tr:hover td{background:#f7faff}
.azioni{white-space:nowrap;text-align:right} .azioni .btn{margin-left:5px}
.badge{display:inline-block;border-radius:999px;padding:2px 10px;font-size:11.5px;font-weight:700;color:#fff;background:var(--grigio)}
.badge.verde{background:var(--verde)} .badge.rosso{background:var(--rosso)} .badge.giallo{background:var(--giallo)} .badge.blu{background:var(--blu-chiaro)} .badge.grigio{background:#9aa7b6} .badge.acqua{background:var(--acqua-scuro)} .badge.arancio{background:var(--arancio)} .badge.viola{background:var(--viola)}
.az{display:inline-block;border-radius:6px;padding:2px 8px;font-size:11px;font-weight:700;color:#fff}

/* interruttori permessi */
.interruttore{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;cursor:pointer;margin:3px 10px 3px 0}
.perm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:4px;margin:8px 0}

/* modale */
.sfondo-modale{display:none;position:fixed;inset:0;background:rgba(7,20,60,.5);z-index:100;align-items:flex-start;justify-content:center;padding:30px 16px;overflow:auto}
.sfondo-modale.aperto{display:flex}
.modale{background:#fff;border-radius:16px;width:100%;max-width:560px;box-shadow:0 30px 70px rgba(4,16,60,.45);animation:su .15s}
@keyframes su{from{transform:translateY(12px);opacity:0}to{transform:none;opacity:1}}
.modale-testa{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--bordo)}
.modale-testa h2{margin:0;font-size:17px} .chiudi{background:0;border:0;font-size:24px;cursor:pointer;color:var(--grigio);line-height:1}
.modale-corpo{padding:18px 20px;max-height:66vh;overflow:auto} .modale-piede{padding:14px 20px;border-top:1px solid var(--bordo);display:flex;justify-content:flex-end;gap:10px}
.aiuto{font-size:12px;color:var(--grigio);margin-top:4px}
.sezione-form{border-top:1px solid var(--bordo);margin-top:14px;padding-top:12px}

/* brindisi (toast) */
#brindisi{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(80px);background:var(--blu-scuro);color:#fff;padding:12px 20px;border-radius:10px;box-shadow:0 12px 30px rgba(4,16,60,.4);z-index:200;opacity:0;transition:.25s;font-size:14px;max-width:90vw}
#brindisi.mostra{transform:translateX(-50%);opacity:1} #brindisi.errore{background:var(--rosso)}

.riga-strumenti{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.riga-strumenti .cresci{flex:1}
.chip{display:inline-flex;align-items:center;gap:6px;background:#eef2f9;border-radius:999px;padding:4px 11px;font-size:12.5px;color:var(--blu-scuro);font-weight:600}
.pallino{width:9px;height:9px;border-radius:50%;background:#9aa7b6;display:inline-block} .pallino.verde{background:var(--verde)} .pallino.rosso{background:var(--rosso)} .pallino.giallo{background:var(--giallo)}

@media (max-width:720px){
  .g2,.g3,.griglia-2{grid-template-columns:1fr}
  .contenuto{padding:16px 14px 50px}
  .barra-alta{padding:8px 12px;gap:8px} .barra-alta .marchio img{height:28px}
  table.tab thead{display:none}
  table.tab,table.tab tbody,table.tab tr,table.tab td{display:block;width:100%}
  table.tab tr{border:1px solid var(--bordo);border-radius:10px;margin-bottom:10px;padding:6px 10px;background:#fff}
  table.tab td{border:0;padding:6px 0;display:flex;justify-content:space-between;gap:12px}
  table.tab td::before{content:attr(data-et);font-weight:700;color:var(--grigio);font-size:12px}
  table.tab td.azioni{justify-content:flex-end} table.tab td.azioni::before{content:''}
}

/* =====================================================================
   v1.1.0 — VESTE GRAFICA ENOVA APT (stessa famiglia visiva):
   filigrana azzurra sfumata, intestazione con linea blu→acqua, menu a
   pillole con icona nel riquadro, schede senza bordo con ombre morbide,
   pulsanti sfumati, badge a pillola
   ===================================================================== */
:root {
  --raggio: 14px;
  --ombra: 0 6px 18px rgba(11,46,158,.10), 0 1px 3px rgba(11,46,158,.06);
  --sfondo: #edf2fb; --superficie: #ffffff; --superficie-2: #f7f9fc;
  --linea: #e3e9f4; --linea-2: #c1cad6; --blu-bg: #e6ecfa; --bordo-attivo: #c9d6f7; --testo-2: #5f6f80;
}
body { background: #eef3fc; letter-spacing: -.005em; }
/* filigrana */
body::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(1100px 640px at 102% -8%, rgba(21,71,214,.42), rgba(20,190,224,.22) 40%, transparent 66%),
    radial-gradient(1000px 620px at -8% 106%, rgba(11,46,158,.46), rgba(21,71,214,.18) 45%, transparent 66%),
    radial-gradient(700px 420px at 55% 50%, rgba(15,192,170,.06), transparent 65%),
    linear-gradient(180deg, #e9effb 0%, #f0f4fd 55%, #ecf2fc 100%);
}
#schermata-login, #schermata-password {
  position: relative; z-index: 0;
  background:
    radial-gradient(1000px 520px at 82% 6%, rgba(20,190,224,.35), transparent 62%),
    radial-gradient(760px 460px at 8% 96%, rgba(15,192,170,.30), transparent 60%),
    linear-gradient(146deg, #071c63 0%, #0a2a92 52%, #1547d6 100%);
}
.box-login { border-radius: 16px; box-shadow: 0 20px 50px rgba(4,16,60,.34); }
:focus-visible { outline: 2px solid var(--acqua); outline-offset: 2px; }

/* intestazione */
.barra-alta { position: sticky; height: 64px; padding: 0 20px; border-bottom: none; box-shadow: 0 1px 0 var(--linea), 0 4px 16px rgba(11,46,158,.06); }
.barra-alta::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; background: linear-gradient(90deg, #0b2e9e, #0fc0aa 60%, #14bee0); pointer-events: none; }
.barra-alta .marchio img { height: 44px; width: auto; }
.barra-alta .utente-info b { color: var(--blu); }
.barra-alta .esci, .barra-alta .utente-info { border-radius: 999px; background: var(--superficie-2); border: 1px solid var(--linea); color: var(--blu); padding: 7px 14px; }
.barra-alta .esci:hover, .barra-alta .utente-info:hover { background: var(--sfondo); }

/* menu a pillole con icona */
.menu { top: 64px; display: flex; gap: 8px; padding: 10px 14px; background: transparent; border-bottom: none; overflow: visible; }
.menu button {
  flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  padding: 7px 4px; font-size: 12.5px; font-weight: 600; line-height: 1.15; text-align: center;
  border: 1px solid var(--linea); border-bottom: 1px solid var(--linea); border-radius: 12px; background: var(--superficie); color: var(--testo-2);
  min-height: 60px; position: relative; box-shadow: var(--ombra); transition: box-shadow .15s, transform .06s, border-color .15s;
}
.menu button .mi { width: 30px; height: 30px; border-radius: 9px; background: var(--sfondo); display: grid; place-items: center; font-size: 16px; line-height: 1; }
.menu button:hover { color: var(--blu); border-color: var(--bordo-attivo); background: var(--superficie); }
.menu button.attivo { background: var(--superficie); color: var(--blu); border-color: var(--bordo-attivo); box-shadow: inset 0 -3px 0 var(--acqua), var(--ombra); }
.menu button.attivo .mi { background: var(--blu-bg); }

/* contenuti */
.contenuto { padding-bottom: 90px; animation: entra .18s ease; }
@keyframes entra { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.riquadro { border: none; border-radius: 16px; box-shadow: var(--ombra); }
.riquadro > h3 { position: relative; padding-left: 16px; }
.riquadro > h3::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 8px; height: 8px; border-radius: 50%; background: var(--acqua); }
.tile { border: none; border-radius: 16px; padding: 16px 18px; position: relative; overflow: hidden; background: var(--superficie); box-shadow: var(--ombra); }
.tile::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 5px; background: var(--blu-chiaro); }
.tile:nth-child(2)::before { background: var(--acqua); } .tile:nth-child(3)::before { background: var(--verde); } .tile:nth-child(4)::before { background: #14bee0; }
.tile .n { font-size: 34px; letter-spacing: -.03em; }
.tile .e { font-size: 11.5px; text-transform: uppercase; letter-spacing: .6px; font-weight: 700; }
.tiles { margin-bottom: 18px; }

/* pulsanti */
.btn { border-radius: 10px; }
.btn-primario { background: linear-gradient(135deg, #0b2e9e, #1547d6); color: #fff; box-shadow: 0 4px 12px rgba(11,46,158,.22); border: none; }
.btn-primario:hover { box-shadow: 0 6px 16px rgba(11,46,158,.3); transform: translateY(-1px); filter: none; }
.btn-acqua { background: linear-gradient(135deg, #0fc0aa, #14bee0); color: #052b26; border: none; box-shadow: 0 4px 12px rgba(15,192,170,.25); }
.btn-acqua:hover { transform: translateY(-1px); filter: none; }
.btn-chiaro { background: var(--superficie); color: var(--blu); border: 1px solid var(--linea); box-shadow: var(--ombra); }
.btn-chiaro:hover { background: var(--superficie-2); }
.btn-ghost { background: var(--superficie-2); border-color: var(--linea); }
.btn-rosso { background: #fdecea; color: var(--rosso); }

/* badge, campi, tabelle, finestre */
.badge { border-radius: 999px; padding: 3px 9px; font-size: 10.5px; letter-spacing: .4px; }
.chip { background: var(--blu-bg); }
.campo label { font-weight: 700; font-size: 12px; letter-spacing: .4px; text-transform: uppercase; color: var(--testo-2); }
.campo input, .campo select, .campo textarea, .modale-corpo input, .modale-corpo select, .modale-corpo textarea { border-radius: 10px; border-color: var(--linea); background: var(--sfondo); }
.campo input:focus, .campo select:focus, .campo textarea:focus, .modale-corpo input:focus, .modale-corpo select:focus { outline: none; background: var(--superficie); border-color: var(--acqua); box-shadow: 0 0 0 3px rgba(15,192,170,.18); }
.box-login .campo input { background: #fff; border-color: var(--linea-2); }
table.tab th { background: var(--superficie-2); border-bottom-color: var(--linea); }
table.tab td { border-bottom-color: var(--linea); }
table.tab tbody tr:hover td { background: var(--superficie-2); }
.sfondo-modale { backdrop-filter: blur(2px); background: rgba(16,32,52,.55); }
.modale { border-radius: 20px; }
.modale-testa, .modale-piede { border-color: var(--linea); }
.sezione-form > h3 { font-size: 12px; text-transform: uppercase; letter-spacing: .8px; color: var(--blu); font-weight: 800; border-bottom: 2px solid var(--linea); padding-bottom: 7px; }
.avviso { border-radius: 12px; }
.avviso.info { background: var(--blu-bg); color: var(--blu); border: 0; }
.vuoto::before { content: "◌"; display: block; font-size: 28px; color: var(--acqua); margin-bottom: 6px; }

/* telefono: menu a pillole compatte in griglia */
@media (max-width: 720px) {
  .barra-alta { height: 54px; padding: 0 10px; gap: 6px; }
  .barra-alta .marchio img { height: auto; max-height: 34px; max-width: 100%; }
  .barra-alta .esci, .barra-alta .utente-info { padding: 7px 10px; font-size: 12.5px; }
  .menu { top: 54px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; padding: 6px 8px; }
  .menu button { min-height: 46px; padding: 4px 2px 5px; gap: 2px; font-size: 10px; border-radius: 10px; }
  .menu button .mi { width: 24px; height: 24px; font-size: 14px; border-radius: 7px; }
  .tile .n { font-size: 26px; }
  .modale { border-radius: 16px; }
}
/* istruzioni */
.tasto { display: inline-block; background: var(--blu-bg); color: var(--blu); border-radius: 7px; padding: 1px 8px; font-weight: 700; font-size: 13px; white-space: nowrap; }
.istr-corpo h4 { color: var(--blu); margin: 14px 0 6px; }
.istr-corpo table { width: 100%; border-collapse: collapse; font-size: 13px; margin: 6px 0; }
.istr-corpo th, .istr-corpo td { text-align: left; vertical-align: top; padding: 7px 8px; border-bottom: 1px solid var(--linea); }
.istr-corpo th { background: var(--superficie-2); font-size: 11.5px; text-transform: uppercase; letter-spacing: .4px; color: var(--testo-2); }
.istr-corpo ul, .istr-corpo ol { padding-left: 20px; }

/* =====================================================================
   ENOVA AGENTI — aggiunte: selettore portale, portale Venus incorporato
   ===================================================================== */
.selettore-portale{display:flex;align-items:center;gap:8px;background:var(--superficie-2);border:1px solid var(--linea);border-radius:999px;padding:5px 12px 5px 6px;cursor:pointer;font-size:13px;max-width:280px}
.selettore-portale:hover{background:var(--sfondo)}
.selettore-portale.unico{cursor:default}
.selettore-portale .pt-sigla{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:24px;padding:0 7px;border-radius:999px;background:var(--blu);color:#fff;font-weight:800;font-size:11.5px}
.selettore-portale .pt-nome{font-weight:700;color:var(--blu-scuro);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:170px}
.selettore-portale .pt-freccia{color:var(--grigio);font-size:11px}
@media(max-width:720px){.selettore-portale .pt-nome{display:none}}

/* contenuto a pieno schermo per il portale Venus */
.contenuto.pieno{max-width:none;padding:10px 12px 0;height:calc(100vh - 64px - 80px);min-height:420px}
@media(max-width:720px){.contenuto.pieno{padding:6px 6px 0;height:calc(100vh - 54px - 150px)}}
#venus-box{position:relative;height:100%;border-radius:14px;overflow:hidden;box-shadow:var(--ombra);background:#fff;border:1px solid var(--linea);display:flex;flex-direction:column}
.vcorpo{position:relative;flex:1;min-height:0}
#venus-frame{width:100%;height:100%;border:0;display:block}
/* menu del portale agenti (voci lette da Venus) */
.vmenu{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;padding:8px 10px;border-bottom:1px solid var(--linea);background:linear-gradient(180deg,#f7faff,#eef3fc);flex:0 0 auto;position:relative;z-index:5}
.vmenu:empty{display:none}
.vm-gruppo{position:relative;flex:0 0 auto}
.vm-voce,.vm-sotto{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;border:1px solid var(--linea);background:#fff;color:#1b2a4a;border-radius:999px;padding:6px 12px;font:600 13px/1.1 inherit;cursor:pointer;flex:0 0 auto;transition:background .15s,border-color .15s}
.vm-voce:hover,.vm-sotto:hover{border-color:#0fc0aa;background:#f2fffc}
.vm-voce.attiva{background:#0b2e9e;color:#fff;border-color:#0b2e9e}
.vm-ico{font-size:14px;line-height:1}
.vm-n{background:#0fc0aa;color:#fff;border-radius:999px;padding:1px 7px;font-size:11px;font-weight:700}
.vm-voce.attiva .vm-n{background:#fff;color:#0b2e9e}
.vm-freccia{font-size:11px;opacity:.7}
.vm-tendina{position:absolute;top:100%;left:0;margin-top:6px;background:#fff;border:1px solid var(--linea);border-radius:12px;box-shadow:0 12px 30px rgba(4,16,60,.18);padding:6px;display:flex;flex-direction:column;gap:4px;z-index:50;min-width:200px}
.vm-tendina[hidden]{display:none}
.vm-sotto{border-radius:8px;justify-content:flex-start;width:100%}
.vm-sotto.attiva{background:#e8eefc;border-color:#0b2e9e}
#venus-caricamento{position:absolute;inset:0;display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;background:#eef3fc;color:var(--grigio);font-size:14px;z-index:2}
.spin{width:34px;height:34px;border-radius:50%;border:3px solid rgba(11,46,158,.18);border-top-color:var(--blu);animation:ej-gira .8s linear infinite}
@keyframes ej-gira{to{transform:rotate(360deg)}}

/* liste portali / collegamenti */
.lista-portali,.rec-portale{display:flex;flex-direction:column;gap:8px}
.rec-portale{flex-direction:row;align-items:center;gap:10px;width:100%;text-align:left;background:#fff;border:1px solid var(--linea);border-radius:12px;padding:11px 14px;cursor:pointer;font-size:14px;font-weight:600;color:var(--testo)}
.rec-portale:hover{border-color:var(--acqua)}
.rec-portale.sel{border-color:var(--blu-chiaro);box-shadow:0 0 0 3px rgba(21,71,214,.12)}

/* =====================================================================
   ENOVA AGENTI 1.1 — Struttura rete
   ===================================================================== */
.st-nuovi{display:flex;gap:8px;flex-wrap:wrap}
.st-piramide{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 16px}
.st-liv{display:flex;align-items:center;gap:8px;font-weight:700;color:var(--blu-scuro);font-size:13.5px}
.st-liv span{width:24px;height:24px;border-radius:50%;background:linear-gradient(135deg,var(--blu),var(--blu-chiaro));color:#fff;display:grid;place-items:center;font-size:12px}
.st-liv small{font-weight:600;color:var(--grigio)}
.st-fr{color:var(--acqua);font-weight:800}
.st-schede{display:flex;gap:6px}
.st-canale>h3{display:flex;align-items:center;gap:8px}
.st-aree{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.st-area{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;background:var(--superficie-2);border:1px solid var(--linea);border-radius:12px;padding:10px 12px;cursor:pointer;font-size:13.5px;color:var(--testo)}
.st-area span{font-size:12px;color:var(--grigio)}
.st-area:hover{border-color:var(--acqua)} .st-area.sel{border-color:var(--blu-chiaro);box-shadow:0 0 0 3px rgba(21,71,214,.12);background:#fff}
.st-gruppo{margin-bottom:14px}
.st-gruppo-testa{display:flex;align-items:center;gap:10px;padding:8px 2px;border-bottom:2px solid var(--linea);margin-bottom:4px}
.st-gruppo-testa .btn{margin-left:auto}
tr.st-spento td{opacity:.6}
.st-testa-scheda{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.st-tabs{display:flex;gap:6px;margin-bottom:12px;flex-wrap:wrap}
.st-perm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:6px 14px}
.st-perm{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:7px 10px;border:1px solid var(--linea);border-radius:10px;font-size:13px;background:#fff}
.st-sino{display:flex;gap:10px;white-space:nowrap;font-weight:600}
.st-sino label{display:inline-flex;gap:4px;align-items:center;cursor:pointer}
.st-barra{height:10px;border-radius:999px;background:var(--linea);overflow:hidden;margin-top:10px}
.st-barra>div{height:100%;background:linear-gradient(90deg,var(--blu),var(--acqua));transition:width .4s}
.riga-accesso{padding:8px 0;border-bottom:1px solid var(--linea)}
@media(max-width:720px){.st-perm-grid{grid-template-columns:1fr}}

/* «Entra come»: fascia in alto quando un amministratore usa il profilo di un agente */
.banda-come{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:9px 18px;background:#fff4d6;border-bottom:2px solid #f0b429;color:#5c3d00;font-size:14px}
.banda-come[hidden]{display:none}
.banda-come .btn{background:#0b2e9e;color:#fff;border:0}
@media(max-width:720px){.banda-come{padding:8px 12px;font-size:13px}}

/* caricamento di una pagina di Venus: barra sottile, la pagina resta visibile */
.vcarica{position:absolute;left:0;right:0;top:0;z-index:4;pointer-events:none}
.vcarica[hidden]{display:none}
.vcarica .vbarra{height:3px;background:linear-gradient(90deg,#0fc0aa,#1547d6,#0fc0aa);background-size:200% 100%;animation:vscorri 1.1s linear infinite}
.vcarica .vchip{position:absolute;right:12px;top:10px;background:#fff;border:1px solid var(--linea);border-radius:999px;padding:6px 12px;font-size:12px;font-weight:700;color:#0b2e9e;box-shadow:0 6px 18px rgba(11,46,158,.14)}
.vcarica .vchip.lento{color:#8a5a00;background:#fff8e6;border-color:#f0d48a}
@keyframes vscorri{from{background-position:0 0}to{background-position:-200% 0}}
@media(max-width:720px){.vm-voce{padding:5px 9px;font-size:12px}.vmenu{gap:4px;padding:6px}}

/* =====================================================================
   ENOVA VENUS — parti proprie dell'app
   ===================================================================== */
.debole{color:var(--grigio);font-size:12.5px}
.tabella-box{background:#fff;border:1px solid var(--linea);border-radius:14px;box-shadow:var(--ombra);overflow-x:auto}
.tabella{width:100%;border-collapse:collapse;font-size:14px}
.tabella th{text-align:left;font-size:11.5px;text-transform:uppercase;letter-spacing:.4px;color:var(--grigio);padding:10px 12px;border-bottom:1px solid var(--linea);background:#f7f9fc;white-space:nowrap}
.tabella td{padding:10px 12px;border-bottom:1px solid var(--linea);vertical-align:middle}
.tabella tr:last-child td{border-bottom:none}
.tabella .azioni{white-space:nowrap;text-align:right}
.tabella .azioni .btn{margin-left:6px}
.pag-testa{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 14px}
.pag-testa h2{margin:0;font-size:20px;color:var(--blu-scuro);display:flex;align-items:center;gap:6px;flex:1;min-width:200px}
.filtri{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin-bottom:14px}
.filtri .campo{margin:0;flex:1 1 160px;min-width:0}

/* ---- cerchietto «i» (aiuto contestuale, come nelle altre app ENOVA) ---- */
.info-i{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;min-width:18px;border-radius:50%;border:1.5px solid var(--blu);background:#fff;color:var(--blu);font:700 11px/1 Georgia,serif;margin-left:6px;padding:0;cursor:pointer;vertical-align:middle;box-shadow:none;transition:background .15s,color .15s}
.info-i:hover{background:var(--blu);color:#fff}
h2 .info-i{width:20px;height:20px;min-width:20px;font-size:12px;margin-left:8px} h3 .info-i{margin-left:6px} th .info-i{margin-left:4px} label .info-i{margin-left:4px}
.info-sfondo{position:fixed;inset:0;background:rgba(7,28,99,.45);z-index:300;display:flex;align-items:flex-start;justify-content:center;padding:20px;overflow:auto}
.info-box{background:#fff;color:var(--testo);border-radius:18px;max-width:640px;width:100%;padding:22px;margin:0 auto;box-shadow:0 30px 70px rgba(4,16,60,.45)}
.info-testa{display:flex;align-items:center;gap:10px;flex-wrap:wrap} .info-testa h2{margin:0;font-size:20px;font-weight:700;color:var(--blu-scuro);flex:1}
.info-chiudi{padding:8px 13px;font-size:12.5px;border-radius:8px;font-weight:600;background:#fff;color:var(--testo);border:1px solid var(--linea);cursor:pointer;font-family:inherit}
.info-corpo{margin-top:8px;font-size:.95rem;line-height:1.5} .info-corpo p{margin:0 0 6px}
.info-h3{font-size:15px;font-weight:700;color:var(--blu-scuro);margin:14px 0 4px} .info-h3:first-child{margin-top:0}

/* ---- Venus dentro ENOVA: schede dei portali con il logo dell'azienda ---- */
#zona-venus{padding:10px 12px 0;height:calc(100vh - 64px - 74px);min-height:440px}
#zona-venus[hidden]{display:none}
#zona-venus #venus-box{height:100%}
.schede-portali{display:flex;align-items:stretch;gap:6px;padding:8px 8px 0;background:#f7f9fc;border-bottom:1px solid var(--linea);overflow-x:auto}
.scheda-portale{display:inline-flex;align-items:center;gap:9px;min-height:48px;padding:6px 14px;border:1px solid var(--linea);border-bottom:none;border-radius:12px 12px 0 0;background:#eef2f9;color:var(--grigio);font:600 13px/1.2 inherit;cursor:pointer;white-space:nowrap}
.scheda-portale img{height:28px;max-width:110px;object-fit:contain;display:block}
.scheda-portale .sp-logo{display:inline-flex;align-items:center;justify-content:center;height:34px;padding:3px 8px;border-radius:8px;background:#fff;border:1px solid var(--linea)}
.scheda-portale .sp-et{font-size:10.5px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;padding:2px 7px;border-radius:999px;background:var(--blu-bg,#e6ecfa);color:var(--blu)}
.scheda-portale.attiva{background:#fff;color:var(--blu-scuro);box-shadow:0 -3px 0 var(--acqua) inset;border-color:#c9d6f7}
.scheda-portale .pallino{flex:none}
.schede-portali .sp-spazio{flex:1}
.schede-portali .sp-azione{align-self:center;margin-bottom:6px}
.venus-frame{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;background:#fff}
.venus-frame[hidden]{display:none}
.venus-vuoto{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center}
#venus-carica{position:absolute;left:0;right:0;top:0;height:3px;z-index:5;overflow:hidden;background:rgba(11,46,158,.08)}
#venus-carica[hidden]{display:none}
#venus-carica::after{content:"";position:absolute;top:0;bottom:0;width:35%;background:linear-gradient(90deg,var(--blu),var(--acqua));animation:ev-scorri 1.1s ease-in-out infinite}
@keyframes ev-scorri{from{left:-35%}to{left:100%}}
.menu button .conta{display:inline-block;margin-left:6px;font-size:11px;font-weight:800;padding:1px 7px;border-radius:999px;background:var(--acqua);color:#052b26}

/* ---- scheda operatore: un riquadro per portale, con il logo dell'azienda ---- */
.acc-griglia{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.acc-portale{border:1px solid var(--linea);border-radius:12px;padding:14px;background:#f7f9fc;display:flex;flex-direction:column;gap:10px;min-width:0}
.acc-portale.spento{opacity:.72}
.acc-testa{display:flex;align-items:center;gap:10px;min-height:46px}
.acc-logo{flex:none;display:inline-flex;align-items:center;justify-content:center;width:120px;height:46px;padding:5px 8px;border-radius:10px;background:#fff;border:1px solid var(--linea)}
.acc-logo img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.acc-nome{flex:1;min-width:0;font-weight:700;color:var(--blu-scuro);font-size:14px;line-height:1.2}
.acc-nome small{display:block;font-weight:600;color:var(--grigio);font-size:11.5px}
.acc-chiave{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.acc-chiave .stato{flex:1;min-width:130px;display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600}
.acc-chiave .stato.ok{color:#1a7f37} .acc-chiave .stato.manca{color:#8a4300}
.mini-loghi{display:flex;flex-wrap:wrap;gap:5px}
.mini-logo{display:inline-flex;align-items:center;justify-content:center;height:26px;padding:3px 6px;border-radius:7px;background:#fff;border:1px solid var(--linea);position:relative}
.mini-logo img{height:18px;max-width:64px;object-fit:contain;display:block}
.mini-logo.senza{opacity:.5}
.mini-logo .pallino{position:absolute;right:-3px;top:-3px;width:9px;height:9px;border:2px solid #fff;box-sizing:content-box}
.chip.acqua{background:#e2f8f4;color:#0b7a6c} .chip.grigio{background:#eef1f6;color:#55657a} .chip.rosso{background:#fdecea;color:#a93226} .chip.verde{background:#e4f5e9;color:#1a7f37} .chip.arancio{background:#fdeede;color:#8a4300}
.conto{display:inline-block;font-size:12.5px;font-weight:700;padding:3px 10px;border-radius:999px;background:#e2f8f4;color:#0b7a6c;white-space:nowrap}
.conto.vicino{background:#fdeede;color:#8a4300}
.portali-griglia{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.portale-carta{background:#fff;border:1px solid var(--linea);border-radius:14px;box-shadow:var(--ombra);overflow:hidden;display:flex;flex-direction:column}
.portale-carta .pc-testa{height:92px;display:flex;align-items:center;justify-content:center;padding:14px 20px;background:linear-gradient(180deg,#f6f9ff,#fff);border-bottom:1px solid var(--linea)}
.portale-carta .pc-testa img{max-width:100%;max-height:60px;object-fit:contain}
.portale-carta .pc-corpo{padding:12px 15px 14px;display:flex;flex-direction:column;gap:8px;flex:1}
.portale-carta.spento{opacity:.65}

/* ---- visore dei file ---- */
.modale.larga{max-width:min(1200px,96vw)}
.modale.larga .modale-corpo{max-height:76vh}
.vedi-strumenti{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.vedi-cerca{flex:1 1 220px;max-width:360px;padding:9px 12px;border:1px solid var(--linea-2,#c1cad6);border-radius:10px;font:inherit}
.vedi-fogli{display:flex;gap:6px;flex-wrap:wrap}
.vedi-fogli button{padding:7px 12px;border-radius:999px;border:1px solid var(--linea);background:#fff;font:600 12.5px inherit;cursor:pointer;color:var(--grigio)}
.vedi-fogli button.attivo{background:var(--blu);border-color:var(--blu);color:#fff}
.vedi-tab{border:1px solid var(--linea);border-radius:12px;overflow:auto;max-height:62vh;background:#fff}
.vedi-tab .tabella{font-size:13px}
.vedi-tab .tabella th{position:sticky;top:0;cursor:pointer;z-index:1}
.vedi-tab .tabella td{white-space:nowrap;max-width:360px;overflow:hidden;text-overflow:ellipsis}
.vedi-n{color:var(--grigio);text-align:right;width:1%;font-size:11.5px}
.vedi-pagine{display:flex;flex-direction:column;align-items:center;gap:12px;background:#e9eef7;border-radius:12px;padding:12px;overflow:auto}
.vedi-pagina{background:#fff;box-shadow:0 4px 14px rgba(11,46,158,.14);max-width:100%;height:auto}
.vedi-testo{background:#f7f9fc;border:1px solid var(--linea);border-radius:12px;padding:14px;font:12.5px/1.5 ui-monospace,Menlo,Consolas,monospace;white-space:pre-wrap;word-break:break-word;max-height:66vh;overflow:auto}
.vedi-attesa{display:flex;flex-direction:column;align-items:center;gap:10px;padding:40px;color:var(--grigio)}
body.pagina-vedi{background:#eef3fc;margin:0}
.vedi-barra{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 14px;background:#fff;border-bottom:1px solid var(--linea)}
.vedi-corpo{padding:14px;max-width:1200px;margin:0 auto}
@media(max-width:720px){#zona-venus{padding:6px 6px 0;height:calc(100vh - 54px - 140px)} .scheda-portale{padding:6px 10px} .acc-logo{width:96px}}

.interruttore input[type=checkbox]{width:18px;height:18px;min-width:18px;flex:none;margin:0;padding:0;accent-color:var(--blu)}
.acc-portale .interruttore{align-self:flex-start;margin:0}
.acc-portale .campo{margin:0}
.menu button .conta[hidden]{display:none}
