/* Stile condiviso Evosolar Agenti — stessa identità visiva del vecchio sito statico */
:root{
  --mint:#4fe89a;
  --green:#6dc94c;
  --gold:#f8b018;
  --orange:#f89c18;
  --yellow:#f8c818;
  --accent:var(--mint);
  --accent-soft:rgba(79,232,154,0.14);
  --ink:#1e2b22;
  --paper:#ffffff;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{
  font-family:'Poppins', sans-serif;
  min-height:100vh;
  background:
    radial-gradient(circle at 15% 15%, rgba(79,232,154,0.20), transparent 45%),
    radial-gradient(circle at 90% 10%, rgba(248,200,24,0.30), transparent 50%),
    linear-gradient(135deg, #f4fbf6 0%, #fdfaf1 100%);
  color:var(--ink);
  display:flex; flex-direction:column; align-items:center;
}

.site-header{
  position:sticky; top:0; z-index:100; width:100%;
  background:rgba(253,250,241,0.92); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  box-shadow:0 2px 14px rgba(30,60,40,0.07);
  display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
  gap:20px; padding:10px 24px;
}
.site-logo{ width:110px; height:auto; flex-shrink:0; }
.topnav{
  display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin:0; padding:0;
}
.topnav a{
  padding:7px 15px; border-radius:999px; font-size:.78rem; font-weight:600;
  color:#5c6b60; text-decoration:none; background:#fff; border:1.5px solid rgba(0,0,0,0.08);
  transition:all .15s ease; white-space:nowrap;
}
.topnav a:hover{ border-color:var(--accent); color:var(--accent); }
.topnav a.active{ background:var(--accent); border-color:var(--accent); color:#fff; }
.topnav .logout-link{ color:#c0392b; border-color:rgba(192,57,43,0.25); }
.topnav .logout-link:hover{ border-color:#c0392b; color:#c0392b; }

main{
  width:100%; max-width:1280px; padding:32px 24px 64px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  flex:1;
}
.intro{ text-align:left; display:flex; flex-direction:row; align-items:center; gap:20px; width:100%; max-width:640px; }
.badge{
  width:80px; height:80px; border-radius:20px; background:var(--accent-soft);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.badge svg{ width:40px; height:40px; stroke:var(--accent); }
.intro-text{ display:flex; flex-direction:column; gap:4px; }
h1{ font-size:1.4rem; font-weight:800; margin:0; }
p.desc{ color:#5c6b60; max-width:520px; line-height:1.5; margin:0; font-size:.82rem; }

footer{ padding:24px; font-size:.8rem; color:#7a8880; text-align:center; }

/* --- Homepage --- */
.subtitle{
  text-align:center; font-weight:500; font-size:.88rem; color:#4a5a4f;
  margin-bottom:32px; letter-spacing:.2px;
}
.reminder-banner{
  width:100%; max-width:900px; margin:0 auto 28px;
  background:#fff4e0; border:1.5px solid rgba(230,150,20,0.35);
  border-radius:16px; padding:16px 20px;
  display:flex; align-items:flex-start; gap:14px; text-align:left;
  box-shadow:0 6px 20px rgba(30,60,40,0.06);
}
.reminder-banner svg{ width:22px; height:22px; stroke:#b8720a; flex-shrink:0; margin-top:2px; }
.reminder-banner .rb-title{ font-weight:800; font-size:.92rem; color:#8a5a06; margin-bottom:6px; }
.reminder-banner .rb-list{ font-size:.82rem; color:#6b5433; line-height:1.7; }
.reminder-banner .rb-list b{ color:#4a3a1e; }
.reminder-banner .rb-more{ font-size:.78rem; color:#8a6a2a; margin-top:2px; }
.reminder-banner .rb-action{
  margin-top:10px; display:inline-flex; align-items:center; gap:6px;
  font-size:.8rem; font-weight:700; color:#b8720a; text-decoration:none;
}
.reminder-banner .rb-action svg{ width:14px; height:14px; margin-top:0; }

.grid{ display:flex; flex-wrap:wrap; gap:28px; width:100%; }
.home-card{
  position:relative; flex:1 1 320px;
  background:var(--paper); border-radius:22px; padding:36px 28px;
  text-decoration:none; color:var(--ink);
  display:flex; flex-direction:column; align-items:flex-start; gap:18px;
  box-shadow:0 10px 30px rgba(30,60,40,0.08); border:1px solid rgba(0,0,0,0.04);
  overflow:hidden; transition:transform .22s ease, box-shadow .22s ease;
}
.home-card::before{ content:""; position:absolute; top:0; left:0; right:0; height:6px; background:var(--accent); }
.home-card:hover{ transform:translateY(-6px); box-shadow:0 18px 40px rgba(30,60,40,0.16); }
.icon-wrap{ width:56px; height:56px; border-radius:16px; display:flex; align-items:center; justify-content:center; background:var(--accent-soft); }
.icon-wrap svg{ width:28px; height:28px; stroke:var(--accent); }
.home-card h2{ font-size:1.2rem; font-weight:700; }
.home-card p{ font-size:.92rem; color:#5c6b60; line-height:1.4; }
.home-card .go{ margin-top:auto; font-size:.85rem; font-weight:600; color:var(--accent); display:flex; align-items:center; gap:6px; }
.home-card .go svg{ width:16px; height:16px; stroke:var(--accent); transition:transform .2s ease; }
.home-card:hover .go svg{ transform:translateX(4px); }

.home-card-lg{ flex:1.5 1 400px; padding:42px 32px; }
.home-card-lg .icon-wrap{ width:64px; height:64px; }
.home-card-lg .icon-wrap svg{ width:32px; height:32px; }
.home-card-lg h2{ font-size:1.32rem; }
.home-card-lg p{ font-size:.95rem; }
.home-card-sm{ flex:0.7 1 220px; padding:26px 22px; gap:12px; }
.home-card-sm .icon-wrap{ width:44px; height:44px; border-radius:13px; }
.home-card-sm .icon-wrap svg{ width:20px; height:20px; }
.home-card-sm h2{ font-size:1rem; }
.home-card-sm p{ font-size:.82rem; }

.c-calendar{--accent:var(--green); --accent-soft:rgba(109,201,76,0.12);}
.c-lead{--accent:var(--gold); --accent-soft:rgba(248,176,24,0.14);}
.c-riepilogo{--accent:var(--orange); --accent-soft:rgba(248,156,24,0.14);}
.c-agenti{--accent:#e0b400; --accent-soft:rgba(224,180,0,0.14);}
.c-marketing{--accent:var(--mint); --accent-soft:rgba(79,232,154,0.14);}
.c-analisi{--accent:#16a085; --accent-soft:rgba(22,160,133,0.14);}
.c-segnalazioni{--accent:#e05a47; --accent-soft:rgba(224,90,71,0.12);}
.c-gestione-nr{--accent:#6c5ce7; --accent-soft:rgba(108,92,231,0.14);}

/* --- Login --- */
.login-wrap{ width:100%; max-width:380px; margin:auto; }
.login-card{
  background:#fff; border-radius:22px; padding:36px 32px;
  box-shadow:0 10px 30px rgba(30,60,40,0.08); border:1px solid rgba(0,0,0,0.04);
  display:flex; flex-direction:column; gap:16px;
}
.login-card h1{ text-align:center; }
.login-card .field{ display:flex; flex-direction:column; gap:6px; }
.login-card label{ font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.3px; color:#8a9690; }
.login-card input{
  padding:11px 14px; border-radius:12px; border:1.5px solid rgba(0,0,0,0.12);
  font-family:inherit; font-size:.92rem; color:var(--ink); outline:none;
}
.login-card input:focus{ border-color:var(--accent); }
.login-card button{
  margin-top:6px; padding:12px; border-radius:12px; border:none;
  background:var(--ink); color:#fff; font-weight:700; font-size:.92rem; cursor:pointer;
}
.login-error{
  background:rgba(220,60,60,0.1); color:#c0392b; border-radius:10px;
  padding:10px 14px; font-size:.82rem; font-weight:600; text-align:center;
}

/* --- Mobile --- */
@media (max-width:700px){
  .site-header{ padding:8px 14px; gap:10px; }
  .site-logo{ width:88px; }
  .topnav{ flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; justify-content:flex-start; padding-bottom:2px; }
  .topnav a{ flex-shrink:0; padding:6px 12px; font-size:.74rem; }
  main{ padding:20px 16px 40px; }
  .intro{ gap:14px; }
  .badge{ width:56px; height:56px; border-radius:16px; }
  .badge svg{ width:28px; height:28px; }
  h1{ font-size:1.15rem; }
  p.desc{ font-size:.78rem; }
  .grid{ gap:16px; }
  .home-card, .home-card-lg, .home-card-sm{ flex:1 1 100%; padding:24px 20px; }
  .reminder-banner{ padding:12px 14px; gap:10px; }
  .reminder-banner svg{ width:18px; height:18px; }
  .login-card{ padding:26px 22px; }
}