/*
 * Authority/Trust Item -- Phase 4 (Authority/Trust System Convergence,
 * catalog/governance/COMPONENT_CONVERGENCE_AUDIT.md). Real evidence
 * (HHDS service-trust.php, Michelle's Nails Service authority_band,
 * Maggy's testimonials authority card, the Hero Authority/Proof
 * primitive) converges on exactly 3 reusable responsibilities -- not 4:
 * a speculative "stat" type was NOT added because HHDS's own real
 * "stat" and "text" items render through the identical branch of its
 * source PHP (no visual or data-shape distinction), and Michelle's
 * real "5+ / Years in Brockton" value+label pairing already fits
 * --standard (icon optional, value optional, label required) exactly.
 *
 * standard   -- optional icon + optional value + required label.
 * rating     -- optional platform icon + optional numeric score +
 *               components/rating-stars (UI-009, reused verbatim, never
 *               re-implemented) + required label.
 * credential -- required media (image) + required label + optional
 *               sublabel.
 */

.lib-authority-item {
  display: flex;
  align-items: center;
  gap: var(--lib-space-3);
}

.lib-authority-item__icon-wrap {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
}

/* Generic closed-enum iconography (calendar/shield/badge/heart-class
   ideas: experience, guarantee, certification, service commitment) --
   inherits the surrounding brand color, unlike platform marks below. */
.lib-authority-item__icon {
  width: var(--lib-size-authority-icon, 1.75rem);
  height: var(--lib-size-authority-icon, 1.75rem);
  color: var(--lib-icon-brand);
}

.lib-authority-item__icon svg {
  width: 100%;
  height: 100%;
}

/* Real third-party brand marks (Google/Facebook) must never change
   color with the surrounding brand -- same rule already established for
   the Hero Authority Band (generation-hhds.css), converged here as the
   single canonical source instead of two independent rules. Google's
   own SVG paints its real 4-color logo directly (no currentColor
   involved); Facebook's needs an explicit brand-color pin. */
.lib-authority-item__icon--facebook {
  color: var(--lib-color-brand-facebook);
}

.lib-authority-item__media {
  width: var(--lib-size-authority-credential, 3rem);
  height: var(--lib-size-authority-credential, 3rem);
  object-fit: contain;
  flex-shrink: 0;
}

.lib-authority-item__content {
  display: flex;
  flex-direction: column;
  gap: var(--lib-space-1);
  min-width: 0;
}

/* Human review correction (2026-08-25): value+label stacked on two
   lines made the whole band read taller than necessary -- real
   precedent (the original Hero Authority Band this converges) always
   kept value and label on one baseline-aligned line for the standard
   type specifically. rating/credential keep the two-line stack (their
   own rating-row + label, or label + sublabel, are each real content,
   not the same "single short pairing" case standard is). */
/* Em, not the rem space scale, on purpose (same already-documented
   reasoning as generation-hhds.css's own .hhds-authority-item__content,
   this is Path A's equivalent): this gap sits between two inline text
   runs of different font-sizes and must scale with each run's own
   size, not a fixed root-relative gap. */
.lib-authority-item--standard .lib-authority-item__content {
  flex-direction: row;
  align-items: baseline;
  gap: 0.35em; /* design-allow: SP-03 */
}

.lib-authority-item__content--centered {
  align-items: center;
  text-align: center;
}

.lib-authority-item__rating {
  display: flex;
  align-items: baseline;
  gap: var(--lib-space-2);
}

.lib-authority-item__score {
  font-family: var(--lib-font-heading);
  font-weight: 700;
}

.lib-authority-item__value {
  font-family: var(--lib-font-heading);
  font-weight: 700;
}

.lib-authority-item__label {
  font-size: var(--lib-font-size-small);
  font-weight: 700;
  line-height: 1.2;
}

.lib-authority-item__sublabel {
  font-size: var(--lib-font-size-caption);
  font-weight: 400;
  line-height: 1.35;
  opacity: 0.72;
}