/* Inimed HealthPress - responsive layout without desktop design changes.
 * This file is deliberately loaded AFTER the theme's original/custom CSS.
 * Breakpoint 1024px fixes the old 980px layout overflowing tablets.
 */
.inimed-mobile-menu-toggle,
.inimed-submenu-toggle { display: none; }

@media only screen and (max-width: 1024px) {
    /* Box sizing prevents padded fixed-width theme elements from exceeding viewport. */
    html, body { max-width: 100%; }
    body { overflow-x: hidden; } /* fallback for third-party full-width content */
    #wrapper { width: 100%; max-width: 100%; overflow-x: clip; }
    #wrapper *, #wrapper *::before, #wrapper *::after { box-sizing: border-box; }

    /* Fluid layout: desktop 980px columns and 290px phone containers must not overflow. */
    #wrapper #header,
    #wrapper #container,
    #wrapper #slider-wrap,
    #wrapper .page-head,
    #wrapper footer,
    #wrapper #footer-bottom { width: 100%; max-width: 100%; }
    #wrapper #container { padding: 16px; margin: 0 auto; }
    #wrapper #container #content,
    #wrapper #container #content.full-width,
    #wrapper #container #sidebar,
    #wrapper .home-left-side,
    #wrapper .official,
    #wrapper .official .team,
    #wrapper .testi,
    #wrapper .newsletter { float: none; width: 100%; max-width: 100%; }
    #wrapper .home-left-side,
    #wrapper .official .team { margin-left: 0; margin-right: 0; }
    #wrapper .testi { padding: 0 0 20px; }
    #wrapper .page-head { padding: 12px 16px; }
    #wrapper #slider-wrap { height: auto; overflow: hidden; }
    #wrapper #slider-wrap .slides, #wrapper #slider-wrap .slide-nav { max-width: 100%; }
    #wrapper #slider-wrap .slide-nav { width: 100%; }
    #wrapper img, #wrapper video, #wrapper svg { max-width: 100%; height: auto; }
    #wrapper iframe, #wrapper embed, #wrapper object { max-width: 100%; }
    #wrapper #content, #wrapper .entry-content, #wrapper .textwidget { overflow-wrap: anywhere; }
    #wrapper #content table { display: block; width: 100%; max-width: 100%; overflow-x: auto; }

    /* Mobile header: logo stays on left, toggle in top-right, contacts wrap below. */
    #wrapper #header { height: auto; position: relative; display: flex; flex-direction: column; align-items: stretch; padding: 14px 14px 0; margin: 0 auto 12px; }
    #wrapper #header .logo { display: block; position: static; align-self: flex-start; max-width: calc(100% - 110px); margin: 0 0 10px; text-align: left; }
    #wrapper #header .logo img { width: auto; max-width: 100%; max-height: 90px; display: block; margin: 0 0 5px; }
    #wrapper #header .logo .tagline { margin: 0; line-height: 1.3; }
    #wrapper #header .social-nav {
        display: flex; position: static; width: 100%; max-width: 100%; height: auto;
        flex-wrap: wrap; align-items: center; justify-content: flex-start;
        margin: 4px 0 8px; padding: 0; overflow: visible;
        top: auto; right: auto; text-align: left;
    }
    #wrapper #header .social-nav li,
    #wrapper #header .social-nav > a { display: inline-block; flex: 0 1 auto; width: auto; max-width: 100%; height: auto; float: none; clear: none; margin: 0 14px 5px 0; line-height: 1.5; }
    #wrapper #header .social-nav li a,
    #wrapper #header .social-nav > a { width: auto; height: auto; line-height: 1.5; overflow-wrap: anywhere; }
    #wrapper #header .social-nav li span,
    #wrapper #header .social-nav li.phone span,
    #wrapper #header .social-nav li.acasa span,
    #wrapper #header .social-nav li.contact span { display: inline; padding: 0; background: none; line-height: 1.5; font-size: 13px; }
    #wrapper #header .social-nav li.slogan { order: 10; flex-basis: 100%; margin-top: 3px; }
    #wrapper #header .social-nav li.slogan img { max-width: 190px; width: auto; height: auto; vertical-align: middle; }
    #wrapper #header .social-nav li.phone { margin-left: 0; }

    /* Accessible hamburger: actual button, no external library or icon fonts. */
    #wrapper #header .inimed-mobile-menu-toggle {
        display: inline-flex; position: absolute; z-index: 12;
        top: 18px; right: 14px; align-items: center; justify-content: center;
        gap: 8px; min-height: 44px; min-width: 44px; padding: 9px 12px;
        background: #4d718c; border: 0; border-radius: 4px;
        color: #fff; font: 600 14px 'Open Sans', Arial, sans-serif;
        cursor: pointer; box-shadow: none; -webkit-tap-highlight-color: transparent;
    }
    #wrapper #header .inimed-mobile-menu-toggle:focus-visible,
    #wrapper #header .inimed-submenu-toggle:focus-visible { outline: 3px solid #162f45; outline-offset: 2px; }
    #wrapper #header .inimed-mobile-menu-icon { display: inline-flex; flex-direction: column; gap: 4px; width: 19px; }
    #wrapper #header .inimed-mobile-menu-icon span { height: 2px; width: 19px; background: #fff; border-radius: 2px; }

    /* Compact dropdown on the same page, not a horizontally sliding overlay. */
    #wrapper #header .main-nav {
        display: none; position: relative !important; inset: auto !important;
        width: 100%; max-width: 100%; height: auto; margin: 4px 0 0;
        padding: 0 !important; border-radius: 4px; z-index: 11;
    }
    #wrapper #header .main-nav.inimed-nav-open { display: block; }
    #wrapper #header .main-nav .responsive-nav { display: none !important; }
    #wrapper #header .main-nav > ul,
    #wrapper #header .main-nav > div > ul,
    #wrapper #header .main-nav ul { display: block; width: 100%; max-width: 100%; height: auto; float: none; position: static; margin: 0; padding: 0; }
    #wrapper #header .main-nav ul li,
    #wrapper #header .main-nav ul li ul li { display: block; float: none; position: relative; width: 100%; max-width: 100%; height: auto; padding: 0; margin: 0; border: none; border-bottom: 1px solid rgba(255,255,255,.18); background: transparent; }
    #wrapper #header .main-nav ul li a,
    #wrapper #header .main-nav ul li ul li a {
        display: block; width: 100%; height: auto; padding: 12px 48px 12px 16px;
        font-size: 15px; font-weight: 400; line-height: 1.5;
        text-align: left; white-space: normal; overflow-wrap: anywhere;
        border: 0; border-radius: 0; box-shadow: none;
    }
    #wrapper #header .main-nav ul li a:hover,
    #wrapper #header .main-nav ul li a:focus-visible { background: rgba(0,0,0,.10); }
    #wrapper #header .main-nav ul li ul {
        display: none !important; position: static !important; inset: auto !important;
        max-width: 100%; width: 100%; height: auto; padding: 0 !important;
        margin: 0 !important; background: rgba(0,0,0,.13) !important;
        border: 0; border-radius: 0; box-shadow: none;
    }
    #wrapper #header .main-nav ul li.inimed-submenu-open > ul { display: block !important; }
    #wrapper #header .main-nav ul li ul li a { padding-left: 30px; }
    #wrapper #header .main-nav ul li ul li ul li a { padding-left: 44px; }
    #wrapper #header .inimed-submenu-toggle {
        display: flex; align-items: center; justify-content: center;
        position: absolute; top: 3px; right: 3px; z-index: 1;
        width: 42px; height: 42px; padding: 0;
        border: 0; border-left: 1px solid rgba(255,255,255,.20);
        color: #fff; background: transparent; cursor: pointer;
    }
    #wrapper #header .inimed-submenu-toggle span {
        display: block; width: 9px; height: 9px;
        border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
        transform: translateY(-2px) rotate(45deg); transition: transform 150ms ease;
    }
    #wrapper #header .inimed-submenu-open > .inimed-submenu-toggle span { transform: translateY(3px) rotate(225deg); }
    #wrapper #header .main-nav #topsearch { position: static; max-width: 100%; width: auto; padding: 10px; }

    /* Existing content/footer widgets were designed for fixed 290px columns. */
    #wrapper .services .service { width: 100%; max-width: 100%; margin: 0 0 20px; float: none; }
    #wrapper .service-list.single-col figure,
    #wrapper .service-list.three-col figure,
    #wrapper .service-list.four-col figure { max-width: 100%; height: auto; }
    #wrapper .service-list.single-col figure img,
    #wrapper .service-list.three-col figure img { width: 100%; max-width: 100%; height: auto; }
    #wrapper .service-list.three-col ul li,
    #wrapper .service-list.four-col ul li,
    #wrapper .doc_list .doctors li,
    #wrapper .doc_list.four_col .doctors li { max-width: 100%; margin-left: 0; }
    #wrapper .gallery-2-columns, #wrapper .gallery-3-columns, #wrapper .gallery-4-columns { margin-left: 0; }
    #wrapper .gallery-2-columns .gallery-item,
    #wrapper .gallery-3-columns .gallery-item,
    #wrapper .gallery-4-columns .gallery-item { width: 100%; max-width: 100%; margin-left: 0; }
    #wrapper #footer-wrap, #wrapper #footer-bottom-wrapper { max-width: 100%; }
    #wrapper footer { padding: 24px 16px; display: flex; flex-wrap: wrap; gap: 14px; }
    #wrapper footer .footer-widget { width: 100%; max-width: 100%; float: none; margin: 0; padding: 0; }
    #wrapper #footer-bottom { height: auto; padding: 12px 16px; }
    #wrapper #footer-bottom p { max-width: 100%; overflow-wrap: anywhere; }
}

@media only screen and (min-width: 650px) and (max-width: 1024px) {
    #wrapper footer .footer-widget { width: calc(50% - 7px); }
}

@media only screen and (max-width: 480px) {
    #wrapper #header .inimed-mobile-menu-toggle { padding: 9px 10px; }
    #wrapper #header .logo { max-width: calc(100% - 102px); }
    #wrapper #header .social-nav li.slogan img { max-width: 170px; }
    #wrapper #container { padding: 12px; }
    #wrapper #header .main-nav ul li a { font-size: 14px; }
}
