/*
Theme Name: Fluent Community Theme
Theme URI: https://fluentcommunityaddons.com/
Author: Fluent Community Add-ons
Author URI: https://fluentcommunityaddons.com/
Description: A theme designed to integrate standard WordPress pages with the FluentCommunity header and sidebar.
Version: 1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: fluentcommunity-theme
Tags: fluentcommunity
*/

/* Basic Layout Styling */
body {
    margin: 0;
    padding: 0;
    font-family: sans-serif; /* Add a default font */

    /* Define fallback FluentCommunity color variables */
    /* These might be overridden by FC JS, but provide a base */
    --fcom-secondary-bg: #f0f2f5;
    --fcom-primary-text: #697386;
    /* Add other key variables used by FC CSS if needed */
}

.fc-mimic-container {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.fc-mimic-header {
    /* Styles for the header area - FluentCommunity's action will inject content here */
    /* Add border or background if needed for visual separation */
    /* border-bottom: 1px solid #eee; */
}

.fc-mimic-main-layout {
    display: flex;
    flex-grow: 1; 
}

.fc-mimic-sidebar {
    /* Styles for the sidebar area - FluentCommunity's action injects content */
    width: 250px; /* Adjust width as needed */
    /* border-right: 1px solid #eee; */
    /* Add background or padding if desired */
    background-color: #f8f9fa; /* Light background similar to the example */
    padding: 15px;
    box-sizing: border-box;
}

.fc-mimic-content {
    /* Styles for the main content area where WP page content goes */
    flex-grow: 1; /* Takes remaining horizontal space */
    padding: 20px;
    box-sizing: border-box;
}

.fc-mimic-content .entry-title {
    /* Style the WordPress page title if needed */
    margin-top: 0;
    font-size: 1.8em;
    margin-bottom: 20px;
}

/* Add other necessary styles */

/* --- FluentCommunity Integration Overrides --- */

/* Target the main container holding the WP page content within the FC structure */
.fluent_com .feed_layout .fcom_wp_page {
    flex-grow: 1; /* Allow this container to grow */
    width: auto; /* Override potential fixed widths */
    min-width: 0; /* Necessary for flex items to shrink properly if needed */

    /* Make this container scrollable below the header */
    overflow-y: auto;
    height: calc(100vh - var(--fcom-header-height, 55px)); /* Calculate height based on viewport and FC header */
}

/* Target the main content element within our WP page container */
.fcom_wp_page .el-main.fcom_main {
    /* Let this be a simple block container */
    width: 100%; /* Take full width of parent */
    box-sizing: border-box; /* Keep box-sizing */
    /* Padding and background handled by parent (.fhr_content_layout_body) via Customizer */
}

/* Apply scroll behavior to the content body container, BELOW the sticky header */
/* --- REVERTING THIS BLOCK --- */
/*
.fcom_wp_page .fhr_content_layout_body {
    overflow-y: auto; 
    height: calc(100vh - var(--fcom-header-height, 55px) - 50px); 
}
*/

/* Ensure sticky page header has a background */
/* --- REVERTING THIS BLOCK --- */
/*
.fcom_wp_page .fhr_content_layout_header.fcom_sticky_header {
    background-color: var(--fcom-secondary-bg, #f0f2f5); 
}
*/

/* Force the <a> tag within the WP Page title h1 to inherit color */
.fcom_wp_page .fhr_content_layout_header h1.fcom_page_title a {
    color: inherit;
}

/* Ensure the direct content wrapper takes full width too */
.fcom_wp_page .feed_texts.feed_md_content {
    width: 100%; 
    max-width: 100%; /* Ensure it doesn't exceed parent */
}

/* Make the flex container for sidebar+content behave */
.fluent_com .feed_layout {
    display: flex !important;
    flex-wrap: nowrap !important;
}

/* Ensure the WP page container itself can grow (REMOVE scroll/height from here) - REVERTED */
.fluent_com .feed_layout .fcom_wp_page {
    flex: 1 1 auto !important; /* Let it grow */
    min-width: 0 !important; /* Allow shrinking */
    width: auto !important; /* Override fixed width */

    /* REMOVE scroll behavior from the entire column - REVERTED */
    /* overflow-y: auto; */
    /* height: calc(100vh - var(--fcom-header-height, 55px)); */ 
}

/* You might need further overrides depending on specific content */
.fcom_wp_page .feed_texts.feed_md_content p,
.fcom_wp_page .feed_texts.feed_md_content h1,
.fcom_wp_page .feed_texts.feed_md_content h2,
.fcom_wp_page .feed_texts.feed_md_content h3 {
    /* Example: Override max-width on text elements if needed */
    /* max-width: none; */
}

/* Force Elementor/WP content text color in dark mode */
html.dark .fcom_wp_page .feed_texts.feed_md_content,
html.dark .fcom_wp_page .feed_texts.feed_md_content p,
html.dark .fcom_wp_page .feed_texts.feed_md_content li,
html.dark .fcom_wp_page .feed_texts.feed_md_content h1,
html.dark .fcom_wp_page .feed_texts.feed_md_content h2,
html.dark .fcom_wp_page .feed_texts.feed_md_content h3,
html.dark .fcom_wp_page .feed_texts.feed_md_content h4,
html.dark .fcom_wp_page .feed_texts.feed_md_content h5,
html.dark .fcom_wp_page .feed_texts.feed_md_content h6 {
    color: var(--fcom-primary-text) !important; /* Use FC variable and !important to override Elementor */
}

/* Set up the main content layout containers */
.fcom_wp_page .fhr_content_layout > div {
    /* This div directly inside .fhr_content_layout needs height */
    /* REMOVE height: 100%; */ 
}
.fcom_wp_page .fhr_content_layout > div > div {
    /* This is the container for header+body, make it flex column */
    display: flex;
    flex-direction: column;
    height: 100%; /* ADD BACK: Explicit height for flex container */ 
}

.fcom_wp_page .fhr_content_layout_header.fcom_sticky_header {
    /* Header should not grow/shrink */
    flex-shrink: 0;
    /* Ensure background for sticky effect - Use primary BG like main header/sidebar */
     background-color: var(--fcom-primary-bg, #ffffff); /* CHANGED to primary bg */
     /* Add default padding if needed, FC might provide this */
     padding: 15px 25px; /* Example padding */
     box-sizing: border-box;
     position: sticky; /* Make it sticky */
     top: 0; /* Stick to the top of its scroll container */
     z-index: 10; /* Ensure it's above scrolling content */
}

/* Make the content body grow and scroll */
.fcom_wp_page .fhr_content_layout_body {
    flex-grow: 1; /* Take remaining vertical space */
    overflow-y: auto; /* Allow vertical scroll */
    min-height: 0; /* Important for flex item scrolling */
    /* REMOVE calculated height */
    /* height: calc(100vh - var(--fcom-header-height, 55px) - 50px); */ 
    /* Customizer styles (padding, background, max-width) are applied here */
}

/* Remove excess top margin added by core FC styles */
.fcom_wp_page .fhr_content_layout_body .el-main.fcom_main {
    /* Targeting the inner main container where padding is applied by customizer */
    /* Fluent original rule might apply margin to .fhr_content_layout_body */
    /* Let's try removing margin from the inner container first */
    margin-top: 0 !important; 
}
/* If the above doesn't work, try targeting the element you mentioned: */
/* .fcom_wp_page .fhr_content_layout .fhr_content_layout_body { margin-top: 0 !important; } */

/* Override the specific FC rule causing excess top margin */
.fcom_wp_page .feeds.fcom_single_layout .fhr_content_layout .fhr_content_layout_body {
    /* margin-top: 0 !important; */ /* REPLACED with full margin override */
    margin: 0 !important; /* Override top/bottom margin */
}

/* --- Basic Styles for Standard WP Views --- */

/* Only apply these when NOT using the FC template */
body.wp-standard-view {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    line-height: 1.6;
    color: #333; /* Default text color, can be overridden */
    background-color: var(--fcom-secondary-bg, #f9f9f9); /* Use FC secondary or fallback */
    padding: 0;
    margin: 0;
    /* Ensure body uses the variables set on .fcom_top_menu for inheritance if needed */
}

/* Remove the standard container centering */
/*
.wp-standard-view .site-header,
.wp-standard-view .site-content,
.wp-standard-view .site-footer .site-info {
    max-width: 1100px; 
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
    box-sizing: border-box;
}
*/

/* Remove standard header specific styles - handled by FC mimic */
/*
.wp-standard-view .site-header {
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
    margin-bottom: 30px;
    background-color: #fff;
}
.wp-standard-view .site-branding .site-title {
    margin: 0;
    font-size: 1.8em;
}
.wp-standard-view .site-branding .site-title a {
    color: #000;
    text-decoration: none;
}
.wp-standard-view .site-description {
    margin: 5px 0 0 0;
    color: #777;
    font-size: 0.9em;
}
.wp-standard-view .custom-logo-link img {
    max-height: 60px; 
    width: auto;
}
*/

/* Styles for the new FC header structure */
/* --- Scope these styles to only apply on standard WP pages --- */
body.wp-standard-view .fcom_top_menu {
    padding: 0 20px; /* Remove top/bottom padding, control height with height/line-height */
    height: 55px; /* Set specific height */
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--fcom-primary-bg, white); /* Use Customizer variable */
    margin-bottom: 0;
    position: sticky;
    top: 0;
    z-index: 99;
    border-bottom: 1px solid var(--fcom-primary-border, #e3e8ee); /* Use Customizer variable */
    flex-wrap: nowrap; /* Prevent wrapping on smaller screens if possible */
    box-sizing: border-box;
}

/* Ensure left/right sections are flex containers */
body.wp-standard-view .fcom_top_menu .top_menu_left,
body.wp-standard-view .fcom_top_menu .top_menu_right {
    display: flex;
    align-items: center;
    gap: 15px; /* Spacing between items */
}

body.wp-standard-view .fcom_top_menu .fhr_logo {
    display: flex; /* Align logo and title */
    align-items: center;
    gap: 10px;
}

body.wp-standard-view .fcom_top_menu .fhr_logo img,
body.wp-standard-view .fcom_top_menu .fhr_logo .custom-logo-link img {
    max-height: calc(55px - 20px); /* Calculate max height based on header height minus padding */
    width: auto;
    display: block; /* Prevent extra space below img */
}
body.wp-standard-view .fcom_top_menu .fhr_logo .standard-site-title {
    margin: 0;
    font-size: 1.2em; /* Adjust site title size */
    line-height: 1;
}
body.wp-standard-view .fcom_top_menu .fhr_logo .standard-site-title a {
    color: var(--fcom-menu-text, #65676B); /* Use menu text color */
    text-decoration: none;
    font-weight: bold;
}


body.wp-standard-view .fcom_top_menu .top_menu_center {
    /* Allow center section to take up available space */
    flex-grow: 1;
    display: flex;
    justify-content: center; /* Center the nav */
}

body.wp-standard-view .fcom_top_menu .top_menu_center .fcom_header_menu {
    display: flex;
    justify-content: center;
    gap: 4px;
    padding: 0;
    margin: 0;
    list-style-type: none;
}

body.wp-standard-view .fcom_top_menu .top_menu_center .fcom_header_menu li {
    margin: 0;
    padding: 0;
    display: flex; /* Align items vertically center */
    align-items: center;
}

body.wp-standard-view .fcom_top_menu .top_menu_center .fcom_header_menu li a {
    display: flex; /* Use flex for icon + text */
    align-items: center;
    gap: 8px; /* Space between icon and text */
    padding: 6px 12px; /* Adjust padding for 55px height */
    text-decoration: none;
    color: var(--fcom-menu-text, #65676B); /* Use Customizer variable */
    border-radius: 6px;
    transition: background-color 0.2s ease, color 0.2s ease;
    font-weight: 500;
    /* Ensure vertical centering if line-height isn't enough */
    line-height: normal; /* Reset line-height if needed */
}

body.wp-standard-view .fcom_top_menu .top_menu_center .fcom_header_menu li a:hover,
body.wp-standard-view .fcom_top_menu .top_menu_center .fcom_header_menu li.current-menu-item > a,
body.wp-standard-view .fcom_top_menu .top_menu_center .fcom_header_menu li.current-menu-ancestor > a {
    color: var(--fcom-menu-text-hover, #1877F2); /* Use Customizer variable */
    background-color: var(--fcom-menu-bg-hover, #E7F3FF); /* Use Customizer variable */
}

/* Style menu item icons if used (requires walker or manual markup) */
body.wp-standard-view .fcom_top_menu .top_menu_center .fcom_header_menu li a .el-icon svg {
    width: 18px; /* Adjust icon size */
    height: 18px;
    fill: currentColor;
    vertical-align: middle; /* Align icon better */
}

/* User actions section */
body.wp-standard-view .fcom_top_menu .top_menu_right .fcom_user_context_menu_items {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px; /* Space between user action items */
    height: 100%; /* Make ul take full height for alignment */
}

/* Remove styles for elements that were deleted */
/*
body.wp-standard-view .fcom_top_menu .top_menu_right .standard-login-item .fcom_profile_menu {
    display: flex;
    align-items: center;
    gap: 8px;
}

body.wp-standard-view .fcom_top_menu .top_menu_right .standard-login-item .user_avatar img {
    width: 32px;
    height: 32px;
    border-radius: 50%;
}

body.wp-standard-view .fcom_top_menu .top_menu_right .standard-login-item .user_name {
    font-weight: 500;
    color: var(--fcom-menu-text, #65676B);
}

body.wp-standard-view .fcom_top_menu .top_menu_right .standard-login-item a {
    color: var(--fcom-menu-text, #65676B);
    text-decoration: none;
    display: inline-flex; 
    align-items: center;
}
body.wp-standard-view .fcom_top_menu .top_menu_right .standard-login-item a:hover {
    color: var(--fcom-menu-text-hover, #1877F2);
}
*/

/* --- End Scope --- */

/* Basic content styling for standard view */
.wp-standard-view .site-main {
    /* Basic padding for content when no max-width is set */
    padding: 30px 20px;
}

.wp-standard-view #primary {
    /* This is where the max-width from Customizer is applied */
    box-sizing: border-box;
}

.wp-standard-view .entry-header {
    margin-bottom: 20px;
}
.wp-standard-view .entry-title {
    font-size: 2em; /* Adjust title size */
    margin: 0;
}

.wp-standard-view .entry-content h1,
.wp-standard-view .entry-content h2,
.wp-standard-view .entry-content h3,
.wp-standard-view .entry-content h4,
.wp_standard-view .entry-content h5,
.wp_standard-view .entry-content h6 {
    margin-top: 1.5em;
    margin-bottom: 0.5em;
}

.wp-standard-view .entry-content p {
    margin-bottom: 1em;
}
.wp-standard-view .entry-content ul,
.wp-standard-view .entry-content ol {
    margin-bottom: 1em;
    padding-left: 1.5em;
}
.wp-standard-view .entry-content img {
    max-width: 100%;
    height: auto;
    margin: 1em 0;
}

/* Alignment classes */
.wp-standard-view .aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.wp-standard-view .alignleft {
    float: left;
    margin-right: 1.5em;
    margin-bottom: 1em;
}
.wp-standard-view .alignright {
    float: right;
    margin-left: 1.5em;
    margin-bottom: 1em;
}

/* Basic Footer */
.wp-standard-view .site-footer {
    margin-top: 40px;
    padding: 20px 0;
    border-top: 1px solid #eee;
    font-size: 0.9em;
    color: #777;
    text-align: center;
}
.wp-standard-view .site-footer .site-info {
    /* Re-add centering specifically for footer info if desired */
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
}

.wp-standard-view .site-footer a {
    color: #555;
    text-decoration: none;
}
.wp-standard-view .site-footer a:hover {
    text-decoration: underline;
}

/* Screen Reader Text */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}