/* Southern Classic Sports — styles for the generated pages (/rules, /schedules).
   Loads AFTER styles.css and only defines new components. It adds no rules that
   touch existing selectors, so it cannot alter the pages your partner built.
   All colors come from the tokens already declared in styles.css. */

/* ===== Page hero (lighter than the home hero) ===== */
.page-hero{
  padding:74px 0 46px;
  background:linear-gradient(180deg, var(--field-dusk-2) 0%, var(--field-dusk) 100%);
  border-bottom:1px solid var(--line);
}
.page-hero.compact{padding:52px 0 34px;}
.page-hero h1{
  font-family:'Big Shoulders Display',sans-serif;
  font-size:clamp(2.4rem,6vw,4rem);
  font-weight:800; text-transform:uppercase; margin:6px 0 14px;
}
.page-hero .lead{
  color:var(--chalk-dim); max-width:60ch; font-size:1.02rem; margin:0 0 22px;
}
.page-hero .hero-cta{display:flex; gap:12px; flex-wrap:wrap;}
.backlink{
  display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:.72rem;
  letter-spacing:.1em; text-transform:uppercase; color:var(--chalk-dim);
  text-decoration:none; margin-bottom:14px;
}
.backlink:hover,.backlink:focus-visible{color:var(--gold-bright);}

/* ===== Document layout (rules) ===== */
.doc-section{padding:52px 0 84px;}
.doc-layout{display:grid; grid-template-columns:236px minmax(0,1fr); gap:48px; align-items:start;}
@media (max-width:900px){ .doc-layout{grid-template-columns:1fr; gap:26px;} }

.doc-nav-inner{position:sticky; top:88px; max-height:calc(100vh - 120px); overflow-y:auto;
  border-left:1px solid var(--line); padding-left:16px;}
@media (max-width:900px){
  .doc-nav-inner{position:static; max-height:260px; border-left:none;
    border-top:1px solid var(--line); padding:14px 0 0;}
}
.doc-nav-title{
  font-family:'IBM Plex Mono',monospace; font-size:.66rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--prairie-gold); margin-bottom:12px;
}
.doc-nav a{
  display:block; color:var(--chalk-dim); text-decoration:none; font-size:.82rem;
  padding:4px 0; line-height:1.35; border-left:2px solid transparent; margin-left:-18px;
  padding-left:16px; transition:color .15s ease, border-color .15s ease;
}
.doc-nav a:hover,.doc-nav a:focus-visible{color:var(--gold-bright); border-left-color:var(--prairie-gold);}
.doc-nav a.lvl3{padding-left:28px; font-size:.76rem; opacity:.82;}

/* ===== Document body ===== */
.doc{min-width:0; max-width:78ch;}
.doc h1{font-family:'Big Shoulders Display',sans-serif; font-size:2rem;
  text-transform:uppercase; margin:0 0 18px;}
.doc h2{
  font-family:'Big Shoulders Display',sans-serif; font-size:1.55rem; text-transform:uppercase;
  margin:52px 0 14px; padding-bottom:8px; border-bottom:1px solid var(--line);
  scroll-margin-top:92px;
}
.doc h3{font-size:1.02rem; font-weight:700; margin:30px 0 8px; color:var(--gold-bright);
  scroll-margin-top:92px;}
.doc h4{font-size:.92rem; font-weight:700; margin:22px 0 6px; color:var(--chalk);}
.doc p{margin:0 0 14px; color:var(--chalk-dim);}
.doc strong{color:var(--chalk); font-weight:700;}
.doc a{color:var(--gold-bright);}
.doc ul,.doc ol{margin:0 0 16px; padding-left:22px; color:var(--chalk-dim);}
.doc li{margin-bottom:6px;}
.doc hr{border:none; border-top:1px solid var(--line); margin:38px 0;}
.doc code{
  font-family:'IBM Plex Mono',monospace; font-size:.85em; background:rgba(243,238,226,.07);
  padding:1px 5px; border-radius:3px; color:var(--gold-bright);
}
.doc blockquote.callout{
  margin:0 0 18px; padding:14px 18px; background:rgba(61,90,115,.20);
  border-left:3px solid var(--denim); border-radius:0 4px 4px 0;
}
.doc blockquote.callout p{margin:0 0 8px;}
.doc blockquote.callout p:last-child{margin:0;}

/* ===== Tables ===== */
.table-scroll{overflow-x:auto; margin:0 0 20px; -webkit-overflow-scrolling:touch;}
.doc table,table.games{
  border-collapse:collapse; width:100%; font-size:.86rem; min-width:440px;
}
.doc th,.doc td,table.games th,table.games td{
  text-align:left; padding:9px 12px; border-bottom:1px solid var(--line);
}
.doc th,table.games th{
  font-family:'IBM Plex Mono',monospace; font-size:.66rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--prairie-gold); font-weight:600;
  white-space:nowrap;
}
.doc td{color:var(--chalk-dim); vertical-align:top;}
.doc tbody tr:hover,table.games tbody tr:hover{background:rgba(243,238,226,.035);}

/* ===== Schedules ===== */
.div-tabs{display:flex; gap:8px; flex-wrap:wrap; margin:0 0 30px;}
.div-tab{
  font-family:'IBM Plex Mono',monospace; font-size:.74rem; letter-spacing:.08em;
  text-transform:uppercase; padding:8px 15px; border-radius:3px; cursor:pointer;
  background:transparent; color:var(--chalk-dim);
  border:1px solid var(--line); transition:all .15s ease;
}
.div-tab:hover{color:var(--gold-bright); border-color:var(--prairie-gold);}
.div-tab.on{background:var(--prairie-gold); color:var(--field-dusk); border-color:var(--prairie-gold); font-weight:600;}

h3.blk{
  font-family:'IBM Plex Mono',monospace; font-size:.72rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--prairie-gold); margin:34px 0 12px;
}
.pool-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr));
  gap:14px; margin-bottom:8px;}
.pool-card{border:1px solid var(--line); border-radius:5px; padding:14px 16px;
  background:var(--field-dusk-2);}
.pool-name{
  font-family:'IBM Plex Mono',monospace; font-size:.68rem; letter-spacing:.12em;
  text-transform:uppercase; color:var(--gold-bright); margin-bottom:8px;
}
.pool-card ol{margin:0; padding-left:18px; font-size:.85rem; color:var(--chalk-dim);}
.pool-card li{margin-bottom:3px;}

table.games td.t{
  font-variant-numeric:tabular-nums; white-space:nowrap;
  color:var(--gold-bright); font-weight:600;
}
table.games td.gid{
  font-family:'IBM Plex Mono',monospace; font-size:.7rem; color:var(--chalk-dim); opacity:.6;
}
table.games .vs{color:var(--chalk-dim); opacity:.5; font-size:.8em; padding:0 3px;}
.tag{
  display:inline-block; padding:2px 8px; border-radius:3px;
  font-family:'IBM Plex Mono',monospace; font-size:.64rem; font-weight:600;
  letter-spacing:.06em; text-transform:uppercase; white-space:nowrap;
}
.tag.pool{background:rgba(61,90,115,.55); color:#cfe0ee;}
.tag.bracket{background:rgba(154,75,43,.6); color:#f6d8c9;}
.tag.crossover{background:rgba(201,162,39,.34); color:#f0e0ae;}

.state{font-family:'IBM Plex Mono',monospace; font-size:.66rem; letter-spacing:.08em;
  text-transform:uppercase;}
.state.on{color:var(--gold-bright);}
.state.off{color:var(--chalk-dim); opacity:.6;}
.pending{
  font-family:'IBM Plex Mono',monospace; font-size:.68rem; letter-spacing:.06em;
  text-transform:uppercase; color:var(--chalk-dim); opacity:.65; align-self:center;
}

@media print{
  body{background:#fff; color:#000;}
  header.site,footer,.doc-nav,.hero-cta,.div-tabs,.backlink{display:none !important;}
  .doc h2,.doc h3,h3.blk,.doc th,table.games th{color:#000;}
  .doc p,.doc td,.doc li{color:#222;}
  .page-hero{background:none; padding:0 0 18px;}
  .div-panel[hidden]{display:block !important;}
}
