/* PhoneSecondaryNav — shared-component styles (Framework Contract §C). Co-located home for
   design-specific CSS. Layout/spacing/color all come from catalog utilities (flx, f_r, f_m, f_nln,
   gp_sp-lrg/-sml, bdr-rds, pd_tp-20/pd_bt-20, clr-acc, fit) and the palette scope of the parent
   header module — keep it that way.
   TWO escape-hatch values (both token-derived, friendly-annotated, component-prefixed; no raw
   magic numbers):
   1. .pil-bx inline padding — no catalog utility does element-level inline padding at pill scale
      (pd_h is %-clamped section padding; the quick pd_* classes are top/bottom only). Token-to-token:
      the comp's "standard" pill side padding maps to --sp-qk (Quick Spacing, 1rem), exposed as a
      scoped custom property (PhoneCallout --phn-clo-pd-h / PhoneSocial --phn-scl-pd-h idiom).
   2. .emg-icn-bx inline icon optical size — comp glyph is 24px ÷ 16 = 1.5rem; mirrors the Phone.css
      .phn-icn-bx idiom exactly (global.css sizes svg via 1em).
   Pill surface stays TRANSPARENT by design — radius/padding exist for header states that add a fill.
   Do not add background/border here. */

.phn-sec-nv .pil-bx {
	--phn-sec-nv-pd-h: var(--sp-qk); /* { min: 0.5, max: 3, step: 0.1, friendly: 'Phone/Secondary Nav Pill Side Padding' } */
	padding-inline: var(--phn-sec-nv-pd-h);
}

.phn-sec-nv .emg-icn-bx {
	--phn-sec-nv-icn-s: 1.5rem; /* { min: 1, max: 3, step: 0.1, friendly: 'Phone/Secondary Nav Emergency Icon Size' } */
	font-size: var(--phn-sec-nv-icn-s);
}