/* ============================================================================
 * shared.css — Power Pages portal-specific overrides
 *
 * Scope: ONLY portal-chrome gaps and Liquid-rendered patterns that
 * navvis-ui.css does not cover. NEVER redefine colours, typography,
 * spacing, shadows, or radii — those come from navvis-ui.css tokens.
 *
 * displayorder: 10 (loads after navvis-ui.css / navvis-ui-overrides.css)
 * ============================================================================ */

/* Pin navbar to top of viewport (sticky) — no body offset needed since
 * the navbar takes up document flow naturally. shared.js still adds the
 * `nv-portal` class for other future portal-specific rules. */
body.nv-portal { margin: 0 !important; padding: 0 !important; }
body.nv-portal > .nv-reset { padding-top: 0 !important; }
/* Power Pages may wrap body in a container with default Bootstrap margin/padding — strip it */
body.nv-portal > div:first-child { margin-top: 0 !important; padding-top: 0 !important; }
.nv-navbar { position: sticky; top: 0; z-index: 200; margin: 0 !important; }

/* Empty-state convenience class for FetchXML-driven lists */
.nv-empty-state {
  color: var(--nv-color-text-secondary);
  font-style: italic;
  padding: var(--nv-space-8) 0;
  text-align: center;
}

/* Liquid-rendered pagination wrapper (matches structure produced by nav-pagination web template) */
.nv-pager-wrapper {
  display: flex;
  justify-content: center;
  padding: var(--nv-space-6) 0;
}

/* Honour HTML `hidden` attribute against framework component display rules */
[hidden] { display: none !important; }

/* Force nv-grid into a real grid (in case nv-grid base rule is missing).
   gap must honour --nv-gap so framework density modifiers (.nv-grid--gap-sm/lg)
   still work — do NOT hardcode the spacing token here. */
.nv-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--nv-gap, var(--nv-space-4));
}
.nv-grid > .nv-col-1  { grid-column: span 1; }
.nv-grid > .nv-col-2  { grid-column: span 2; }
.nv-grid > .nv-col-3  { grid-column: span 3; }
.nv-grid > .nv-col-4  { grid-column: span 4; }
.nv-grid > .nv-col-5  { grid-column: span 5; }
.nv-grid > .nv-col-6  { grid-column: span 6; }
.nv-grid > .nv-col-7  { grid-column: span 7; }
.nv-grid > .nv-col-8  { grid-column: span 8; }
.nv-grid > .nv-col-9  { grid-column: span 9; }
.nv-grid > .nv-col-10 { grid-column: span 10; }
.nv-grid > .nv-col-11 { grid-column: span 11; }
.nv-grid > .nv-col-12 { grid-column: span 12; }
@media (max-width: 767px) {
  .nv-grid > [class*="nv-col-"] { grid-column: 1 / -1; }
}
