/* SunGuard Energy — Portale Installatori CSS */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

:root {
  --navy: #0c1f3f; --navy-d: #07132a; --navy-m: #1a3358;
  --green: #4d9e27; --green-d: #3a7d1a; --green-l: #eaf4e2;
  --orange: #e8870d; --orange-d: #c46d00; --orange-l: #fdf2dc;
  --ink: #1a2332; --ink-s: #334155; --muted: #64748b; --muted-l: #94a3b8;
  --bg: #ffffff; --bg2: #f6f8fc; --bg3: #eef1f7;
  --border: #e2e8f0; --border2: #cbd5e1;
  --sidebar-w: 240px;
  --topbar-h: 60px;
}
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

/* ── Look squadrato, coerente col sito (angoli retti su bottoni e box) ── */
*, *::before, *::after { border-radius: 0 !important; }
/* mantieni circolari solo gli elementi tondi (dot di stato, avatar) */
.st-dot, [style*="border-radius:50%"], [style*="border-radius: 50%"] { border-radius: 50% !important; }

html { font-size:16px; }
body { font-family:'Inter',system-ui,sans-serif; color:var(--ink); background:var(--bg2); -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
::selection { background:rgba(77,158,39,.18); }

/* ── Auth pages ── */
.auth-page { min-height:100vh; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,var(--navy-d) 0%,var(--navy-m) 60%,#0e2a14 100%); padding:1.5rem; }
.auth-box { background:var(--bg); border-radius:18px; padding:clamp(2rem,5vw,3rem); width:100%; max-width:440px; box-shadow:0 24px 60px rgba(7,19,42,.35); }
.auth-logo { display:flex; justify-content:center; margin-bottom:2rem; }
.auth-logo img { height:44px; width:auto; }
.auth-title { font-size:1.45rem; font-weight:800; letter-spacing:-.02em; text-align:center; margin-bottom:.4rem; }
.auth-sub { font-size:.86rem; color:var(--muted); text-align:center; margin-bottom:2rem; }
.fg { display:flex; flex-direction:column; gap:.4rem; margin-bottom:1rem; }
.fg label { font-size:.77rem; font-weight:600; color:var(--ink-s); }
.fg input, .fg select { background:var(--bg2); border:1px solid var(--border2); border-radius:9px; color:var(--ink); padding:11px 14px; font-size:.9rem; font-family:inherit; outline:none; transition:.2s; width:100%; }
.fg input:focus, .fg select:focus { border-color:var(--green); background:var(--bg); box-shadow:0 0 0 3px rgba(77,158,39,.12); }
.btn-auth { width:100%; background:linear-gradient(135deg,var(--green),var(--orange)); color:#fff; font-weight:600; padding:13px; border-radius:10px; border:none; cursor:pointer; font-size:.93rem; font-family:inherit; transition:.22s; box-shadow:0 6px 20px rgba(77,158,39,.28); margin-top:.5rem; }
.btn-auth:hover { transform:translateY(-2px); box-shadow:0 10px 28px rgba(77,158,39,.42); }
.auth-sep { display:flex; align-items:center; gap:.8rem; margin:1.2rem 0; font-size:.78rem; color:var(--muted-l); }
.auth-sep::before, .auth-sep::after { content:''; flex:1; height:1px; background:var(--border); }
.btn-google { width:100%; display:flex; align-items:center; justify-content:center; gap:10px; background:var(--bg); border:1.5px solid var(--border2); color:var(--ink-s); font-weight:600; padding:12px; border-radius:10px; cursor:pointer; font-size:.9rem; font-family:inherit; transition:.2s; }
.btn-google:hover { border-color:var(--border2); background:var(--bg2); }
.btn-google svg { width:20px; height:20px; }
.auth-links { text-align:center; margin-top:1.4rem; font-size:.84rem; color:var(--muted); }
.auth-links a { color:var(--green-d); font-weight:600; }
.auth-alert { margin-bottom:1rem; padding:.8rem 1rem; border-radius:8px; font-size:.86rem; display:none; }
.auth-alert.error { background:#fef2f2; border:1px solid #fecaca; color:#b91c1c; }
.auth-alert.success { background:var(--green-l); border:1px solid rgba(77,158,39,.3); color:var(--green-d); }
.auth-alert.show { display:block; }

/* ── Portal layout ── */
.portal-wrap { display:flex; min-height:100vh; }

/* Sidebar */
.sidebar { width:var(--sidebar-w); background:var(--navy-d); color:#fff; display:flex; flex-direction:column; position:fixed; top:0; left:0; height:100vh; z-index:100; transition:transform .3s; }
.sidebar-logo { padding:1.2rem 1.5rem; border-bottom:1px solid rgba(255,255,255,.08); }
.sidebar-logo img { width:100%; height:auto; background:rgba(255,255,255,.92); border-radius:7px; padding:6px 12px; display:block; }
.sidebar-nav { flex:1; padding:1.25rem 0; overflow-y:auto; }
.sidebar-nav a { display:flex; align-items:center; gap:10px; padding:10px 1.5rem; font-size:.86rem; font-weight:500; color:rgba(255,255,255,.7); transition:.2s; border-left:3px solid transparent; }
.sidebar-nav a:hover { color:#fff; background:rgba(255,255,255,.06); }
.sidebar-nav a.active { color:#fff; background:rgba(255,255,255,.09); border-left-color:var(--green); }
.sidebar-nav a .ic { width:18px; height:18px; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.sidebar-section { padding:.6rem 1.5rem .25rem; font-size:.66rem; font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:rgba(255,255,255,.35); margin-top:.5rem; }
.sidebar-user { padding:1rem 1.5rem; border-top:1px solid rgba(255,255,255,.08); font-size:.82rem; color:rgba(255,255,255,.7); }
.sidebar-user strong { display:block; color:#fff; font-size:.86rem; margin-bottom:.2rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* Main area */
.portal-main { margin-left:var(--sidebar-w); flex:1; min-height:100vh; display:flex; flex-direction:column; }
.portal-topbar { height:var(--topbar-h); background:var(--bg); border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; padding:0 2rem; position:sticky; top:0; z-index:50; }
.portal-topbar h1 { font-size:1.1rem; font-weight:700; }
.portal-topbar-actions { display:flex; align-items:center; gap:.8rem; }
.portal-content { padding:2rem; flex:1; }

/* Cards */
.pcard { background:var(--bg); border:1px solid var(--border); border-radius:14px; padding:1.75rem; }
.pcard-sm { padding:1.25rem 1.5rem; }
.stat-row { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:1rem; margin-bottom:1.5rem; }
.stat-tile { background:var(--bg); border:1px solid var(--border); border-radius:12px; padding:1.25rem 1.5rem; }
.stat-tile .val { font-size:2rem; font-weight:800; letter-spacing:-.03em; color:var(--ink); line-height:1; }
.stat-tile .lbl { font-size:.75rem; color:var(--muted); text-transform:uppercase; letter-spacing:.07em; margin-top:.35rem; }
.stat-tile.green .val { color:var(--green-d); }
.stat-tile.orange .val { color:var(--orange-d); }

/* Table */
.ptable { width:100%; border-collapse:collapse; font-size:.87rem; }
.ptable th { font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.09em; color:var(--muted); padding:.7rem 1rem; text-align:left; border-bottom:2px solid var(--border); }
.ptable td { padding:.9rem 1rem; border-bottom:1px solid var(--border); color:var(--ink-s); }
.ptable tr:last-child td { border-bottom:none; }
.ptable tr:hover td { background:var(--bg2); }

/* Badges */
.badge { display:inline-flex; align-items:center; gap:5px; padding:3px 9px; border-radius:99px; font-size:.71rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.badge-draft { background:var(--bg3); color:var(--muted); }
.badge-submitted { background:var(--green-l); color:var(--green-d); }
.badge-cancelled  { background:#fef2f2; color:#b91c1c; }
.badge-completed  { background:#ecfdf5; color:#065f46; }

/* Buttons */
.btn { display:inline-flex; align-items:center; gap:7px; padding:9px 18px; border-radius:9px; border:none; cursor:pointer; font-size:.85rem; font-weight:600; font-family:inherit; transition:.2s; text-decoration:none; white-space:nowrap; }
.btn-primary { background:linear-gradient(135deg,var(--green),var(--orange)); color:#fff; box-shadow:0 4px 14px rgba(77,158,39,.28); }
.btn-primary:hover { transform:translateY(-1px); box-shadow:0 7px 20px rgba(77,158,39,.42); }
.btn-outline { border:1.5px solid var(--border2); color:var(--ink-s); background:var(--bg); }
.btn-outline:hover { border-color:var(--green); color:var(--green-d); background:var(--green-l); }
.btn-danger { border:1.5px solid #fecaca; color:#b91c1c; background:#fef2f2; }
.btn-danger:hover { background:#fee2e2; }
.btn-sm { padding:6px 12px; font-size:.78rem; border-radius:7px; gap:5px; }
.ic { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }

/* Downloads */
.dl-section { margin-bottom:2rem; }
.dl-section h3 { font-size:.9rem; font-weight:700; margin-bottom:.9rem; padding-bottom:.6rem; border-bottom:1px solid var(--border); color:var(--ink); }
.dl-item { display:flex; align-items:center; justify-content:space-between; padding:.75rem .25rem; border-bottom:1px solid var(--border); }
.dl-item:last-child { border-bottom:none; }
.dl-item-info { display:flex; align-items:center; gap:.8rem; }
.dl-item-info .ic { color:var(--green); }
.dl-item-label { font-size:.87rem; color:var(--ink-s); }
.dl-item-meta { font-size:.75rem; color:var(--muted-l); }
.dl-link { font-size:.8rem; font-weight:600; color:var(--green-d); display:flex; align-items:center; gap:4px; }
.dl-link:hover { color:var(--green); }

/* Wizard */
.wizard-header { display:flex; align-items:flex-start; gap:0; margin-bottom:2.5rem; overflow-x:auto; padding-bottom:.5rem; }
.wstep { display:flex; flex-direction:column; align-items:center; gap:.4rem; flex-shrink:0; width:66px; }
.wstep-circle { width:32px; height:32px; display:flex; align-items:center; justify-content:center; font-size:.78rem; font-weight:700; background:var(--bg3); color:var(--muted); border:2px solid var(--border2); flex-shrink:0; transition:.3s; cursor:pointer; }
.wstep-circle:hover { filter:brightness(.88); }
.wstep-label { font-size:.62rem; font-weight:600; color:var(--muted); text-align:center; line-height:1.2; cursor:pointer; letter-spacing:.01em; }
.wstep.active .wstep-circle { background:var(--navy); color:#fff; border-color:var(--navy); }
.wstep.active .wstep-label { color:var(--navy); font-weight:700; }
.wstep.done .wstep-circle { background:var(--green); color:#fff; border-color:var(--green); }
.wstep.done .wstep-label { color:var(--green-d); }
.wstep.error .wstep-circle { background:#fef2f2; color:#b91c1c; border-color:#fecaca; }
.wstep.error .wstep-label { color:#b91c1c; }
.wstep-line { width:20px; height:2px; margin-top:16px; background:var(--border2); flex-shrink:0; }
.wstep.done + .wstep .wstep-line, .wstep.done .wstep-line { background:var(--green); }
.wizard-panel { display:none; }
.wizard-panel.active { display:block; }
.wizard-panel h3 { font-size:1.2rem; font-weight:700; margin-bottom:.4rem; }
.wizard-panel .panel-sub { font-size:.86rem; color:var(--muted); margin-bottom:1.5rem; line-height:1.6; }
.wizard-nav { display:flex; justify-content:space-between; align-items:center; margin-top:2rem; padding-top:1.5rem; border-top:1px solid var(--border); }
.dynamic-table { width:100%; border-collapse:collapse; font-size:.84rem; margin-top:.8rem; }
.dynamic-table th { font-size:.71rem; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.07em; padding:.5rem .6rem; text-align:left; border-bottom:2px solid var(--border); }
.col-tip {
  font-size:.65rem; color:var(--muted-l); cursor:help; vertical-align:super;
  position:relative; display:inline-block;
}
.col-tip::after {
  content: attr(data-tip);
  position:absolute; bottom:calc(100% + 8px); left:50%; transform:translateX(-50%);
  background:#1a2332; color:#fff; font-size:.78rem; font-weight:400;
  letter-spacing:0; text-transform:none; line-height:1.5;
  padding:8px 12px; border-radius:8px;
  white-space:normal; min-width:240px; max-width:320px;
  box-shadow:0 4px 16px rgba(0,0,0,.25);
  pointer-events:none; opacity:0; transition:opacity .18s;
  z-index:200;
}
.col-tip:hover::after { opacity:1; }
.dynamic-table td { padding:.45rem .6rem; }
.dynamic-table td input, .dynamic-table td select { width:100%; background:var(--bg2); border:1px solid var(--border2); border-radius:6px; padding:6px 8px; font-size:.82rem; font-family:inherit; color:var(--ink); outline:none; }
.dynamic-table td input:focus, .dynamic-table td select:focus { border-color:var(--green); background:var(--bg); }
.form-group { margin-bottom:1.1rem; }
.form-group label { display:block; font-size:.77rem; font-weight:600; color:var(--ink-s); margin-bottom:.4rem; }
.form-group input, .form-group select, .form-group textarea { width:100%; background:var(--bg2); border:1px solid var(--border2); border-radius:9px; color:var(--ink); padding:10px 13px; font-size:.9rem; font-family:inherit; outline:none; transition:.2s; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color:var(--green); background:var(--bg); box-shadow:0 0 0 3px rgba(77,158,39,.1); }
.field-error { border-color:#fca5a5 !important; background:#fef2f2 !important; box-shadow:0 0 0 3px rgba(239,68,68,.12) !important; }
.form-group textarea { resize:vertical; }
.form-row-2 { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-row-3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:1rem; }
.option-radios { display:flex; gap:1.5rem; }
.option-radios label { display:flex; align-items:center; gap:.45rem; font-size:.87rem; cursor:pointer; }
.user-block { background:var(--bg2); border:1px solid var(--border); border-radius:12px; padding:1.25rem 1.5rem; margin-bottom:1.25rem; }
.user-block h4 { font-size:.92rem; font-weight:700; margin-bottom:1rem; color:var(--ink); }

/* Activation status banners */
.submitted-notice { background:var(--green-l); border:1px solid rgba(77,158,39,.3); color:var(--green-d); padding:.85rem 1.1rem; border-radius:9px; font-size:.87rem; font-weight:500; margin-bottom:1.25rem; }
.readonly-notice  { background:var(--orange-l); border:1px solid #f6dcb0; color:#92530a; padding:.85rem 1.1rem; border-radius:9px; font-size:.87rem; font-weight:500; margin-bottom:1.25rem; }

/* Alert */
.alert { padding:.85rem 1.1rem; border-radius:9px; font-size:.87rem; margin-bottom:1rem; display:none; }
.alert.show { display:block; }
.alert.error { background:#fef2f2; border:1px solid #fecaca; color:#b91c1c; }
.alert.success { background:var(--green-l); border:1px solid rgba(77,158,39,.3); color:var(--green-d); }
.alert.info { background:#eff6ff; border:1px solid #bfdbfe; color:#1e40af; }

/* Responsive */
@media (max-width: 768px) {
  .sidebar { transform:translateX(-100%); }
  .sidebar.open { transform:translateX(0); }
  .portal-main { margin-left:0; }
  .portal-topbar { padding:0 1rem; }
  .portal-content { padding:1.25rem; }
  .form-row-2, .form-row-3 { grid-template-columns:1fr; }
}