/* ---------- Tokens ---------- */
:root{
  --va-max: 1200px;
  --va-pad: clamp(16px, 3vw, 32px);
  --va-bg:  #f6f7fb;
  --va-card:#ffffff;
  --va-text:#111827;
  --va-muted:#6b7280;
  --va-line:#e5e7eb;

  --va-green:#22c55e;
  --va-amber:#f59e0b;
  --va-red:  #ef4444;
  --va-neutral:#eef2f7;
  --va-shadow:0 6px 18px rgba(17,24,39,.06);
  --va-container: clamp(1024px, 95vw, 1360px);

  --va-font: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans",
             "Apple Color Emoji", "Segoe UI Emoji";

  --va-brand: var(--wp--preset--color--va-brand, #1166ff);
  --va-bg:    var(--wp--preset--color--va-bg,    #f7f8fb);
  --va-fg:    var(--wp--preset--color--va-fg,    #16181d);
  --va-font-sans: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  --va-gutter: clamp(12px, 3vw, 28px);
}
body{ font-family: var(--va-font-sans); color: var(--va-fg); background: var(--va-bg); }

/* auth pill clickable anywhere */
.va-auth-a{
  display:inline-block; font-size:.95rem; line-height:1;
  padding:.5rem .9rem; border-radius:999px;
  border:1px solid #d1d5db; background:#fff; color:#111; text-decoration:none;
  box-shadow:0 1px 2px rgba(0,0,0,.06);
}
.va-auth-a:hover{ background:#f3f4f6; }

/* ---------- Base ---------- */
body{ background:var(--va-bg); color:var(--va-text); font-family:var(--va-font); }
.va-container { max-width: var(--va-max); margin: 0 auto; padding: var(--va-pad); }
.va-card{
  background:#fff; border:1px solid var(--va-line); border-radius:12px;
  box-shadow:var(--va-shadow); padding: clamp(16px,2.4vw,24px);
}
.va-title { margin:0 0 .5rem; font-size:clamp(28px,2.4vw,34px); font-weight:800; }
.va-subtle{ color:var(--va-muted); }

/* ---------- Header utility nav (Sign in/out) ---------- */
#header, header { position: relative; }
.va-nav{
  position: fixed; right: clamp(16px, 4vw, 40px); top: 14px; z-index: 9999;
  display:flex; gap:.75rem; list-style:none; margin:0; padding:0;
}
.va-nav a, .va-auth-a{
  display:inline-block; font-size:.95rem; line-height:1; padding:.5rem .9rem;
  border-radius:999px; border:1px solid #d1d5db; background:#fff; color:#111;
  text-decoration:none; box-shadow:0 1px 2px rgba(0,0,0,.06);
}
.va-nav a:hover, .va-auth-a:hover{ background:#f3f4f6; }
@media (max-width: 600px){ .va-nav{ top:10px; right:12px } .va-nav a{ padding:.45rem .75rem; font-size:.9rem } }

/* --- Header nav should live inside the header bar, not fixed --- */
.va-header .va-nav{
  position: static;
  right: auto; top: auto;
  margin-left: auto;
}

/* ---------- Buttons, inputs, dropzone ---------- */
.va-btn{ display:inline-flex; align-items:center; gap:.4rem; border:1px solid #e2e8f0;
  border-radius:8px; padding:.55rem .9rem; text-decoration:none; cursor:pointer; font-weight:600; }
.va-btn.primary{ background:#0ea5e9; color:#fff; border-color:#0ea5e9; }
.va-btn.ghost{ background:#fff; color:#0ea5e9; }

.va-input{ width:100%; padding:.75rem .9rem; border:1px solid var(--va-line); border-radius:10px; background:#fff; }
.va-drop{ border:2px dashed #e5e7eb; border-radius:12px; padding:1.25rem; text-align:center; background:#fafbfc; }
.va-drop.dragover{ border-color:#94a3b8; background:#f8fafc; }

/* ---------- Trust score cards ---------- */
.va-grid{ display:grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap:16px; }
.va-score{ position:relative; padding:12px 12px 16px; border:1px solid var(--va-line); border-radius:12px; background:#fff; }
.va-score h3{ margin:0 0 .35rem; font-size:.95rem; color:#374151; }
.va-score .va-meter{ position:relative; height:18px; background:var(--va-neutral); border-radius:999px; overflow:hidden; }
.va-score .va-meter > span{ position:absolute; inset:0 auto 0 0; }
.va-score .value{
  position:absolute; top:8px; right:12px;
  padding:.15rem .5rem; border-radius:.5rem; background:#fff; border:1px solid #e5e7eb;
  font-weight:800; letter-spacing:.2px; font-variant-numeric: tabular-nums lining-nums; color:#111827;
}
.va-score.ok   .va-meter>span{ background:var(--va-green); }
.va-score.warn .va-meter>span{ background:var(--va-amber); }
.va-score.bad  .va-meter>span{ background:var(--va-red); }

/* ---------- Legend ---------- */
.va-legend{ display:flex; gap:16px; align-items:center; list-style:none; padding:0; margin:.25rem 0 1rem; color:#6b7280; }
.va-legend .dot{ width:10px; height:10px; border-radius:50%; display:inline-block; margin-right:6px; }
.va-legend .dot.ok{ background:var(--va-green); }
.va-legend .dot.warn{ background:var(--va-amber); }
.va-legend .dot.bad{ background:var(--va-red); }

/* ---------- Details & badges ---------- */
.va-dl{ display:grid; grid-template-columns: 160px 1fr; column-gap:16px; row-gap:.5rem; margin:0; }
.va-dl dt{ color:#6b7280; }
.va-dl dd{ margin:0; }

.va-badge{ display:inline-block; padding:.15rem .5rem; border-radius:999px; font-size:.8rem; font-weight:600; }
.va-badge.ok{ background:#e7f8ee; color:#166534; }
.va-badge.bad{ background:#fee2e2; color:#991b1b; }

/* ---------- Vendor panel ---------- */
.va-vendor{ margin-top:1.25rem; border-top:1px solid var(--va-line); padding-top:1.25rem; }
.va-vendor h2{ font-size:20px; margin:.25rem 0 .75rem; }
.va-list{ list-style:none; padding:0; margin:0; }
.va-list li{ padding:.35rem 0; border-bottom:1px dashed var(--va-line); }
.va-list li:last-child{ border-bottom:0; }

/* ---------- Misc ---------- */
.va-back{ display:inline-block; margin-top:1rem; text-decoration:none; color:#fff; background:#0ea5e9; padding:.55rem .9rem; border-radius:8px; }
.va-back:hover{ background:#0284c7; }
code{ background:#f6f8fa; padding:.15rem .3rem; border-radius:6px;
      font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace; }

/* ---- Chips & link lists used by YARA and Product/Licensing ---- */
.va-chip{
  display:inline-block; padding:.2rem .5rem; border-radius:999px;
  font-size:.8rem; font-weight:600; border:1px solid var(--va-line); background:#fff;
}
.va-chip.ok     { border-color:#c7f9d0; background:#f0fff4; color:#166534; }
.va-chip.warn   { border-color:#fde68a; background:#fffbeb; color:#92400e; }
.va-chip.danger { border-color:#fecaca; background:#fff1f2; color:#991b1b; }

.va-linklist{ list-style:none; margin:.25rem 0 0; padding:0; display:grid; gap:.35rem; }
.va-linklist a{ color:#0ea5e9; text-decoration:none; word-break: break-all; }
.va-linklist a:hover{ text-decoration:underline; }

/* --- Portal tab navigation (avoids conflict with header .va-nav) --- */
.va-pnav{display:flex;gap:.75rem;margin:.25rem 0 1rem;border-bottom:1px solid var(--va-line)}
.va-pnav__link{padding:.5rem .75rem;border-radius:.5rem;text-decoration:none;color:#374151}
.va-pnav__link:hover{background:#f3f4f6}
.va-pnav__link.current{background:#111827;color:#fff}

/* Helpers used by portal pages */
.va-card{background:#fff;border:1px solid var(--va-line,#e5e7eb);border-radius:.75rem;padding:1rem}
.va-title{margin:.25rem 0 1rem}
.va-subtle{color:var(--va-muted,#6b7280)}
.va-error{color:#b91c1c;background:#fee2e2;border:1px solid #fecaca;padding:.5rem .75rem;border-radius:.5rem}
.va-actions{display:flex;gap:.5rem;align-items:center;margin:.75rem 0}
.va-toolbar{display:flex;gap:.5rem;align-items:center;margin:.5rem 0}
.va-input{width:100%;padding:.5rem .625rem;border:1px solid #d1d5db;border-radius:.375rem}
.va-btn{padding:.5rem .75rem;border:0;border-radius:.5rem;background:#111827;color:#fff;cursor:pointer}
.va-btn.primary{background:#1f2937}
.va-btn.sm{padding:.25rem .5rem;font-size:.875rem}
.va-btn:disabled{opacity:.6;cursor:not-allowed}
.va-table-wrap{overflow-x:auto}
.va-table{width:100%;border-collapse:collapse}
.va-table th,.va-table td{padding:.5rem .625rem;border-bottom:1px solid var(--va-line,#e5e7eb);vertical-align:top}
.va-table th{text-align:left;font-weight:600}
.va-grid.two{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
/* === Unified table rules used by /analyses and /keys */
.va-table { width: 100%; border-collapse: collapse; }

.va-table th,
.va-table td {
  padding: .75rem .9rem;
  border-bottom: 1px solid var(--va-line);
  vertical-align: middle;
}

/* Right-align the Actions column */
.va-table th:last-child,
.va-table td:last-child {
  text-align: right;
  white-space: nowrap;
  width: 1%;
}

/* Actions inside cells: no vertical margins */
.va-table td .va-actions {
  margin: 0;
  display: inline-flex;
  gap: .5rem;
  align-items: center;
}

:where(.va-card) > .va-actions { margin: .75rem 0; }

@media (max-width:700px){.va-grid.two{grid-template-columns:1fr}}

.va-header {border-bottom:1px solid #e5e7eb; background:#fff;}
.va-header-inner, .va-footer-inner {max-width:var(--va-container); margin:0 auto; padding:0.75rem 1rem; display:flex; align-items:center; justify-content:space-between;}
.va-brand {font-weight:700; text-decoration:none; color:#111827;}
.va-nav a {margin-left:1rem; text-decoration:none; color:#111827;}
.va-nav a:hover, .va-footer-nav a:hover {text-decoration:underline;}
.va-footer {border-top:1px solid #e5e7eb; background:#fafafa; color:#6b7280;}
.va-footer-nav a {margin-left:1rem; color:inherit; text-decoration:none;}

.va-auth-only, .va-anon-only {display:none;}

/* --- Global tokens --- */

html{font-size:16px}
body{font-family:var(--va-font-sans);color:var(--va-fg);background:var(--va-bg);}

/* Layout primitives used by all templates */
.va-container{max-width:var(--va-container);margin:2.5rem auto;padding:0 1rem;}
.va-card{background:var(--va-surface);border:1px solid var(--va-border);border-radius:var(--va-radius);box-shadow:var(--va-shadow);padding:2rem;}
.va-title{font-size:1.75rem;line-height:1.2;margin:0 0 1rem}

/* Typography for arbitrary page content (Privacy, Terms, etc.) */
.va-content{max-width:70ch;line-height:1.65;font-size:1rem}
.va-content p{margin:0 0 1rem}
.va-content h2{font-size:1.5rem;margin:2rem 0 .75rem}
.va-content h3{font-size:1.25rem;margin:1.5rem 0 .5rem}
.va-content ul,.va-content ol{padding-left:1.25rem;margin:0 0 1rem}
.va-content li+li{margin-top:.25rem}
.va-content a{color:var(--va-brand);text-decoration:underline}
.va-content blockquote{border-left:3px solid var(--va-border);padding:.5rem 1rem;margin:1rem 0;color:var(--va-muted)}
.va-content code{background:#f3f4f6;border:1px solid #e5e7eb;border-radius:6px;padding:.1rem .35rem;font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace}
.va-content pre{background:#0f172a;color:#e2e8f0;border-radius:8px;padding:1rem;overflow:auto}

/* --- Page layout: sticky footer --- */
body.va{
  min-height: 100svh;         
  display: flex;
  flex-direction: column;
}
body.va > header.va-header{ flex: 0 0 auto; }
body.va > main,
body.va > .site-content,
body.va > .wp-site-blocks{ 
  flex: 1 0 auto; 
}
body.va > footer.va-footer{
  margin-top: auto; 
  flex: 0 0 auto;
}

.site-footer{margin:2rem auto 1rem;color:var(--va-muted);font-size:.875rem;text-align:center}
.site-footer a{color:inherit;text-decoration:underline}

/* Brand alignment */
.va-brand{ display:flex; align-items:center; gap:.5rem; }
.va-brand img{ display:block; }

/* Match the header/foot padding visually */
.va-container{ padding-inline: 1rem; }

/* Unify vertical rhythm in report cards */
.va-card + .va-card{ margin-top: 1rem; }

/* Keep the hero strip from looking too tight */
.va-hero{ margin-top:.25rem; margin-bottom:1rem; }

/* --- Final container contract --- */
.va-container{
  max-width: var(--va-container) !important;
  margin: 1.25rem auto 2rem !important; 
  padding: 0 1rem !important; 
  box-sizing: border-box;
}

.va-header-inner{
  max-width: none;
  padding-left: var(--va-gutter);
  padding-right: var(--va-gutter);
}
/* Unify card padding with gutters (lighter than 2rem) */
.va-card{ padding: 1.25rem !important; }

.va-card .va-card{
  border: 0;
  box-shadow: none;
  background: #fff;
  padding: 1.25rem;
}

/* Consistent vertical rhythm inside any card */
.va-card > * + *{ margin-top: 1rem; }

/* legend & hero spacing tight */
.va-hero{ margin-top: .25rem; margin-bottom: 1rem; }
.va-legend{ margin-top: .25rem; margin-bottom: 1rem; }