/*
Theme Name:         CEC 6 Underscores Child Theme
Theme URI:          https://cec6.rklnyc.com
Description:        Tailored child theme for CEC6 utilizing branding from CEC6-logo-full.png.
Author:             CEC Web
Template:           cec6-parent-folder
Version:            1.2.0
Text Domain:        cec6
*/

/* Brand Palette derived directly from CEC6-logo-full.png */
:root {
    --cec-blue: #0B6BB5;           /* Primary Logo Blue */
    --cec-orange: #F05A28;         /* Accent Logo Orange */
    --cec-lighthouse-red: #D22630; /* Structural Accent Red */
    --cec-dark: #1C1C1C;           /* Contrast Text */
    --cec-light-bg: #F8FAFC;       /* Soft background wrap */
    --cec-border: #E2E8F0;
    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
/* Layout Layout Spacing Tokens */
    --space-xs: 0.5rem;   /* 8px */
    --space-sm: 1rem;     /* 16px */
    --space-md: 1.5rem;   /* 24px */
    --space-lg: 2rem;     /* 32px */
    --space-xl: 4rem;     /* 64px */
    
    /* Structural Constants */
    --max-width-content: 1200px;
    --border-radius-card: 6px;
    --box-shadow-smooth: 0 4px 12px rgba(0, 0, 0, 0.08);

}

body {
    font-family: var(--font-sans);
    color: var(--cec-dark);
    background-color: var(--cec-light-bg);
    line-height: 1.6;
    margin: 0;
}


.mb-0 .widget {
        margin: 0 0 0em;
}

.tribe-common--breakpoint-medium.tribe-events .tribe-events-l-container {
	padding-top:1em!important;
	padding-left: 0;
	padding-right: 0;
}

.siteorigin-header-wrapper .widget {
	margin: 0 0 0em;
}

#tribe-events, #tribe-events-pg-template, .tribe-events-pg-template {
	
}


.container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.25rem;
    box-sizing: border-box;
    background-color: #0770b9;
    color: #fff;
}

/* Three-Section Header Layout Engine */
.header-three-section-grid {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 1.5rem;
}

/* Left Section Typography */
.header-section-left .site-title a {
    display: block;
    font-size: 1.75rem;
    font-weight: 800;
    color: var(--cec-blue);
    line-height: 1.1;
    margin-bottom: 0.25rem;
}

.header-section-left .site-description {
    display: block;
    font-size: 0.85rem;
    font-weight: 600;
    color: #64748B;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Center Section Logo Element */
.header-section-center {
    text-align: center;
}

.header-brand-logo {
    max-height: 100px;
    width: auto;
    display: block;
    margin: 0 auto;
}

/*Website Name */
.header-title a {
    color:#fff;
    text-decoration: none;
}

.menu-navigation-container ul {
    display: flex;
    align-items: flex-end;
    gap: 0.5rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.menu-navigation-container ul#menu-navigation {
    flex-direction: column;
    /* Ensures the row items are centered horizontally on desktop */
    justify-content: center; 
    
    /* Ensures the items are centered vertically if the container has height */
    align-items: center; 
    
    /* Forces the flex container to take up full available width to allow centering */
    width: 100%;

}
.menu-navigation-container {
    color: var(--cec-dark);
    font-weight: 700;
    font-size: 1rem;
    text-decoration: none;
    padding: 0.25rem 0;
    transition: color 0.2s ease;
}

.menu-navigation-container a:hover,
.menu-navigation-container .current-menu-item > a {
    color: var(--cec-blue);
}

/* Base Footer Rule Styling */
.site-footer {
    background-color: var(--cec-dark);
    color: #ffffff;
    padding: 3rem 0;
    border-top: 6px solid var(--cec-orange);
}

.entry-header {
    text-align: center;
}

/* News Canvas Core Container */
.news-archive-canvas {
    background-color: #f8fafc;
}
.wrap {
    max-width: 1200px;
    margin: 0 auto;
}

/* Category Filter Bar */
.news-filter-navigation {
    margin-bottom: 2.5rem;
    border-bottom: 2px solid #e2e8f0;
    padding-bottom: 1rem;
}
.filter-buttons-group {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}
.filter-btn {
    display: inline-block;
    padding: 0.5rem 1.25rem;
    background-color: #ffffff;
    color: #475569;
    text-decoration: none;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    border: 1px solid #cbd5e1;
    transition: all 0.2s ease;
}
.filter-btn:hover,
.filter-btn.is-active {
    background-color: #0b6bbf; /* Matches your core blue theme branding color */
    color: #ffffff;
    border-color: #0b6bbf;
}

/* Fluid Flex/Grid Layout Layout Logic */
.news-posts-grid {
    display: grid;
    gap: 2rem;
    grid-template-columns: 1fr;
}
@media (min-width: 768px) {
    .news-posts-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (min-width: 1024px) {
    .news-posts-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Clean Typography Card Formatting */
.news-card-entry {
    background-color: #ffffff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03);
    display: flex;
    flex-direction: column;
}
.news-card-thumbnail {
    position: relative;
    height: 200px;
    overflow: hidden;
    background-color: #e2e8f0;
}
.news-card-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.fallback-gradient {
    background: linear-gradient(135deg, #0b6bbf 0%, #1e3a8a 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}
.fallback-tag {
    color: rgba(255, 255, 255, 0.85);
    font-weight: bold;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    font-size: 0.85rem;
}
.news-card-content {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.news-card-meta {
    font-size: 0.8rem;
    color: #64748b;
    margin-bottom: 0.5rem;
    display: flex;
    gap: 0.5rem;
}
.news-card-title {
    font-size: 1.25rem;
    line-height: 1.4;
    margin: 0 0 0.75rem 0;
}
.news-card-title a {
    color: #1e293b;
    text-decoration: none;
}
.news-card-title a:hover {
    color: #0b6bbf;
}
.news-card-excerpt {
    color: #475569;
    font-size: 0.95rem;
    line-height: 1.6;
    margin-bottom: 1.5rem;
}
.news-card-footer {
    margin-top: auto;
}
.news-read-more {
    color: #0b6bbf;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.9rem;
}
.news-read-more:hover {
    text-decoration: underline;
}

/* Archive Pagination Styling */
.news-pagination {
    margin-top: 3rem;
    text-align: center;
    display: flex;
    justify-content: center;
    gap: 0.5rem;
}
.news-pagination .page-numbers {
    padding: 0.5rem 1rem;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    color: #334155;
    text-decoration: none;
    border-radius: 4px;
}
.news-pagination .page-numbers.current {
    background: #0b6bbf;
    color: #ffffff;
    border-color: #0b6bbf;
}

/* ==========================================================================
   CEC6 Theme Header & Navigation Overhaul
   ========================================================================== */

/* Design Variables */
:root {
    --cec-blue: #0B6BB5;
    --cec-orange: #F05A28;
    --cec-white: #FFFFFF;
    --cec-font-stack: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* Base Header Container Styling */
.site-header {
    background-color: var(--cec-blue) !important; /* Forces background consistency from edited-image.png */
    padding: 0rem 2rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* Mobile-First Layout Flexbox Constraints */
.header-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 1200px;
    margin: 0 auto;
    gap: 1.5rem;
}

/* Site Branding / Typography Rules */
.site-branding {
    text-align: center;
}

.site-title-text {
    color: var(--cec-white) !important;
    font-family: var(--cec-font-stack);
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.2;
    margin: 0;
    letter-spacing: -0.01em;
}

.site-subtitle-text {
    color: rgba(255, 255, 255, 0.88) !important;
    font-family: var(--cec-font-stack);
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 1.2;
    margin: 0.2rem 0 0 0;
}

/* Central Emblem / Logo Alignment */
.site-logo-container {
    max-width: 150px;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.site-logo-container img {
    display: block;
    max-width: 100%;
    height: auto;
}

/* Primary Navigation Reset & Contrast Fixes */
.menu-navigation-container {
    width: 100%;
}

/* Strips default unstyled bullet listings seen in edited-image.png */
.menu-navigation-container ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.menu-navigation-container ul li {
    margin: 0 !important;
    padding: 0 !important;
    list-style-type: none !important;
}

/* Fixes contrast violation: updates dark purple links to accessible white */
.menu-navigation-container a {
    color: var(--cec-white) !important;
    text-decoration: none !important;
    font-family: var(--cec-font-stack);
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    padding: 0.5rem 0.25rem;
    display: inline-block;
    transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
    border-bottom: 2px solid transparent;
}

/* Interactive States: Utilizes the emblem's contrast accent orange */
.menu-navigation-container a:hover,
.menu-navigation-container .current-menu-item > a,
.menu-navigation-container .current_page_item > a {
    color: var(--cec-white) !important;
    border-bottom-color: var(--cec-orange) !important;
}

/* Fix for The Events Calendar views (List, Month, Day) */
.tribe-common-l-container {
    margin-top: 0 !important;
}

/* Fix if the main calendar page container has an extra default layout margin */
.post-type-archive-tribe_events #primary,
.post-type-archive-tribe_events .entry-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Ensure the header container doesn't force a large bottom margin */
.site-header, 
header[role="banner"] {
    margin-bottom: 0 !important;
}

.1mb-0 p {
    margin-bottom: 0!important;
    margin-top: 0!important;
}


/* ==========================================================================
   CEC6 Child Theme Style Enhancements (Fixes text stacking & layout)
   ========================================================================== */

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* About Layout / Subpage Cards Grid Structure */
.about-subpage-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    margin-top: 32px;
}

@media (min-width: 768px) {
    .about-subpage-grid {
        grid-template-columns: repeat(3, 1fr); /* Forms symmetrical horizontal cards side-by-side */
    }
}

/* Fix Visibility: Ensure links contrast beautifully and don't blend with dark layouts */
.about-card {
    background: #ffffff;
    border-radius: 6px;
    padding: 24px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    color: #333333; /* Dark slate reader text instead of blind invisible blue */
}

.about-card h3 a {
    color: #0056b3;
    text-decoration: none;
    font-size: 1.25rem;
}

.about-card h3 a:hover {
    text-decoration: underline;
}

.about-card__excerpt {
    color: #555555;
    font-size: 0.95rem;
    line-height: 1.5;
    margin: 12px 0 20px 0;
}

/* Minutes & Governance Structural Blocks */
.minutes-grid-container {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 24px;
}

@media (min-width: 600px) {
    .minutes-grid-container {
        grid-template-columns: repeat(2, 1fr);
    }
}

.minutes-archive-card {
    background: #fafafa;
    border-left: 4px solid #0056b3;
    padding: 20px;
    border-radius: 0 4px 4px 0;
}
.site-main {
padding-left: var(--space-md);
    padding-right: var(--space-md);
}

/* ==========================================================================
   Page Header & Title Spacing Corrections (Fix for image_70fafc.png)
   ========================================================================== */

/* 1. Adjust the structural container holding the title band */
.about-hub__header, 
.page-header {
    padding-top: var(--space-sm);
}

/* 2. Normalize the Title Typography Spacing */
.about-hub__title,
.page-header h1,
.site-main .About { /* Safeguard for your specific block mapping */
    color: #0770b9;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
    margin: 0;                /* Resets browser default h1 user-agent margins that cause unpredictable shifting */
    padding: 0;
}

/* 3. Tighten up the top margin of the card grid layout container */
.about-subpage-grid,
.layout-grid {
    margin-top: 0 !important;  /* Overrides any block framework container defaults causing the large bottom gap */
    padding-top: 8px;
}

/* ==========================================================================
   NYC Community Education Council Single Post & Event Styling
   ========================================================================== */

/* Universal Layout Container */
.cec-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    box-sizing: border-box;
}

/* Hero Header Design */
.cec-hero-header {
    background-color: #f4f6f8;
    border-left: 5px solid #002f6c; /* NYC Civic Blue */
    padding: 30px 25px;
    margin-bottom: 40px;
    border-radius: 4px;
}

.cec-hero-badge {
    display: inline-block;
    background-color: #002f6c;
    color: #ffffff;
    font-size: 0.75rem;
    text-transform: uppercase;
    font-weight: 700;
    padding: 4px 10px;
    letter-spacing: 1px;
    border-radius: 3px;
    margin-bottom: 12px;
}

.cec-entry-title {
    font-size: 2.25rem;
    color: #111111;
    margin: 0 0 10px 0;
    line-height: 1.2;
}

.cec-entry-meta {
    font-size: 0.9rem;
    color: #555555;
}
.cec-entry-meta span:not(:last-child)::after {
    content: "•";
    margin: 0 8px;
    color: #999999;
}

/* Mobile-First Layout: Stack content by default */
.cec-grid-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
}

/* Content Body */
.cec-featured-image {
    margin-bottom: 25px;
}
.cec-featured-image img {
    width: 100%;
    height: auto;
    border-radius: 4px;
    display: block;
}

.cec-entry-content {
    font-size: 1.125rem;
    line-height: 1.7;
    color: #333333;
}
.cec-entry-content p {
    margin-bottom: 1.5rem;
}

/* Sidebar & Custom Component Cards */
.cec-sidebar-area {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.cec-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 24px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.02);
}

.cec-action-card {
    border-top: 4px solid #d97706; /* Notice/Alert Amber */
    background-color: #fffbeb;
}

.cec-card-title {
    font-size: 1.4rem;
    margin: 0 0 8px 0;
    color: #1e293b;
}

.cec-card-lead {
    font-size: 0.95rem;
    color: #475569;
    margin-bottom: 20px;
}

.cec-card-sub-title {
    font-size: 1.1rem;
    margin: 0 0 10px 0;
    color: #334155;
}

.cec-info-card {
    background-color: #f8fafc;
    font-size: 0.9rem;
    line-height: 1.5;
    color: #64748b;
}

/* Functional Data Buttons */
.cec-action-buttons {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cec-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 20px;
    font-weight: 600;
    font-size: 1rem;
    border-radius: 4px;
    text-decoration: none;
    transition: background-color 0.2s ease, transform 0.1s ease;
    text-align: center;
    cursor: pointer;
}

.cec-btn .dashicons {
    margin-right: 8px;
    font-size: 1.2rem;
    width: auto;
    height: auto;
}

.cec-btn-primary {
    background-color: #002f6c;
    color: #ffffff !important;
}
.cec-btn-primary:hover {
    background-color: #001f4d;
}

.cec-btn-secondary {
    background-color: #10b981; /* Success Green for Complete Minutes */
    color: #ffffff !important;
}
.cec-btn-secondary:hover {
    background-color: #059669;
}

.cec-btn-outline {
    background-color: transparent;
    color: #002f6c !important;
    border: 2px solid #002f6c;
}
.cec-btn-outline:hover {
    background-color: rgba(0, 47, 108, 0.05);
}

.cec-status-notice {
    display: flex;
    align-items: center;
    background: #f1f5f9;
    padding: 12px;
    border-radius: 4px;
    color: #64748b;
    font-size: 0.9rem;
    border: 1px dashed #cbd5e1;
}
.cec-status-notice .dashicons {
    margin-right: 8px;
}

/* Post Pagination Footer */
.cec-entry-footer {
    margin-top: 50px;
    padding-top: 20px;
    border-top: 1px solid #e2e8f0;
}
.cec-entry-footer .nav-links {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}
.cec-entry-footer a {
    color: #002f6c;
    text-decoration: none;
    font-weight: 500;
}
.cec-entry-footer a:hover {
    text-decoration: underline;
}


.cec-meta-grid {
                    display: grid;
                    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
                    gap: 2rem;
                    font-size: 14px;
                    line-height: 1.5;
                    color: #2d3748;
                }
                @media (min-width: 992px) {
                    .cec-meta-grid {
                        grid-template-columns: 1fr 1fr 1.2fr 1.5fr;
                    }
                }
                .cec-meta-heading {
                    font-size: 13px;
                    font-weight: 700;
                    letter-spacing: 0.05em;
                    text-transform: uppercase;
                    margin: 0 0 1.25rem 0 !important;
                    color: #1a202c !important;
                    border: none !important;
                    padding: 0 !important;
                }
                .cec-meta-col p {
                    margin-bottom: 0.75rem;
                }
                .cec-meta-col a {
                    color: #0056b3;
                    text-decoration: underline;
                }
                .cec-meta-col a:hover {
                    text-decoration: none;
                }
                .cec-meta-map iframe {
                    border-radius: 6px;
                    border: 1px solid #e2e8f0;
                    max-width: 100%;
                }
                /* Clean styling patch for the Add To Calendar elements */
                .cec-calendar-actions .tribe-events-button, 
                .cec-calendar-actions .tribe-compatibility-container a {
                    display: inline-block;
                    background: #fff !important;
                    border: 1px solid #0056b3 !important;
                    color: #0056b3 !important;
                    padding: 8px 16px !important;
                    border-radius: 4px !important;
                    text-decoration: none !important;
                    font-weight: 600 !important;
                    font-size: 14px !important;
                    transition: all 0.2s ease-in-out;
                }
                .cec-calendar-actions .tribe-events-button:hover {
                    background: #0056b3 !important;
                    color: #fff !important;
                }

/* ==========================================================================
   CEC Breadcrumbs Component (Mobile-First)
   ========================================================================== */

.cec-breadcrumbs {
    padding-left: var(--space-md);
    padding-right: var(--space-md);
    padding-top: .5em;
    padding-bottom: .5em;
    background-color: #f8f9fa;
    border-radius: 4px;
}

.breadcrumb-list {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 0.875rem; /* 14px */
    line-height: 1.4;
}

.breadcrumb-item {
    display: inline-flex;
    align-items: center;
    color: #4a5568;
}

/* Accessible Separators */
.breadcrumb-item + .breadcrumb-item::before {
    content: "/";
    padding: 0 0.5rem;
    color: #a0aec0;
}

.breadcrumb-item a {
    color: #0056b3; /* High contrast accessible blue */
    text-decoration: none;
    transition: text-decoration 0.2s ease;
}

.breadcrumb-item a:hover,
.breadcrumb-item a:focus {
    text-decoration: underline;
}

.breadcrumb-item.active {
    color: #2d3748;
    font-weight: 500;
}

/* Mobile Adjustments for long titles */
@media (max-width: 480px) {
    .breadcrumb-list {
        font-size: 0.8rem;
    }
    /* Allows items to stack elegantly on very tiny viewports */
    .breadcrumb-item {
        margin-bottom: 0.25rem;
    }
}

/* ==========================================================================
   Responsive Breakpoints (Desktop Layout Enhancements)
   ========================================================================== */
@media (min-width: 768px) {
    .cec-grid-layout {
        grid-template-columns: 2fr 1fr; /* Sidebar shifts to right side */
        gap: 40px;
    }
    
    .cec-hero-header {
        padding: 40px 45px;
    }

    .cec-entry-title {
        font-size: 2.75rem;
    }
}

/* ==========================================================================
   Desktop Grid Breakpoint (Widths 768px and up)
   ========================================================================== */
@media (min-width: 768px) {
    .header-container {
        gap: 0;
    }

    /* Left Grid Core */
    .site-branding {
        text-align: left;
        flex: 1;
    }

    /* Center Grid Core */
    .site-logo-container {
        flex: 0 0 auto;
        margin: 0 2rem;
        max-width: 160px;
    }

    /* Right Grid Core */
    .menu-navigation-container {
        flex: 1;
        display: flex;
        justify-content: flex-end;
    }

    .menu-navigation-container ul {
        gap: 1.75rem;
    }
}

/* Mobile-First Responsive Breakpoint Collapse */
@media (max-width: 768px) {
    .header-three-section-grid {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 1.5rem;
    }
    
    .header-section-center {
        order: -1; /* Pushes Logo to absolute top on narrow mobile screens */
    }
    
    .header-section-right {
        justify-content: center;
    }
    
    .menu-navigation-container ul {
        align-items: center;
        gap: 0.75rem;
    }
}