/* ============================================================
   GWSCSW — CLEAN GLOBAL WILD APRICOT CSS
   Palette: #243B39 | #195E57 | #D4B65E | #F4F6F5
   This file is intended for the Wild Apricot global CSS area.
   Section-specific homepage CSS (hero, resources, membership, etc.)
   should stay inside those Custom HTML gadgets.
   ============================================================ */

/* ============================================================
   HOMEPAGE — PROGRAM TITLE FIX
   ============================================================ */

.gw-programs-section .gw-programs-title {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}

.gw-programs-section .gw-programs-title::before,
.gw-programs-section .gw-programs-title::after {
    display: none !important;
    content: none !important;
}

@media (min-width: 1001px) {
    .gw-programs-section .gw-programs-title {
        white-space: nowrap !important;
    }
}

/* ============================================================
   HOMEPAGE — LIVE FEED GADGETS
   ============================================================ */

.gw-live-feed-row {
    max-width: 1320px;
    margin: 0 auto 52px;
    padding: 0 28px 10px;
    box-sizing: border-box;
}

.gw-live-feed-row .WaGadgetEvents,
.gw-live-feed-row .WaGadgetBlog,
.gw-live-feed-row .WaGadgetRecentBlogPosts,
.gw-live-feed-row .WaGadgetContent {
    background: #ffffff !important;
    border: 1px solid #e1e7e5 !important;
    border-radius: 8px !important;
    box-shadow: 0 5px 18px rgba(36, 59, 57, .07) !important;
    overflow: hidden !important;
    height: 100%;
}

.gw-live-feed-row .gadgetStyleBody,
.gw-live-feed-row .gadgetContentEditableArea,
.gw-live-feed-row .gadgetStyleNone {
    background: #ffffff !important;
}

.gw-live-feed-row .gadgetStyleTitle,
.gw-live-feed-row .gadgetStyleTitle h4,
.gw-live-feed-row .gadgetStyleTitle h3,
.gw-live-feed-row .gadgetStyleTitleContainer {
    background: #243B39 !important;
    color: #ffffff !important;
    border: 0 !important;
}

.gw-live-feed-row .gadgetStyleTitle {
    padding: 15px 18px !important;
}

.gw-live-feed-row .gadgetStyleTitle h4,
.gw-live-feed-row .gadgetStyleTitle h3,
.gw-live-feed-row .gadgetStyleTitleContainer {
    margin: 0 !important;
    color: #ffffff !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 21px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    text-transform: none !important;
}

.gw-live-feed-row .gadgetStyleBody {
    padding: 20px 18px 22px !important;
}

.gw-live-feed-row a {
    color: #195E57 !important;
    text-decoration: none !important;
}

.gw-live-feed-row a:hover {
    color: #243B39 !important;
    text-decoration: underline !important;
}

.gw-live-feed-row .boxBodyInfoOuterContainer,
.gw-live-feed-row .boxBodyInfoContainer,
.gw-live-feed-row .item,
.gw-live-feed-row li {
    margin-bottom: 16px !important;
}

.gw-live-feed-row .eventDetailsLink,
.gw-live-feed-row .title a,
.gw-live-feed-row .itemTitle a,
.gw-live-feed-row h5 a,
.gw-live-feed-row h4 a {
    color: #195E57 !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
}

.gw-live-feed-row .eventInfo,
.gw-live-feed-row .date,
.gw-live-feed-row .postedDate,
.gw-live-feed-row .itemInfo,
.gw-live-feed-row time {
    color: #65716f !important;
    font-size: 12.5px !important;
    line-height: 1.45 !important;
}

.gw-live-feed-row p,
.gw-live-feed-row .description,
.gw-live-feed-row .itemText {
    color: #4d5957 !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}

.gw-live-feed-row .boxBodyInfoOuterContainer:not(:last-child),
.gw-live-feed-row .item:not(:last-child),
.gw-live-feed-row li:not(:last-child) {
    padding-bottom: 15px !important;
    border-bottom: 1px solid #e6ebe9 !important;
}

.gw-live-feed-row .WaGadgetEvents .boxBodyInfoOuterContainer {
    padding-bottom: 15px !important;
    margin-bottom: 15px !important;
}

.gw-live-feed-row .WaGadgetEvents .eventDetailsLink {
    display: inline-block !important;
    margin-bottom: 4px !important;
}

.gw-live-feed-footer {
    text-align: center;
    margin-top: 16px;
}

.gw-live-feed-footer a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 11px 18px;
    background: #243B39;
    border-radius: 4px;
    color: #ffffff !important;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .4px;
    text-transform: uppercase;
    text-decoration: none !important;
    transition: background .2s ease, transform .2s ease;
}

.gw-live-feed-footer a:hover {
    background: #195E57;
    color: #ffffff !important;
    text-decoration: none !important;
    transform: translateY(-2px);
}

@media (max-width: 700px) {
    .gw-live-feed-row {
        padding: 0 16px 5px;
    }

    .gw-live-feed-row .gadgetStyleTitle h4,
    .gw-live-feed-row .gadgetStyleTitle h3,
    .gw-live-feed-row .gadgetStyleTitleContainer {
        font-size: 19px !important;
    }

    .gw-live-feed-row .eventDetailsLink,
    .gw-live-feed-row .title a,
    .gw-live-feed-row .itemTitle a {
        font-size: 15px !important;
    }
}

/* ============================================================
   BLOG / RECENT POSTS — HIDE AUTHOR/META
   ============================================================ */

.WaGadgetRecentBlogPosts .gadgetStyleBody ul li .author,
.WaGadgetRecentBlogPosts.gadgetStyle001 ul li .date,
.boxInfoContainer h5,
.WaGadgetBlog .boxBodyInfoOuterContainer h5 .postedByLink,
.WaGadgetBlog .boxBodyInfoOuterContainer h5 .postedByLabel,
span.postedByLink,
span.postedByComment {
    display: none !important;
}

.WaGadgetRecentBlogPosts .gadgetStyleBody ul li {
    margin: 0 0 10px 0;
}

/* ============================================================
   FORUM CLEANUP
   ============================================================ */

.WaGadgetForum .pageTitleOuterContainer .pageBackContainer,
.WaGadgetForum .forumPanelOuterContainer .forumPanelContainer .forumSortedOrderLink,
.WaGadgetForum.WaGadgetForumStateMessageList .messageListOuterContainer .messageListContainer ul.boxesList li.boxesListItem .boxHeaderOuterContainer table.forumMessageHeaderTable td.forumMessageHeaderBodyContainer > span,
.WaGadgetForumStateList .forumCategoryListOuterContainer .forumCategoryOuterContainer .forumCategoryContainer .forumListContainer .boxBodyOuterContainer table.forumListTable tr.forumListRow td.lastReplyTD .lastReply a:first-child,
.WaGadgetForum.WaGadgetForumStateTopicList #idTopicListContainer .topicListContainer .boxBodyOuterContainer table tr.topicListRow td.lastReplyTD .lastReply a,
.WaGadgetForum.WaGadgetForumStateMessageList .messageListOuterContainer .messageListContainer ul.boxesList li.boxesListItem .boxHeaderOuterContainer table.forumMessageHeaderTable td.forumMessageHeaderInfoContainer .forumMessageHeaderInfo span {
    display: none !important;
}

/* ============================================================
   CAREER-STAGE / SLIDE BUTTONS
   Consolidated replacement for the duplicate buttonfx rules.
   ============================================================ */

.buttonfx {
    color: #ffffff !important;
    background: #243B39;
    border: 1px solid #243B39;
    border-radius: 4px;
    outline: none;
    padding: 10px 18px;
    margin: 4px;
    text-decoration: none !important;
    display: inline-block;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: .04em;
    text-transform: uppercase;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    isolation: isolate;
    transition: color .3s ease, border-color .3s ease;
}

.buttonfx::before {
    content: "";
    position: absolute;
    inset: 0;
    background: #F3E7A6;
    transform: translateX(-101%);
    transition: transform .3s ease;
    z-index: -1;
}

.buttonfx:hover::before,
.buttonfx:focus::before,
.slideleft:hover::before,
.slideleft:focus::before {
    transform: translateX(0);
}

.buttonfx:hover,
.buttonfx:focus {
    color: #243B39 !important;
    border-color: #D4B65E;
    text-decoration: none !important;
}

.buttonfx:focus-visible {
    outline: 2px solid #D4B65E;
    outline-offset: 2px;
}

/* Legacy effect class names retained so existing links do not break. */
.slideleft,
.slidebottomleft,
.angleinleft,
.curtaindown,
.curtainup,
.angleindouble,
.doubletake,
.bouncein {
    position: relative;
}

/* ============================================================
   SOCIAL PROFILE
   ============================================================ */

.WaGadgetSocialProfile.gadgetStyle003 .gadgetStyleBody ul li a {
    border-color: #195E57;
    color: #195E57;
}

.WaGadgetSocialProfile.gadgetStyle003 .gadgetStyleBody ul li a:hover {
    border-color: #243B39;
    color: #243B39;
}

/* ============================================================
   HORIZONTAL NAVIGATION
   ============================================================ */

.WaGadgetMenuHorizontal.menuStyle002 .menuInner {
    border-bottom-color: transparent;
    background: transparent;
    text-align: center;
}

.WaGadgetMenuHorizontal.menuStyle002 .menuInner ul.firstLevel > li > .item > a span {
    padding: 10px 0 15px;
    color: #ffffff;
    font-size: 14px;
}

.WaGadgetMenuHorizontal.menuStyle002 .menuInner ul.firstLevel > li.sel > .item > a > span::after {
    background-color: #ffffff;
    height: 3px;
    bottom: 4px;
}

.WaGadgetMenuHorizontal .menuInner ul ul li > .item {
    background: #243B39;
}

.WaGadgetMenuHorizontal .menuInner ul ul li > .item:hover {
    background: #195E57;
}

.WaGadgetMenuHorizontal.menuStyle002 .menuInner ul ul {
    border-top: 5px solid #D4B65E;
}

.WaGadgetMenuHorizontal.menuStyle002 .menuInner ul.firstLevel > li.dir > .item > a::after {
    background: #ffffff;
}

/* ============================================================
   WILD APRICOT STANDARD BUTTONS
   ============================================================ */

a.stylizedButton.buttonStyle001,
a.stylizedButton.buttonStyle001:hover,
.functionalButton,
.WaGadgetContactProfile .topButtonsOuterContainer .topButtonsContainer .inner input.typeButton,
.WaGadgetContactProfile .topButtonsOuterContainer .topButtonsContainer .inner input.typeButton:hover,
.WaGadgetAuthorizationRequired .loginPageTable #idSubmitBox #idLoginButtonBox span input.loginButton,
.generalFieldsContainer input[type="submit"],
.generalFieldsContainer input.typeButton,
.commonMessageBox .cww-co .buttons input[type="submit"],
.commonMessageBox .cww-co .buttons input.typeButton,
.WaGadgetMemberPublicProfileStateMain .memberDirectoryDetailsOuterContainer .profileHeaderContainer h2 .sendMailButtonContainer input.typeButton,
.navigationOuterContainer .navigationContainer input.nextButton,
.navigationOuterContainer .navigationContainer input.typeButton,
.navigationOuterContainer .navigationContainer input[type="submit"],
.WaGadgetTermsOfUse .login-role-actions input[type="submit"],
.WaGadgetUnsubscribeFromEmails form input[type="submit"] {
    background-color: #243B39 !important;
}

/* ============================================================
   VERTICAL MENU
   ============================================================ */

.WaGadgetMenuVertical .menuInner {
    background: #f7f8f7;
}

.WaGadgetMenuVertical .menuInner ul.firstLevel > li:hover > .item,
.WaGadgetMenuVertical .menuInner ul ul li:hover > .item {
    background: #f4f6f5;
}

.customVertMenu .firstLevel {
    padding: 10px 0 !important;
}

.customVertMenu a {
    padding: 0 5px !important;
}

.customVertMenu a:hover {
    background: #ffffff;
    color: #195E57 !important;
}

.WaGadgetMenuVertical .menuInner ul.firstLevel > li > .item > a {
    color: #243B39;
    text-shadow: none;
}

.WaGadgetMenuVertical .menuInner ul ul li > .item > a {
    text-shadow: none;
}

/* ============================================================
   CUSTOM HORIZONTAL MENU BANDS
   ============================================================ */

.horizontalMenuFull1,
.horizontalMenuFull {
    background: #243B39;
    margin: 0;
}

.horizontalMenuFull a {
    color: #ffffff !important;
    font-size: 17px !important;
}

.WaGadgetCustomMenu .gadgetStyleBody .customMenuWrapper.alignCenter {
    padding: 14px 0 10px;
}

.WaGadgetCustomMenu .gadgetStyleBody ul.orientationHorizontal li a {
    padding: 0 10px;
}

/* ============================================================
   EVENTS
   ============================================================ */

.WaGadgetEvents .boxOuterContainer .boxHeaderOuterContainer .boxHeaderContainer h4.boxHeaderTitle a {
    color: #243B39;
    font: normal 26px/normal "Roboto Condensed", Arial, sans-serif;
    text-decoration: none;
}

.WaGadgetEvents .boxOuterContainer .boxBodyOuterContainer .boxBodyContainer .boxBodyInfoOuterContainer .boxBodyInfoContainer .boxActionContainer {
    padding: 15px 0 0;
}

.WaGadgetEvents .boxOuterContainer .boxBodyOuterContainer .boxBodyContainer .boxBodyInfoOuterContainer .boxBodyInfoContainer .boxActionContainer input.typeButton,
.WaGadgetEvents .boxOuterContainer .boxBodyOuterContainer .boxBodyContainer .boxBodyInfoOuterContainer .boxBodyInfoContainer .boxActionContainer input.typeButton:hover {
    background-color: #243B39;
}

/* ============================================================
   SLIDESHOW / LEGACY SLIDER
   ============================================================ */

.zoneHeader1 > .container_12,
.zoneHeader1 > .container_12 > .s1_grid_12 {
    width: 100%;
}

.zoneHeader1 > .container_12 > .s1_grid_12 {
    margin: 0;
}

.zoneHeader1.container_12 {
    width: 100%;
}

.zoneHeader1Inner.zoneInner.s1_grid_12.s2_grid_12.s3_grid_12 {
    width: 100%;
    margin: 0;
}

.WaGadgetSlideshow .camera_wrap .camera_pag .camera_pag_ul li,
.WaGadgetSlideshow .camera_wrap .camera_pag .camera_pag_ul li > span {
    background: #dddddd;
    border: 0;
}

.WaGadgetSlideshow .camera_wrap .camera_pag .camera_pag_ul li:hover > span,
.WaGadgetSlideshow .camera_wrap .camera_pag .camera_pag_ul li.cameracurrent,
.WaGadgetSlideshow .camera_wrap .camera_pag .camera_pag_ul li.cameracurrent > span {
    background: #195E57;
}

.desktopSlider {
    position: relative;
}

.camera_caption {
    top: 90%;
    left: 10%;
    display: block;
    position: absolute;
    width: 80%;
}

.camera_caption > div {
    background: rgba(36, 59, 57, .72);
}

/* ============================================================
   LEGACY HOMEPAGE CTA HELPERS
   ============================================================ */

.ctaBox a {
    color: #ffffff;
    text-decoration: none;
    border: 3px solid #ffffff;
}

.ctaBox a:hover {
    background: #ffffff;
    color: #243B39;
    padding: 5px;
}

.ctaBox2 a {
    background: #ffffff;
    color: #243B39;
    text-decoration: none;
    border: 3px solid #ffffff;
    padding: 5px;
}

.ctaBox2 a:hover {
    background: transparent;
    color: #ffffff;
}

.liveTalks,
.liveTalks .WaLayoutItem {
    height: 400px;
}

@media only screen and (max-width: 670px) {
    .liveTalks,
    .liveTalks .WaLayoutItem {
        height: auto !important;
    }
}

/* ============================================================
   SYSTEM HEADINGS
   Keep this restrained so custom homepage headings are not affected.
   ============================================================ */

.captionOuterContainer .captionContainer .fieldBody h4 {
    color: #243B39;
    font: normal 26px/normal "Roboto Condensed", Arial, sans-serif;
    overflow: visible;
    white-space: normal;
}

/* Do NOT globally force h2 sizing/lines; custom homepage sections
   use their own scoped title classes. */

h2 {
    color: #243B39;
}

/* ============================================================
   BLOG TITLES
   ============================================================ */

.WaGadgetBlog.WaGadgetBlogStateList ul.boxesList li.boxesListItem .boxHeaderOuterContainer h4.boxHeaderTitle a {
    color: #243B39;
    font: normal 18px/normal "Roboto Condensed", Arial, sans-serif;
    text-decoration: none;
}

/* ============================================================
   LOGIN ICON
   ============================================================ */

.WaGadgetLoginForm .loginContainerWrapper .loginContainerInnerWrapper .loginLink::before {
    border: 2px solid #243B39;
    border-radius: 50%;
    background-color: #243B39;
}

/* ============================================================
   MOBILE SAFETY
   Prevent long homepage headings and links from overflowing.
   ============================================================ */

@media (max-width: 700px) {
    .gw-connected-title,
    .gw-resources-title,
    .gw-programs-title,
    .gw-president-title,
    .gw-membership-title,
    .gw-committees-title {
        white-space: normal !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
        max-width: 100% !important;
    }

    .buttonfx {
        white-space: normal;
        max-width: 100%;
        box-sizing: border-box;
    }
}
