/* Login button */
.WaGadgetLoginButton .loginLink, .WaGadgetLoginForm .loginLink {
    background: #FFF200 !important;
    color: rgb(38, 108, 120) !important;
}

/* Login button on hover */
.WaGadgetLoginButton .loginLink:hover, .WaGadgetLoginForm .loginLink:hover {
    background: #FFF200 !important;
}

/* Logout button */
.WaGadgetLoginButton .authenticated .loginLink, .WaGadgetLoginForm .authenticated .loginLink {
    background: 0 !important;
    color: #FFF200 !important;
}

/* Logout button on hover */
.WaGadgetLoginButton .authenticated .loginLink:hover, .WaGadgetLoginButton .authenticated .loginLink.hover, .WaGadgetLoginForm .authenticated .loginLink:hover, .WaGadgetLoginForm .authenticated .loginLink.hover {
    background: #FFF200 !important;
    color: rgb(38, 108, 120) !important;
}

/* Optional: Target the container inside the placeholder if needed */
.WaPlaceHolder > .zoneInner {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}


/* Change button background to green */
.wa-button, 
input[type="submit"], 
input[type="button"], 
button {
    background-color: #266C78 !important; /* A standard green hex code */
    border-color: #266C78 !important;
    color: #ffffff !important; /* Keeps the text white */
}

/* Change button color when hovered */
.wa-button:hover, 
input[type="submit"]:hover, 
input[type="button"]:hover, 
button:hover {
    background-color: #218838 !important; /* A slightly darker green for the hover effect */
    border-color: #1e7e34 !important;
}

/* Change Date and Location color in Upcoming Events gadget */
.wa-upcoming-events-gadget .eventLocation, 
.wa-upcoming-events-gadget .eventDate {
    color: #000000 !important; /* Replace #000000 with your preferred hex code */
}

/* Code to change page width START */
.WaPlaceHolder {
    max-width: 1400px; 
}
/* Code to change page width END */

/* Targets the Grants header gadget on the home page and forces rounded edges */
#id_AmCXvDH, 
#id_AmCXvDH .idGContainer, 
#id_AmCXvDH .idGContainer .gadgetOuterWrapper {
    border-radius: 8px !important;
    overflow: hidden !important;
}
/* Targets the Become a Member header gadget on the home page and forces rounded edges */
#id_O5iClM1, 
#id_O5iClM1 .idGContainer, 
#id_O5iClM1 .idGContainer .gadgetOuterWrapper {
    border-radius: 8px !important;
    overflow: hidden !important;
}
/* Targets the Grants subheader content gadget on the home page and forces rounded edges */
#id_3vbezaq, 
#id_3vbezaq .idGContainer, 
#id_3vbezaq .idGContainer .gadgetOuterWrapper {
    border-radius: 8px !important;
    overflow: hidden !important;
}
/* Targets the Special Events header gadget on the home page and forces rounded edges */
#id_LIdsaGW, 
#id_LIdsaGW .idGContainer, 
#id_LIdsaGW .idGContainer .gadgetOuterWrapper {
    border-radius: 8px !important;
    overflow: hidden !important;
}
/* Targets the Register content gadget on the Cool Breeze Ride page and forces rounded edges */
#id_UuZckOg, 
#id_UuZckOg .idGContainer, 
#id_UuZckOg .idGContainer .gadgetOuterWrapper {
    border-radius: 8px !important;
    overflow: hidden !important;
}
/* Targets the Website content gadget on the Cool Breeze Ride page and forces rounded edges */
#id_xgcCaYM, 
#id_xgcCaYM .idGContainer, 
#id_xgcCaYM .idGContainer .gadgetOuterWrapper {
    border-radius: 8px !important;
    overflow: hidden !important;
}
/* Targets the Merchandise content gadget on the Cool Breeze Ride page and forces rounded edges */
#id_ECruD7f, 
#id_ECruD7f .idGContainer, 
#id_ECruD7f .idGContainer .gadgetOuterWrapper {
    border-radius: 8px !important;
    overflow: hidden !important;
}
/* Change link color for Privacy Policy in footer */
#id_dClJEop a {
    color: #7BCDC8 !important; /* Replace with your hex color code */
}
/* Change link color for Become a Member in footer */
#id_p3NrgUr a {
    color: #7BCDC8 !important; /* Replace with your hex color code */
}
/* Change link color for Contact Us in footer */
#id_Oip23gj a {
    color: #7BCDC8 !important; /* Replace with your hex color code */
}

/* Force tight container blocks for the Upcoming Events listings */
.WaGadgetUpcomingEvents,
.WaGadgetUpcomingEvents * {
    margin-bottom: 2px !important;
    padding-bottom: 2px !important;
    margin-top: 0px !important;
    padding-top: 0px !important;
}

/* Handle actual text elements and paragraph breaks specifically */
.WaGadgetUpcomingEvents p, 
.WaGadgetForumUpdates p,
.WaGadgetUpcomingEvents li, 
.WaGadgetForumUpdates li,
.WaGadgetUpcomingEvents td, 
.WaGadgetForumUpdates td {
    margin: 15px 0 !important;
    padding: 2px 0 !important;
    line-height: 1.2 !important;
}

/* Remove the entire left-hand schedule list block */
div[class*="EventSchedule"],
td[class*="EventSchedule"],
.waEventDetailsSchedule,
.eventDetailsSessionListContainer {
    display: none !important;
}

/* Force the description block to take up the full available width */
div[class*="EventDescription"],
td[class*="EventDescription"],
.waEventDetailsDescription {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
}

/* Nuclear override for the calendar title element */
h3.sectionTitle[class*="sectionTitle"],
.WaGadgetEventCalendar h3,
.WaGadgetEventCalendar .sectionTitle {
    font-family: 'Verdana', sans-serif !important; /* Changes font to Verdana */
    font-weight: normal !important;               /* Removes the bold style */
    font-size: 30px !important;
    color: #266C78 !important;
    text-transform: capitalize !important;
    font-variant: normal !important;
    letter-spacing: normal !important;
}

/* ==========================================================
   WA-004 Calendar Day Outlines
   Purpose:
     • Draws a black outline around each calendar day.
     • Draws black outlines around the weekday header.
     • Restores the bottom border of the final week.
   ========================================================== */

.EventListCalendar {
    border-collapse: collapse !important;
}

/*
Remove all existing borders from the main calendar cells.
This does not affect the small tables inside each date.
*/
.EventListCalendar > tbody > tr > td {
    border: none !important;
}

/* Vertical divisions between Sunday through Saturday */
.EventListCalendar > tbody > tr > td {
    border-left: 1px solid #000 !important;
}

/* Right outside edge */
.EventListCalendar > tbody > tr > td:last-child {
    border-right: 1px solid #000 !important;
}

/*
Top border of each week.
These are the rows containing the date numbers.
*/
.EventListCalendar > tbody > tr > td[style*="border-top-style"] {
    border-top: 1px solid #000 !important;
}

/*
Bottom border of each week.
Wild Apricot identifies these as the 10-pixel spacer rows.
*/
.EventListCalendar > tbody > tr > td[height="10"] {
    border-bottom: 1px solid #000 !important;
}

/*
Bottom border of the entire calendar.
This restores the missing line under the last week.
*/
.EventListCalendar {
    border-bottom: 1px solid #000 !important;
}

/* Weekday headings */
.EventListCalendarHeader {
    border: none !important;
    border-bottom: 1px solid #000 !important;
}

/* Left and right edges of the weekday heading row */
.EventListCalendarHeader:first-child {
    border-left: 1px solid #000 !important;
}

.EventListCalendarHeader:last-child {
    border-right: 1px solid #000 !important;
}

/* ==========================================================
   WA-002 Calendar Navigation Bar
   Purpose:
     • Teal navigation buttons
     • Darker teal for the selected Week / Month / Year view
     • Verdana font with normal weight
     • Uniform 54px button height
     • Approximately 3px less space above and below
   ========================================================== */


/* ---------- Regular button backgrounds ---------- */

.weekButton,
.monthButton,
.yearButton,
.todayButton,
.previousMonthButton,
.nextMonthButton,

.weekButton a,
.monthButton a,
.yearButton a,
.todayButton a,

.DecDateButton,
.incDateButton,

.weekButton span,
.monthButton span,
.yearButton span {
    background: #2A9D8F !important;
    background-color: #2A9D8F !important;
    background-image: none !important;
}


/* ---------- Selected Week / Month / Year ---------- */

.weekButton:has(.weekButtonLabel),
.monthButton:has(.monthButtonLabel),
.yearButton:has(.yearButtonLabel),

.weekButton:has(.weekButtonLabel) span,
.monthButton:has(.monthButtonLabel) span,
.yearButton:has(.yearButtonLabel) span {
    background: #1D746D !important;
    background-color: #1D746D !important;
}


/* ---------- Button containers ---------- */

.weekButton,
.monthButton,
.yearButton,
.todayButton,
.previousMonthButton,
.nextMonthButton {
    height: 54px !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}


/* ---------- Button text ---------- */

.weekButton a,
.monthButton a,
.yearButton a,
.todayButton a,

.DecDateButton,
.incDateButton,

.weekButton span,
.monthButton span,
.yearButton span {
    display: block !important;
    height: 54px !important;
    line-height: 54px !important;

    padding: 0 8px !important;
    box-sizing: border-box !important;

    color: #ffffff !important;
    font-family: Verdana, Arial, sans-serif !important;
    font-size: 16px !important;
    font-weight: normal !important;
    text-align: center !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}