/* AmA Governance Portal — custom styles */
:root {
  --brand: #2563eb;
}

/* Document body rendering (from mammoth output) */
.doc-body { line-height: 1.7; color: #1e293b; }
.doc-body h1, .doc-body h2, .doc-body h3, .doc-body h4 {
  font-weight: 700; color: #0f172a; scroll-margin-top: 5rem;
}
.doc-body h1 { font-size: 1.75rem; margin: 1.5rem 0 1rem; border-bottom: 2px solid #e2e8f0; padding-bottom: 0.5rem; }
.doc-body h2 { font-size: 1.35rem; margin: 1.4rem 0 0.8rem; }
.doc-body h3 { font-size: 1.1rem; margin: 1.2rem 0 0.6rem; }
.doc-body h4 { font-size: 1rem; margin: 1rem 0 0.5rem; color: #334155; }
.doc-body p  { margin: 0.6rem 0; }
.doc-body ul, .doc-body ol { margin: 0.6rem 0 0.6rem 1.5rem; }
.doc-body li { margin: 0.25rem 0; }
.doc-body table {
  border-collapse: collapse; margin: 1rem 0; font-size: 0.9rem; width: 100%;
}
.doc-body th, .doc-body td {
  border: 1px solid #cbd5e1; padding: 0.5rem 0.75rem; vertical-align: top;
}
.doc-body th { background: #f1f5f9; font-weight: 600; }
.doc-body strong { font-weight: 600; color: #0f172a; }

/* TOC sidebar */
.toc-link {
  display: block; padding: 0.25rem 0.5rem; border-left: 2px solid transparent;
  color: #475569; font-size: 0.875rem; transition: all 0.15s;
}
.toc-link:hover { color: #2563eb; border-left-color: #93c5fd; }
.toc-link.active { color: #1d4ed8; border-left-color: #2563eb; font-weight: 600; }
.toc-link.h2 { padding-left: 1.25rem; }
.toc-link.h3 { padding-left: 2rem; font-size: 0.8rem; }
.toc-link.h4 { padding-left: 2.75rem; font-size: 0.78rem; }

/* Status badges */
.badge { display: inline-flex; align-items: center; font-size: 0.7rem; font-weight: 600; padding: 0.15rem 0.55rem; border-radius: 9999px; }
.badge-draft     { background: #fef3c7; color: #92400e; }
.badge-review    { background: #dbeafe; color: #1e40af; }
.badge-revised   { background: #e0e7ff; color: #3730a3; }
.badge-final     { background: #dcfce7; color: #166534; }

/* Nav pills */
.nav-pill { padding: 0.5rem 1rem; border-radius: 0.5rem; font-size: 0.875rem; font-weight: 500; color: #475569; transition: all 0.15s; }
.nav-pill:hover { background: #f1f5f9; color: #0f172a; }
.nav-pill.active { background: #2563eb; color: white; }

/* Document card */
.doc-card {
  background: white; border: 1px solid #e2e8f0; border-radius: 0.5rem;
  padding: 1rem; transition: all 0.15s; cursor: pointer;
}
.doc-card:hover { border-color: #2563eb; box-shadow: 0 4px 12px -2px rgba(37,99,235,0.15); transform: translateY(-1px); }

/* Reader watermark (Phase 9) — diagonal repeating overlay while reading */
.watermark {
  position: fixed; inset: 0; pointer-events: none; z-index: 5;
  background-repeat: repeat;
  opacity: 0.06;
  mix-blend-mode: multiply;
}

/* Accessibility: focus outlines and skip link */
:focus-visible { outline: 3px solid #2563eb; outline-offset: 2px; border-radius: 4px; }
.skip-link {
  position: absolute; top: -40px; left: 8px; background: #1d4ed8; color: white;
  padding: 8px 16px; border-radius: 0 0 6px 6px; z-index: 100; font-weight: 600;
  transition: top 0.2s;
}
.skip-link:focus { top: 0; }

/* Fade-in */
.fade-in { animation: fadeIn 0.25s ease-out; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
