/*
 * TSO Clubhouse Framework v3.0.0
 * Authoritative layout layer. Loaded last on every Clubhouse screen.
 */
:root{
  --tso-ch-page:#050033;
  --tso-ch-page-top:#0b2450;
  --tso-ch-navy:#071d33;
  --tso-ch-blue:#002366;
  --tso-ch-blue-bright:#003087;
  --tso-ch-gold:#ffd700;
  --tso-ch-white:#f4f7fb;
  --tso-ch-muted:#c9d5e5;
  --tso-ch-width:1280px;
  --tso-ch-radius:22px;
  --tso-ch-border:1px solid rgba(255,215,0,.42);
  --tso-ch-shadow:0 18px 46px rgba(0,0,0,.30);
}

/* Theme-independent page canvas: never allow white page rails. */
body.tso-clubhouse-active,
body.tso-clubhouse-active #page,
body.tso-clubhouse-active #content,
body.tso-clubhouse-active #primary,
body.tso-clubhouse-active #main,
body.tso-clubhouse-active .site,
body.tso-clubhouse-active .site-content,
body.tso-clubhouse-active .content-area,
body.tso-clubhouse-active .main-content,
body.tso-clubhouse-active .site-main,
body.tso-clubhouse-active article,
body.tso-clubhouse-active .entry-content,
body.tso-clubhouse-active .page-content,
body.tso-clubhouse-active .post-content,
body.tso-clubhouse-active .wp-block-post-content,
body.tso-clubhouse-active .wp-site-blocks,
body.tso-clubhouse-active main{
  background:var(--tso-ch-page)!important;
  border:0!important;
  box-shadow:none!important;
}
body.tso-clubhouse-active .entry-header,
body.tso-clubhouse-active .page-header,
body.tso-clubhouse-active .entry-title,
body.tso-clubhouse-active .wp-block-post-title{display:none!important}
body.tso-clubhouse-active #primary,
body.tso-clubhouse-active #main,
body.tso-clubhouse-active .content-area,
body.tso-clubhouse-active .site-main,
body.tso-clubhouse-active article.page,
body.tso-clubhouse-active article.type-page,
body.tso-clubhouse-active .entry-content,
body.tso-clubhouse-active .page-content,
body.tso-clubhouse-active .post-content,
body.tso-clubhouse-active .wp-block-post-content{
  width:100%!important;max-width:none!important;margin:0!important;padding:0!important;
}

/* One canvas and one width for every Clubhouse module. */
body.tso-clubhouse-active .tso-clubhouse-page,
body.tso-clubhouse-active .tso-conversations-app{
  box-sizing:border-box!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:34px 0 72px!important;
  background:radial-gradient(circle at top,var(--tso-ch-page-top) 0%,var(--tso-ch-page) 55%,#020018 100%)!important;
  color:var(--tso-ch-white)!important;
}
body.tso-clubhouse-active .tso-clubhouse-wrap,
body.tso-clubhouse-active .tso-conversations-app{
  width:min(var(--tso-ch-width),calc(100% - 44px))!important;
  max-width:var(--tso-ch-width)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:0!important;
  padding-right:0!important;
}
/* Conversations is itself the width wrapper, so keep its background transparent. */
body.tso-clubhouse-active .tso-conversations-app{background:transparent!important}

/* One standard interior hero. Main Entrance keeps its larger promotional hero. */
body.tso-clubhouse-active .tso-clubhouse-mini-hero,
body.tso-clubhouse-active .tso-conversations-hero,
body.tso-clubhouse-active .tso-matchday-page-hero{
  box-sizing:border-box!important;
  width:100%!important;
  min-height:230px!important;
  margin:0 0 18px!important;
  padding:36px 40px!important;
  border:var(--tso-ch-border)!important;
  border-radius:var(--tso-ch-radius)!important;
  background:radial-gradient(circle at 84% 20%,rgba(255,215,0,.18),transparent 29%),linear-gradient(135deg,var(--tso-ch-navy),var(--tso-ch-blue) 62%,#050033)!important;
  box-shadow:var(--tso-ch-shadow)!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:flex-start!important;
  text-align:left!important;
  overflow:hidden!important;
}
body.tso-clubhouse-active .tso-clubhouse-mini-hero > *,
body.tso-clubhouse-active .tso-conversations-hero > *,
body.tso-clubhouse-active .tso-matchday-page-hero > *{text-align:left!important}
body.tso-clubhouse-active .tso-clubhouse-mini-hero h1,
body.tso-clubhouse-active .tso-conversations-hero h1,
body.tso-clubhouse-active .tso-matchday-page-hero h1{
  margin:7px 0 12px!important;
  font-size:clamp(2.45rem,4.4vw,4.2rem)!important;
  line-height:1!important;
  color:var(--tso-ch-gold)!important;
  text-align:left!important;
}
body.tso-clubhouse-active .tso-clubhouse-mini-hero p,
body.tso-clubhouse-active .tso-conversations-hero p,
body.tso-clubhouse-active .tso-matchday-page-hero p{
  max-width:800px!important;margin:0!important;color:var(--tso-ch-white)!important;line-height:1.58!important;text-align:left!important;
}
body.tso-clubhouse-active .tso-conversations-hero > div:first-child,
body.tso-clubhouse-active .tso-matchday-page-copy{max-width:820px!important;margin:0!important}
body.tso-clubhouse-active .tso-conversation-hero-mascot,
body.tso-clubhouse-active .tso-matchday-page-icon{display:none!important}
body.tso-clubhouse-active .tso-conversation-hero-actions{
  position:static!important;display:flex!important;flex-wrap:wrap!important;gap:10px!important;margin-top:20px!important;text-align:left!important;
}
body.tso-clubhouse-active .tso-matchday-page-fixture{
  display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:12px!important;flex-wrap:wrap!important;
  margin-top:18px!important;color:#fff!important;text-align:left!important;font-weight:900!important;
}
body.tso-clubhouse-active .tso-matchday-page-status{margin-top:14px!important}

/* Main entrance: same width, colours and alignment; deliberately taller only on the landing page. */
body.tso-clubhouse-active .tso-clubhouse-home .tso-clubhouse-hero{
  width:100%!important;min-height:430px!important;margin:0 0 18px!important;padding:52px 42px!important;border-radius:var(--tso-ch-radius)!important;
}

/* One navigation treatment and spacing. */
body.tso-clubhouse-active .tso-clubhouse-nav{
  box-sizing:border-box!important;width:100%!important;margin:0 0 22px!important;padding:10px!important;
  border:var(--tso-ch-border)!important;border-radius:16px!important;background:rgba(7,29,51,.96)!important;
}

/* Shared panels/cards: dark only, never white. */
body.tso-clubhouse-active :is(
 .tso-dashboard-card,.tso-feature-card,.tso-game-card,.tso-arcade-card,.tso-leaderboard-panel,
 .tso-clubhouse-policy,.tso-clubhouse-form,.tso-form-aside,.tso-founder-panel,.tso-clubhouse-cta,
 .tso-conversation-card,.tso-conversation-toolbar,.tso-conversation-empty,.tso-conversation-gate,
 .tso-conversation-single,.tso-conversation-reply,.tso-conversation-start,.tso-matchday-hub
){
  color:var(--tso-ch-white)!important;
  border-color:rgba(255,215,0,.34)!important;
  background:radial-gradient(circle at 92% 0,rgba(255,215,0,.08),transparent 27%),linear-gradient(135deg,rgba(7,29,51,.99),rgba(0,48,135,.70))!important;
  box-shadow:var(--tso-ch-shadow)!important;
}
body.tso-clubhouse-active :is(.tso-conversation-card,.tso-dashboard-card,.tso-feature-card,.tso-game-card,.tso-arcade-card,.tso-leaderboard-panel){border-radius:var(--tso-ch-radius)!important}

/* Gold controls always carry navy text; red live pills remain white. */
body.tso-clubhouse-active :is(.tso-clubhouse-btn,.tso-matchday-status,.tso-matchday-page-status,.tso-conversation-category,.tso-matchday-form button,.tso-matchday-signin a){color:var(--tso-ch-navy)!important}
body.tso-clubhouse-active :is(.tso-matchday-live .tso-matchday-status,.tso-page-status-live){color:#fff!important}

/* Forms may use light fields for readability, but the containing panel remains navy. */
body.tso-clubhouse-active :is(input,textarea,select){box-sizing:border-box;max-width:100%}

@media(max-width:768px){
  body.tso-clubhouse-active .tso-clubhouse-page,
  body.tso-clubhouse-active .tso-conversations-app{padding:20px 0 58px!important}
  body.tso-clubhouse-active .tso-clubhouse-wrap,
  body.tso-clubhouse-active .tso-conversations-app{width:calc(100% - 20px)!important}
  body.tso-clubhouse-active .tso-clubhouse-mini-hero,
  body.tso-clubhouse-active .tso-conversations-hero,
  body.tso-clubhouse-active .tso-matchday-page-hero{min-height:0!important;padding:28px 22px!important;border-radius:18px!important}
  body.tso-clubhouse-active .tso-clubhouse-mini-hero h1,
  body.tso-clubhouse-active .tso-conversations-hero h1,
  body.tso-clubhouse-active .tso-matchday-page-hero h1{font-size:clamp(2.25rem,11vw,3.45rem)!important}
  body.tso-clubhouse-active .tso-clubhouse-home .tso-clubhouse-hero{min-height:0!important;padding:34px 22px 300px!important;border-radius:18px!important}
  body.tso-clubhouse-active .tso-matchday-page-fixture{display:grid!important;grid-template-columns:1fr!important;gap:4px!important}
}
