/* =========================================================
   JDRC_SITE_WIDE_WRAP_GUARD_V1
   Site-wide + mobile/foldable typography safety layer.

   Policy:
   - Never split normal UI words into individual letters.
   - Compact status/LED pills stay horizontal.
   - Longer labels may wrap only at normal word boundaries.
   - Header/tab navigation remains horizontal and scrollable.
   ========================================================= */

html,
body{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

/* Normal UI copy may wrap at spaces, never arbitrarily inside words. */
:where(
  h1,h2,h3,h4,h5,h6,
  dt,dd,label,legend,
  .eyebrow,
  .portal-kicker,
  .hero-kicker,
  .section-kicker,
  .panel-kicker,
  .card-title,
  .panel-title
){
  word-break:normal !important;
  overflow-wrap:normal !important;
  hyphens:none !important;
}

/* Buttons can wrap when necessary, but only between words. */
:where(
  button,
  .button,
  [role="button"]
){
  word-break:normal !important;
  overflow-wrap:normal !important;
  hyphens:none !important;
}

/* Normalize all status/badge/chip/pill families without forcing long copy
   to stay on one line. This directly neutralizes "anywhere" letter wrapping. */
:where(
  [class*="-status"],
  [class*="status-"],
  [class*="-badge"],
  [class*="badge-"],
  [class*="-chip"],
  [class*="chip-"],
  [class*="-pill"],
  [class*="pill-"]
){
  word-break:normal !important;
  overflow-wrap:normal !important;
  hyphens:none !important;
}

/* Compact LED/status indicators should stay as one complete label. */
:where(
  .status-chip,
  .status-pill,
  .jdrc-status-chip,
  .pit-os-chip,
  .pit-os-tag,
  .pit-feed-rule-chip,
  .pit-feed-tags span,
  .reward-v7-status,
  .sponsor-account-status,
  .sponsor-plan-badge,
  .sw-race-status,
  .sw-race-source,
  .sw-race-entry-chip,
  #jdrcLiveRaceCallChip
){
  display:inline-flex !important;
  align-items:center !important;

  flex:0 0 auto !important;
  flex-shrink:0 !important;

  width:auto !important;
  min-width:max-content !important;
  max-width:100% !important;

  white-space:nowrap !important;
  word-break:keep-all !important;
  overflow-wrap:normal !important;
  hyphens:none !important;

  writing-mode:horizontal-tb !important;
  text-orientation:mixed !important;
}

/* Protect LED/dot glyphs from collapsing. */
:where(
  .live-dot,
  [class*="-led"],
  [class*="led-"]
){
  flex-shrink:0 !important;
}

/* Membership + Reward Points labels:
   "Monthly Points", "Monthly entitlement", etc. may become two lines,
   but never M/O/N/T/H/L/Y letter stacks. */
:where(
  .driver-progression-meta span,
  .driver-progression-meta strong,
  .reward-v7-stats article > span,
  .reward-v7-stats article > strong,
  .membership-value-status,
  .membership-value-label,
  .membership-value-copy,
  [class*="membership"] [class*="point"],
  [class*="reward"] [class*="point"]
){
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
  hyphens:none !important;
}

/* Tab text always stays complete. Containers may scroll horizontally. */
:where(
  [role="tab"],
  a[class*="-tab"],
  button[class*="-tab"],
  .pit-feed-tab
){
  flex:0 0 auto !important;
  flex-shrink:0 !important;
  min-width:max-content !important;

  white-space:nowrap !important;
  word-break:keep-all !important;
  overflow-wrap:normal !important;
  hyphens:none !important;
}

:where(
  [role="tablist"],
  [class*="-tabs"]
){
  overflow-x:auto !important;
  overflow-y:hidden !important;
  overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}

:where(
  [role="tablist"],
  [class*="-tabs"]
)::-webkit-scrollbar{
  display:none;
}

/* Header navigation: all words stay intact; the row scrolls if a
   foldable/tablet viewport cannot hold every tab at once. */
@media (max-width:1280px){

  .site-header{
    min-width:0 !important;
  }

  .site-header nav{
    display:flex !important;
    align-items:center !important;
    flex-wrap:nowrap !important;

    min-width:0 !important;
    max-width:100% !important;

    overflow-x:auto !important;
    overflow-y:hidden !important;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }

  .site-header nav::-webkit-scrollbar{
    display:none;
  }

  .site-header nav > a,
  .site-header nav > button{
    flex:0 0 auto !important;
    flex-shrink:0 !important;
    min-width:max-content !important;
    width:auto !important;

    white-space:nowrap !important;
    word-break:keep-all !important;
    overflow-wrap:normal !important;
    hyphens:none !important;

    writing-mode:horizontal-tb !important;
    text-orientation:mixed !important;
  }

  /* Intermediate foldable widths are where 3/4-column stat grids
     were most likely to squeeze words into letter stacks. */
  .driver-progression-meta,
  .reward-v7-stats{
    grid-template-columns:repeat(2,minmax(150px,1fr)) !important;
  }

  :where(
    .portal-dashboard-head,
    .jdrc-credit-head,
    .reward-v7-head,
    .jdrc-live-stats-head,
    .pit-feed-section-head
  ){
    flex-wrap:wrap !important;
  }
}

@media (max-width:620px){

  .driver-progression-meta,
  .reward-v7-stats{
    grid-template-columns:1fr !important;
  }

  /* At very small widths, use whole-word wrapping instead of
     shrinking labels into columns. */
  :where(
    .driver-progression-meta span,
    .reward-v7-stats article > span,
    .membership-value-label,
    .membership-value-copy
  ){
    white-space:normal !important;
    word-break:normal !important;
    overflow-wrap:normal !important;
  }
}

/* Long URLs/codes are the exception: they are allowed to break so they
   cannot force the entire layout wider than the viewport. */
:where(
  .ref-v9-link,
  .ref-v9-code,
  code,
  pre,
  .url,
  .long-url
){
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}