/* ============================================================ 
   JEVENTS GLOBAL NAVIGATION - FIXED 
============================================================ */

/* Hide IMAGES, SVGs, and FONT ICONS */
.nav_bar_cal img, 
.jev_navbar img, 
.jev_navrow img, 
.jev_links img,
.nav_bar_cal svg,
.nav_bar_cal .icon-arrow-right, 
.nav_bar_cal .icon-arrow-left,
.nav_bar_cal .icon-calendar,
.nav_bar_cal .icon-search,
.nav_bar_cal .fa, 
.nav_bar_cal .fas, 
.nav_bar_cal .far {
    display: none !important;
}

/* Container for the buttons */
.nav_bar_cal, 
.jev_navbar, 
.jev_navrow {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 10px !important;
    margin-bottom: 25px !important;
    background: #f8f9fa !important;
    padding: 15px !important;
    border-radius: 8px !important;
}

/* Turn links into Big Blue Buttons */
.nav_bar_cal a, 
.jev_navbar a, 
.jev_navrow a, 
.jev_links a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: #0056b3 !important;
    color: #ffffff !important;
    padding: 12px 20px !important;
    border-radius: 6px !important;
    font-size: 1.1rem !important;
    font-weight: bold !important;
    text-decoration: none !important;
    min-width: 130px !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2) !important;
    transition: all 0.2s ease-in-out !important;
}

/* INJECT TEXT LABELS */
.nav_bar_cal a[title*="Month"]::after, .jev_month::after { content: "By Month"; }
.nav_bar_cal a[title*="Week"]::after, .jev_week::after { content: "By Week"; }
.nav_bar_cal a[title*="Day"]::after, .jev_day::after { content: "By Day"; }
.nav_bar_cal a[title*="Search"]::after, .jev_search::after { content: "Search"; }
.nav_bar_cal a[title*="Jump"]::after, .jev_jumpto::after { content: "Jump to Month"; }

/* Button Hover State */
.nav_bar_cal a:hover, 
.jev_navbar a:hover {
    background-color: #003d7a !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.3) !important;
    color: #ffffff !important;
}
