/**
 * TEMPORARY debug overlay — page 6/12-col grid from tokens.css
 *
 * Enable:  ?debugGrid=1  (persists via localStorage)
 * Disable: ?debugGrid=0
 * Or:      document.documentElement.classList.add('debug-grid')
 *
 * Remove: delete this file, assets/js/debug-grid.js, and the
 *         heim-debug-grid enqueue block in functions.php.
 */

html.debug-grid::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 2147483646;
  pointer-events: none;
  /* Page margins as faint side bands */
  background-color: rgba(255, 80, 0, 0.04);
  background-clip: border-box;
  border-inline: var(--page-margin) solid rgba(255, 80, 0, 0.1);
  box-sizing: border-box;
}

html.debug-grid::after {
  --debug-grid-width: min(
    calc(100vw - (var(--page-margin) * 2)),
    var(--container-max)
  );
  --debug-col: calc(
    (
        var(--debug-grid-width) -
          ((var(--grid-columns) - 1) * var(--grid-gutter))
      ) / var(--grid-columns)
  );

  content: "";
  position: fixed;
  top: 0;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2147483647;
  pointer-events: none;
  width: var(--debug-grid-width);
  background-image: repeating-linear-gradient(
    to right,
    rgba(22, 61, 158, 0.14) 0,
    rgba(22, 61, 158, 0.14) var(--debug-col),
    transparent var(--debug-col),
    transparent calc(var(--debug-col) + var(--grid-gutter))
  );
}