/* =========================================================
   CTG THEME — Cumming Tennis Group
   A focused override layer. Loaded LAST so it wins against
   bootstrap.css / style.css / mainStyles.css without editing
   or removing any of the original template files.
   Nothing here renames classes used by PHP/JS — only restyles
   what's already on the page.
   ========================================================= */

:root{
  /* Pulled directly from the CTG Season 16 match-day graphic:
     deep navy background, tennis-ball lime accent, sky-blue "VS"
     highlight, and the gold of the CTG OPEN badge for CTAs */
  --ctg-navy-deep:    #011D42;
  --ctg-navy-mid:     #0E2C57;
  --ctg-sky:          #9FD9FF;
  --ctg-lime:         #D4F017;
  --ctg-lime-deep:    #A8C400;
  --ctg-gold:         #E8B309;
  --ctg-gold-deep:    #B98700;
  --ctg-bg:           #F5F8FC;
  --ctg-card:         #FFFFFF;
  --ctg-ink:          #14212E;
  --ctg-ink-soft:     #51606E;
  --ctg-line:         #DCE6F2;
}

/* ---------- Base ---------- */
body{
  font-family: 'Nunito Sans', Arial, sans-serif;
  background: var(--ctg-bg);
  color: var(--ctg-ink);
}

h1, h2, h3, h4, h5, h6{
  font-family: 'Roboto Condensed', Arial, sans-serif;
  color: var(--ctg-navy-deep);
  letter-spacing: 0.3px;
}

a{ color: var(--ctg-navy-mid); }
a:hover, a:focus{ color: var(--ctg-gold); }

/* ---------- Top utility bar ---------- */
.header{
  background: var(--ctg-navy-deep);
  border-bottom: 3px solid var(--ctg-lime);
}
.header .w3layouts_header_left ul li,
.header .w3layouts_header_right ul li{
  font-family: 'Nunito Sans', Arial, sans-serif;
}
.header .w3layouts_header_left a,
.header .w3layouts_header_right a{
  color: #EFF4EC;
  transition: color .2s ease;
}
.header .w3layouts_header_left a:hover,
.header .w3layouts_header_right a:hover{
  color: var(--ctg-lime);
}
.header .w3layouts_header_right li{
  color: #EFF4EC;
}

/* ---------- Main navigation ---------- */
.banner{
  background: var(--ctg-navy-mid);
  background: linear-gradient(180deg, var(--ctg-navy-mid) 0%, var(--ctg-navy-deep) 100%);
}
.navbar-default{
  background: transparent;
  border: none;
  margin-bottom: 0;
}
.navbar-brand img{
  border-radius: 6px;
  box-shadow: 0 1px 4px rgba(0,0,0,.35);
}
.link-effect-2 .nav.navbar-nav > li > a{
  font-family: 'Roboto Condensed', Arial, sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 14px;
  color: #F3F6F1 !important;
  padding: 22px 16px;
  transition: color .2s ease, background .2s ease;
}
.link-effect-2 .nav.navbar-nav > li > a span:before{
  display:none; /* disable the old hover-text duplication trick if theme relies on it */
}
.link-effect-2 .nav.navbar-nav > li > a:hover,
.link-effect-2 .nav.navbar-nav > li.active > a{
  color: var(--ctg-lime) !important;
  background: rgba(255,255,255,0.06);
}
.dropdown-menu.agile_short_dropdown{
  background: var(--ctg-navy-deep);
  border: none;
  border-top: 3px solid var(--ctg-lime);
  border-radius: 0 0 4px 4px;
  box-shadow: 0 8px 20px rgba(0,0,0,.25);
  padding: 6px 0;
}
.dropdown-menu.agile_short_dropdown li a{
  font-family: 'Nunito Sans', Arial, sans-serif;
  font-size: 14px;
  color: #E9EFE6;
  padding: 8px 18px;
}
.dropdown-menu.agile_short_dropdown li a:hover{
  background: var(--ctg-navy-mid);
  color: var(--ctg-lime);
}

/* Register CTA — replaces the old blinking-red pulse with a
   calm, confident pill button so it reads as "professional"
   rather than "urgent banner ad". Still stands out by shape
   and color alone. */
.nav-register-highlight{
  display: inline-flex !important;
  align-items: center;
  margin: 12px 6px;
  padding: 8px 18px !important;
  background: var(--ctg-gold);
  border-radius: 999px;
  color: #fff !important;
  box-shadow: 0 2px 6px rgba(0,0,0,.25);
}
.nav-register-highlight span{
  color: #fff !important;
  font-weight: 700 !important;
  animation: none !important; /* kill the pulse keyframe */
  font-size: 13px;
  letter-spacing: 0.5px;
}
.nav-register-highlight:hover,
.nav-register-highlight:hover span{
  background: var(--ctg-gold-deep);
  color: #fff !important;
}

/* ---------- Hero / slider headline strip ---------- */
#exampleSlider .sliderBox{
  background-color: var(--ctg-navy-deep);
}
#exampleSlider .sliderBox h3{
  font-family: 'Roboto Condensed', Arial, sans-serif;
  text-shadow: 0 2px 8px rgba(0,0,0,.4);
}
#exampleSlider .sliderBox h3 span{
  color: var(--ctg-lime);
}

/* ---------- Season announcement banner ---------- */
.banner-bottom{
  background: var(--ctg-card);
  border-bottom: 1px solid var(--ctg-line);
  padding: 30px 0;
}
.banner-bottom .w3ls_banner_bottom_right1 h2{
  font-size: 26px;
  margin-bottom: 14px;
  position: relative;
  padding-left: 16px;
  border-left: 5px solid var(--ctg-gold);
}
.banner-bottom .some_agile_facts li{
  list-style: none;
  margin: 0 0 8px 0;
  font-family: 'Nunito Sans', Arial, sans-serif;
  color: var(--ctg-ink-soft);
}
.banner-bottom .some_agile_facts li i{
  color: var(--ctg-gold);
  margin-right: 8px;
}
.banner-bottom .some_agile_facts li a{
  font-weight: 700;
  color: var(--ctg-navy-mid);
}
.banner-bottom .some_agile_facts li a:hover{ color: var(--ctg-gold); }

.agileits_w3layouts_banner_bottom_grid img{
  border-radius: 8px;
  box-shadow: 0 6px 18px rgba(1,29,66,.20);
}

/* ---------- Stats / scoreboard band ----------
   Signature element: a stadium-scoreboard strip — dark court
   green, condensed display numerals in tennis-ball yellow,
   a thin gradient rule on top like the line of a scoreboard. */
.container > .w3l_header.w3_agileits_header{
  font-family: 'Roboto Condensed', Arial, sans-serif;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--ctg-ink-soft);
  font-size: 18px;
  margin: 10px 0 18px;
}
.container > .w3l_header.w3_agileits_header span{
  color: var(--ctg-navy-deep);
  font-weight: 700;
}

.stats{
  background: var(--ctg-navy-deep);
  border-radius: 10px;
  padding: 30px 10px 10px;
  position: relative;
  overflow: hidden;
}
.stats:before{
  content:"";
  position:absolute;
  top:0; left:0; right:0;
  height:4px;
  background: linear-gradient(90deg, var(--ctg-lime) 0%, var(--ctg-sky) 100%);
}
.stats .w3layouts_stats_left,
.stats .w3_counter_grid,
.stats .w3_counter_grid1,
.stats .w3_counter_grid2,
.stats .w3_counter_grid3{
  text-align: center;
  padding: 10px 10px 24px;
}
.stats .counter{
  font-family: 'Roboto Condensed', Arial, sans-serif;
  font-size: 44px;
  font-weight: 700;
  color: var(--ctg-lime);
  margin: 0;
  line-height: 1.1;
}
.stats .w3layouts_stats_left > i{
  display: block;
  font-size: 20px;
  color: var(--ctg-sky);
  margin-bottom: 6px;
}
.stats h3{
  font-family: 'Nunito Sans', Arial, sans-serif;
  color: #DCE9F2;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  font-weight: 600;
  margin-top: 4px;
}

/* Season-leader callout just under the scoreboard */
.container > div[style*="text-align:center"]{
  background: var(--ctg-card);
  border: 1px solid var(--ctg-line);
  border-radius: 8px;
  margin-top: 14px !important;
  padding: 12px 16px !important;
  font-family: 'Nunito Sans', Arial, sans-serif;
  color: var(--ctg-ink);
}
.container > div[style*="text-align:center"] strong{
  color: var(--ctg-gold);
}

/* ---------- Generic buttons / links used across the site ---------- */
.button, .btn-primary, input[type=submit].submit, .form_settings .submit{
  background: var(--ctg-gold) !important;
  border-color: var(--ctg-gold-deep) !important;
  box-shadow: none !important;
  text-shadow: none;
}
.button:hover, .btn-primary:hover{
  background: var(--ctg-gold-deep) !important;
}

/* Login modal polish (#myModal2 markup unchanged) */
.modal-content{
  border-radius: 10px;
  border: none;
}
.modal-header{
  border-bottom: 1px solid var(--ctg-line);
}

/* ---------- Responsive ---------- */
@media (max-width: 991px){
  .stats .counter{ font-size: 32px; }
  .link-effect-2 .nav.navbar-nav > li > a{ padding: 14px 14px; }
}
@media (max-width: 480px){
  .banner-bottom .w3ls_banner_bottom_right1 h2{ font-size: 21px; }
  .stats .counter{ font-size: 26px; }
}