@charset "utf-8";
/* CSS Document ver 2.1 - FINAL CLEAN VERSION */

:root {
  --pf-nav-bg: #000032;       /* Navy background */
  --pf-border-red: #8B0000;   /* Dark Red for borders/arrows */
  --pf-text-gray: #333333;    /* Dark Gray for menu links */
  --pf-hover-bg: #000032;     /* Light gray hover background */
  --pf-hover-link: white;     /* Light gray hover background */
  --pf-nav-height: 55px;      /* Fixed height for navbar */
}

/* --- RESET & BASICS --- */
* { margin: 0; padding: 0; box-sizing: border-box; }
a, a:hover { text-decoration: none; }

/* --- MAIN NAVBAR CONTAINER --- */
#pf_top-nav {
  height: var(--pf-nav-height);
  display: flex;
  padding: 0;
  background-color: var(--pf-nav-bg);
}

#pf_top-nav ul.pf_menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* --- TOP LEVEL MENU ITEMS (LI) --- */
#pf_top-nav ul.pf_menu > li {
  display: inline-block;
  position: relative; 
  cursor: pointer;
  user-select: none;
}

/* FIX: Ensure the LI itself never changes background color */
#pf_top-nav ul.pf_menu > li:hover {
    background-color: transparent !important;
    background: none !important;
}

/* --- NAVIGATION BAR --- */
    nav { display: inline-block; height: var(--pf-nav-height); vertical-align: top; }
    .pf_menu { list-style: none; padding: 0; margin: 0; }
    
    /* Top Level Menu Items (NEWS, STATS, etc) */
    .pf_menu > li { 
        float: left; 
        position: relative; 
        padding: 0px 0px 0px 18px; /* Spacing between top buttons */
        line-height: var(--pf-nav-height);
        cursor: pointer;
        user-select: none;
    }
    .pf_menu > li > a { 
        text-decoration: none; 
        color: white; 
        display: block; 
        font-size: 14px; 
        font-weight: bold; 
    }
    .pf_menu > li:hover { background-color: #000055; }

/* --- TOP LEVEL LINKS (A) --- */
#pf_top-nav ul.pf_menu > li > a {
  display: block;
  color: #D9D9D9;
  padding: 0px 15px;       
  line-height: var(--pf-nav-height); 
  font-family: Arial, sans-serif; 
  font-size: 14px;
  transition: background-color 0.2s, color 0.2s;
}

/* FIX: Only the Link turns blue on hover or when Active */
#pf_top-nav ul.pf_menu > li:hover > a,
#pf_top-nav ul.pf_menu > li.active > a { 
  background-color: #000064 !important; 
  color: #ffffff !important; 
}

/* --- THE RED ARROW (Triangle) --- */
li.pf-dropdown.active::after {
  content: "";
  position: absolute;
  bottom: 0;           
  left: 50%;           
  margin-left: -8px;   
  width: 0;
  height: 0;
  z-index: 2000;       
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid var(--pf-border-red);
}

/* --- MAIN DROPDOWN CONTAINER (Level 1) --- */
ul.pf-dropdown-menu,
.pf_drop-down-menu {
  display: none;       
  position: absolute;
  top: var(--pf-nav-height);
  left: 20px;
  width: 280px;        
  background: white;
  border-top: 5px solid var(--pf-border-red);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  z-index: 1000;
  list-style: none;
  padding: 0;
  margin: 0;
}

/* --- SUB-MENU CONTAINER (Level 2) --- */
ul.pf-dropdown-submenu,
.pf-dropdown-submenu {
  display: none;       
  position: absolute;
  top: 0;
  left: 100%;          
  width: 320px;
  background: white;
  border-left: 5px solid var(--pf-border-red);
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.15);
  z-index: 2000;
  list-style: none;
  padding: 0;
  margin: 0;
}

/* --- DROPDOWN LIST ITEMS (LI) --- */
ul.pf-dropdown-menu li,
ul.pf-dropdown-submenu li {
  display: block;
  position: relative; 
  margin: 0;
  padding: 0; 
  border-bottom: 1px solid #eee;
}

/* FIX: Ensure the LI in dropdowns never highlights */
ul.pf-dropdown-menu li:hover,
ul.pf-dropdown-submenu li:hover {
    background-color: transparent !important;
    background: none !important;
}

/* --- DROPDOWN LINKS (A) --- */
a.pf_sub_link, 
.pf_sub_link {
  display: block;        /* Fills the whole box */
  width: 100%;           /* Ensures full width */
  box-sizing: border-box;
  padding: 0px 10px;    
  
  text-align: left;
  font-family: 'Days One', sans-serif; 
  font-size: 12px;
  color: var(--pf-text-gray) !important; 
  text-decoration: none;
  transition: background-color 0.1s;
}

/* FIX: Only the Link turns gray on hover */
a.pf_sub_link:hover {
  background-color: var(--pf-hover-bg) !important;
  color: var(--pf-hover-link) !important;
}

/* --- MOBILE & UTILITIES --- */
.pflogo19 { display: inline-block; }

@media only screen and (max-width: 1300px) {
  .pflogo_mobile19 { display: block; }
  ul.pf_menu { display: none; } 
  .pflogo19 { display: none; }
}