/* ============================================================
   ap.css — Administrative Procedure theme
   ============================================================
   Visual identity:
   - Primary color: dark green #3D7A1C (the "operational backbone")
   - Header layout: horizontal logo + title block, single 2px green rule
   - Type label "Administrative Procedure" italic green ABOVE title
   - Metadata: inline single line (Section / Effective / Last Reviewed)
   - Signature element: NONE — clean prose is the AP's identity

   Used by class="ap" documents (Administrative Procedures, Tier 2).
   ============================================================ */

:root {
  --accent-primary: #3D7A1C;
  --accent-light:   #E8F4DD;
  --accent-dark:    #2D5A14;
}

/* ---------- Header band ------------------------------------ */
.gov-header.ap {
  display: flex;
  align-items: center;
  gap: 44px;
  padding-bottom: 14px;
  border-bottom: 2px solid var(--accent-primary);
  margin-bottom: 28px;
}

.ap-logo {
  width: 110px;
  height: 90px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ap-logo img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.ap-meta-block { flex: 1; }

/* Type label sits ABOVE title — note the deliberate inversion vs WI */
.ap-type {
  font-family: Calibri, sans-serif;
  font-style: italic;
  color: var(--accent-primary);
  font-size: 11pt;
  margin: 0 0 1px 0;
  line-height: 1.2;
}

.ap-title {
  font-size: 18pt;
  font-weight: 600;
  color: #1F1F1F;
  line-height: 1.15;
  margin: 0 0 4px 0;
}

.ap-section {
  font-size: 10pt;
  color: var(--text-muted);
  line-height: 1.4;
  margin: 0;
}

.ap-dates {
  font-size: 10pt;
  color: var(--text-muted);
  line-height: 1.4;
  margin: 0;
}

/* ---------- Heading overrides for AP ----------------------- */
/* Scoped to .gov-content so they don't accidentally style the
   header band's title (which is also an h1).
   
   Visual hierarchy: H1 section headings hang at page-padding edge;
   body content (paragraphs, lists, tables) indents inward to create
   a "section break" column on the left. */
.tier-ap .gov-content h1 {
  color: var(--accent-primary);
  font-size: 15pt;
  margin: 24px 0 14px 0;
  padding-bottom: 5px;
  border-bottom: 1px solid var(--accent-light);
}

.tier-ap .gov-content h2 {
  color: var(--accent-primary);
  font-size: 13pt;
  margin-left: 28px;   /* H2s sit inside the body indent, subordinate to H1 */
}

.tier-ap .gov-content h3 {
  color: var(--accent-primary);
  font-size: 11.5pt;
  margin-left: 28px;
}

.tier-ap .gov-content h4,
.tier-ap .gov-content h5,
.tier-ap .gov-content h6 {
  margin-left: 28px;
}

/* Body content indents under each section heading.
   H1s stay at the section-break edge (page padding); everything
   else (paragraphs, lists, tables, sub-headings) lives indented. */
.tier-ap .gov-content > p,
.tier-ap .gov-content > ul,
.tier-ap .gov-content > ol,
.tier-ap .gov-content > table,
.tier-ap .gov-content > blockquote,
.tier-ap .gov-content > section,
.tier-ap .gov-content > div {
  margin-left: 28px;
  margin-right: 0;
}

/* Tables need to span the indented content width */
.tier-ap .gov-content > table {
  width: calc(100% - 28px);
}

/* Responsibilities role-headings get a subtle treatment to make
   the role hierarchy visually distinct from regular body H3s.
   Triggered by wrapping responsibilities in <section class="gov-responsibilities">. */
.gov-responsibilities h3 {
  background: var(--accent-light);
  padding: 4px 10px;
  border-left: 3px solid var(--accent-primary);
  margin-top: 16px;
}