{# Chrome strip content — badge-parity material stack.
   v0.2.4 rewrite: dropped inner-well-edge stroke (badge has no equivalent),
   narrowed accent rail to 4px at 0.7 opacity (matches badge line-11 treatment),
   removed bevel filter's specular dependency (see chrome-defs.j2 rewrite).
   Mirror of badge/chrome-content.j2 at strip scale. #}

{# Material stack clipped to frame bounds (badge/stats parity, v0.2.5).
   Top highlight stays outside the clip — matches badge/chrome-content.j2.
   Rects use ``content_width`` (where visible content ends) instead of
   ``width`` (SVG viewBox). When strip_min_width clamps the viewBox wider
   than natural, the envelope/well/rail end at content_width and trailing
   pixels stay transparent. #}
<g clip-path="url(#{{ uid }}-clip)">
  {# Outer rim: full-size rect filled with animated chrome env-map + shadow filter #}
  <rect width="{{ strip_zones.core.content_width }}" height="{{ strip_h }}" rx="{{ chrome_corner }}"
        fill="url(#{{ uid }}-envelope)" filter="url(#{{ uid }}-bevel)"/>

  {# Thin inset stroke (badge parity: 0.6px interior shading line) #}
  <rect x="{{ strip_chrome_inner_inset }}" y="{{ strip_chrome_inner_inset }}" width="{{ strip_zones.chrome.inner_w }}" height="{{ strip_zones.chrome.inner_h }}"
        rx="{{ chrome_corner }}" fill="none"
        stroke="var(--dna-chrome-inner-stroke, var(--dna-surface-deep))" stroke-width="0.6"/>

  {# Inner well: dark recessed content area. 2px inset matches badge's well inset
     ratio (2/22 ≈ 0.09 on badge → ~4.7px on strip; we use 2 for crisper edges). #}
  <rect x="{{ strip_chrome_well_inset }}" y="{{ strip_chrome_well_inset }}" width="{{ strip_zones.chrome.well_w }}" height="{{ strip_zones.chrome.well_h }}"
        rx="{{ strip_chrome_well_rx }}" fill="url(#{{ uid }}-well)"/>

  {# Chrome accent bar: 4px wide at 0.7 opacity — identical to badge line 11 #}
  <rect x="{{ strip_chrome_well_inset }}" y="{{ strip_chrome_well_inset }}" width="{{ accent_w }}" height="{{ strip_zones.chrome.accent_h }}"
        fill="url(#{{ uid }}-envelope)" opacity="0.7"/>
</g>

{# Top highlight — hairline specular line, badge parity.
   Fully vector (no filter), so it stays pixel-crisp on mobile. #}
<rect x="{{ strip_chrome_highlight_x }}" y="{{ strip_chrome_highlight_y }}" width="{{ strip_zones.chrome.highlight_w }}" height="{{ strip_chrome_highlight_h }}" rx="{{ strip_chrome_highlight_rx }}"
      fill="{{ specular_light }}"
      opacity="{{ highlight_opacity | default('0.1') }}"/>
