/*
 * AA Landing 9.7.5 — definitive statistics surface fix
 *
 * The statistics row must never be pulled outside its own layout box. The old
 * -46px overlap crossed the page-builder/widget boundary: in light mode that
 * boundary was visible as a horizontal rule through the cards; Safari dark
 * compositing could clip everything above the same boundary. This layer is
 * intentionally loaded LAST and uses a new filename so no stale cached polish
 * stylesheet can win over it.
 */

/* Standalone shortcode: no masking cap, no technical grid behind the panel. */
.aail-site.aail-fragment-stats,
.aail-fragment.aail-fragment-stats {
  padding-top: 0 !important;
  background-color: var(--aail-theme-bg, #f1efe9) !important;
  background-image: none !important;
  overflow-y: visible !important;
}

.aail-site.aail-fragment-stats::before,
.aail-fragment.aail-fragment-stats::before {
  content: none !important;
  display: none !important;
  background: none !important;
  box-shadow: none !important;
}

/* Full landing + standalone shortcode: the row stays inside normal flow. */
.aail-site .aail-stats,
.aail-fragment .aail-stats,
.aail-visual-studio-hybrid .aail-stats,
.aail-visual-layout-master-v8 .aail-stats {
  margin-top: 0 !important;
  padding-top: 0 !important;
  position: relative !important;
  z-index: 1 !important;
  isolation: isolate !important;

  /* Opaque surface: the 48px page grid can never show through the cards. */
  background-color: var(--aail-theme-surface, #f8f6f1) !important;
  background-image: none !important;

  /* Avoid Safari's backdrop-filter/overflow compositing cut in dark mode. */
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;

  /* One clean OUTER frame only. No internal horizontal rule. */
  border: 1px solid var(--aail-theme-line, rgba(24,24,21,.15)) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

/* Cards only draw vertical separators. Their own opaque surface also preserves
 * the existing hover palette because --aail-panel-bg changes on hover/focus. */
.aail-site .aail-stats > .aail-stat-card,
.aail-fragment .aail-stats > .aail-stat-card {
  border: 0 !important;
  border-radius: 0 !important;
  border-right: 1px solid var(--aail-theme-line, rgba(24,24,21,.15)) !important;
  outline: 0 !important;
  box-shadow: none !important;
  background-color: var(--aail-panel-bg, var(--aail-theme-surface, #f8f6f1)) !important;
  background-image: none !important;
}

.aail-site .aail-stats > .aail-stat-card:last-child,
.aail-fragment .aail-stats > .aail-stat-card:last-child {
  border-right: 0 !important;
}

/* On stacked layouts the separators become horizontal between cards, but
 * never above the first card. */
@media (max-width: 760px) {
  .aail-site .aail-stats > .aail-stat-card,
  .aail-fragment .aail-stats > .aail-stat-card {
    border-right: 0 !important;
    border-bottom: 1px solid var(--aail-theme-line, rgba(24,24,21,.15)) !important;
  }
  .aail-site .aail-stats > .aail-stat-card:last-child,
  .aail-fragment .aail-stats > .aail-stat-card:last-child {
    border-bottom: 0 !important;
  }
}