/* Aven Onboard — neubrutalist UI, light default, dark toggle */

:root{
  --bg:#F5F3EE;
  --surface:#FFFFFF;
  --ink:#0B0B0C;
  --muted:#5B5B5B;
  --accent:#FF5A1F;
  --accent-2:#2B6BFF;
  --good:#1FA97A;
  --warn:#F5B400;
  --bad:#E63946;
  --border:#0B0B0C;
  --radius:0px;
  --shadow: 6px 6px 0 var(--ink);
  --shadow-sm: 4px 4px 0 var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Arial, sans-serif;
}

[data-theme="dark"]{
  --bg:#121212;
  --surface:#1B1B1B;
  --ink:#F5F3EE;
  --muted:#B7B7B7;
  --border:#F5F3EE;
  --shadow: 6px 6px 0 #000;
  --shadow-sm: 4px 4px 0 #000;
}

*{box-sizing:border-box;}
body{
  margin:0; background:var(--bg); color:var(--ink);
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;}
h1,h2,h3{font-weight:900; letter-spacing:-0.02em; text-transform:uppercase; line-height:1.05;}
p{color:var(--muted); line-height:1.5;}

.topbar{
  border-bottom:3px solid var(--border); background:var(--surface); position:sticky; top:0; z-index:50;
}
.topbar-inner{
  max-width:1100px; margin:0 auto; padding:14px 20px; display:flex; align-items:center; justify-content:space-between;
}
.brand{ display:flex; gap:6px; align-items:baseline; text-decoration:none; }
.brand-mark{ font-weight:900; font-size:1.3rem; letter-spacing:-0.03em; }
.brand-sub{ font-weight:700; font-size:0.75rem; color:var(--accent); letter-spacing:0.1em; }
.topnav{ display:flex; align-items:center; gap:18px; font-weight:700; font-size:0.9rem; }
.topnav a{ text-decoration:none; border-bottom:2px solid transparent; }
.topnav a:hover{ border-bottom-color: var(--accent); }
.theme-toggle{
  border:2px solid var(--border); background:var(--surface); color:var(--ink);
  width:34px; height:34px; cursor:pointer; font-size:1rem;
}

.page{ max-width:1100px; margin:0 auto; padding:32px 20px 64px; min-height:70vh; }

.hero{ padding:40px 0 24px; }
.hero h1{ font-size:2.4rem; max-width:720px; }
.hero p{ max-width:560px; font-size:1.05rem; }
.tag{
  display:inline-block; border:2px solid var(--border); padding:3px 10px; font-weight:800;
  font-size:0.7rem; text-transform:uppercase; letter-spacing:0.08em; background:var(--accent); color:#0B0B0C;
  box-shadow:var(--shadow-sm);
}

.grid{ display:grid; gap:20px; }
.grid.cols-2{ grid-template-columns:repeat(2,1fr); }
.grid.cols-3{ grid-template-columns:repeat(3,1fr); }
.grid.cols-4{ grid-template-columns:repeat(4,1fr); }
@media (max-width:800px){ .grid.cols-2,.grid.cols-3,.grid.cols-4{ grid-template-columns:1fr; } }

.card{
  background:var(--surface); border:3px solid var(--border); box-shadow:var(--shadow); padding:20px;
}
.card.tight{ padding:14px 16px; }

.btn{
  display:inline-block; border:3px solid var(--border); background:var(--accent); color:#0B0B0C;
  font-weight:800; text-transform:uppercase; letter-spacing:0.03em; font-size:0.85rem;
  padding:12px 20px; cursor:pointer; box-shadow:var(--shadow-sm); text-decoration:none;
  transition:transform .05s ease;
}
.btn:hover{ transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--ink); }
.btn:active{ transform:translate(0,0); box-shadow:2px 2px 0 var(--ink); }
.btn.secondary{ background:var(--surface); }
.btn.blue{ background:var(--accent-2); color:#fff; }
.btn.good{ background:var(--good); color:#fff; }
.btn.bad{ background:var(--bad); color:#fff; }
.btn.block{ width:100%; text-align:center; }
.btn[disabled]{ opacity:.5; cursor:not-allowed; }

label{ display:block; font-weight:700; font-size:0.8rem; text-transform:uppercase; letter-spacing:0.03em; margin:14px 0 6px; }
input[type=text],input[type=email],input[type=tel],input[type=date],input[type=password],input[type=url],select,textarea{
  width:100%; border:2px solid var(--border); background:var(--surface); color:var(--ink);
  padding:10px 12px; font-size:0.95rem; font-family:inherit;
}
textarea{ min-height:90px; resize:vertical; }
fieldset{ border:2px dashed var(--border); padding:16px; margin:20px 0; }
legend{ font-weight:900; text-transform:uppercase; padding:0 8px; }
.hint{ font-size:0.78rem; color:var(--muted); margin-top:4px; }
.error-text{ color:var(--bad); font-weight:700; font-size:0.85rem; margin-top:4px; }
.checkbox-row{ display:flex; align-items:flex-start; gap:10px; margin:14px 0; }
.checkbox-row input{ width:auto; margin-top:4px; }

.badge{ display:inline-block; padding:3px 10px; font-size:0.72rem; font-weight:800; text-transform:uppercase; border:2px solid var(--border); }
.badge.pending{ background:var(--warn); }
.badge.good{ background:var(--good); color:#fff; }
.badge.bad{ background:var(--bad); color:#fff; }
.badge.neutral{ background:var(--surface); }

.progress-track{ display:flex; gap:8px; flex-wrap:wrap; margin:20px 0; }
.progress-step{
  border:2px solid var(--border); padding:8px 14px; font-weight:700; font-size:0.82rem; background:var(--surface);
}
.progress-step.done{ background:var(--good); color:#fff; }
.progress-step.current{ background:var(--warn); }

table{ width:100%; border-collapse:collapse; }
th,td{ border-bottom:2px solid var(--border); padding:10px 8px; text-align:left; font-size:0.88rem; }
th{ text-transform:uppercase; font-size:0.72rem; letter-spacing:0.05em; color:var(--muted); }
tr:hover td{ background:rgba(0,0,0,0.03); }

.stat{ text-align:left; }
.stat .num{ font-size:2rem; font-weight:900; }
.stat .lbl{ font-size:0.75rem; text-transform:uppercase; color:var(--muted); font-weight:700; }

.sig-pad-wrap{ border:3px solid var(--border); background:#fff; touch-action:none; }
.sig-pad-wrap canvas{ display:block; width:100%; height:220px; cursor:crosshair; }
.sig-actions{ display:flex; gap:10px; margin-top:10px; }

.doc-sheet{
  background:#fff; color:#0B0B0C; border:3px solid var(--border); padding:36px; max-width:760px; margin:0 auto;
  font-family: Georgia, 'Times New Roman', serif; line-height:1.6;
}
.doc-sheet h2{ text-align:center; }
.doc-sheet .doc-meta{ display:flex; justify-content:space-between; font-family:inherit; margin:20px 0; font-size:0.9rem; }
.doc-sheet .doc-sig-line{ margin-top:40px; border-top:1px solid #000; padding-top:6px; font-size:0.85rem; }
@media print{ .no-print{ display:none !important; } .doc-sheet{ box-shadow:none; border:none; } }

.alert{ border:2px solid var(--border); padding:12px 14px; margin-bottom:16px; font-weight:600; font-size:0.9rem; }
.alert.success{ background:var(--good); color:#fff; }
.alert.error{ background:var(--bad); color:#fff; }
.alert.info{ background:var(--accent-2); color:#fff; }

.sitefoot{ border-top:3px solid var(--border); padding:20px; text-align:center; color:var(--muted); font-size:0.8rem; }

.section-title{ display:flex; align-items:center; gap:12px; margin:32px 0 16px; }
.section-title h2{ font-size:1.3rem; margin:0; }
.section-title .line{ flex:1; height:3px; background:var(--border); }

.two-col-form{ display:grid; grid-template-columns:1fr 1fr; gap:0 20px; }
@media (max-width:700px){ .two-col-form{ grid-template-columns:1fr; } }

.sidebar-layout{ display:grid; grid-template-columns:220px 1fr; gap:24px; align-items:start; }
@media (max-width:800px){ .sidebar-layout{ grid-template-columns:1fr; } }
.sidebar{ border:3px solid var(--border); background:var(--surface); box-shadow:var(--shadow); padding:14px; }
.sidebar a{ display:block; padding:8px 6px; font-weight:700; font-size:0.88rem; text-decoration:none; border-bottom:2px solid transparent; }
.sidebar a.active, .sidebar a:hover{ border-bottom-color:var(--accent); }