/* PHSPB 3.13.51 — deliberate mobile stats polish.
   Presentation only: no player, fetch, cache, cron, API, or snapshot changes. */

/* The Elementor mobile marker is already present on the current model pages.
   A small media fallback keeps this layer useful outside Elementor preview. */
@media (max-width:820px) {
  body.phspb-stream-template .phspb-full-stats { --phspb-mobile-stats: 1; }
}

body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats,
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats * {
  min-width: 0 !important;
}

/* Keep the overview strong, but trim the visual weight on a phone. */
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__overview,
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__sessions {
  padding: 15px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__metric-grid {
  gap: 8px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__metric-grid > .phspb-full-stats__metric {
  min-height: 112px !important;
  padding: 12px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__metric-grid > .phspb-full-stats__metric-icon {
  margin-bottom: 9px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__metric-grid > .phspb-full-stats__metric small {
  margin-top: 6px !important;
  font-size: 10px !important;
}

/* Live strip: a real compact dashboard strip rather than four separate tiles. */
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__live-strip {
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  border-radius: 16px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__live-item {
  min-height: 48px !important;
  padding: 9px 8px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__live-item:first-child {
  grid-column: 1 / -1 !important;
  min-height: 37px !important;
  padding: 8px 10px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__live-item:nth-child(2n + 1)::before {
  display: none !important;
}

/* Recent sessions: two clean session cards first. The old desktop headers are noise here. */
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__session-labels {
  display: none !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__session-table {
  gap: 10px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__session-row {
  display: grid !important;
  grid-template-columns: 56px minmax(0,1fr) !important;
  gap: 9px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 11px !important;
  border-radius: 17px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__date {
  grid-column: 1 !important;
  grid-row: 1 !important;
  min-height: 54px !important;
  padding: 7px 4px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__session-main {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: center !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__session-main strong {
  display: block !important;
  max-width: 100% !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__session-main em {
  margin: 6px 0 0 !important;
  padding: 4px 7px !important;
  font-size: 8px !important;
}
/* Metrics stop being boxes inside another box: duration is a subtle strip;
   peak and average share a lightweight two-up line. */
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__session-metric {
  min-height: 36px !important;
  padding: 6px 7px !important;
  border-color: rgba(207,167,255,.12) !important;
  border-radius: 11px !important;
  background: rgba(255,255,255,.025) !important;
  box-shadow: none !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__session-metric:nth-child(3) {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__session-metric:nth-child(4) {
  grid-column: 1 !important;
  grid-row: 3 !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__session-metric:nth-child(5) {
  grid-column: 2 !important;
  grid-row: 3 !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__session-metric:nth-child(4),
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__session-metric:nth-child(5) {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__session-metric span {
  font-size: 8px !important;
  letter-spacing: .08em !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__session-metric strong {
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1 !important;
}
/* Initial mobile state is intentionally only two sessions. JS changes the
   state to expanded when the ghost button is tapped. */
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__session-table[data-phspb-mobile-sessions="collapsed"] > article.phspb-full-stats__session-row:nth-of-type(n+3) {
  display: none !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__session-table[data-phspb-mobile-sessions="expanded"] > article.phspb-full-stats__session-row {
  display: grid !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-mobile-reveal {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  margin: 3px auto 0;
  padding: 8px 14px;
  border: 1px solid rgba(224,154,255,.28);
  border-radius: 999px;
  color: #f1c7ff;
  background: rgba(155,72,255,.12);
  font: 750 12px/1 Inter,system-ui,sans-serif;
  cursor: pointer;
}

/* Deep analytics: one shell, two understated groups. Fewer nested frames and
   an intentional 2×2 rhythm grid avoid the old tall, card-after-card feed. */
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__deep {
  border-radius: 20px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__tabs {
  display: grid !important;
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  gap: 0 !important;
  padding: 8px 8px 0 !important;
  overflow: hidden !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__tabs button {
  min-width: 0 !important;
  padding: 11px 5px !important;
  font-size: 11px !important;
  line-height: 1.1 !important;
  text-align: center !important;
  white-space: nowrap !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__tabs button.is-active::after {
  right: 9px !important;
  left: 9px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__tab-panel {
  padding: 12px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__audience,
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__audience-summary,
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__details {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) !important;
  gap: 12px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__metric-group,
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__schedule-summary {
  padding: 12px !important;
  border-radius: 17px !important;
  background: linear-gradient(145deg,rgba(30,10,57,.5),rgba(14,5,31,.34)) !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__group-head {
  margin: 0 0 10px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__group-head strong {
  font-size: 15px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__group-head span {
  display: none !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__mini-grid--growth,
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__mini-grid--activity,
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__mini-grid--details,
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__mini-grid--schedule {
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 9px !important;
}
/* Growth only needs community size and weekly gain on a phone. */
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__mini-grid--growth > .phspb-full-stats__metric:nth-child(2),
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__mini-grid--growth > .phspb-full-stats__metric:nth-child(4) {
  display: none !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__mini-grid > .phspb-full-stats__metric {
  min-height: 92px !important;
  padding: 11px !important;
  border-radius: 15px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__mini-grid > .phspb-full-stats__metric:nth-child(odd):last-child {
  grid-column: auto !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__mini-grid .phspb-full-stats__metric-icon {
  width: 25px !important;
  height: 25px !important;
  margin-bottom: 7px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__mini-grid .phspb-full-stats__metric-label {
  font-size: 8.5px !important;
  line-height: 1.08 !important;
  letter-spacing: .08em !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__mini-grid .phspb-full-stats__metric strong {
  margin-top: 6px !important;
  font-size: 23px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__mini-grid .phspb-full-stats__metric small {
  display: none !important;
}

/* Viewer Peaks: horizontal segmented selector and a real compact chart.
   When there are no positive daily samples, JS applies the empty state so
   the page never carries a huge blank graph. */
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__chart {
  min-height: 0 !important;
  padding: 12px !important;
  border-radius: 17px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__chart-head {
  align-items: center !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__chart-head > div:first-child span {
  font-size: 10px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__chart-tools {
  display: flex !important;
  align-items: center !important;
  width: auto !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__chart-ranges {
  display: inline-grid !important;
  grid-template-columns: repeat(3,1fr) !important;
  gap: 2px !important;
  padding: 3px !important;
  border: 1px solid rgba(207,164,255,.15) !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.025) !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__chart-ranges button {
  min-width: 33px !important;
  padding: 6px 4px !important;
  border-radius: 7px !important;
  font-size: 10px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__chart-head b { display:none !important; }
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__chart-tooltip {
  min-height: 34px !important;
  margin: 9px 0 7px !important;
  padding: 9px 10px !important;
  border-radius: 11px !important;
  font-size: 10px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__bars,
body.phspb-stream-template[data-elementor-device-mode="mobile"] [data-phspb-chart-bars] {
  display: flex !important;
  flex: 0 0 112px !important;
  height: 112px !important;
  min-height: 112px !important;
  align-items: flex-end !important;
  gap: 4px !important;
  padding: 6px 0 7px !important;
  visibility: visible !important;
  opacity: 1 !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__chart-bar,
body.phspb-stream-template[data-elementor-device-mode="mobile"] [data-phspb-chart-point="1"] {
  display: flex !important;
  flex: 1 1 0 !important;
  align-items: flex-end !important;
  width: auto !important;
  height: 100% !important;
  min-width: 5px !important;
  overflow: hidden !important;
  visibility: visible !important;
  opacity: 1 !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__chart-bar i,
body.phspb-stream-template[data-elementor-device-mode="mobile"] [data-phspb-chart-point="1"] i {
  display: block !important;
  width: 100% !important;
  height: var(--value) !important;
  min-height: 4px !important;
  border-radius: 5px 5px 0 0 !important;
  background: linear-gradient(180deg,#ea8cff 0%,#b85dff 50%,#753ce8 100%) !important;
  box-shadow: 0 0 12px rgba(211,105,255,.4) !important;
  visibility: visible !important;
  opacity: 1 !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__chart.is-mobile-empty {
  min-height: 148px !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__chart.is-mobile-empty .phspb-full-stats__bars {
  display:none !important;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-mobile-chart-empty {
  display:flex;
  align-items:center;
  min-height:54px;
  padding:11px 12px;
  border:1px dashed rgba(203,154,255,.2);
  border-radius:12px;
  color:#bdaed2;
  background:rgba(255,255,255,.018);
  font-size:11px;
  line-height:1.35;
}
body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__chart-foot {
  padding-top:8px !important;
  font-size:9px !important;
}

/* Small phones retain a dignified single-column fallback, never clipped cards. */
@media (max-width:390px) {
  body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__mini-grid--activity,
  body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__mini-grid--details,
  body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__mini-grid--schedule {
    grid-template-columns: minmax(0,1fr) !important;
  }
  body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__session-row {
    grid-template-columns: 52px minmax(0,1fr) !important;
  }
  body.phspb-stream-template[data-elementor-device-mode="mobile"] .phspb-full-stats__tabs button {
    font-size: 10px !important;
  }
}
