:root { 
  --primary: #f00;
  --accent: #f57c00;
  --border: #ddd;
  --light: #f9f9f9;
  --text: #222;
}

/* RESET */
*,
*::before,
*::after {
  box-sizing: border-box;
}

* {
  margin: 0;
  padding: 0;
}

body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

/* Media defaults */
img, picture, video, canvas {
  display: block;
  max-width: 100%;
}

/* Form elements */
input, button, textarea, select {
  font: inherit;
}

/* Remove list styles (optional) */
ul, ol {
  list-style: none;
}

/* Better table defaults */
table {
  border-collapse: collapse;
  width: 100%;
}

/* Default Styles 
--------------------------------------------------------------------*/
.center		{text-align:center;}
.right		{text-align:right;}
.left		{text-align:left;}
.floatright	{float:right;}
.floatleft	{float:left;}
.nobr		{white-space:nowrap;}

/* BASE */
body {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  color: var(--text);
  line-height: 1.5;
  /*font-size:clamp(0.95rem, 0.3vw + 0.9rem, 1.05rem) */
}
h1 {
  font-size: clamp(2rem, 1.5vw + 1.5rem, 3rem);
}

h2 {
  font-size: clamp(1.5rem, 1vw + 1.2rem, 2.2rem);
}

h3 {
  font-size: clamp(1.2rem, 0.6vw + 1rem, 1.6rem);
}
header, footer {
		grid-column: 1 / -1;
}
/* NAV */
.site-header {
  background: linear-gradient(#ff0000, #991a00);
}

.nav-container {
  max-width: 1200px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px;
}

.logo {
  color: white;
  font-weight: bold;
}
.logo img {
  width: 160px;
  height: auto;
  flex-shrink: 0;
}

.menu {
  display: flex;
  flex-wrap: nowrap;
  list-style: none;
  font-family: 'Arial', sans-serif;
  font-size:1.0em;
  font-weight:bold;	
	
}

.menu li a {
  color: white;
  padding: 10px 15px;
  text-decoration: none;
  white-space: nowrap;
}

.menu li a:hover {
  background: #ffcc66;
  color: #ff0000;
  border-radius: 5px;
}

/* DROPDOWN BASE */
.menu li {
  position: relative;
}

.dropdown {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background: white;
  min-width: 220px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
  z-index: 1000;
  flex-direction: column;
}

.dropdown li a {
  color: #ff0000;
  padding: 10px;
  display: block;
}

.dropdown li a:hover {
  background: #ffcc66;
}

/* DESKTOP HOVER */
@media (min-width: 769px) {
  .menu li:hover .dropdown {
    display: block;
  }
}
/* MOBILE MENU */
.menu-toggle {
  display: none;
  font-size: 28px;
  color: white;
  border: none;
  width: 72px;
  height: 72px;
  padding-left:20px;
  padding-bottom:20px;
  background-color: #1f2937; 
  border-radius: 10px;
  /* display: flex; */
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 6px;
  cursor: pointer;

  /* subtle shadow for visibility */
  box-shadow: 0 2px 6px rgba(0,0,0,0.25);		
}
/* Hamburger lines */
.menu-toggle span {
  display: block;
  width: 26px;
  height: 3px;
  background-color: #ffffff;
  border-radius: 2px;
}

/* Tap feedback */
.menu-toggle:active {
  transform: scale(0.96);
}

/* Optional: hover for desktop */
.menu-toggle:hover {
  background-color: #374151;
}

@media (max-width: 980px) {
  .menu {
    display: none;
    flex-direction: column;
    width: 100%;
  }

  .menu.active {
    display: flex;
  }

  .menu-toggle {
    display: block;
  }
  .dropdown {
    position: static;     /* CRITICAL FIX */
    display: none;
    box-shadow: none;
    background: #fff;
  }

  .has-dropdown > a {
    display: block;
    width: 100%;
  }	
}

/* MAIN GRID */
.container {
  max-width: 1200px;
  margin: auto;
  padding: 20px;
  display: grid;
  gap: 20px;
}

/* HERO */
.hero {
  text-align: center;
}

/* GRID */
.grid-two {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

@media (max-width: 768px) {
  .grid-two {
    grid-template-columns: 1fr;
  }
}

/* CARD */
.card {
  background: white;
  padding: 15px;
  border-left: 5px solid #ff0000;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

/* TABLE */
.responsive-table {
  overflow-x: auto;
}

table {
  width: 100%;
  border-collapse: collapse;
}

th, td {
  padding: 8px;
  border-bottom: 1px solid #ddd;
}

/* FOOTER 
footer {
  text-align: center;
  padding: 15px;
  background: #ff0000;
  color: white;
}
footer address {
    text-align: center;
    padding: 20px;
}

footer address img {
    display: block;
    margin: 10px auto 0;
    max-width: 100%;
    height: auto;
}
*/
footer {
  padding: 15px;
  background: #ff0000;
  color: white;
}
.site-footer {
    background: #f00;
    color: white;
    padding: 30px 20px;
}

.footer-inner {
    max-width: 1100px;
    margin: auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* LEFT SIDE */
.footer-left a {
    display: block;
    color: #f57c00;
    text-decoration: none;
    margin-bottom: 8px;
    font-weight: 500;
}

.footer-left a:hover {
    text-decoration: underline;
}

.footer-left .copyright {
    margin-top: 15px;
    font-size: 0.85rem;
    opacity: 0.8;
}

/* RIGHT SIDE */
.footer-right img {
    max-width: 600px;
	width: 90%;
    height: auto;
}

/* MOBILE STACK */
@media (max-width: 768px) {
    .footer-inner {
        flex-direction: column;
        text-align: center;
        gap: 20px;
    }

    .footer-left a {
        display: inline-block;
        margin: 0 10px;
    }
}

.main-layout {
  display: grid;
  grid-template-columns:1fr 300px;
  gap: 20px;
}

.ads {
  background: #f1f1f1;
  padding: 10px;
}

.ad-box {
  height: 250px;
  background: #ddd;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
}

/* Mobile */
@media (max-width: 900px) {
  .main-layout {
    grid-template-columns:1fr;
  }
}
/* Two equal columns */
.two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

/* Stack on phones */
@media (max-width: 900px) {
  .two-col {
    grid-template-columns: 1fr;
  }
}

/* Legacy Styles */
.standings	table	{ margin-left:20px; }
.standings	td		{ padding:4px 8px; }

/* Layout Tables */
table.container_table 		{margin:0 auto; }
table.container_table td	{vertical-align:top;}

table.main_table  { 
  margin: 0 auto;
  border-collapse: collapse;
  width: 100%;
}
.main_table th,
.main_table td {
  padding: 8px 10px;
}

table.main_table th { 
  vertical-align:bottom;   
  text-align: left;
  border-bottom: 2px solid var(--primary);}

table.main_table td { vertical-align:middle;}

/* Opponent Header */
.opp_top {
  margin: 10px auto;
  border-collapse: collapse;
  width: 100%;
}

.opp_top td {
  padding: 6px 10px;
}

.opp_top p {
  font-weight: 700;
  font-size: 1.4rem;
  margin: 10px 0;
}


table.search_table	
{	border: 1px solid var(--primary); 
	border-collapse:separate; 
	margin:5px 0px;}
table.search_table td	
{	border: 1px solid var(--primary);
  	padding: 6px;}

/* Season Table (your main one) */
.season_table {
  margin: 0 auto;
  border-collapse: collapse;
  font-family: inherit;
}

.season_table th {
  padding: 10px;
  text-align: left;
  background: var(--primary);
  color: #fff;
}

.season_table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
}

/* Zebra striping */
.season_table tbody tr:nth-child(even) {
  background: var(--light);
}

/* Images */
.season_table img, .main_table img, .red_bg_grad img {
  padding: 0;
  float:left;
}
/* Tooltip (Modernized Pop) */
.Pop {
  position: relative;
  display: inline-block;
  font-size: 0.75rem;
}

.Pop a {
  text-decoration: none;
  color: var(--accent);
  background: #eee;
  padding: 2px 6px;
  border-radius: 4px;
}

.Pop span {
  display: none;
  position: absolute;
  top: 0;
  left: 100%;
  margin-left: 10px;
  width: 300px;
  padding: 10px;
  font-size: 0.85rem;
  color: #333;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 6px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
  z-index: 10;
}

.Pop:hover span {
  display: block;
}

p.main_head	{font-weight:bold;font-size:1.5em;}
p.overall_record	{font-weight:bold; margin-left:2px; font-size:1.1em;}

.award_title {text-decoration:underline; margin-bottom:2px; font-family:"Times New Roman"; font-size:16pt; font-weight:bold;}
.champ_script	{font-family:Monotype Corsiva; color:#ff0000; font-size:1.5em; font-weight:bold;}
.ind_awards {margin-left:75px;}
.verdana		{font-family:Verdana; font-size:1.0em; }
.red_bg_grad	{background: -webkit-gradient(linear, center top, center bottom, from(#f66), to(#faa)); background-image: linear-gradient(#f66, #faa);}
.record {background-color:#f00; max-width:600px; margin:auto;}	
.record th, .record td {color:#fff;}

/* For Season pages */
.season-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 10px 20px;
}

/* Mobile behavior */
@media (max-width: 1000px) {
  .season-header {
    flex-direction: column;     /* stack */
    align-items: flex-start;    /* left align */
    gap: 5px;                   /* spacing between them */
  }
}