/**
 * Home card title leading icons — per-screen norms from public design systems
 * (not project-invented). Decorative only (aria-hidden in markup).
 *
 * Sources:
 * - IBM Carbon Icons: 16px with ~14px type, 20px with ~16px type; center-align;
 *   monochrome; interactive hit ≥44px (N/A — these icons are non-interactive).
 *   https://carbondesignsystem.com/elements/icons/usage/
 * - IBM Design Language UI icons: stroke weight scales with artboard
 *   (2px @32 → ~1px @16, ~1.25px @20). Phosphor Regular matches this family.
 *   https://www.ibm.com/design/language/iconography/ui-icons/design/
 * - Carbon buttons: 8px gap between label and icon (ghost).
 *   https://carbondesignsystem.com/components/button/usage/
 * - Linear product DS: icon-md 16px default; icon-lg 20px = “heading companion”;
 *   dark secondary text #8A8F98; spacing 4/8/12…
 *   https://github.com/soulcore-dev/soul-design-md/blob/main/designs/linear/DESIGN.md
 * - Apple HIG: interactive controls ≥44×44pt — not applied to decorative title glyphs.
 *   https://developer.apple.com/design/human-interface-guidelines/buttons
 * - Material 3: dense desktop often 20dp icons; touch targets 48dp for controls only.
 *   https://m3.material.io/styles/icons/designing-icons
 *
 * Breakpoint map (device windows, not “guess”):
 * | Screen  | Width            | Icon | Gap | Why |
 * | Desktop | ≥1024px          | 20px | 8px | Linear icon-lg heading companion; Carbon 20↔16pt expressive |
 * | Tablet  | 768px–1023.98px  | 16px | 8px | Carbon productive default (software density) |
 * | Phone   | ≤767.98px        | 16px | 8px | Keep Carbon productive floor; do not drop to 12px (ratio break) |
 */

:is(#js-trigger-home-admin-wrapper, #js-trigger-home-team-wrapper, #js-trigger-home-client-wrapper) {
  /* Linear dark secondary (heading-adjacent quiet chrome) */
  --nx-home-title-icon-color: #8a8f98;
  --nx-home-title-icon-gap: 0.5rem; /* 8px — Carbon ghost label↔icon */
  --nx-home-title-icon-size: 1.25rem; /* 20px desktop default */
}

:is(#js-trigger-home-admin-wrapper, #js-trigger-home-team-wrapper, #js-trigger-home-client-wrapper)
  .nx-home-card-title {
  display: inline-flex !important;
  align-items: center; /* Carbon: center, never baseline */
  gap: var(--nx-home-title-icon-gap);
  min-width: 0;
  max-width: 100%;
}

:is(#js-trigger-home-admin-wrapper, #js-trigger-home-team-wrapper, #js-trigger-home-client-wrapper)
  .nx-home-card-title__icon {
  flex: 0 0 auto;
  width: var(--nx-home-title-icon-size);
  height: var(--nx-home-title-icon-size);
  font-size: var(--nx-home-title-icon-size) !important;
  line-height: 1 !important;
  font-family: "Phosphor" !important;
  font-style: normal !important;
  font-weight: normal !important; /* Phosphor Regular ≈ IBM 1–1.25px stroke family */
  speak: none;
  color: var(--nx-home-title-icon-color);
  opacity: 1;
}

:is(#js-trigger-home-admin-wrapper, #js-trigger-home-team-wrapper, #js-trigger-home-client-wrapper)
  .nx-home-card-title__text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

:is(#js-trigger-home-admin-wrapper, #js-trigger-home-team-wrapper, #js-trigger-home-client-wrapper)
  .nx-home-card-title__text a {
  color: inherit;
  text-decoration: none;
}

:is(#js-trigger-home-admin-wrapper, #js-trigger-home-team-wrapper, #js-trigger-home-client-wrapper)
  .nx-home-card-title__text a:hover,
:is(#js-trigger-home-admin-wrapper, #js-trigger-home-team-wrapper, #js-trigger-home-client-wrapper)
  .nx-home-card-title__text a:focus {
  color: inherit;
  text-decoration: none;
  opacity: 0.92;
}

/* Prestige / light surfaces — secondary ink parallel to Linear #8A8F98 role */
:is(html.prestige, html[data-bs-theme="prestige"])
  :is(#js-trigger-home-admin-wrapper, #js-trigger-home-team-wrapper, #js-trigger-home-client-wrapper) {
  --nx-home-title-icon-color: #64748b;
}

/* —— Tablet (md): Carbon productive 16px —— */
@media (max-width: 1023.98px) and (min-width: 768px) {
  :is(#js-trigger-home-admin-wrapper, #js-trigger-home-team-wrapper, #js-trigger-home-client-wrapper) {
    --nx-home-title-icon-size: 1rem; /* 16px */
    --nx-home-title-icon-gap: 0.5rem; /* 8px */
  }
}

/* —— Phone (sm): keep 16px floor; gap stays 8px (Carbon) —— */
@media (max-width: 767.98px) {
  :is(#js-trigger-home-admin-wrapper, #js-trigger-home-team-wrapper, #js-trigger-home-client-wrapper) {
    --nx-home-title-icon-size: 1rem; /* 16px */
    --nx-home-title-icon-gap: 0.5rem; /* 8px */
  }
}

/* —— Desktop / expanded (≥1024): Linear heading companion 20px —— */
@media (min-width: 1024px) {
  :is(#js-trigger-home-admin-wrapper, #js-trigger-home-team-wrapper, #js-trigger-home-client-wrapper) {
    --nx-home-title-icon-size: 1.25rem; /* 20px */
    --nx-home-title-icon-gap: 0.5rem; /* 8px */
  }
}
