/* =========================================================
   Futurix Site Dark Mode
========================================================= */

:root {
    color-scheme: light;
    --fxdm-bg: #f4f8fb;
    --fxdm-surface: #ffffff;
    --fxdm-surface-2: #eef5f8;
    --fxdm-text: #102033;
    --fxdm-muted: #6b7c8f;
    --fxdm-border: #dce8ef;
    --fxdm-accent: #22c7d9;
    --fxdm-shadow: 0 16px 40px rgba(18, 58, 90, 0.08);
}

html.fx-global-dark {
    color-scheme: dark;
    --fxdm-bg: #07111f;
    --fxdm-surface: #0e1b2a;
    --fxdm-surface-2: #12263a;
    --fxdm-text: #edf5fa;
    --fxdm-muted: #98a9b9;
    --fxdm-border: #203a4d;
    --fxdm-accent: #4de3ff;
    --fxdm-shadow: 0 18px 48px rgba(0, 0, 0, 0.28);
}

.fx-global-dark-toggle-source {
    display: none;
}

.fx-global-dark-toggle {
    appearance: none;
    -webkit-appearance: none;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 14px;
    outline: none;
    background:
        linear-gradient(
            135deg,
            rgba(255, 255, 255, 0.15),
            rgba(255, 255, 255, 0.06)
        );
    color: #ffffff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
    cursor: pointer;
    transition:
        transform 0.2s ease,
        background 0.2s ease,
        border-color 0.2s ease;
}

.fx-global-dark-toggle:hover {
    transform: translateY(-1px);
    border-color: rgba(77, 227, 255, 0.45);
}

.fx-global-dark-toggle:focus-visible {
    outline: 3px solid rgba(77, 227, 255, 0.28);
    outline-offset: 3px;
}

.fx-global-dark-toggle__sun,
.fx-global-dark-toggle__moon {
    position: absolute;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition:
        opacity 0.22s ease,
        transform 0.22s ease;
}

.fx-global-dark-toggle__sun {
    opacity: 1;
    transform: scale(1) rotate(0deg);
}

.fx-global-dark-toggle__moon {
    opacity: 0;
    transform: scale(0.7) rotate(-18deg);
}

html.fx-global-dark .fx-global-dark-toggle__sun {
    opacity: 0;
    transform: scale(0.7) rotate(18deg);
}

html.fx-global-dark .fx-global-dark-toggle__moon {
    opacity: 1;
    transform: scale(1) rotate(0deg);
}

.fx-global-dark-toggle svg {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.fx-global-dark-toggle-fallback {
    position: fixed;
    left: 18px;
    bottom: calc(18px + env(safe-area-inset-bottom));
    z-index: 1000011;
}

.fx-global-dark-toggle-fallback .fx-global-dark-toggle {
    background: #123a5a;
    box-shadow: 0 12px 30px rgba(2, 35, 52, 0.24);
}

/* Global surfaces */
html.fx-global-dark body,
html.fx-global-dark #page,
html.fx-global-dark .site,
html.fx-global-dark .site-content,
html.fx-global-dark main,
html.fx-global-dark .elementor,
html.fx-global-dark .elementor-section-wrap {
    background-color: var(--fxdm-bg) !important;
    color: var(--fxdm-text) !important;
}

/* Common containers */
html.fx-global-dark :is(
    article,
    aside,
    section,
    .widget,
    .card,
    .post,
    .page,
    .entry-content,
    .sidebar-area,
    .elementor-widget-container
) {
    border-color: var(--fxdm-border);
}

/* Common light surfaces */
html.fx-global-dark :is(
    .fcl-wrap,
    .fx-page-section,
    .futurix-light-news-block,
    .fx-topic-card,
    .fxew-topic-card,
    .fxew-latest,
    .fx-side-card,
    .widget,
    .sidebar-area,
    .comment-body,
    .woocommerce div.product,
    .woocommerce-page div.product
) {
    background-color: var(--fxdm-bg) !important;
    color: var(--fxdm-text) !important;
    border-color: var(--fxdm-border) !important;
}

/* White cards and inner surfaces */
html.fx-global-dark :is(
    .fcl-news-item,
    .fcl-side-box,
    .fcl-newsletter,
    .fx-news-item,
    .fx-side-card,
    .fx-topic,
    .fxew-topic-card,
    .fxew-latest,
    .head_card_box,
    .futurix-card,
    .elementor-widget-container,
    .woocommerce table.shop_table,
    .woocommerce form.checkout,
    .woocommerce-cart-form
) {
    color: var(--fxdm-text);
    border-color: var(--fxdm-border) !important;
}

/* Typography */
html.fx-global-dark :is(
    h1, h2, h3, h4, h5, h6,
    p, li, label, legend,
    .entry-title,
    .widget-title,
    .fx-title,
    .fx-side-text,
    .fcl-title,
    .fcl-news-title,
    .fcl-side-title
) {
    color: var(--fxdm-text) !important;
}

html.fx-global-dark :is(
    .fx-excerpt,
    .fx-date,
    .fcl-news-excerpt,
    .fcl-muted,
    .entry-meta,
    .post-meta,
    small
) {
    color: var(--fxdm-muted) !important;
}

/* Links */
html.fx-global-dark a:not(
    .fx-header a,
    .fx-mobile-menu a,
    .fx-search-panel a,
    .button,
    .btn
) {
    color: var(--fxdm-text);
}

html.fx-global-dark a:hover {
    color: var(--fxdm-accent);
}

/* Inputs */
html.fx-global-dark :is(
    input,
    textarea,
    select
) {
    background-color: var(--fxdm-surface) !important;
    color: var(--fxdm-text) !important;
    border-color: var(--fxdm-border) !important;
}

html.fx-global-dark :is(
    input,
    textarea
)::placeholder {
    color: var(--fxdm-muted) !important;
}

/* Tables */
html.fx-global-dark table,
html.fx-global-dark th,
html.fx-global-dark td {
    color: var(--fxdm-text) !important;
    border-color: var(--fxdm-border) !important;
}

/* Preserve media */
html.fx-global-dark img,
html.fx-global-dark video,
html.fx-global-dark iframe,
html.fx-global-dark svg {
    filter: none;
}

/* Preserve the existing dark/glass header design */
html.fx-global-dark .fx-header,
html.fx-global-dark .fx-header__bar,
html.fx-global-dark .fx-mobile-menu__panel,
html.fx-global-dark .fx-search-panel__box {
    color: #ffffff !important;
}

/* Elementor common backgrounds */
html.fx-global-dark .elementor-section:not(
    .elementor-section[data-settings*="background_background"]
),
html.fx-global-dark .e-con:not(
    [data-settings*="background_background"]
) {
    background-color: transparent;
}

/* Scrollbar */
html.fx-global-dark {
    scrollbar-color: #345064 #07111f;
}

html.fx-global-dark ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

html.fx-global-dark ::-webkit-scrollbar-track {
    background: #07111f;
}

html.fx-global-dark ::-webkit-scrollbar-thumb {
    background: #345064;
    border: 2px solid #07111f;
    border-radius: 999px;
}

@media (max-width: 880px) {
    .fx-global-dark-toggle {
        width: 40px;
        height: 40px;
        border-radius: 12px;
    }

    .fx-global-dark-toggle svg {
        width: 19px;
        height: 19px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .fx-global-dark-toggle,
    .fx-global-dark-toggle__sun,
    .fx-global-dark-toggle__moon {
        transition: none !important;
    }
}


/* =========================================================
   Futurix v1.1 — strong overrides for shortcode/Elementor UI
   These selectors intentionally use !important because several
   Futurix shortcodes print inline style blocks after plugin CSS.
========================================================= */

html.fx-global-dark,
html.fx-global-dark body {
    background: #07111f !important;
    color: #edf5fa !important;
}

/* Futurix AJAX news section from functions.php */
html.fx-global-dark .fx-page-section,
html.fx-global-dark .fx-page-section.fx-theme-light,
html.fx-global-dark .fx-page-section.fx-theme-dark {
    --fx-bg: #07111f !important;
    --fx-surface: #0e1b2a !important;
    --fx-surface-2: #12263a !important;
    --fx-text: #edf5fa !important;
    --fx-muted: #98a9b9 !important;
    --fx-soft: #15334a !important;
    --fx-border: #203a4d !important;
    --fx-accent: #4de3ff !important;
    --fx-accent-2: #3ddc97 !important;
    --fx-navy: #edf5fa !important;
    --fx-shadow: 0 22px 55px rgba(0, 0, 0, .32) !important;
    background: #07111f !important;
    color: #edf5fa !important;
}

html.fx-global-dark .fx-page-section .fx-page-inner,
html.fx-global-dark .fx-page-section .fx-main-grid,
html.fx-global-dark .fx-page-section .fx-news-column,
html.fx-global-dark .fx-page-section .fx-side-column {
    background: transparent !important;
    color: #edf5fa !important;
}

html.fx-global-dark .fx-page-section .fx-news-item {
    background: transparent !important;
    color: #edf5fa !important;
    border-color: #203a4d !important;
}

html.fx-global-dark .fx-page-section .fx-side-card {
    background: #0e1b2a !important;
    color: #edf5fa !important;
    border-color: #203a4d !important;
    box-shadow: 0 22px 55px rgba(0,0,0,.26) !important;
}

html.fx-global-dark .fx-page-section :is(
    h2,
    h3,
    .fx-title,
    .fx-title a,
    .fx-side-head span,
    .fx-side-text,
    .fx-side-item
) {
    color: #edf5fa !important;
}

html.fx-global-dark .fx-page-section :is(
    .fx-excerpt,
    .fx-date,
    .fx-side-head small
) {
    color: #98a9b9 !important;
}

html.fx-global-dark .fx-page-section .fx-cat,
html.fx-global-dark .fx-page-section .fx-side-dot,
html.fx-global-dark .fx-page-section .fx-kicker {
    color: #4de3ff !important;
    border-color: rgba(77,227,255,.38) !important;
}

/* Claude/FCL section */
html.fx-global-dark .fcl-wrap {
    --fcl-bg: #07111f !important;
    --fcl-surface: #0e1b2a !important;
    --fcl-surface-2: #12263a !important;
    --fcl-text: #edf5fa !important;
    --fcl-muted: #98a9b9 !important;
    --fcl-primary: #4de3ff !important;
    --fcl-accent: #4de3ff !important;
    --fcl-accent-2: #3ddc97 !important;
    --fcl-border: #203a4d !important;
    --fcl-hover: #123247 !important;
    --fcl-shadow: 0 24px 70px rgba(0,0,0,.25) !important;
    --fcl-card-shadow: 0 18px 45px rgba(0,0,0,.18) !important;
    --fcl-glow: 0 18px 60px rgba(0,212,230,.16) !important;
    background: #07111f !important;
    color: #edf5fa !important;
}

html.fx-global-dark .fcl-wrap :is(
    .fcl-news-item,
    .fcl-side-box,
    .fcl-newsletter
) {
    background: #0e1b2a !important;
    border-color: #203a4d !important;
    color: #edf5fa !important;
}

html.fx-global-dark .fcl-wrap :is(
    h1,h2,h3,h4,h5,h6,
    .fcl-title,
    .fcl-news-title,
    .fcl-side-title,
    a
) {
    color: #edf5fa !important;
}

html.fx-global-dark .fcl-wrap :is(
    p,
    small,
    .fcl-news-excerpt,
    .fcl-meta
) {
    color: #98a9b9 !important;
}

/* Elementor and common theme areas */
html.fx-global-dark :is(
    .elementor,
    .elementor-section,
    .elementor-container,
    .elementor-column-wrap,
    .elementor-widget-wrap,
    .e-con,
    .e-con-inner,
    .site-content,
    .content-area,
    .main-content,
    #content
) {
    color: #edf5fa;
}

html.fx-global-dark :is(
    .elementor-widget-text-editor,
    .elementor-widget-heading,
    .entry-content,
    .post-content
) :is(h1,h2,h3,h4,h5,h6,p,li,span) {
    color: inherit;
}

/* Form and WooCommerce safety */
html.fx-global-dark :is(
    input,
    textarea,
    select,
    option
) {
    background: #0e1b2a !important;
    color: #edf5fa !important;
    border-color: #203a4d !important;
}

html.fx-global-dark :is(
    .woocommerce,
    .woocommerce-page
) :is(
    table,
    th,
    td,
    form,
    .cart_totals,
    .woocommerce-checkout-review-order
) {
    background-color: transparent;
    color: #edf5fa !important;
    border-color: #203a4d !important;
}

/* Keep images natural */
html.fx-global-dark img,
html.fx-global-dark picture,
html.fx-global-dark video {
    filter: none !important;
}


/* =========================================================
   Futurix v1.2 — remaining sections
   1) Popular / topic cards
   2) Event gallery
========================================================= */

/* ---------- Popular / topic cards ---------- */
html.fx-global-dark :is(
    .fxew-topics,
    .fx-topics,
    .futurix-topics,
    .popular-posts,
    .trending-posts
) {
    background: #07111f !important;
    color: #edf5fa !important;
}

html.fx-global-dark :is(
    .fxew-topic-card,
    .fx-topic-card,
    .futurix-topic-card,
    .popular-card,
    .trending-card
) {
    background: #0e1b2a !important;
    color: #edf5fa !important;
    border-color: #203a4d !important;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .22) !important;
}

html.fx-global-dark :is(
    .fxew-topic-card__head h3,
    .fxew-topic-card__feature strong,
    .fxew-topic-card__list a,
    .fx-topic-card h3,
    .popular-card h3,
    .trending-card h3
) {
    color: #edf5fa !important;
}

html.fx-global-dark :is(
    .fxew-topic-card__feature > span,
    .fxew-topic-card__feature small,
    .fxew-topic-card__list small,
    .fx-topic-card small,
    .popular-card small,
    .trending-card small
) {
    color: #98a9b9 !important;
}

html.fx-global-dark .fxew-topic-card__list,
html.fx-global-dark .fxew-topic-card__list a {
    border-color: #203a4d !important;
}

html.fx-global-dark .fxew-topic-card__more {
    color: #4de3ff !important;
}

/* In case the heading is outside the cards */
html.fx-global-dark :is(
    .fxew-topics__section-title,
    .fx-topics__section-title,
    .popular-posts__title,
    .trending-posts__title
) {
    color: #edf5fa !important;
}

/* ---------- Event gallery ---------- */
html.fx-global-dark .futurix-gallery {
    background:
        radial-gradient(
            circle at 15% 20%,
            rgba(77, 227, 255, .10),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #0b1726 0%,
            #0e1b2a 52%,
            #102235 100%
        ) !important;
    border-color: #203a4d !important;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .24) !important;
}

html.fx-global-dark .futurix-gallery::before {
    background:
        linear-gradient(
            120deg,
            transparent 0%,
            rgba(77, 227, 255, .08) 45%,
            transparent 70%
        ) !important;
}

html.fx-global-dark .futurix-gallery .futurix-card {
    background: #0e1b2a !important;
    color: #edf5fa !important;
    border-color: #203a4d !important;
    box-shadow: 0 14px 34px rgba(0, 0, 0, .22) !important;
}

html.fx-global-dark .futurix-gallery .futurix-card h3,
html.fx-global-dark .futurix-gallery .futurix-card h3 a {
    color: #edf5fa !important;
}

html.fx-global-dark .futurix-gallery .futurix-card:hover h3,
html.fx-global-dark .futurix-gallery .futurix-card:hover h3 a {
    color: #4de3ff !important;
}

html.fx-global-dark .futurix-gallery p {
    background: #0e1b2a !important;
    color: #98a9b9 !important;
    border-color: #203a4d !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .18) !important;
}

/* ---------- Liquid-glass news block, if used as popular section ---------- */
html.fx-global-dark .futurix-light-news-block {
    background: #07111f !important;
    color: #edf5fa !important;
}

html.fx-global-dark .futurix-light-news-block .head_card_title,
html.fx-global-dark .futurix-light-news-block .head_card_more,
html.fx-global-dark .futurix-light-news-block .head_card_more i {
    color: #edf5fa !important;
}

html.fx-global-dark .futurix-light-news-block .liquid-glass-card,
html.fx-global-dark .futurix-light-news-block .app-card-content {
    background: #0e1b2a !important;
    color: #edf5fa !important;
    border-color: #203a4d !important;
}

html.fx-global-dark .futurix-light-news-block .app-card-content h3 a {
    color: #edf5fa !important;
}

html.fx-global-dark .futurix-light-news-block .app-card-content h3 a:hover {
    color: #4de3ff !important;
}


/* =========================================================
   Futurix v1.3 — force fix for Future Topics cards
========================================================= */
html.fx-global-dark body .elementor-widget-fxew-topics .fxew-topics,
html.fx-global-dark body .fxew-topics {
    background: transparent !important;
    color: #edf5fa !important;
}

html.fx-global-dark body .elementor-widget-fxew-topics .fxew-topics__section-title,
html.fx-global-dark body .fxew-topics .fxew-topics__section-title {
    color: #edf5fa !important;
}

html.fx-global-dark body .elementor-widget-fxew-topics .fxew-topic-card,
html.fx-global-dark body .fxew-topics .fxew-topic-card {
    background: #0e1b2a !important;
    background-color: #0e1b2a !important;
    color: #edf5fa !important;
    border-color: #203a4d !important;
    box-shadow: 0 18px 45px rgba(0,0,0,.22) !important;
}

html.fx-global-dark body .elementor-widget-fxew-topics .fxew-topic-card__head h3,
html.fx-global-dark body .elementor-widget-fxew-topics .fxew-topic-card__feature,
html.fx-global-dark body .elementor-widget-fxew-topics .fxew-topic-card__feature strong,
html.fx-global-dark body .elementor-widget-fxew-topics .fxew-topic-card__list a,
html.fx-global-dark body .fxew-topics .fxew-topic-card__head h3,
html.fx-global-dark body .fxew-topics .fxew-topic-card__feature,
html.fx-global-dark body .fxew-topics .fxew-topic-card__feature strong,
html.fx-global-dark body .fxew-topics .fxew-topic-card__list a {
    color: #edf5fa !important;
}

html.fx-global-dark body .elementor-widget-fxew-topics .fxew-topic-card__feature > span,
html.fx-global-dark body .elementor-widget-fxew-topics .fxew-topic-card__feature small,
html.fx-global-dark body .elementor-widget-fxew-topics .fxew-topic-card__list small,
html.fx-global-dark body .fxew-topics .fxew-topic-card__feature > span,
html.fx-global-dark body .fxew-topics .fxew-topic-card__feature small,
html.fx-global-dark body .fxew-topics .fxew-topic-card__list small {
    color: #98a9b9 !important;
}

html.fx-global-dark body .elementor-widget-fxew-topics .fxew-topic-card__list,
html.fx-global-dark body .elementor-widget-fxew-topics .fxew-topic-card__list a,
html.fx-global-dark body .fxew-topics .fxew-topic-card__list,
html.fx-global-dark body .fxew-topics .fxew-topic-card__list a {
    border-color: #203a4d !important;
}


/* =========================================================
   Futurix v1.4 — exact selectors from Futurix Elementor Widgets
   Actual classes in the uploaded plugin:
   .fxew-topics, .fxew-section-title, .fxew-topic,
   .fxew-topic__head, .fxew-topic__feature, .fxew-topic__list
========================================================= */

html.fx-global-dark body .fxew-topics {
    --fxew-primary: #4de3ff !important;
    --fxew-accent: #4de3ff !important;
    --fxew-surface: #0e1b2a !important;
    --fxew-text: #edf5fa !important;
    --fxew-muted: #98a9b9 !important;
    background: transparent !important;
    color: #edf5fa !important;
}

html.fx-global-dark body .fxew-topics .fxew-section-title {
    color: #edf5fa !important;
}

html.fx-global-dark body .fxew-topics .fxew-topic {
    background: #0e1b2a !important;
    background-color: #0e1b2a !important;
    color: #edf5fa !important;
    border-color: #203a4d !important;
    box-shadow: 0 18px 45px rgba(0,0,0,.22) !important;
}

html.fx-global-dark body .fxew-topics .fxew-topic__head h3 {
    color: var(--fxew-topic-color) !important;
}

html.fx-global-dark body .fxew-topics .fxew-topic__feature,
html.fx-global-dark body .fxew-topics .fxew-topic__feature strong,
html.fx-global-dark body .fxew-topics .fxew-topic__list a,
html.fx-global-dark body .fxew-topics .fxew-topic__list a span {
    color: #edf5fa !important;
}

html.fx-global-dark body .fxew-topics .fxew-topic__feature small {
    color: #98a9b9 !important;
}

html.fx-global-dark body .fxew-topics .fxew-topic__list,
html.fx-global-dark body .fxew-topics .fxew-topic__list a {
    border-color: #203a4d !important;
}

html.fx-global-dark body .fxew-topics .fxew-topic__list a:hover,
html.fx-global-dark body .fxew-topics .fxew-topic__feature:hover strong {
    color: #4de3ff !important;
}


/* =========================================================
   Futurix v1.5 — mobile header toggle alignment
========================================================= */
@media (max-width: 880px) {
    .fx-header__bar {
        grid-template-columns:
            42px
            42px
            42px
            minmax(0, 1fr)
            42px !important;

        grid-template-areas:
            "search dark desktop logo menu" !important;
    }

    .fx-header__actions {
        display: contents !important;
    }

    .fx-global-dark-toggle--mobile-row {
        grid-area: dark !important;
        position: static !important;
        display: inline-flex !important;
        justify-self: center !important;
        align-self: center !important;
        width: 40px !important;
        height: 40px !important;
        margin: 0 !important;
        padding: 0 !important;
        border-radius: 12px !important;
        transform: none !important;
    }

    .fx-global-dark-toggle--mobile-row:hover {
        transform: none !important;
    }
}

@media (max-width: 390px) {
    .fx-header__bar {
        grid-template-columns:
            38px
            38px
            38px
            minmax(0, 1fr)
            38px !important;

        gap: 5px !important;
    }

    .fx-global-dark-toggle--mobile-row {
        width: 38px !important;
        height: 38px !important;
    }
}


/* =========================================================
   Futurix v1.6 — performance safety
========================================================= */
.fx-global-dark-toggle {
    contain: layout paint;
}

html.fx-global-dark .fxew-topic,
html.fx-global-dark .fx-page-section,
html.fx-global-dark .futurix-gallery {
    transition: none !important;
}