/* One page width for every content page.
 *
 * These pages had drifted apart: `.container` is declared 1200px in styles.css and
 * again as 1800px !important in dashboard.css, which loads later and wins - so History
 * rendered at 1800px. Meanwhile `.agents-dashboard-container` pinned Agents to 1000px,
 * `.player-stats-shell` to 1000px and `.ml-dashboard-container` to 1600px. Four
 * different widths across pages that should read as one product.
 *
 * Loaded last in base.html so it settles the argument. The dashboard itself is left
 * alone: it is a dense fixture grid, not a content page, and uses `.fc-content`.
 */

:root {
  /* One number governs every content page. Agents and betbuilder were already at
   * 1900px and read best there; the rest were narrower for no deliberate reason. */
  --rb-shell-width: 1900px;
}

.rb-page-shell,
body:not(.dashboard-page) .container.rb-page-shell,
.history-container,
.agents-dashboard-container,
.player-stats-shell,
.ml-dashboard-container,
.leagues-container,
.betbuilder-container {
  max-width: var(--rb-shell-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100%;
}

/* Narrow variant keeps working for pages that deliberately want a reading column. */
.rb-page-shell--narrow {
  max-width: 800px !important;
}

/* Consistent side padding so the content edge lines up between pages. */
.rb-page-shell,
.history-container,
.agents-dashboard-container,
.player-stats-shell,
.ml-dashboard-container {
  padding-left: 20px;
  padding-right: 20px;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .rb-page-shell,
  .history-container,
  .agents-dashboard-container,
  .player-stats-shell,
  .ml-dashboard-container {
    padding-left: 12px;
    padding-right: 12px;
  }
}


/* Nested shells: an outer wrapper that merely contains the real shell must not
 * constrain anything itself.
 *
 * history.html is `<div class="history-container"><div class="container rb-page-shell">`,
 * so applying the width and padding to BOTH gave it two layers of each and left its
 * content visibly narrower than every other page. Only the innermost shell should own
 * the measurements; the outer div becomes a plain full-width block.
 */
.history-container:has(> * > .rb-page-shell),
.history-container:has(> .rb-page-shell) {
  max-width: none !important;
  padding-left: 0;
  padding-right: 0;
}

/* :has() is unsupported in older engines, so pin the known case directly too. */
.history-container {
  max-width: none !important;
  padding-left: 0;
  padding-right: 0;
}
.history-container .rb-page-shell {
  max-width: var(--rb-shell-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 20px;
  padding-right: 20px;
}

@media (max-width: 768px) {
  .history-container .rb-page-shell {
    padding-left: 12px;
    padding-right: 12px;
  }
}


/* Body-scoped overrides.
 *
 * Each page had grown its own shell width, and because these selectors are
 * body-scoped they outrank a bare `.rb-page-shell`:
 *
 *     agents          1900px !important
 *     betbuilder      1900px
 *     leagues         1360px
 *     rb-style-page   1000px
 *     layout default  1200px
 *
 * Agents used !important, so it beat this file outright and rendered ~540px wider
 * than leagues. Matching the specificity (and the !important) is the only way to make
 * one width authoritative without editing five stylesheets that other rules depend on.
 */
body.leagues-style-page .rb-page-shell,
body.agents-style-page .rb-page-shell,
body.betbuilder-style-page .rb-page-shell,
body.rb-style-page .rb-page-shell,
body.history-style-page .history-container .rb-page-shell,
body.dashboard-style-page .rb-page-shell {
  max-width: var(--rb-shell-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* The fixture-grid dashboard opts out on purpose: it is a dense board, not a
   reading column, and its own layout owns the width. */
body.fc-layout-active .rb-page-shell,
.fc-layout-active .fc-content .rb-page-shell {
  max-width: none !important;
}