/* =============================================================================
   mh-railchips.css - PACK18b (19 Sep 2026)
   THE DESIGN PACK'S ACCENT-BAR ICON CHIPS, ON EVERY LEFT RAIL IN THE APP.

   Owner: "deploy the same icon and exact styles all over the database - left sidebar
   panel, wizards and detail mocks."

   Source of truth: _handoff/Sidebar panel Icon styles/icon-chips-export, shipped in this
   app as css/mh-iconchips.css, BYTE-FOR-BYTE. That file is what draws the chip - 56px,
   radius 5/15/15/5, the accent bar inset 3.5px, the 14% accent fill, the 28px Lucide mark
   at stroke 1.7. NOTHING HERE RESTATES ANY OF IT, and the app's own three copies of the
   old 34px chip (detail-view.css, enroll-wizard.css, program-wizards.css) are DELETED, so
   there is exactly one description of a chip in the codebase.

   The rails this covers, all four families:
     #clWiz, #clMbr                                   Add Household + Add Family Member
     #mhDetail                                        THE detail shell - every detail mock
     #enrollWiz #cnWiz #cnXfer #cnUnlock #cnAccess #cnDelete   Enroll + the Case Note wizards
     #pgWiz #schWiz #latePts                          Program + Schedule wizards

   This file does ONLY the two things the pack cannot do for itself:
     1. its README: "Themes set --p-accent, --p-ink3, --p-hover; any container can set
        those three instead" - each rail sets exactly those three, from the pack's own
        "sage-deep" theme in icon-chips.json. Its .mh-ground BACKGROUND is deliberately not
        taken: every one of these rails already has its pine surface, and replacing that
        would repaint panels nobody asked about.
     2. the pack's hover lives on .mh-chip, a column of icon-over-label. Every rail here is
        a row (mark left, label + value right), so the hover is re-pointed at the row -
        the DECLARATIONS are copied from icon-chips.css unchanged.
   ============================================================================= */

/* ---- 1. the pack's sage-deep theme, on each rail ---- */
:is(#clWiz,#clMbr) .dzaside,
:is(#subWiz,#volWiz) .wleft,
#mhDetail .rail,
:is(#enrollWiz,#cnWiz,#cnXfer,#cnUnlock,#cnAccess,#cnDelete) .rail,
:is(#pgWiz,#schWiz,#latePts) .wz2 .rail{
  --p-accent:#BFD2BA;--p-ink3:#9BB795;--p-hover:rgba(255,255,255,.06);
}

/* ---- 2. = .mh-chip, minus the column layout each rail row supplies itself ---- */
:is(#clWiz,#clMbr,:is(#subWiz,#volWiz)) .pv-stat,
#mhDetail .sum-row,
:is(#enrollWiz,#cnWiz,#cnXfer,#cnUnlock,#cnAccess,#cnDelete) .sum-row,
:is(#pgWiz,#schWiz,#latePts) .sum-row{
  padding:12px 14px;border-radius:14px;
  transition:background .18s ease-out,transform .18s ease-out;
}
:is(#clWiz,#clMbr,:is(#subWiz,#volWiz)) .pv-stat:hover,
#mhDetail .sum-row:hover,
:is(#enrollWiz,#cnWiz,#cnXfer,#cnUnlock,#cnAccess,#cnDelete) .sum-row:hover,
:is(#pgWiz,#schWiz,#latePts) .sum-row:hover{
  background:var(--p-hover);transform:translateY(-3px);
}

/* ---- 3. = .mh-chip:hover .mh-chip__icon ---- */
:is(#clWiz,#clMbr,:is(#subWiz,#volWiz)) .pv-stat:hover .mh-chip__icon,
#mhDetail .sum-row:hover .mh-chip__icon,
:is(#enrollWiz,#cnWiz,#cnXfer,#cnUnlock,#cnAccess,#cnDelete) .sum-row:hover .mh-chip__icon,
:is(#pgWiz,#schWiz,#latePts) .sum-row:hover .mh-chip__icon,
#mhDetail .sum-more:hover .mh-chip__icon{
  background:color-mix(in srgb,var(--p-accent) 22%,transparent);
  box-shadow:inset 5px 0 0 var(--p-accent),0 6px 16px color-mix(in srgb,var(--p-accent) 28%,transparent);
}

/* ---- 4. = .mh-chip__label, on each row's own label ---- */
:is(#clWiz,#clMbr,:is(#subWiz,#volWiz)) .pv-stat .sv .l,
#mhDetail .sum-k,
:is(#enrollWiz,#cnWiz,#cnXfer,#cnUnlock,#cnAccess,#cnDelete) .sum-k,
:is(#pgWiz,#schWiz,#latePts) .sum-k{color:var(--p-ink3)}

/* ---- 5. ONE VERTICAL LINE (PACK18c). Owner: "never deploy the icons like that, it must be
          in the same vertical row." Every row in a rail list - a plain fact, a clickable fact
          (.act) and the detail shell's "N more" button - gets the SAME left padding, so every
          accent bar starts at the same x. The list is pulled back by that padding so the column
          still sits on the rail's own edge. ---- */
#mhDetail .sum-list,
:is(#enrollWiz,#cnWiz,#cnXfer,#cnUnlock,#cnAccess,#cnDelete) .sum-list,
:is(#pgWiz,#schWiz,#latePts) .sum-list{margin-left:-14px;margin-right:-14px}
/* the detail shell's "N more in Overview" row is part of the same column */
#mhDetail .sum-more{padding-left:14px;padding-right:14px;border-radius:14px}

@media (prefers-reduced-motion:reduce){
  :is(#clWiz,#clMbr,:is(#subWiz,#volWiz)) .pv-stat,
  #mhDetail .sum-row,
  :is(#enrollWiz,#cnWiz,#cnXfer,#cnUnlock,#cnAccess,#cnDelete) .sum-row,
  :is(#pgWiz,#schWiz,#latePts) .sum-row{transition:none}
  :is(#clWiz,#clMbr,:is(#subWiz,#volWiz)) .pv-stat:hover,
  #mhDetail .sum-row:hover,
  :is(#enrollWiz,#cnWiz,#cnXfer,#cnUnlock,#cnAccess,#cnDelete) .sum-row:hover,
  :is(#pgWiz,#schWiz,#latePts) .sum-row:hover{transform:none}
}