/**
 * Sistema de Muelles — Mobile Focus Mode
 * Capa exclusivamente visual. Breakpoint alineado con wp-admin responsive.
 */

@media screen and (max-width: 782px) {
    /* ================================================================
     * WP-ADMIN: conservar solamente el menú móvil superior + pantalla
     * ================================================================ */
    body.wp-admin.fm-mobile-focus-admin {
        min-width: 0 !important;
        background: #f6f7f7 !important;
        overflow-x: hidden !important;
    }

    body.wp-admin.fm-mobile-focus-admin #wpwrap,
    body.wp-admin.fm-mobile-focus-admin #wpcontent,
    body.wp-admin.fm-mobile-focus-admin #wpbody,
    body.wp-admin.fm-mobile-focus-admin #wpbody-content {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    body.wp-admin.fm-mobile-focus-admin #wpcontent {
        margin-left: 0 !important;
        padding-left: 0 !important;
    }

    body.wp-admin.fm-mobile-focus-admin #wpbody {
        padding-top: 46px !important;
    }

    body.wp-admin.fm-mobile-focus-admin #wpbody-content {
        padding-bottom: 0 !important;
    }

    body.wp-admin.fm-mobile-focus-admin #wpadminbar {
        display: block !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        min-width: 0 !important;
        z-index: 100000 !important;
    }

    body.wp-admin.fm-mobile-focus-admin #wpadminbar #wp-toolbar,
    body.wp-admin.fm-mobile-focus-admin #wpadminbar #wp-admin-bar-root-default {
        width: 100% !important;
    }

    body.wp-admin.fm-mobile-focus-admin #wpadminbar #wp-admin-bar-root-default > li:not(#wp-admin-bar-menu-toggle),
    body.wp-admin.fm-mobile-focus-admin #wpadminbar #wp-admin-bar-top-secondary,
    body.wp-admin.fm-mobile-focus-admin #wpadminbar .ab-top-secondary {
        display: none !important;
    }

    body.wp-admin.fm-mobile-focus-admin #wpadminbar #wp-admin-bar-menu-toggle,
    body.wp-admin.fm-mobile-focus-admin #wpadminbar #wp-admin-bar-menu-toggle > .ab-item,
    body.wp-admin.fm-mobile-focus-admin #wpadminbar #wp-admin-bar-menu-toggle .ab-icon {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    body.wp-admin.fm-mobile-focus-admin.wp-responsive-open #adminmenuback,
    body.wp-admin.fm-mobile-focus-admin.wp-responsive-open #adminmenuwrap,
    body.wp-admin.fm-mobile-focus-admin.wp-responsive-open #adminmenu {
        display: block !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    body.wp-admin.fm-mobile-focus-admin.wp-responsive-open #adminmenuwrap,
    body.wp-admin.fm-mobile-focus-admin.wp-responsive-open #adminmenuback {
        left: 0 !important;
        transform: none !important;
    }

    body.wp-admin.fm-mobile-focus-admin #fm-admin-mobile-menu-fallback {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        z-index: 100001 !important;
        height: 46px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.wp-admin.fm-mobile-focus-admin #fm-admin-mobile-menu-fallback button {
        height: 46px !important;
        min-width: 58px !important;
        margin: 0 !important;
        padding: 0 14px !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: #1d2327 !important;
        color: #f0f0f1 !important;
        font-size: 24px !important;
        line-height: 46px !important;
        cursor: pointer !important;
    }

    body.wp-admin.fm-mobile-focus-admin #screen-meta,
    body.wp-admin.fm-mobile-focus-admin #screen-meta-links,
    body.wp-admin.fm-mobile-focus-admin #wpfooter,
    body.wp-admin.fm-mobile-focus-admin #contextual-help-link-wrap,
    body.wp-admin.fm-mobile-focus-admin #screen-options-link-wrap,
    body.wp-admin.fm-mobile-focus-admin #wpbody-content > .update-nag,
    body.wp-admin.fm-mobile-focus-admin #wpbody-content > .notice:not(.fm-brand-header),
    body.wp-admin.fm-mobile-focus-admin #wpbody-content > .updated:not(.fm-brand-header),
    body.wp-admin.fm-mobile-focus-admin #wpbody-content > .error:not(.fm-brand-header) {
        display: none !important;
    }

    body.wp-admin.fm-mobile-focus-admin #wpbody-content > .wrap,
    body.wp-admin.fm-mobile-focus-admin .wrap,
    body.wp-admin.fm-mobile-focus-admin .fm-dashboard-shell,
    body.wp-admin.fm-mobile-focus-admin .fm-reportes-wrap,
    body.wp-admin.fm-mobile-focus-admin .fm-historial-wrap,
    body.wp-admin.fm-mobile-focus-admin .fm-permissions-wrap,
    body.wp-admin.fm-mobile-focus-admin .fm-help-wrap {
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body.wp-admin.fm-mobile-focus-admin #wpbody-content > .wrap,
    body.wp-admin.fm-mobile-focus-admin .wrap {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    body.wp-admin.fm-mobile-focus-admin .wrap > h1,
    body.wp-admin.fm-mobile-focus-admin .wrap h1:first-child {
        font-size: 28px !important;
        line-height: 1.18 !important;
    }

    body.wp-admin.fm-mobile-focus-admin .fm-brand-header-admin {
        max-width: none !important;
        margin: 0 !important;
        padding: 8px 12px !important;
        border-left: 0 !important;
        box-shadow: none !important;
    }

    /* ================================================================
     * FRONTEND: solo cuando existe un componente público de Muelles.
     * Todo lo anterior al título se apaga y se reconstruye el menú principal.
     * ================================================================ */
    html.fm-mobile-focus-html,
    html.fm-mobile-focus-html body.admin-bar {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    body.fm-mobile-focus-public {
        margin: 0 !important;
        padding-top: 0 !important;
        overflow-x: hidden !important;
    }

    body.fm-mobile-focus-public #wpadminbar,
    body.fm-mobile-focus-public .fm-mobile-before-title-hidden {
        display: none !important;
    }

    body.fm-mobile-focus-public footer,
    body.fm-mobile-focus-public #colophon,
    body.fm-mobile-focus-public .site-footer,
    body.fm-mobile-focus-public #secondary,
    body.fm-mobile-focus-public .sidebar,
    body.fm-mobile-focus-public .widget-area,
    body.fm-mobile-focus-public .entry-footer,
    body.fm-mobile-focus-public .post-navigation,
    body.fm-mobile-focus-public .navigation.post-navigation,
    body.fm-mobile-focus-public .comments-area,
    body.fm-mobile-focus-public #comments,
    body.fm-mobile-focus-public .site-info,
    body.fm-mobile-focus-public .edit-link {
        display: none !important;
    }

    body.fm-mobile-focus-public #page,
    body.fm-mobile-focus-public .site,
    body.fm-mobile-focus-public #content,
    body.fm-mobile-focus-public .site-content,
    body.fm-mobile-focus-public #primary,
    body.fm-mobile-focus-public .content-area,
    body.fm-mobile-focus-public main,
    body.fm-mobile-focus-public .site-main,
    body.fm-mobile-focus-public article,
    body.fm-mobile-focus-public .entry-content {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body.fm-mobile-focus-public .entry-content {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* El título sigue perteneciendo al tema; solo se ajusta su escala móvil. */
    body.fm-mobile-focus-public .fm-mobile-page-title {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        font-size: clamp(30px, 8vw, 36px) !important;
        line-height: 1.15 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin-top: 18px !important;
        margin-bottom: 22px !important;
    }

    /* Menú móvil del sitio: contiene exclusivamente el menú principal público. */
    body.fm-mobile-focus-public #fm-public-mobile-nav {
        display: block !important;
        width: 100% !important;
        max-width: none !important;
        box-sizing: border-box !important;
        margin: 0 !important;
        padding: 0 !important;
        position: sticky !important;
        top: 0 !important;
        z-index: 99999 !important;
        background: #0c3557 !important;
        box-shadow: 0 1px 4px rgba(0,0,0,.22) !important;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    }

    body.fm-mobile-focus-public .fm-public-mobile-nav-toggle {
        appearance: none !important;
        -webkit-appearance: none !important;
        width: 100% !important;
        min-height: 52px !important;
        display: flex !important;
        align-items: center !important;
        gap: 12px !important;
        margin: 0 !important;
        padding: 0 16px !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: #0c3557 !important;
        color: #ffffff !important;
        box-shadow: none !important;
        cursor: pointer !important;
        text-align: left !important;
        font-size: 17px !important;
        font-weight: 600 !important;
        line-height: 1.2 !important;
    }

    body.fm-mobile-focus-public .fm-public-mobile-nav-icon {
        width: 24px !important;
        min-width: 24px !important;
        height: 18px !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
    }

    body.fm-mobile-focus-public .fm-public-mobile-nav-icon span {
        display: block !important;
        width: 24px !important;
        height: 2px !important;
        border-radius: 2px !important;
        background: #ffffff !important;
        transition: transform .18s ease, opacity .18s ease !important;
    }

    body.fm-mobile-focus-public #fm-public-mobile-nav.is-open .fm-public-mobile-nav-icon span:nth-child(1) {
        transform: translateY(8px) rotate(45deg) !important;
    }

    body.fm-mobile-focus-public #fm-public-mobile-nav.is-open .fm-public-mobile-nav-icon span:nth-child(2) {
        opacity: 0 !important;
    }

    body.fm-mobile-focus-public #fm-public-mobile-nav.is-open .fm-public-mobile-nav-icon span:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg) !important;
    }

    body.fm-mobile-focus-public .fm-public-mobile-nav-panel {
        width: 100% !important;
        max-height: min(68vh, 560px) !important;
        overflow-y: auto !important;
        box-sizing: border-box !important;
        margin: 0 !important;
        padding: 6px 0 !important;
        background: #ffffff !important;
        border: 1px solid #dcdcde !important;
        border-top: 0 !important;
        box-shadow: 0 5px 12px rgba(0,0,0,.18) !important;
    }

    body.fm-mobile-focus-public .fm-public-mobile-nav-panel[hidden] {
        display: none !important;
    }

    body.fm-mobile-focus-public .fm-public-mobile-nav-link,
    body.fm-mobile-focus-public .fm-public-mobile-nav-empty {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
        margin: 0 !important;
        padding: 13px 18px !important;
        color: #0c3557 !important;
        background: #ffffff !important;
        border: 0 !important;
        border-bottom: 1px solid #eeeeee !important;
        text-decoration: none !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
    }

    body.fm-mobile-focus-public .fm-public-mobile-nav-link:last-child {
        border-bottom: 0 !important;
    }

    body.fm-mobile-focus-public .fm-public-mobile-nav-link.fm-menu-depth-1 { padding-left: 34px !important; }
    body.fm-mobile-focus-public .fm-public-mobile-nav-link.fm-menu-depth-2 { padding-left: 50px !important; }
    body.fm-mobile-focus-public .fm-public-mobile-nav-link.fm-menu-depth-3 { padding-left: 66px !important; }
    body.fm-mobile-focus-public .fm-public-mobile-nav-link.fm-menu-depth-4 { padding-left: 82px !important; }
    body.fm-mobile-focus-public .fm-public-mobile-nav-link.fm-menu-depth-5 { padding-left: 98px !important; }
    body.fm-mobile-focus-public .fm-public-mobile-nav-link.fm-menu-depth-6 { padding-left: 114px !important; }

    body.fm-mobile-focus-public .fm-public-mobile-nav-link.is-current {
        font-weight: 700 !important;
        background: #f0f6fa !important;
    }

    body.fm-mobile-focus-public .fm-public-mobile-nav-link:active,
    body.fm-mobile-focus-public .fm-public-mobile-nav-link:focus,
    body.fm-mobile-focus-public .fm-public-mobile-nav-link:hover {
        background: #f0f6fa !important;
        color: #0c3557 !important;
        outline: none !important;
    }
}