/* =========================================
   1. FONT DECLARATIONS
   ========================================= 
   Custom fonts for ASU Three Rivers branding.
   Ensure font files exist in correct paths.
   ========================================= */
/*
@font-face {
  font-family: 'Paladins';
  src: url('/assets/fonts/paladins.woff2') format('woff2'),
       url('/assets/fonts/paladins.woff') format('woff'),
       url('PALADINS.TTF') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}*/

@font-face {
  font-family: 'Avenir Book';
  src: url('Avenir-Book-01.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Avenir-Black-03';
  src: url('/Avenir-Black-03.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
    font-family: 'Paladins';
    src: url('https://static.presto-sport.com/fonts/PALADINS.TTF') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}




/* =========================================
   2. CSS VARIABLES & GLOBAL FONT SETTINGS
   ========================================= 
   Sets Avenir Book as body font, Avenir Black for headings
   ========================================= */

:root {
    --body-font-family: 'Avenir Book', sans-serif;
    --bs-font-sans-serif: 'Avenir Book', sans-serif;
    --bs-body-font-family: 'Avenir Book', sans-serif;
    --heading-font-family: 'Avenir-Black-03', sans-serif;
}

/* =========================================
   3. MAIN CONTENT AREA BACKGROUNDS
   ========================================= 
   Changes secondary backgrounds to primary (dark blue)
   across main content areas
   ========================================= */

.visually-hidden-focusable,
.visually-hidden  { color:#000 }
.page-heading.visually-hidden,
.section.sec-top-stories .visually-hidden,
.section.sec-countdown  .visually-hidden,
.section.sec-scoreboard .visually-hidden, 
.section.sec-banner .visually-hidden{ color:#fff }

main#site-main,
.container-fluid.px-3.py-5,
.pre-header .site-title.bg-secondary,
.component-scoreboard.layout-standard .slick-arrow-controls {
  background-color: var(--bs-primary) !important;
}


/* Mobile offcanvas menu background */
.navbar-offcanvas-template .offcanvas.bg-secondary {
  background-color: var(--bs-primary) !important;
}

/* =========================================
   4. MAIN HEADER NAVIGATION
   ========================================= 
   White background with primary blue text/icons
   Tertiary color on hover with no underlines
   ========================================= */

/* Header background set to white */
.macro-primary-navigation,
.macro-primary-navigation .container-fluid {
  background-color: #ffffff !important;
}

/* All header text, links, and icons set to primary blue */
.macro-primary-navigation .btn,
.macro-primary-navigation .nav-link,
.macro-primary-navigation .fa-brands,
.macro-primary-navigation .fa-regular,
.macro-primary-navigation span {
  color: var(--bs-primary) !important;
  opacity: 1 !important;
}

/* Navigation and menu items use heading font */
.nav, .menu {
  font-family: var(--heading-font-family) !important; 
}

/* HEADER ACCENT LINES - Middle bar is secondary (light blue) */
.site-header .branding span {
    background-color: var(--bs-secondary) !important;
}

/* HEADER ACCENT LINES - Outer bars are primary (dark blue) */
.site-header .branding span:before, 
.site-header .branding span:after {
    background-color: var(--bs-primary) !important;
}

/* Header links hover to tertiary color with no underline */
.menu .btn:hover,
.links .nav-link:hover,
.social-icons .nav-link:hover,
.social-icons .nav-link:hover span {
  color: var(--bs-tertiary) !important;
  text-decoration: none !important;
}

/* Search button hover - tertiary color, no underline */
.component-search .btn:hover,
.component-search .btn:hover span,
.component-search .btn:hover .fa-regular {
  color: var(--bs-tertiary) !important;
  text-decoration: none !important;
}

/* Sports dropdown menu - no underline on hover */
.macro-primary-navigation .dropdown-menu .dropdown-item:hover {
  text-decoration: none !important;
}

/* =========================================
   5. MOBILE MENU (SIDEBAR) STYLING
   ========================================= 
   White text on primary background
   Secondary color on hover/active states
   ========================================= */

.sidebar .nav-link,
.sidebar .accordion-button,
.mobile-menu-footer .nav-link {
  color: #ffffff !important;
}

.sidebar .nav-link:hover,
.sidebar .nav-link:focus,
.sidebar .accordion-button:hover,
.sidebar .accordion-button:not(.collapsed),
.mobile-menu-footer .nav-link:hover {
  color: var(--bs-secondary) !important;
}

/* =========================================
   6. NEXT EVENT / COUNTDOWN WIDGET
   ========================================= 
   White text for countdown display
   ========================================= */

.countdown-keys .countdown-digit,
.countdown-keys .countdown-label {
  color: #ffffff !important;
}

/* Wiki links styling */
a[rel="wiki-link"] {
  color: #FF0000 !important;
  text-decoration: none;
}

a[rel="wiki-link"]:hover {
  text-decoration: underline;
}

/* =========================================
   7. SCHEDULE / SCOREBOARD COMPONENT
   ========================================= 
   Card headers use secondary (light blue) background
   Primary blue text for sport names
   ========================================= */

/* Active tab indicator */
.section.sec-scoreboard .nav-pills .nav-link.active {
    color: var(--bs-secondary);
}
.section.sec-scoreboard .component-scoreboard.layout-standard .card .card-body {
    border-color: var(--bs-primary);
    
}

/* Schedule card headers - light blue background with dark blue text */
.component-scoreboard.layout-standard .card .card-header {
  background-color: var(--bs-secondary) !important;
  color: #003457 !important;    
  font-family: var(--heading-font-family) !important;
}

/* Arrow controls for scrolling through schedule */
.component-scoreboard.layout-standard .slick-arrow {
    border: 1px solid var(--bs-secondary) !important;
}

.component-scoreboard.layout-standard .slick-arrow:hover {
    border: 1px solid #ffffff !important;
}

/* Composite Calendar Link Styling */
.landing .ps-component .archive-link a {
    color: #ffffff !important;
    font-family: var(--heading-font-family) !important;
    text-decoration: none !important;
}

/* Composite link hover - secondary blue, no underline */
.landing .ps-component .archive-link a.btn.btn-link,
.landing .ps-component .archive-link a.btn-link {
    text-decoration: none !important;
    font-family: var(--heading-font-family) !important;
}

.landing .ps-component .archive-link a.btn.btn-link:hover,
.landing .ps-component .archive-link a.btn-link:hover {
    color: var(--bs-secondary) !important;
    text-decoration: none !important;
}

/* Schedule navigation arrows */
button.slick-arrow,
button.slick-arrow .fa,
button.slick-arrow span {
  color: var(--bs-secondary) !important;
  opacity: 1;
}

button.slick-arrow:hover,
button.slick-arrow:hover .fa {
  color: #ffffff !important;
}

/* Sport name styling */
.sport-name,
.sport-name a,
.sport-name .sport-name-wrapper {
  color: var(--bs-primary) !important;
  font-family: var(--heading-font-family); 
}

/* =========================================
/* Main Container - Override bg-white/text-dark utilities */
.macro-secondary-navigation {
    background-color: var(--bs-primary) !important;
    color: #ffffff !important;
}

/* Remove default shadows if they clash with dark background */
.macro-secondary-navigation.shadow {
    box-shadow: none !important;
}

/* Links & Brand - White text */
.macro-secondary-navigation .navbar-brand,
.macro-secondary-navigation .nav-link {
    color: #ffffff !important;
}

/* Hover & Focus States - Secondary color */
.macro-secondary-navigation .navbar-brand:hover,
.macro-secondary-navigation .nav-link:hover,
.macro-secondary-navigation .nav-link:focus,
.macro-secondary-navigation .nav-link.active {
    color: var(--bs-secondary) !important;
}

/* Toggler (Mobile Menu Button) */
.macro-secondary-navigation .navbar-toggler {
    border-color: rgba(255, 255, 255, 0.5);
}

.macro-secondary-navigation .navbar-toggler .fa-bars {
    color: #ffffff;
}

/* Dropdown Menus */
.macro-secondary-navigation .dropdown-menu {
    background-color: var(--bs-primary);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.macro-secondary-navigation .dropdown-item {
    color: #ffffff;
}

.macro-secondary-navigation .dropdown-item:hover,
.macro-secondary-navigation .dropdown-item:focus {
    color: var(--bs-secondary);
    background-color: transparent;
}

/* =========================================
   9. FOOTER STYLING
   ========================================= 
   Accent lines, link colors, and copyright bar
   ========================================= */

/* Footer accent lines - secondary (light blue) */
.site-footer .branding span:before, 
.site-footer .branding span:after {
    background-color: var(--bs-secondary);
}

/* Copyright bar background - secondary blue */
.copyright.bg-primary.text-white.p-2 {
    background-color: var(--bs-secondary) !important;
}

/* Footer section titles - heading font, keeps text on one line */
.site-footer .footer-details .title {
    font-family: var(--heading-font-family);
    font-size: 1.2rem !important;
    white-space: nowrap !important;
}

.site-footer .footer-details a:hover,
.site-footer .footer-links a:hover,
.site-footer .nav-link:hover {
  text-decoration: underline !important;
  text-underline-offset: 2px;
}

/* Copyright bar text and links - primary blue, no default underline */
.copyright,
.copyright .disclaimer,
.copyright .disclaimer div {
  color: #003457 !important;
}

.copyright a {
  color: #003457 !important;
  text-decoration: none !important;
}

/* Copyright links show underline only on hover */
.copyright a:hover {
  text-decoration: underline !important;
  text-underline-offset: 2px;
}

/* "Powered by PrestoSports" logo - primary blue color */
.copyright .withpoweredby path,
.copyright .withpoweredby rect,
.copyright .withpoweredby polygon,
.copyright .withpoweredby .st0,
.copyright .withpoweredby .st1 {
  fill: var(--bs-primary) !important;
}

/* =========================================
   10. DESKTOP-SPECIFIC OVERRIDES
   ========================================= 
   Additional styling that only applies on larger screens
   ========================================= */

@media only screen and (min-width: 992px) {
    /* Desktop scoreboard archive link background */
    .section.sec-scoreboard .archive-link {
        background-color: var(--bs-primary);
    }
}


.site-footer .footer-details .component-nav a:hover {   color: var(--bs-secondary);}
.component-navbar-secondary.layout-standard .navbar .flexible-menu .flexible-dropdown-menu .nav-link {    color: var(--bs-primary) !important;   font-weight: bold !important;}
.component-scoreboard.layout-standard .slick-active + .slick-active .card-body:after {   background-color: var(--bs-primary);}

.pre-header .site-title {   font-family: 'Paladins'; font-weight: normal;}
.sec-scoreboard .component-title {   font-family: 'Paladins'; font-weight: normal;     font-size: 2.5rem;}

@media only screen and (min-width:992px){
    .site-header .component-nav.layout-standard .nav-link:after {   background-color: var(--bs-primary);}
    .site-header .component-search.layout-modal button:after {   background-color: var(--bs-primary);}
    .site-header .component-search.layout-modal button{ position: relative;}
    
    .sec-scoreboard .component-scoreboard.layout-standard .card .event-links, .sec-scoreboard .component-scoreboard.layout-standard .card .macro-event-notes {   min-height: inherit;}
}

@media only screen and (max-width:767px){
    .site-footer .footer-details .title {   white-space: normal !important;}
}