/* =========================================================
   POWERLIFTING.COM - SITEWIDE CSS
   Load on every front-end page.
   ========================================================= */

:root {
    --pl-blue: #0027ff;
    --pl-blue-medium: #334aff;
    --pl-blue-hover: #5c6eff;
    --pl-blue-dark: #1a2fcc;
    --pl-white: #fff;
    --pl-black: #000;
    --pl-text-dark: #111;
    --pl-muted-dark: #555;
    --pl-border-light: #ddd;
    --pl-dark-surface: #1a1a1a;
    --pl-dark-input: #1c1c1c;
    --pl-dark-border: #222;
}

/* =========================================================
   HEADER AND MAIN NAVIGATION
   ========================================================= */

#menu-item-7100 a,
#menu-item-7753 a,
#menu-main-menu li a {
    font-size: 28px;
    font-weight: 700;
}

#menu-item-7100,
#menu-item-7753 {
    margin-left: 40px;
}

#menu-main-menu {
    display: flex;
    justify-content: center;
    margin: 0;
    padding-left: 0;
    list-style: none;
}

.jeg_main_menu li a {
    position: relative;
    display: inline-block;
    text-transform: none !important;
    text-decoration: none;
}

.main-header-menu li a {
    text-transform: none !important;
}

.jeg_main_menu li a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: var(--pl-blue);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.jeg_main_menu li:hover > a::after,
.jeg_main_menu li.current-menu-item > a::after,
.jeg_main_menu li.current-menu-ancestor > a::after {
    transform: scaleX(1);
}

/* =========================================================
   MOBILE NAVIGATION
   ========================================================= */

.jeg_navbar_mobile_menu .jeg_mobile_menu_style_1 {
    margin: 0 !important;
    padding-left: 0 !important;
}

.jeg_navbar_mobile_menu .jeg_mobile_menu_style_1 li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
}

.jeg_navbar_mobile_menu .jeg_mobile_menu_style_1 li a {
    display: inline-block;
    margin: 0 !important;
    padding: 4px 12px !important;
    line-height: 1.2 !important;
    text-transform: capitalize !important;
}

@media (max-width: 1024px) {
    .jeg_navbar_mobile_menu,
    .jeg_navbar_mobile_menu .container,
    .jeg_navbar_mobile_menu .menu-main-menu-container {
        overflow: visible !important;
    }

    .jeg_navbar_mobile_menu #menu-main-menu .menu-item-has-children {
        position: relative !important;
    }

    .jeg_navbar_mobile_menu #menu-main-menu .menu-item-has-children > .sub-menu {
        position: absolute !important;
        top: 100% !important;
        right: 0 !important;
        left: auto !important;
        z-index: 999999 !important;

        display: none !important;
        visibility: visible !important;
        opacity: 1 !important;

        min-width: 240px !important;
        margin: 0 !important;
        padding: 8px 0 !important;

        color: var(--j-txt-color, var(--pl-text-dark)) !important;
        background: var(--j-bg-color, var(--pl-white)) !important;
        border: 1px solid rgba(128, 128, 128, 0.25) !important;
        box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18) !important;
    }

    .jeg_navbar_mobile_menu #menu-main-menu .menu-item-has-children.open > .sub-menu {
        display: block !important;
    }

    .jeg_navbar_mobile_menu #menu-main-menu .sub-menu li {
        display: block !important;
        float: none !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .jeg_navbar_mobile_menu #menu-main-menu .sub-menu a {
        display: block !important;
        padding: 10px 15px !important;
        color: inherit !important;
        background: transparent !important;
        text-decoration: none !important;
        white-space: nowrap !important;
    }

    .jeg_navbar_mobile_menu #menu-main-menu .sub-menu a:hover,
    .jeg_navbar_mobile_menu #menu-main-menu .sub-menu a:focus {
        color: inherit !important;
        background: rgba(128, 128, 128, 0.15) !important;
    }
}

@media (max-width: 1024px) and (prefers-color-scheme: dark) {
    .jeg_navbar_mobile_menu #menu-main-menu .menu-item-has-children > .sub-menu {
        color: var(--j-txt-color, var(--pl-white)) !important;
        background: var(--j-bg-color, var(--pl-text-dark)) !important;
        border-color: rgba(255, 255, 255, 0.18) !important;
        box-shadow: 0 6px 18px rgba(0, 0, 0, 0.45) !important;
    }

    .jeg_navbar_mobile_menu #menu-main-menu .sub-menu a:hover,
    .jeg_navbar_mobile_menu #menu-main-menu .sub-menu a:focus {
        background: rgba(255, 255, 255, 0.12) !important;
    }
}

/* =========================================================
   HEADER, DROPDOWNS, AND STACKING
   ========================================================= */

/*
 * Establish the entire header as a high-level stacking context.
 * All dropdowns remain above page content, Elementor, and TEC.
 */
.jeg_header {
    position: relative !important;
    z-index: 2000000000 !important;
}

/*
 * Prevent header containers from clipping dropdown menus.
 */
.jeg_header,
.jeg_navbar,
.jeg_navbar_wrapper,
.jeg_nav_normal,
.jeg_nav_col,
.jeg_mainmenu_wrap,
.jeg_main_menu,
.jeg_nav_left,
.jeg_nav_center,
.jeg_nav_right,
.jeg_nav_right .item_wrap,
.jeg_nav_account,
.jeg_accountlink,
.jeg_accountlink > li {
    overflow: visible !important;
}

/*
 * Main navigation needs its own elevated layer.
 * Do not return these elements to z-index: 1.
 */
.jeg_mainmenu_wrap,
.jeg_main_menu,
.jeg_nav_left,
.jeg_nav_center {
    position: relative !important;
    z-index: 20 !important;
}

/*
 * Keep the account-menu area elevated too.
 */
.jeg_nav_col.jeg_nav_right,
.jeg_nav_right .item_wrap,
.jeg_nav_account,
.jeg_accountlink,
.jeg_accountlink > li {
    position: relative !important;
    z-index: 30 !important;
}


/* =========================================================
   DESKTOP MAIN-MENU DROPDOWNS
   ========================================================= */

@media (min-width: 1025px) {
    .jeg_main_menu .menu-item-has-children {
        position: relative !important;
    }

    /*
     * Invisible bridge between the parent link and dropdown.
     * Prevents the submenu from closing while moving the mouse.
     */
    .jeg_main_menu .menu-item-has-children::after {
        content: "";
        position: absolute;
        top: 100%;
        right: 0;
        left: 0;
        z-index: 39;
        height: 14px;
    }

    .jeg_main_menu .menu-item-has-children > .sub-menu {
        position: absolute !important;
        z-index: 40 !important;
        margin-top: 0 !important;
    }

    .jeg_main_menu .menu-item-has-children:hover > .sub-menu,
    .jeg_main_menu .menu-item-has-children.sfHover > .sub-menu,
    .jeg_main_menu .menu-item-has-children.focus > .sub-menu,
    .jeg_main_menu .menu-item-has-children:focus-within > .sub-menu {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    /*
     * HOME SUBMENU
     *
     * Home is menu item 7100. Give it the highest layer
     * inside the already-elevated header.
     */
    #menu-item-7100 {
        position: relative !important;
        z-index: 100 !important;
    }

    #menu-item-7100 > .sub-menu {
        position: absolute !important;
        z-index: 101 !important;
    }

    #menu-item-7100:hover > .sub-menu,
    #menu-item-7100.sfHover > .sub-menu,
    #menu-item-7100.focus > .sub-menu,
    #menu-item-7100:focus-within > .sub-menu {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }
}


/* =========================================================
   MOBILE HOME SUBMENU STACKING
   ========================================================= */

@media (max-width: 1024px) {
    .jeg_navbar_mobile_menu,
    .jeg_navbar_mobile_menu .container,
    .jeg_navbar_mobile_menu .menu-main-menu-container {
        position: relative !important;
        overflow: visible !important;
        z-index: 2000000000 !important;
    }

    .jeg_navbar_mobile_menu #menu-item-7100 {
        position: relative !important;
        z-index: 100 !important;
    }

    .jeg_navbar_mobile_menu #menu-item-7100 > .sub-menu {
        z-index: 101 !important;
    }
}


/* =========================================================
   LOGGED-IN ACCOUNT DROPDOWN
   ========================================================= */

.jeg_accountlink > li > ul {
    position: absolute !important;
    top: 100% !important;
    right: 0 !important;
    left: auto !important;
    z-index: 50 !important;

    display: none !important;
    min-width: 180px !important;

    background: var(--pl-white) !important;
    border: 1px solid rgba(0, 0, 0, 0.15) !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18) !important;
}

.jeg_accountlink > li:hover > ul,
.jeg_accountlink > li.sfHover > ul,
.jeg_accountlink > li:focus-within > ul {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

.jeg_accountlink > li > ul li,
.jeg_accountlink > li > ul a {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.jeg_accountlink > li > ul a {
    padding: 10px 15px !important;
    color: var(--pl-text-dark) !important;
    background: var(--pl-white) !important;
    white-space: nowrap !important;
}


/* =========================================================
   WORDPRESS ADMIN BAR
   ========================================================= */

/*
 * Keep the WordPress admin toolbar above the site header
 * while logged in.
 */
@media (min-width: 1025px) {
    #wpadminbar {
        z-index: 2147483600 !important;
    }

    #wpadminbar .ab-sub-wrapper,
    #wpadminbar .ab-submenu,
    #wpadminbar .menupop .ab-sub-wrapper {
        z-index: 2147483601 !important;
    }
}

/* =========================================================
   SHARED JNEWS THUMBNAILS
   ========================================================= */

.jeg_pl_lg_2 .thumbnail-container,
.jeg_pl_md_1 .thumbnail-container {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 3 / 2 !important;
    overflow: hidden !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.jeg_pl_lg_2 .thumbnail-container img,
.jeg_pl_md_1 .thumbnail-container img {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    object-fit: cover !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
}

/* =========================================================
   GLOBAL DARK-MODE FORMS
   These were sitewide in the original CSS.
   ========================================================= */

body.jnews-dark-mode form,
body.jnews-dark-mode fieldset,
body.jnews-dark-mode input,
body.jnews-dark-mode select,
body.jnews-dark-mode textarea,
body.jnews-dark-mode button {
    color: var(--pl-white) !important;
    background-color: var(--pl-dark-input) !important;
    border-color: var(--pl-dark-border) !important;
}

body.jnews-dark-mode ::placeholder {
    color: #aaa !important;
    opacity: 1 !important;
}

body.jnews-dark-mode input:focus,
body.jnews-dark-mode textarea:focus,
body.jnews-dark-mode select:focus {
    outline: none !important;
    border-color: var(--pl-muted-dark) !important;
    background-color: var(--pl-dark-border) !important;
}

body.jnews-dark-mode button:hover,
body.jnews-dark-mode input[type="submit"]:hover,
body.jnews-dark-mode input[type="button"]:hover {
    background-color: #444 !important;
}

body.jnews-dark-mode input[type="submit"],
body.jnews-dark-mode button.btn-primary {
    color: var(--pl-white) !important;
    background-color: var(--pl-blue) !important;
    border: 1px solid var(--pl-blue) !important;
}

.jnews-dark-mode div[data-key="0"] {
    color: var(--pl-white) !important;
}

.jnews-dark-mode .wpforms-entry-preview.wpforms-entry-preview-basic,
.jnews-dark-mode .wpforms-entry-preview.wpforms-entry-preview-basic *,
.jnews-dark-mode .wpforms-field-label {
    color: var(--pl-white) !important;
}

/* =========================================================
   MISCELLANEOUS SITEWIDE RULES
   ========================================================= */

body.error404 .jeg_breadcrumbs,
body.error404 .jeg_block_heading.jeg_block_heading_6.jeg_subcat_right {
    display: none !important;
}

/* =========================================================
   LEGACY GLOBAL RESPONSIVE OVERRIDES
   Retained to preserve the current site during migration.
   Test removing this entire section on staging because the
   .td-* selectors are not native JNews selectors and forcing
   Elementor widgets to display:block can disrupt layouts.
   ========================================================= */

@media only screen and (min-width: 769px) {
    .td-header-wrap,
    .td-header-menu,
    .td-footer-wrap,
    .td-footer-menu {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
    }

    .td-main-content,
    .td-sidebar {
        display: block !important;
        width: auto !important;
    }

    .elementor-section,
    .elementor-column,
    .elementor-widget {
        display: block !important;
        max-width: 100% !important;
    }

    .tribe-events,
    .tribe-events-loop,
    .tribe-events-list,
    .tribe-events-single-event {
        display: block !important;
        width: auto !important;
    }
}

@media only screen and (max-width: 768px) {
    .td-header-wrap,
    .td-header-menu,
    .td-footer-wrap,
    .td-footer-menu {
        display: block !important;
        flex-direction: column !important;
    }

    .td-main-content,
    .td-sidebar {
        display: block !important;
        width: 100% !important;
    }

    .elementor-section,
    .elementor-column,
    .elementor-widget {
        display: block !important;
        max-width: 100% !important;
    }

    .tribe-events,
    .tribe-events-loop,
    .tribe-events-list,
    .tribe-events-single-event {
        display: block !important;
        width: 100% !important;
    }
}

/* =========================================================
   HIDE CATEGORY LABELS ON FEATURED IMAGES
   ========================================================= */

.jeg_post_category {
    display: none !important;
}

