/**
 * creSEndO Theme - Main Styles (Non-Critical)
 *
 * This file is loaded asynchronously after critical.css
 * Contains: animations, hover effects, footer, responsive details
 */

/* ========================================
   Enhanced Typography
   ======================================== */
.wp-block-post-content p,
.wp-block-post-content li {
    max-width: var(--wp--custom--content-width, 65ch);
}

/* Focus visible for keyboard users */
:focus-visible {
    outline: 2px solid var(--wp--preset--color--primary, #f59e0b);
    outline-offset: 2px;
}

/* ========================================
   Navigation Enhancements
   ======================================== */
.wp-block-navigation .wp-block-navigation-item__content:hover {
    color: var(--wp--preset--color--primary, #f59e0b);
}

/* ========================================
   Post Meta
   ======================================== */
.wp-block-post-date,
.wp-block-post-author-name {
    font-size: var(--wp--preset--font-size--small, 0.875rem);
}

/* ========================================
   Author Box
   ======================================== */
.author-box {
    transition: box-shadow 0.2s ease;
}

.author-box:hover {
    box-shadow: var(--wp--custom--shadow--md, 0 4px 6px rgba(0,0,0,0.07));
}

.wp-block-avatar img {
    border-radius: var(--wp--custom--border-radius--full, 9999px);
}

/* ========================================
   Footer Contact
   ======================================== */
.crescendo-footer-contact {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    font-size: var(--wp--preset--font-size--small, 0.875rem);
    color: var(--wp--preset--color--muted, #64748b);
}

.crescendo-footer-contact > div {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

.crescendo-footer-contact .contact-icon {
    flex-shrink: 0;
    margin-top: 2px;
    opacity: 0.7;
}

.crescendo-footer-contact a {
    color: inherit;
    text-decoration: none;
    transition: color 0.15s ease;
}

.crescendo-footer-contact a:hover {
    color: var(--wp--preset--color--primary, #f59e0b);
}

.crescendo-contact-placeholder {
    font-size: var(--wp--preset--font-size--small, 0.875rem);
    color: var(--wp--preset--color--muted, #64748b);
}

.crescendo-contact-placeholder a {
    color: var(--wp--preset--color--primary, #f59e0b);
}

/* ========================================
   Query & Pagination
   ======================================== */
.wp-block-query-pagination {
    margin-top: var(--wp--preset--spacing--50, 2.5rem);
}

.wp-block-query-pagination a {
    padding: 0.5rem 1rem;
    border-radius: var(--wp--custom--border-radius--sm, 4px);
    transition: background-color 0.15s ease;
}

.wp-block-query-pagination a:hover {
    background-color: var(--wp--preset--color--surface, #f8fafc);
}

/* ========================================
   Site Header - Desktop/Mobile Layout
   ======================================== */
.site-header {
    position: relative;
}

.site-header__inner {
    padding: 1rem 0;
}

/* Desktop Header */
.site-header__desktop {
    display: flex;
    align-items: center;
    gap: 2rem;
    padding: 1rem 0;
}

/* Force buttons to be inline on desktop header */
.site-header__desktop .wp-block-buttons,
.site-header__desktop .wp-block-buttons.is-layout-flex,
.site-header__desktop .wp-block-buttons.wp-block-buttons-is-layout-flex {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 0.5rem !important;
    align-items: center !important;
}

.site-header__desktop .wp-block-button,
.site-header__desktop .wp-block-buttons .wp-block-button {
    margin: 0 !important;
    flex: 0 0 auto !important;
}

.site-header__brand {
    flex-shrink: 0;
}

.site-header__brand .wp-block-site-title {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 800;
    letter-spacing: -0.025em;
}

.site-header__brand .wp-block-site-title a {
    text-decoration: none;
}

.site-header__brand .wp-block-site-title a:hover {
    opacity: 0.9;
}

.site-header__nav {
    flex: 1;
    display: flex;
    justify-content: center;
}

.site-header__nav .wp-block-navigation,
.site-header__nav .wp-block-navigation__container,
.site-header__nav ul,
.site-header__nav ol {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 2rem !important;
    justify-content: center !important;
    align-items: center !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.site-header__nav .wp-block-navigation-item,
.site-header__nav li {
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
}

.site-header__nav .wp-block-navigation-item__content,
.site-header__nav a {
    white-space: nowrap !important;
}

.site-header__nav .wp-block-navigation-item__content {
    font-weight: 500;
    transition: color 0.15s ease;
}

.site-header__nav .wp-block-navigation-item__content:hover {
    color: var(--wp--preset--color--primary, #f59e0b);
}

.site-header__cta {
    flex-shrink: 0;
}

.site-header__cta .wp-block-buttons {
    gap: 0.75rem;
}

/* CTA Buttons Style */
.btn-register .wp-block-button__link,
.btn-register-mobile .wp-block-button__link {
    background: var(--wp--preset--color--primary, #f59e0b);
    color: #000;
    font-weight: 600;
    border: none;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.btn-register .wp-block-button__link:hover,
.btn-register-mobile .wp-block-button__link:hover {
    transform: translateY(-1px);
    background: var(--wp--preset--color--primary-hover, #d97706);
    box-shadow: 0 4px 12px rgba(245, 158, 11, 0.4);
}

.btn-login .wp-block-button__link,
.btn-login-mobile .wp-block-button__link {
    background: transparent;
    color: var(--wp--preset--color--dark-foreground, #f1f5f9);
    font-weight: 600;
    border: 1px solid var(--wp--preset--color--dark-border, #334155);
    transition: background 0.15s ease, transform 0.15s ease, border-color 0.15s ease;
}

.btn-login .wp-block-button__link:hover,
.btn-login-mobile .wp-block-button__link:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: var(--wp--preset--color--primary, #f59e0b);
    color: var(--wp--preset--color--primary, #f59e0b);
    transform: translateY(-1px);
}

/* Mobile Header - Hidden by default */
.site-header__mobile {
    display: none;
    align-items: center;
    justify-content: space-between;
    padding: 0.625rem 1rem;
    width: 100%;
    box-sizing: border-box;
}

.site-header__mobile-menu {
    flex-shrink: 0;
}

.site-header__mobile-menu .wp-block-navigation__responsive-container-open {
    padding: 0.5rem;
    border-radius: 6px;
}

.site-header__mobile-brand {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0; /* Allow shrinking */
}

.site-header__mobile-brand .wp-block-site-title {
    margin: 0;
    font-size: 1rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.site-header__mobile-cta,
.site-header__mobile-actions {
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

.site-header__mobile-cta .wp-block-buttons,
.site-header__mobile-actions .wp-block-buttons {
    display: flex;
    gap: 0.375rem;
    flex-wrap: nowrap;
}

.site-header__mobile-cta .wp-block-button__link,
.site-header__mobile-actions .wp-block-button__link {
    font-size: 0.75rem;
    padding: 0.375rem 0.625rem;
    white-space: nowrap;
    min-width: 60px;
    text-align: center;
}

/* Theme Toggle in Header */
.site-header__toggle {
    display: flex;
    align-items: center;
    justify-content: center;
}

.site-header__toggle .theme-toggle-container {
    display: flex;
    align-items: center;
}

/* Desktop toggle - show only on desktop */
.site-header__toggle--desktop {
    display: none;
}

/* Mobile toggle - show only on mobile */
.site-header__toggle--mobile {
    display: flex;
}

@media (min-width: 783px) {
    .site-header__toggle--desktop {
        display: flex;
    }
    .site-header__toggle--mobile {
        display: none;
    }
}

@media (max-width: 782px) {
    .site-header__toggle--desktop {
        display: none !important;
    }
    .site-header__toggle--mobile {
        display: flex;
        margin-right: 0.5rem;
    }
    
    .site-header__toggle--mobile .theme-toggle {
        width: 32px;
        height: 32px;
    }
    
    .site-header__toggle--mobile .theme-toggle svg {
        width: 16px;
        height: 16px;
    }
}

/* Gradient Line */
.site-header__gradient-line {
    height: 3px;
    background: linear-gradient(90deg, 
        var(--wp--preset--color--primary, #f59e0b) 0%, 
        var(--wp--preset--color--accent, #dc2626) 50%, 
        var(--wp--preset--color--secondary, #1e3a5f) 100%
    );
    margin: 0;
    padding: 0 !important;
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
}

/* Desktop: Show desktop, hide mobile */
@media (min-width: 783px) {
    .site-header__desktop {
        display: flex;
    }
    .site-header__mobile {
        display: none !important;
    }
}

/* Mobile: Show mobile, hide desktop */
@media (max-width: 782px) {
    .site-header__desktop {
        display: none !important;
    }
    .site-header__mobile {
        display: flex;
    }
    .site-header__gradient-line {
        height: 2px;
    }
}

/* Dark mode header styles */
.dark-mode .site-header {
    background-color: var(--wp--preset--color--dark-background, #0f172a);
}

.dark-mode .site-header__nav .wp-block-navigation-item__content {
    color: var(--wp--preset--color--dark-foreground, #f1f5f9);
}

.dark-mode .btn-login .wp-block-button__link,
.dark-mode .btn-login-mobile .wp-block-button__link {
    background: rgba(245, 158, 11, 0.1);
    border-color: var(--wp--preset--color--dark-border, #334155);
}

/* Auto dark mode header */
@media (prefers-color-scheme: dark) {
    .auto-mode .site-header,
    :root:not(.light-mode):not(.dark-mode) .site-header {
        background-color: var(--wp--preset--color--dark-background, #0f172a);
    }
    
    .auto-mode .site-header__nav .wp-block-navigation-item__content,
    :root:not(.light-mode):not(.dark-mode) .site-header__nav .wp-block-navigation-item__content {
        color: var(--wp--preset--color--dark-foreground, #f1f5f9);
    }
}

/* Light mode header - explicit */
.light-mode .site-header {
    background-color: var(--wp--preset--color--background, #ffffff);
}

.light-mode .site-header__brand .wp-block-site-title a {
    color: var(--wp--preset--color--primary, #f59e0b);
}

/* ========================================
   Header Variants
   ======================================== */

/* Minimal Header */
.site-header--minimal {
    border-bottom: 1px solid var(--wp--preset--color--border, #e2e8f0);
}

/* Transparent Header */
.site-header--transparent {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    background: transparent;
}

.site-header--transparent .wp-block-navigation-item__content {
    color: rgba(255, 255, 255, 0.9);
}

.site-header--transparent .wp-block-navigation-item__content:hover {
    color: #ffffff;
}

/* Simple Footer */
.site-footer--simple {
    border-top: 1px solid var(--wp--preset--color--border, #e2e8f0);
}

.site-footer--simple a {
    text-decoration: none;
}

.site-footer--simple a:hover {
    text-decoration: underline;
}

/* Dark mode variants */
.dark-mode .site-header--minimal {
    border-color: var(--wp--preset--color--dark-border, #334155);
}

.dark-mode .site-footer--simple {
    border-color: var(--wp--preset--color--dark-border, #334155);
}

/* ========================================
   Site Header Enhancements (Legacy)
   ======================================== */
.site-header__brand .wp-block-site-title a:hover {
    color: var(--wp--preset--color--primary, #f59e0b);
}

/* ========================================
   Site Footer
   ======================================== */
.site-footer {
    background-color: var(--wp--preset--color--surface, #f8fafc);
    border-top: 1px solid var(--wp--preset--color--border, #e2e8f0);
}

.site-footer a {
    color: var(--wp--preset--color--foreground, #1e293b);
    text-decoration: none;
    transition: color 0.15s ease;
}

.site-footer a:hover {
    color: var(--wp--preset--color--primary, #f59e0b);
    text-decoration: underline;
}

.footer-columns {
    gap: 2rem;
}

.footer-column h4,
.footer-column .wp-block-heading {
    font-size: var(--wp--preset--font-size--medium, 1rem);
    font-weight: 600;
    margin-bottom: 1rem;
    color: var(--wp--preset--color--foreground, #1e293b);
}

.footer-nav .wp-block-navigation__container {
    flex-direction: column;
    gap: 0.5rem;
}

.footer-nav .wp-block-navigation-item__content {
    padding: 0.25rem 0;
    font-size: var(--wp--preset--font-size--small, 0.875rem);
}

.footer-contact {
    font-size: var(--wp--preset--font-size--small, 0.875rem);
    line-height: 1.8;
}

.footer-contact-item {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.footer-contact-item svg,
.footer-contact-item img {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    margin-top: 3px;
    opacity: 0.7;
}

.footer-bottom {
    border-top: 1px solid var(--wp--preset--color--border, #e2e8f0);
    font-size: var(--wp--preset--font-size--small, 0.875rem);
    color: var(--wp--preset--color--muted, #64748b);
}

.footer-bottom a {
    color: var(--wp--preset--color--muted, #64748b);
}

.footer-bottom a:hover {
    color: var(--wp--preset--color--primary, #f59e0b);
}

.footer-legal {
    gap: 1.5rem;
}

.footer-legal a {
    font-size: var(--wp--preset--font-size--small, 0.875rem);
}

.footer-social .wp-block-social-links {
    gap: 0.5rem;
}

.footer-social .wp-social-link {
    width: 36px;
    height: 36px;
}

/* ========================================
   Mobile Navigation
   ======================================== */
.wp-block-navigation__responsive-container-open {
    border-radius: var(--wp--custom--border-radius--sm, 4px);
    transition: background-color 0.15s ease;
}

.wp-block-navigation__responsive-container-open:hover {
    background-color: var(--wp--preset--color--surface, #f8fafc);
}

.wp-block-navigation__responsive-container.is-menu-open {
    background-color: var(--wp--preset--color--background, #fff);
    padding: var(--wp--preset--spacing--40, 2rem);
}

.wp-block-navigation__responsive-container-close {
    position: absolute;
    top: var(--wp--preset--spacing--30, 1.5rem);
    right: var(--wp--preset--spacing--30, 1.5rem);
    padding: 0.5rem;
    border-radius: var(--wp--custom--border-radius--sm, 4px);
    transition: background-color 0.15s ease;
}

.wp-block-navigation__responsive-container-close:hover {
    background-color: var(--wp--preset--color--surface, #f8fafc);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
    gap: 0;
    padding-top: var(--wp--preset--spacing--50, 2.5rem);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
    width: 100%;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
    display: block;
    padding: var(--wp--preset--spacing--30, 1.5rem) 0;
    border-bottom: 1px solid var(--wp--preset--color--border, #e2e8f0);
    font-size: var(--wp--preset--font-size--large, 1.25rem);
    transition: color 0.15s ease;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover {
    color: var(--wp--preset--color--primary, #f59e0b);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
    padding-left: var(--wp--preset--spacing--40, 2rem);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
    font-size: var(--wp--preset--font-size--medium, 1rem);
    color: var(--wp--preset--color--muted, #64748b);
}

/* ========================================
   Mobile Bottom Navigation - Styles
   ======================================== */

/* Hover and active states */
.mobile-nav-link:hover,
.mobile-nav-link:active,
.mobile-nav-link.is-active {
    color: var(--wp--preset--color--primary, #f59e0b);
    text-decoration: none;
}

/* Transition for smooth hover */
.mobile-nav-link {
    transition: color 0.15s ease;
    -webkit-tap-highlight-color: transparent;
}

/* SVG stroke width */
.mobile-nav-link svg {
    stroke-width: 1.5;
}

/* Custom icon specific styles */
.mobile-nav-icon-custom {
    border-radius: 4px;
}

/* ========================================
   Responsive - Mobile
   ======================================== */
@media (max-width: 782px) {
    .wp-block-query .wp-block-group[style*="flex"] {
        flex-direction: column;
    }

    .wp-block-post-featured-image[style*="width"] {
        width: 100% !important;
        margin-right: 0 !important;
        margin-bottom: var(--wp--preset--spacing--20, 1rem);
    }

    .footer-columns {
        flex-direction: column;
    }

    .footer-bottom {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
    }

    .footer-legal {
        justify-content: center;
    }

    /* Ensure footer doesn't get hidden by mobile nav */
    .site-footer {
        padding-bottom: calc(var(--wp--preset--spacing--40, 2rem) + 64px);
    }
}

/* ========================================
   Theme Toggle Button
   ======================================== */
.theme-toggle-container {
    display: flex;
    align-items: center;
    margin-left: auto;
}

.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: var(--wp--custom--border-radius--md, 6px);
    background: transparent;
    color: var(--wp--preset--color--muted, #64748b);
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
    -webkit-tap-highlight-color: transparent;
}

.theme-toggle:hover {
    background-color: var(--wp--preset--color--surface, #f8fafc);
    color: var(--wp--preset--color--foreground, #1e293b);
}

.theme-toggle:active {
    transform: scale(0.95);
}

.theme-toggle:focus-visible {
    outline: 2px solid var(--wp--preset--color--primary, #f59e0b);
    outline-offset: 2px;
}

.theme-toggle svg {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

/* Mode indicators */
.theme-toggle[data-mode="auto"] {
    color: var(--wp--preset--color--muted, #64748b);
}

.theme-toggle[data-mode="light"] {
    color: #f59e0b; /* Amber/sun color */
}

.theme-toggle[data-mode="dark"] {
    color: #6366f1; /* Indigo/moon color */
}

/* Theme transition */
.theme-transition,
.theme-transition *,
.theme-transition *::before,
.theme-transition *::after {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease !important;
}

/* ========================================
   Dark Mode - Manual (.dark-mode class)
   ======================================== */
.dark-mode {
    --wp--preset--color--foreground: var(--wp--preset--color--dark-foreground, #f1f5f9);
    --wp--preset--color--background: var(--wp--preset--color--dark-background, #0f172a);
    --wp--preset--color--muted: var(--wp--preset--color--dark-muted, #94a3b8);
    --wp--preset--color--surface: var(--wp--preset--color--dark-surface, #1e293b);
    --wp--preset--color--border: var(--wp--preset--color--dark-border, #334155);
}

.dark-mode body,
.dark-mode .editor-styles-wrapper {
    background-color: var(--wp--preset--color--dark-background, #0f172a);
    color: var(--wp--preset--color--dark-foreground, #f1f5f9);
}

.dark-mode .author-box:hover {
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}

.dark-mode .site-footer {
    background-color: var(--wp--preset--color--dark-surface, #1e293b);
    border-top-color: var(--wp--preset--color--dark-border, #334155);
}

.dark-mode .footer-bottom {
    border-top-color: var(--wp--preset--color--dark-border, #334155);
}

.dark-mode .theme-toggle:hover {
    background-color: var(--wp--preset--color--dark-surface, #1e293b);
    color: var(--wp--preset--color--dark-foreground, #f1f5f9);
}

/* Mobile Bottom Nav - Manual Dark Mode */
.dark-mode .mobile-bottom-nav {
    background: var(--wp--preset--color--dark-background, #0f172a);
    border-top-color: var(--wp--preset--color--dark-border, #334155);
}

.dark-mode .mobile-nav-link {
    color: var(--wp--preset--color--dark-muted, #94a3b8);
}

.dark-mode .mobile-nav-link:hover,
.dark-mode .mobile-nav-link:active,
.dark-mode .mobile-nav-link.is-active {
    color: var(--wp--preset--color--primary, #f59e0b);
}

/* Navigation menu dark mode */
.dark-mode .wp-block-navigation__responsive-container.is-menu-open {
    background-color: var(--wp--preset--color--dark-background, #0f172a);
}

.dark-mode .wp-block-navigation__responsive-container-open:hover,
.dark-mode .wp-block-navigation__responsive-container-close:hover {
    background-color: var(--wp--preset--color--dark-surface, #1e293b);
}

.dark-mode .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
    border-bottom-color: var(--wp--preset--color--dark-border, #334155);
}

.dark-mode .wp-block-query-pagination a:hover {
    background-color: var(--wp--preset--color--dark-surface, #1e293b);
}

/* ========================================
   Dark Mode - Auto (prefers-color-scheme)
   For .auto-mode class, use media query
   ======================================== */
@media (prefers-color-scheme: dark) {
    .auto-mode,
    :root:not(.light-mode):not(.dark-mode) {
        --wp--preset--color--foreground: var(--wp--preset--color--dark-foreground, #f1f5f9);
        --wp--preset--color--background: var(--wp--preset--color--dark-background, #0f172a);
        --wp--preset--color--muted: var(--wp--preset--color--dark-muted, #94a3b8);
        --wp--preset--color--surface: var(--wp--preset--color--dark-surface, #1e293b);
        --wp--preset--color--border: var(--wp--preset--color--dark-border, #334155);
    }

    .auto-mode body,
    :root:not(.light-mode):not(.dark-mode) body {
        background-color: var(--wp--preset--color--dark-background, #0f172a);
        color: var(--wp--preset--color--dark-foreground, #f1f5f9);
    }

    .auto-mode .author-box:hover,
    :root:not(.light-mode):not(.dark-mode) .author-box:hover {
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
    }

    .auto-mode .site-footer,
    :root:not(.light-mode):not(.dark-mode) .site-footer {
        background-color: var(--wp--preset--color--dark-surface, #1e293b);
        border-top-color: var(--wp--preset--color--dark-border, #334155);
    }

    .auto-mode .theme-toggle:hover,
    :root:not(.light-mode):not(.dark-mode) .theme-toggle:hover {
        background-color: var(--wp--preset--color--dark-surface, #1e293b);
        color: var(--wp--preset--color--dark-foreground, #f1f5f9);
    }

    /* Mobile Bottom Nav - Auto Dark Mode */
    .auto-mode .mobile-bottom-nav,
    :root:not(.light-mode):not(.dark-mode) .mobile-bottom-nav {
        background: var(--wp--preset--color--dark-background, #0f172a);
        border-top-color: var(--wp--preset--color--dark-border, #334155);
    }

    .auto-mode .mobile-nav-link,
    :root:not(.light-mode):not(.dark-mode) .mobile-nav-link {
        color: var(--wp--preset--color--dark-muted, #94a3b8);
    }

    .auto-mode .mobile-nav-link:hover,
    .auto-mode .mobile-nav-link:active,
    .auto-mode .mobile-nav-link.is-active,
    :root:not(.light-mode):not(.dark-mode) .mobile-nav-link:hover,
    :root:not(.light-mode):not(.dark-mode) .mobile-nav-link:active,
    :root:not(.light-mode):not(.dark-mode) .mobile-nav-link.is-active {
        color: var(--wp--preset--color--primary, #f59e0b);
    }

    /* Navigation dark mode auto */
    .auto-mode .wp-block-navigation__responsive-container.is-menu-open,
    :root:not(.light-mode):not(.dark-mode) .wp-block-navigation__responsive-container.is-menu-open {
        background-color: var(--wp--preset--color--dark-background, #0f172a);
    }

    .auto-mode .wp-block-navigation__responsive-container-open:hover,
    .auto-mode .wp-block-navigation__responsive-container-close:hover,
    :root:not(.light-mode):not(.dark-mode) .wp-block-navigation__responsive-container-open:hover,
    :root:not(.light-mode):not(.dark-mode) .wp-block-navigation__responsive-container-close:hover {
        background-color: var(--wp--preset--color--dark-surface, #1e293b);
    }
}

/* ========================================
   Light Mode - Explicit (.light-mode class)
   Force light mode even in dark system
   ======================================== */
.light-mode {
    --wp--preset--color--foreground: #1e293b;
    --wp--preset--color--background: #ffffff;
    --wp--preset--color--muted: #64748b;
    --wp--preset--color--surface: #f8fafc;
    --wp--preset--color--border: #e2e8f0;
}

.light-mode body {
    background-color: #ffffff;
    color: #1e293b;
}

.light-mode .site-footer {
    background-color: #f8fafc;
    border-top-color: #e2e8f0;
}

.light-mode .mobile-bottom-nav {
    background: #ffffff;
    border-top-color: #e2e8f0;
}

.light-mode .mobile-nav-link {
    color: #64748b;
}

/* ========================================
   Niche Header Patterns
   ======================================== */
.site-header--niche {
    position: relative;
    z-index: 100;
}

.site-header--niche .site-header__actions {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 0.75rem;
}

.site-header--niche .site-header__actions .wp-block-buttons,
.site-header .site-header__actions .wp-block-buttons,
.site-header__desktop .wp-block-buttons {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 0.5rem !important;
    align-items: center !important;
}

.site-header--niche .site-header__mobile-actions {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 0.375rem;
    flex-shrink: 0;
}

.site-header--niche .site-header__mobile-actions .wp-block-buttons {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 0.375rem !important;
}

/* Mobile header layout for niche variant */
.site-header--niche .site-header__mobile {
    justify-content: space-between !important;
    padding: 0.5rem 0.75rem !important;
}

.site-header--niche .site-header__mobile-brand {
    flex: 0 1 auto !important;
    max-width: 50% !important;
}

/* Equal size CTA buttons */
.site-header--niche .btn-register .wp-block-button__link,
.site-header--niche .btn-login .wp-block-button__link {
    min-width: 100px;
    text-align: center;
    padding: 0.625rem 1.25rem !important;
}

.site-header--niche .btn-register-mobile .wp-block-button__link,
.site-header--niche .btn-login-mobile .wp-block-button__link {
    min-width: 72px;
    text-align: center;
    padding: 0.375rem 0.625rem !important;
    font-size: 0.75rem !important;
    white-space: nowrap;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

/* Force equal button widths on mobile */
@media (max-width: 782px) {
    .site-header--niche .btn-register-mobile,
    .site-header--niche .btn-login-mobile {
        flex: 0 0 auto;
    }
    
    .site-header--niche .btn-register-mobile .wp-block-button__link,
    .site-header--niche .btn-login-mobile .wp-block-button__link {
        min-width: 68px;
        padding: 0.3rem 0.5rem !important;
        font-size: 0.75rem !important;
    }
}

/* Force hide desktop header on mobile for niche header */
@media (max-width: 782px) {
    .site-header--niche .site-header__desktop {
        display: none !important;
        visibility: hidden !important;
        position: absolute !important;
        left: -9999px !important;
        pointer-events: none !important;
    }
    
    .site-header--niche .site-header__mobile {
        display: flex !important;
        width: 100% !important;
    }
    
    /* Prevent vertical text overflow */
    .site-header--niche .wp-block-button__link {
        writing-mode: horizontal-tb !important;
        text-orientation: mixed !important;
        white-space: nowrap !important;
    }
}

/* Age Badge spacing in header */
.site-header--niche .crescendo-age-badge {
    margin-right: 0.25rem;
}

/* Sticky header variant */
/* Apply sticky to parent HEADER element in FSE */
header:has(.site-header--sticky) {
    position: sticky !important;
    position: -webkit-sticky !important;
    top: 0 !important;
    z-index: 9999 !important;
}

.site-header--sticky,
.site-header--niche.site-header--sticky {
    z-index: 9999 !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    background: rgba(15, 23, 42, 0.98) !important;
}

/* Desktop-only nav in sticky */
.site-header__nav--desktop-only {
    display: none;
}

@media (min-width: 783px) {
    .site-header__nav--desktop-only {
        display: flex;
    }
}

/* Thin gradient line for sticky */
.site-header__gradient-line--thin {
    height: 2px;
}

/* ========================================
   Niche Footer Patterns
   ======================================== */
.site-footer--niche {
    position: relative;
}

/* Niche footer - dark text on dark bg */
.site-footer--niche .footer-column a,
.site-footer--niche .footer-legal a {
    color: var(--wp--preset--color--dark-muted, #94a3b8);
    text-decoration: none;
    transition: color 0.15s ease;
}

.site-footer--niche .footer-column a:hover,
.site-footer--niche .footer-legal a:hover,
.site-footer--niche .footer-legal-links a:hover,
.site-footer--niche .footer-minimal-links a:hover {
    color: var(--wp--preset--color--primary, #f59e0b);
}

/* Footer legal links spacing */
.footer-legal-links,
.footer-minimal-links {
    gap: 0.5rem 1rem;
}

.footer-legal-links p,
.footer-minimal-links p {
    margin: 0;
}

/* Payment methods in footer */
.site-footer--niche .crescendo-payment-methods {
    margin-top: 1rem;
}

/* Footer responsible section special styling for dark bg */
.site-footer--niche .crescendo-footer-responsible {
    background: rgba(251, 191, 36, 0.08);
}

/* Mobile view adjustments for niche footer */
@media (max-width: 782px) {
    .site-footer--niche .footer-columns {
        flex-direction: column;
        gap: 2rem;
    }
    
    .site-footer--niche .footer-column {
        flex-basis: 100% !important;
    }
    
    .site-footer--niche .footer-bottom {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }
    
    .site-footer--niche .footer-legal,
    .site-footer--niche .footer-legal-links,
    .site-footer--niche .footer-minimal-links {
        justify-content: center;
        text-align: center;
    }
    
    .site-footer--legal .footer-legal-columns {
        flex-direction: column;
        gap: 1.5rem;
    }
    
    .site-footer--legal .footer-legal-columns > .wp-block-column {
        flex-basis: 100% !important;
    }
}

/* ========================================
   Print Styles
   ======================================== */
@media print {
    .wp-block-navigation,
    .wp-block-comments,
    .wp-block-social-links,
    .wp-block-buttons,
    .site-footer,
    .mobile-bottom-nav {
        display: none !important;
    }

    body {
        font-size: 12pt;
        color: #000;
        background: #fff;
    }

    a[href]::after {
        content: " (" attr(href) ")";
    }

    .wp-block-post-featured-image {
        max-width: 50%;
    }

    /* Override dark mode for print */
    :root {
        --wp--preset--color--foreground: #1e293b;
        --wp--preset--color--background: #ffffff;
    }
}

/* ========================================
   Content Notice
   ======================================== */
.crescendo-disclosure {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    margin-bottom: 1.5rem;
    background: var(--wp--preset--color--surface, #f8fafc);
    border: 1px solid var(--wp--preset--color--border, #e2e8f0);
    border-left: 3px solid var(--wp--preset--color--primary, #f59e0b);
    border-radius: var(--wp--custom--border-radius--md, 6px);
    font-size: 0.8125rem;
    color: var(--wp--preset--color--muted, #64748b);
    line-height: 1.5;
}

.crescendo-disclosure__icon {
    flex-shrink: 0;
    font-size: 1rem;
}

.crescendo-disclosure a {
    color: var(--wp--preset--color--primary, #f59e0b);
    text-decoration: underline;
}

@media (prefers-color-scheme: dark) {
    .crescendo-disclosure {
        background: var(--wp--preset--color--dark-surface, #1e293b);
        border-color: var(--wp--preset--color--dark-border, #334155);
        color: var(--wp--preset--color--dark-muted, #94a3b8);
    }
}

.dark-mode .crescendo-disclosure {
    background: var(--wp--preset--color--dark-surface, #1e293b);
    border-color: var(--wp--preset--color--dark-border, #334155);
    color: var(--wp--preset--color--dark-muted, #94a3b8);
}