/* 1. Target the JS-Generated Container */
#idEventViewSwitcher .semantic-ui,
#idEventViewSwitcher .pageViewSwitcherContainer,
[id^="init-add-event-to-calendar-dropdown"] {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    padding: 10px 0 !important;
}

/* 2. Target the actual Link/Text inside the JS dropdown */
#idEventViewSwitcher .semantic-ui a,
#idEventViewSwitcher .semantic-ui .ui.dropdown,
#idEventViewSwitcher .semantic-ui .text {
    /* Using a modern, clean stack */
    font-family: 'Montserrat', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif !important;
    font-size: 20px !important; 
    color: #0000FF !important; 
    font-weight: 700 !important; /* Bold but not "heavy" */
    letter-spacing: 0.5px !important; /* Adds tiny space between letters for clarity */
    text-transform: none !important; /* Removed uppercase for better readability */
    text-decoration: underline !important;
}

/* 3. Target the Icon specifically */
#idEventViewSwitcher .semantic-ui i.icon,
#idEventViewSwitcher .semantic-ui .calendar.icon {
    font-size: 22px !important;
    color: rgb(58,131,190) !important;
    margin-left: 10px !important;
    opacity: 1 !important; /* Semantic UI sometimes fades icons; this prevents that */
}

/* 4. Hover State */
#idEventViewSwitcher .semantic-ui a:hover {
    color: #00008B !important;
    cursor: pointer !important;
}

.WaGadgetMenuHorizontal .menuInner ul.firstLevel>li>.item>a{
color: rgb(8, 8, 8) !important;
}


/* 2. BLOG FIX: Hide 'Posted By' info */
.WaGadgetBlog .boxBodyInfoOuterContainer h5 .postedByLink {
    display: none;
}

/* 3. BUTTONS: The Improved, Responsive Button Style */
.button {
    display: inline-block;
    text-decoration: none;
    text-align: center;
    padding: 11px 32px;
    border: 1px solid #004F72;
    border-radius: 4px;
    font: bold 20px Arial, Helvetica, sans-serif;
    color: #E5FFFF !important;
    background-color: #3BA4C7;
    background-image: linear-gradient(to bottom, #3BA4C7 0%, #1982A5 100%);
    box-shadow: 0 1px 2px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.3);
    transition: all 0.2s ease-in-out;
    cursor: pointer;
}

.button:hover {
    background-color: #46b2d5;
    background-image: linear-gradient(to bottom, #46b2d5 0%, #1d94bc 100%);
    box-shadow: 0 2px 4px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.4);
    color: #FFFFFF !important;
}

.button:active {
    background-image: linear-gradient(to bottom, #1982A5 0%, #3BA4C7 100%);
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.2);
    transform: translateY(1px);
}
