/* Logged-in dashboard compact rules.
 * This file is loaded after the legacy showcase stylesheet, so selectors here
 * deliberately match its specificity where the product dashboard must win.
 */

/* Overview: status card, never a photographic hero. */
[data-husindex-card] > div[data-overview-compact-husindex] {
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  background-image:
    radial-gradient(circle at 92% 18%, rgba(45, 122, 103, .14), transparent 28%),
    linear-gradient(135deg, #073843 0%, #0a4a55 58%, #0b5660 100%) !important;
  background-position: initial !important;
  background-size: auto !important;
  background-repeat: no-repeat !important;
  box-shadow: 0 12px 30px rgba(7, 56, 67, .16) !important;
}

/* The current compact card has one real content wrapper. Older CSS assumed a
 * decorative first child and forced it absolute, collapsing the card to its
 * border/padding. Keep every direct child in flow unless it explicitly marks
 * itself as decoration. */
[data-husindex-card] > div[data-overview-compact-husindex] > div {
  position: relative !important;
  z-index: 2 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

[data-husindex-card] > div[data-overview-compact-husindex] > [data-husindex-decoration] {
  position: absolute !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

[data-husindex-card] > div[data-overview-compact-husindex]::after {
  display: none !important;
  content: none !important;
}

[data-husindex-card] > div[data-overview-compact-husindex] [data-husindex-gauge] {
  width: 7.75rem !important;
  max-width: 7.75rem !important;
  padding: .55rem .7rem !important;
}

[data-husindex-card] > div[data-overview-compact-husindex] [data-husindex-gauge] p {
  white-space: nowrap !important;
  line-height: 1 !important;
}

@media (min-width: 640px) {
  [data-husindex-card] > div[data-overview-compact-husindex] {
    padding-top: .75rem !important;
    padding-bottom: .75rem !important;
  }

  [data-husindex-card] > div[data-overview-compact-husindex] [data-husindex-gauge] {
    width: 8.25rem !important;
    max-width: 8.25rem !important;
  }
}

/* Plan: the action card should size to its own content instead of stretching
 * to match the explanatory card beside it.
 */
[data-plan-foundation-state] > div:nth-child(2) {
  align-items: start !important;
}

[data-plan-foundation-state] > div:nth-child(2) > section {
  align-self: start !important;
  height: auto !important;
  min-height: 0 !important;
}
