/* Shared generated markup contract, loaded after the selected theme.
   Theme colors and typography stay in each variant; these rules supply
   shared navigation and adapt the three legacy layout families. */
.site-header { padding-inline: 0; height: auto; }
.site-header > .container {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%; max-width: var(--max-w, var(--max-width, 1140px));
  min-height: 64px; height: auto; margin-inline: auto; padding: 10px 20px; gap: 16px;
}
.site-header .logo { display: flex; align-items: center; gap: 8px; min-width: 0; flex-shrink: 0; }
.site-header .logo-img { display: block; width: auto; height: 30px; max-width: 110px; object-fit: contain; }
.site-header .nav { display: flex; align-items: center; flex-wrap: wrap; list-style: none; gap: 4px; margin: 0; padding: 0; }
.site-header .nav a { display: block; padding: 8px 10px; color: var(--text); text-decoration: none; font-size: .875rem; }
.site-header .nav a:hover { color: var(--accent); }
.site-header .hamburger { display: none; flex-shrink: 0; width: 44px; height: 44px; padding: 10px; border: 1px solid var(--border); border-radius: 6px; background: transparent; color: var(--text); cursor: pointer; }
.site-header .hamburger span { display: block; width: 22px; height: 2px; flex-shrink: 0; background: currentColor; }
.site-header :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
main > .hero { max-width: var(--max-w, var(--max-width, 1140px)); margin-inline: auto; padding-inline: 20px; }
main .container { min-width: 0; }
main img { max-width: 100%; }
/* Small key facts need the readable secondary colour in every theme. */
body .key-info .label { color: var(--text-secondary); }
main .btn-primary { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
.provider-logo-grid { grid-template-columns: repeat(auto-fit, minmax(min(120px, 100%), 1fr)); }
/* These families originally targeted a comparison app with a nav element
   and sidebar. Generated brand pages use .nav and full-width articles. */
body:is([data-theme^="filterable-grid--"], [data-theme^="table-forward--"], [data-theme^="gamified-emoji--"]) {
  --surface: var(--card-bg); --surface-hover: var(--card-bg);
  --bg-alt: var(--card-bg); --accent-dark: var(--primary-dark);
  --green: var(--success); --green-bg: transparent; --green-border: var(--border);
  --accent-glow: transparent; --radius: var(--radius-md);
}
body:is([data-theme^="filterable-grid--"], [data-theme^="table-forward--"], [data-theme^="gamified-emoji--"]) .container { width: 100%; max-width: var(--max-width); margin-inline: auto; padding-inline: 20px; }
body:is([data-theme^="filterable-grid--"], [data-theme^="table-forward--"], [data-theme^="gamified-emoji--"]) main { display: block; padding: 24px 0; }
body:is([data-theme^="filterable-grid--"], [data-theme^="table-forward--"], [data-theme^="gamified-emoji--"]) .content-section { padding: 24px; margin-block: 24px; background: var(--card-bg); border: 1px solid var(--border); border-radius: var(--radius-md); }
body:is([data-theme^="filterable-grid--"], [data-theme^="table-forward--"], [data-theme^="gamified-emoji--"]) .content-section :is(p, ul, ol) { margin-block: 12px; }
body:is([data-theme^="filterable-grid--"], [data-theme^="table-forward--"], [data-theme^="gamified-emoji--"]) .content-section :is(ul, ol) { padding-left: 24px; }
body:is([data-theme^="filterable-grid--"], [data-theme^="table-forward--"], [data-theme^="gamified-emoji--"]) .key-info { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; background: var(--card-bg); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 20px; }
body:is([data-theme^="filterable-grid--"], [data-theme^="table-forward--"], [data-theme^="gamified-emoji--"]) .key-info :is(.label,.value) { display: block; }
body:is([data-theme^="filterable-grid--"], [data-theme^="table-forward--"], [data-theme^="gamified-emoji--"]) .key-info .label { color: var(--text-secondary); font-size: .8rem; }
body:is([data-theme^="filterable-grid--"], [data-theme^="table-forward--"], [data-theme^="gamified-emoji--"]) .key-info .value { font-weight: 700; overflow-wrap: anywhere; }
body:is([data-theme^="filterable-grid--"], [data-theme^="table-forward--"], [data-theme^="gamified-emoji--"]) .hero { padding-block: 32px; }
body:is([data-theme^="filterable-grid--"], [data-theme^="table-forward--"], [data-theme^="gamified-emoji--"]) .hero h1 { font-size: clamp(1.7rem, 3vw, 2.6rem); line-height: 1.2; margin-bottom: 16px; }
.mobile-cta { display: none; }
@media (max-width: 900px) {
  .site-header > .container { flex-wrap: wrap; gap: 8px; }
  .site-header .logo { font-size: .95rem; gap: 5px; max-width: calc(100% - 52px); flex-wrap: wrap; }
  .site-header .logo-img { max-width: 90px; height: 26px; }
  .site-header .hamburger { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; margin-left: auto; }
  .site-header .nav { display: none; }
  .site-header .nav.open { display: flex; position: static; width: 100%; flex: 0 0 100%; flex-direction: column; align-items: stretch; padding: 8px 0; background: var(--surface, var(--card-bg, var(--bg))); }
  .site-header .nav.open a { padding: 10px; }
  body { padding-bottom: 76px; }
  .mobile-cta { display: block; position: fixed; inset: auto 0 0; z-index: 200; padding: 14px 12px max(14px, env(safe-area-inset-bottom)); background: var(--accent); color: var(--text); text-align: center; font-weight: 700; font-size: .875rem; text-decoration: none; }
}
@media (max-width: 600px) {
  body:is([data-theme^="filterable-grid--"], [data-theme^="table-forward--"], [data-theme^="gamified-emoji--"]) .key-info { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 16px; }
  .pokies-grid, .feature-grid { grid-template-columns: minmax(0, 1fr); }
  .provider-logo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .content-section { overflow-wrap: anywhere; }
}

body:is([data-theme^="filterable-grid--"], [data-theme^="table-forward--"], [data-theme^="gamified-emoji--"]) main a:not(.btn-primary):not(.btn):not(.btn-cta) { color: var(--primary); }
body:is([data-theme^="filterable-grid--"], [data-theme^="table-forward--"], [data-theme^="gamified-emoji--"]) .hero .subtitle { margin-block: 16px; }
@media (max-width: 480px) {
  .key-info .info-item { min-width: 0; overflow-wrap: anywhere; }
  .key-info .value { font-size: .85rem; }
}

/* Wide comparison tables scroll within their own region, not the page. */
.table-scroll { max-width: 100%; min-width: 0; overflow-x: auto; margin-block: 24px; }
.table-scroll table { width: 100%; min-width: 32rem; margin-block: 0; }
.table-scroll:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Keep shared controls readable on both light and dark accent palettes. */
body a.mobile-cta, body main a.btn-primary {
  background: var(--accent); color: var(--cta-foreground); filter: none;
}
body a.mobile-cta:hover, body main a.btn-primary:hover {
  color: var(--cta-foreground); filter: none; text-decoration: underline;
}
body .post-meta, body .breadcrumbs { color: var(--text-secondary); }
main .provider-logo-card { min-width: 0; align-self: stretch; }
main .provider-logo-card img {
  width: 80px; height: 64px; object-fit: contain; padding: 6px;
  background: #fff; border-radius: 4px;
}
main .provider-logo-card span { font-size: .8rem; overflow-wrap: normal; word-break: normal; }
@media (max-width: 600px) {
  main .provider-logo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  main .pros-cons { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 360px) {
  main .provider-logo-grid { grid-template-columns: minmax(0, 1fr) !important; }
  main .provider-logo-card { flex-direction: row; justify-content: flex-start; }
  main .provider-logo-card img { flex: 0 0 80px; }
}

/* Keep four dashboard facts balanced without changing six-fact summaries. */
@media (min-width: 769px) {
  body[data-theme^="dashboard-stats--"] .key-info:has(> .info-item:nth-child(4):last-child) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body[data-theme^="dashboard-stats--"] .key-info:has(> .info-item:nth-child(4):last-child) > .info-item {
    min-width: 0;
    overflow-wrap: anywhere;
  }
}
@media (min-width: 1024px) {
  body[data-theme^="dashboard-stats--"] .key-info:has(> .info-item:nth-child(4):last-child) {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* Balance four-fact grids in the remaining grid-based layout families. */
@media (min-width: 769px) {
  body:is([data-theme^="toplist-comparison--"], [data-theme^="dark-immersive--"], [data-theme^="gamified-emoji--"], [data-theme^="trust-authority--"], [data-theme^="table-forward--"], [data-theme^="filterable-grid--"], [data-theme^="media-magazine--"]):not([data-theme="table-forward--navy-crisp"]) .key-info:has(> .info-item:nth-child(4):last-child) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body:is([data-theme^="toplist-comparison--"], [data-theme^="dark-immersive--"], [data-theme^="gamified-emoji--"], [data-theme^="trust-authority--"], [data-theme^="table-forward--"], [data-theme^="filterable-grid--"], [data-theme^="media-magazine--"]):not([data-theme="table-forward--navy-crisp"]) .key-info:has(> .info-item:nth-child(4):last-child) > .info-item {
    min-width: 0;
    overflow-wrap: anywhere;
  }
}
@media (min-width: 1024px) {
  body:is([data-theme^="toplist-comparison--"], [data-theme^="dark-immersive--"], [data-theme^="gamified-emoji--"], [data-theme^="trust-authority--"], [data-theme^="table-forward--"], [data-theme^="filterable-grid--"], [data-theme^="media-magazine--"]):not([data-theme="table-forward--navy-crisp"]) .key-info:has(> .info-item:nth-child(4):last-child) {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* Toplist fact cells use the theme surface, which may be a dark palette. */
body[data-theme^="toplist-comparison--"] .key-info :is(.label, .value) {
  color: var(--key-info-foreground, var(--text));
}

/* Resolve footer text against the actual footer backdrop, not page paragraphs. */
body:not([data-theme="table-forward--navy-crisp"]) footer.site-footer :is(h4, a, .footer-disclaimer) { color: var(--footer-foreground, var(--text)); }
body:not([data-theme="table-forward--navy-crisp"]) footer.site-footer a:is(:hover, :focus-visible) { color: var(--footer-foreground, var(--text)); text-decoration: underline; }
/* Dark toplist variants retain their surfaces but need light inherited text. */
body[data-theme^="toplist-comparison--"] {
  --text: #f4f5f7;
  --text-secondary: #c5cad3;
  --text-muted: #b4bbc7;
}
/* Provider reference articles use a light reading surface across dark themes. */
body.provider-reference:not([data-theme="table-forward--navy-crisp"]) main.pv-editorial details.faq-item > summary {
  background: #f7f5ef;
  color: #142c40;
}
body.provider-reference:not([data-theme="table-forward--navy-crisp"]) main.pv-editorial details.faq-item > summary::after {
  color: #142c40;
}
/* Text links on trust-authority reading panels have their own foreground;
   filled CTA buttons keep their independently calculated contrast treatment. */
body[data-theme^="trust-authority--"]:not(.provider-reference) main:not(.promotion-main) a:not(.btn-primary):not(.btn):not(.btn-cta):not(.mobile-cta) {
  color: var(--content-link-foreground, var(--text));
}
body[data-theme^="trust-authority--"]:not(.provider-reference) main:not(.promotion-main) a:not(.btn-primary):not(.btn):not(.btn-cta):not(.mobile-cta):is(:hover, :focus-visible) {
  color: var(--content-link-foreground, var(--text));
  text-decoration: underline;
}

/* Reviewed homepage components: readable content at narrow widths. */
body.review-home[data-theme^="dark-immersive--"] main > .hero {
  display: flex; flex-direction: column; align-items: center; gap: 16px;
}
body.review-home[data-theme^="dark-immersive--"] main > .hero > * {
  position: relative; z-index: 1; max-width: 100%; flex-shrink: 0;
}
body.review-home[data-theme^="dark-immersive--"] main > .hero h1 { width: 100%; }
body.review-home .payid-flow-steps { margin: 0; padding-left: 1.5em; text-align: left; font-size: 1rem; line-height: 1.65; }
body.review-home .payid-flow-steps li + li { margin-top: .75em; }
@media (max-width: 600px) {
  body.review-home .pokies-grid { grid-template-columns: minmax(0, 1fr) !important; }
  body.review-home .pokie-card { min-width: 0; }
}

/* Journey pages have a fixed light background, independent of theme tokens. */
body.journey-page:not([data-theme="table-forward--navy-crisp"]) main.journey-main .breadcrumbs,
body.journey-page:not([data-theme="table-forward--navy-crisp"]) main.journey-main .breadcrumbs .sep {
  color: #243b4d;
}

/* Review repairs 50–52: reading links and light component contrast. */
body[data-theme="minimalist-modern--ocean-teal"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary),
body[data-theme="minimalist-modern--ocean-teal"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary):is(:hover, :focus-visible) { color: #08756c; }
body[data-theme="minimalist-modern--amber-gold"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary),
body[data-theme="minimalist-modern--amber-gold"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary):is(:hover, :focus-visible) { color: #975205; }
body[data-theme="minimalist-modern--sunset-coral"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary),
body[data-theme="minimalist-modern--sunset-coral"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary):is(:hover, :focus-visible) { color: #be2340; }
body[data-theme="filterable-grid--emerald-grid"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary),
body[data-theme="filterable-grid--emerald-grid"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary):is(:hover, :focus-visible) { color: #047857; }
body[data-theme="filterable-grid--amber-warm"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary),
body[data-theme="filterable-grid--amber-warm"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary):is(:hover, :focus-visible) { color: #975205; }
body[data-theme="filterable-grid--blue-slate"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary),
body[data-theme="filterable-grid--blue-slate"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary):is(:hover, :focus-visible) { color: #165fc1; }
body[data-theme="table-forward--cool-mint"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary),
body[data-theme="table-forward--cool-mint"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary):is(:hover, :focus-visible) { color: #08756c; }
body[data-theme="toplist-comparison--ocean-blue"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary),
body[data-theme="toplist-comparison--ocean-blue"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary):is(:hover, :focus-visible) { color: #60a5fa; }
body[data-theme="toplist-comparison--violet-void"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary),
body[data-theme="toplist-comparison--violet-void"]:not(.provider-reference):not(.journey-page) main:not(.promotion-main) a:is(:not([class]), [class=""], .journey-secondary):is(:hover, :focus-visible) { color: #b69aff; }
body main#main-content.promotion-main a:not(.btn):not(.btn-primary):not(.btn-cta) { color: #16505f; }
body:not(.journey-page):not(.provider-reference) main .data-table th { color: var(--cta-foreground); }
body:is([data-theme="filterable-grid--emerald-grid"], [data-theme="filterable-grid--amber-warm"]) main:not(.promotion-main):not(.journey-main) table:not(.data-table) th { color: #000; }
body.journey-page main.journey-main tbody tr:nth-child(even) { background: #edf2f5; }
body:is([data-theme^="table-forward--"], [data-theme^="filterable-grid--"], [data-theme^="blog-review--"]):not([data-theme="table-forward--navy-crisp"]) main .pros h3,
body:is([data-theme^="table-forward--"], [data-theme^="filterable-grid--"]):not([data-theme="table-forward--navy-crisp"]) main .pokie-rtp { color: #047857; }

:root { --cta-foreground: #000; --key-info-foreground: #000; --footer-foreground: #000; }
