/* ==========================================================================
   TABLE OF CONTENTS
   1. GLOBAL & SITE-WIDE STYLES
   2. BUTTON STYLES (THEME DEFAULTS)
   3. TEXT COLORS & LINKS
   4. HEADER & NAVIGATION LAYOUT
   5. FORUM LAYOUT & STYLING
   6. MEMBER PUBLIC PROFILE
   7. MISCELLANEOUS / SPECIFIC ID FIXES
   8. MOBILE / RESPONSIVE STYLES
   ========================================================================== */
/* 1. FORCE EDITOR WHITE (Top Priority) */
/* Targets the editor and generic containers to force them white */
#idPrimaryContentBlock1Content,
.forumEditEntryEditorContainer,
.RadEditor .reContentCell, 
.cke_editable,
body[contenteditable="true"] {
    background-color: #ffffff !important;
    background-image: none !important;
}

/* CRITICAL FIX: Hides the "iPhone Layer" so it doesn't cover the white background */
#idPrimaryContentBlock1Content::before,
.forumEditEntryEditorContainer::before,
.RadEditor .reContentCell::before, 
.cke_editable::before,
body[contenteditable="true"]::before {
    display: none !important;
    content: none !important;
    background: none !important;
}

/* Ensure the text inside the editor is black */
#idPrimaryContentBlock1Content p,
.forumEditEntryEditorContainer p,
.cke_editable p {
    color: #000000 !important;
}

/* 2. DESKTOP BACKGROUND (Computers) */
/* Sets the fixed blue background for normal screens */
body {
    background-image: url('https://omegahomenetwork.wildapricot.org/resources/Site/Blue%20Background.png') !important;
    background-size: cover !important;
    background-attachment: fixed !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
}

/* 3. MOBILE BACKGROUND FIX (Phones/Tablets) */
/* Only runs on screens smaller than 1024px to fix the iPhone blur */
@media only screen and (max-width: 1024px) {
    /* Make the main body transparent */
    body {
        background: transparent !important;
        position: relative;
        z-index: 1;
    }
    
    /* Put the image on a separate fixed layer behind the body */
    body::before {
        content: "";
        position: fixed;
        top: 0; left: 0; right: 0; bottom: 0;
        z-index: -1;
        
        background-image: url('https://omegahomenetwork.wildapricot.org/resources/Site/Blue%20Background.png');
        background-size: cover;
        background-position: center center;
        background-repeat: no-repeat;
    }
}

/* ==========================================================================
   2. BUTTON STYLES (THEME DEFAULTS)
   ========================================================================== */

/* Button Style 1 */
a.stylizedButton.buttonStyle001 {
    background-color: {Button_styles-Style_1-Normal-Background_color};
    font-family: {Button_styles-Style_1-Normal-Font_family};
    font-size: {Button_styles-Style_1-Normal-Font_size};
    font-weight: {Button_styles-Style_1-Normal-Font_weight};
    font-style: {Button_styles-Style_1-Normal-Font_style};
    text-decoration: {Button_styles-Style_1-Normal-Text_decoration};
    color: {Button_styles-Style_1-Normal-Font_color};
    border-radius: 20px;
}
a.stylizedButton.buttonStyle001:hover {
    background-color: {Button_styles-Style_1-Hover-Background_color};
    font-family: {Button_styles-Style_1-Hover-Font_family};
    font-size: {Button_styles-Style_1-Hover-Font_size};
    font-weight: {Button_styles-Style_1-Hover-Font_weight};
    font-style: {Button_styles-Style_1-Hover-Font_style};
    text-decoration: {Button_styles-Style_1-Hover-Text_decoration};
    color: {Button_styles-Style_1-Hover-Font_color};
    border-radius: 20px;
}

/* Button Style 2 */
a.stylizedButton.buttonStyle002 {
    background-color: {Button_styles-Style_2-Normal-Background_color};
    font-family: {Button_styles-Style_2-Normal-Font_family};
    font-size: {Button_styles-Style_2-Normal-Font_size};
    font-weight: {Button_styles-Style_2-Normal-Font_weight};
    font-style: {Button_styles-Style_2-Normal-Font_style};
    text-decoration: {Button_styles-Style_2-Normal-Text_decoration};
    color: {Button_styles-Style_2-Normal-Font_color};
    border-radius: 20px;
}
a.stylizedButton.buttonStyle002:hover {
    background-color: {Button_styles-Style_2-Hover-Background_color};
    font-family: {Button_styles-Style_2-Hover-Font_family};
    font-size: {Button_styles-Style_2-Hover-Font_size};
    font-weight: {Button_styles-Style_2-Hover-Font_weight};
    font-style: {Button_styles-Style_2-Hover-Font_style};
    text-decoration: {Button_styles-Style_2-Hover-Text_decoration};
    color: {Button_styles-Style_2-Hover-Font_color};
    border-radius: 20px;
}

/* Button Style 3 */
a.stylizedButton.buttonStyle003 {
    background-color: {Button_styles-Style_3-Normal-Background_color};
    font-family: {Button_styles-Style_3-Normal-Font_family};
    font-size: {Button_styles-Style_3-Normal-Font_size};
    font-weight: {Button_styles-Style_3-Normal-Font_weight};
    font-style: {Button_styles-Style_3-Normal-Font_style};
    text-decoration: {Button_styles-Style_3-Normal-Text_decoration};
    color: {Button_styles-Style_3-Normal-Font_color};
    border-radius: 20px;
}
a.stylizedButton.buttonStyle003:hover {
    background-color: {Button_styles-Style_3-Hover-Background_color};
    font-family: {Button_styles-Style_3-Hover-Font_family};
    font-size: {Button_styles-Style_3-Hover-Font_size};
    font-weight: {Button_styles-Style_3-Hover-Font_weight};
    font-style: {Button_styles-Style_3-Hover-Font_style};
    text-decoration: {Button_styles-Style_3-Hover-Text_decoration};
    color: {Button_styles-Style_3-Hover-Font_color};
    border-radius: 20px;
}

/* ==========================================================================
   3. TEXT COLORS & LINKS
   ========================================================================== */

/* Group First Container - White Links */
.WaTemplateGadgetGroupFirst a,
.WaTemplateGadgetGroupFirst a:visited,
.WaTemplateGadgetGroupFirst a:hover,
.WaTemplateGadgetGroupFirst a:active {
    color: white !important;
}

/* Main Layout Container (Excluding Buttons) - White Links */
.WaLayoutContainer a:not(.stylizedButton),
.WaLayoutContainer a:visited:not(.stylizedButton),
.WaLayoutContainer a:hover:not(.stylizedButton),
.WaLayoutContainer a:active:not(.stylizedButton) {
    color: white !important;
}

/* Specific Gadget IDs - Force White Links */
#id_X8PvFV4 a,        /* Board of Directors Gadget */
#id_N2358a9 a,        /* Staff Gadget */
#id_cPLhXX5 a,        /* Phone Number TD */
#id_72iKP7m a,        /* Address TD */
#id_X8PvFV4 a:visited, #id_N2358a9 a:visited, #id_cPLhXX5 a:visited, #id_72iKP7m a:visited,
#id_X8PvFV4 a:hover,   #id_N2358a9 a:hover,   #id_cPLhXX5 a:hover,   #id_72iKP7m a:hover,
#id_X8PvFV4 a:active,  #id_N2358a9 a:active,  #id_cPLhXX5 a:active,  #id_72iKP7m a:active {
    color: white !important;
}

/* ==========================================================================
   4. HEADER & NAVIGATION LAYOUT
   ========================================================================== */

/* Custom Header Layout Styles */
.custom-header-container {
    display: flex;
    justify-content: space-between; /* Pushes logo Left, Buttons Right */
    align-items: center; /* Vertically centers them */
    width: 100%;
    flex-wrap: wrap; /* Allows stacking on small screens */
}

/* Force spacing between buttons */
.header-buttons a {
    margin-right: 20px !important; /* Pushes the next button away */
    margin-left: 0 !important;     /* Reset left margin to avoid conflicts */
    display: inline-block !important;
}

/* Remove the margin from the very last button so it aligns with the edge */
.header-buttons a:last-child {
    margin-right: 0 !important;
}

/* ==========================================================================
   5. FORUM LAYOUT & STYLING
   ========================================================================== */

/* Standardize border thickness and rounded corners */
.WaGadgetForumStateList {
    border: 5px solid #e6e6e6;
    border-radius: 15px !important; /* Rounded corners (1/2) */
    background-color: #ffffff;
    margin-bottom: 20px;
    padding: 0;
    overflow: hidden !important; /* Rounded corners (2/2) */
}

/* Standardize borders for Latest Updates gadget */
.WaGadgetLatestWidget,
.WaGadgetForumUpdates.gadgetStyle001 {
    border: 1px solid #C5C5C5 !important;
    border-radius: 5px !important;
    overflow: hidden !important;
}

/* Header Styling (Forum + Updates) */
.WaGadgetForumStateList h2,
.WaGadgetForumUpdates.gadgetStyle001 h2 {
    border-bottom: 1px solid #C5C5C5 !important;
    background-color: #F7F7F7;
    border-top-left-radius: 15px !important;
    border-top-right-radius: 15px !important;
    padding: 10px 15px;
    margin: 0;
}

/* Inner Padding Adjustments */
.WaGadgetForumStateList table.forumListTable {
    padding-left: 15px;
    padding-right: 15px;
}
.WaGadgetForumStateList .forumCategoryListOuterContainer {
    padding: 15px;
}
.WaGadgetForumStateList td:first-child {
    padding-left: 15px !important;
}
.forumCategoryTitle {
    background-color: #f2f2f2 !important;
    padding-left: 15px;
    padding-right: 15px;
}

/* Category Separation Lines */
.WaGadgetForumStateList .boxBodyOuterContainer {
    border-bottom: 1px solid #EAEAEA;
    margin-bottom: 20px;
}
.WaGadgetForumStateList .boxBodyOuterContainer:last-child {
    border-bottom: none;
    margin-bottom: 0;
}

/* Forum Typography */
.WaGadgetForumStateList h5 {
    font-size: 26px;
    font-weight: 600;
    margin-bottom: 0;
    color: #373737;
}

/* Rounded Profile Images in Forum */
.pictureContainer img {
    border-radius: 100%;
}

/* --- Forum Hiding Elements --- */

/* Hide 'Last message', 'Topics', and 'Replies' Columns & Headers */
.WaGadgetForumStateList .forumListTable td:nth-child(3),
.WaGadgetForumStateList .forumListTable td:nth-child(4),
.WaGadgetForumStateList .forumListTable td:nth-child(5),
.WaGadgetForumStateList h3:contains('Last message'),
.WaGadgetForumStateList h3:contains('Topics'),
.WaGadgetForumStateList h3:contains('Replies'),
.WaGadgetForumStateList .forumListTable th:nth-child(3),
.WaGadgetForumStateList .forumListTable th:nth-child(4),
.WaGadgetForumStateList .forumListTable th:nth-child(5) {
    display: none !important;
}

/* Hide Generic Table Headers & Headings */
.forumListHeaderTable th,
.forumListHeaderTable h1, .forumListHeaderTable h2, .forumListHeaderTable h3,
.forumListHeaderTable h4, .forumListHeaderTable h5, .forumListHeaderTable h6 {
    display: none !important;
}

/* Hide specific TD classes */
.forumListTD:not(.threadTD),
.pageStateIconTD {
    display: none !important;
}

/* ==========================================================================
   6. MEMBER PUBLIC PROFILE (CUSTOM REDESIGN)
   ========================================================================== */

/* Hide the original/default profile elements */
.WaGadgetMemberPublicProfile .back-link-container,
.WaGadgetMemberPublicProfile .navigation-container,
.WaGadgetMemberPublicProfile .fd-group-fields,
.WaGadgetMemberPublicProfile .member-details-box,
.WaGadgetMemberPublicProfile .entry-details,
.WaGadgetMemberPublicProfile > h1,
.WaGadgetMemberPublicProfile .profile-title {
    display: none !important;
}

/* Collapse the main container to prevent "flash" of unstyled content */
.WaGadgetMemberPublicProfile {
    opacity: 0;
    position: absolute;
    z-index: -9999;
    pointer-events: none;
    height: 0;
    overflow: hidden;
}

/* Styling for specific fields hidden individually */
.fieldBody h4 { display: none !important; }
#idContainer16769236 { display: none !important; } /* Organization Field */

/* Show and Style the NEW Custom Profile Container */
.custom-profile-container {
    opacity: 1 !important;
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
}

/* Optional: Style "Linked Members" section if it appears */
.WaGadgetMemberPublicProfile h3 {
    margin-top: 40px;
    font-size: 1.5rem;
    border-bottom: 2px solid #eee;
    padding-bottom: 10px;
}

/* ==========================================================================
   7. MISCELLANEOUS / SPECIFIC ID FIXES
   ========================================================================== */

/* Colored Topic Box (H5) - uses JS variable --topic-color */
#id_YTsgfu9 h5::before {
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-right: 8px;
    vertical-align: middle;
    border-radius: 2px;
    background-color: var(--topic-color, #1f4788);
}
#id_YTsgfu9 h5 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    display: flex !important;
    align-items: center !important;
}
#id_YTsgfu9 h5 + div {
    margin-bottom: 25px !important;
    min-height: 50px !important;
}

/* Removes hyperlink from individual members list*/
#id_JBl8GV5 a {
    pointer-events: none !important;
    cursor: default !important;
    text-decoration: none !important;
    color: inherit !important;
}

/* Change login name, password link, and logout link to white */
.WaGadgetLoginButton,
.WaGadgetLoginButton a,
.WaGadgetLoginButton span {
    color: #ffffff !important;
}

/* ==========================================================================
   8. MOBILE / RESPONSIVE STYLES
   ========================================================================== */

/* --- Tablet / Mobile Landscape (Max Width: 768px) --- */
@media only screen and (max-width: 768px) {
    
    /* Fix mobile menu background for specific items */
    .firstLevel,
    .firstLevel > a {
        background-color: #1f4788 !important; /* Dark Blue */
        color: #ffffff !important; /* White text to ensure contrast */
    }
    .firstLevel {
        border: none !important;
    }

    /* Make mobile menu button white */
    .menuButton {
        color: #ffffff !important;       /* Sets icon/text color to white */
        border-color: #ffffff !important; /* Sets border to white */
    }
    .menuButton span,
    .menuButton .fa {
        background-color: #ffffff !important;
        color: #ffffff !important;
    }

    /* Mobile Header Adjustments */
    .custom-header-container {
        display: block !important; /* Stack vertically */
        text-align: left !important; /* Force Left Align */
    }

    .header-logo {
        display: block;
        margin-bottom: 15px; /* Space below logo */
    }

    .header-buttons {
        display: block;
        width: 100%;
        text-align: left !important; /* Ensure buttons align left */
    }

    .header-buttons a {
        margin: 0 0 15px 0 !important; /* Adds space to bottom of each button */
        width: auto !important;        /* Fixes the size: only as wide as the text */
        display: inline-block !important;
    }
}

/* --- Mobile Only (Max Width: 767px) --- */
@media only screen and (max-width: 767px) {
    
    /* FORCE Mobile Map Resize */
    iframe[src*="google"], iframe[src*="maps"], iframe[title*="Map"] {
        height: 300px !important;
        max-height: 300px !important; /* Sets a hard ceiling */
        min-height: 0 !important;     /* Removes any minimum height blocks */
    }

    /* Fix for Forum List and Latest Sidebar */
    #id_YTsgfu9, #id_Y3HfGx5 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        display: block !important;
        box-sizing: border-box !important;
        float: none !important;
    }
}

/* --- Small Mobile (Max Width: 600px) --- */
@media only screen and (max-width: 600px) {
    
    /* Left Align Contact Info with Margin Reset (id_EoqjMvF) */
    #id_EoqjMvF,
    #id_EoqjMvF table,
    #id_EoqjMvF tbody,
    #id_EoqjMvF tr,
    #id_EoqjMvF td,
    #id_EoqjMvF div {
        display: block !important;
        width: 100% !important;
        text-align: left !important;
        box-sizing: border-box !important;
        float: none !important;
        margin-left: 0 !important; /* Key fix: Overrides the -50px margin */
        padding-left: 0 !important;
    }

    /* Specific fix for text paragraphs and spans (Address) */
    #id_EoqjMvF p,
    #id_EoqjMvF span {
        margin-left: 0 !important; /* Ensures address text starts at the edge */
        padding-left: 0 !important;
        white-space: normal !important;
        word-wrap: break-word !important;
        text-align: left !important;
    }

    /* Left align the Logo */
    #id_EoqjMvF img {
        display: block !important;
        margin: 10px 0 !important;
        float: none !important;
        max-width: 100% !important;
        height: auto !important;
    }

    /* Left align the Buttons */
    #id_EoqjMvF a,
    #id_EoqjMvF .stylizedButton {
        display: inline-block !important;
        margin: 5px 10px 5px 0 !important;
        float: none !important;
    }
}

/* Prevent horizontal scrolling on the entire site */
html, body {
    overflow-x: hidden !important;
    position: relative;
    width: 100%;
}

/* Ensure all images and tables stay within their containers */
img, table {
    max-width: 100% !important;
    height: auto !important;
}