/* InspectBook v0.3.4 — mobile header one-line layout
   Mobile only:
   Logo + InspectBook title + language dropdown + menu dropdown stay on ONE horizontal line.
   Desktop remains unchanged.
*/

.ib-mobile-menu-btn,
.ib-mobile-menu-panel {
    display: none;
}

@media (max-width: 820px) {
    body {
        overflow-x: hidden;
    }

    header,
    header.ibd-nav,
    .ibd-nav {
        position: relative !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 6px !important;
        min-height: 56px !important;
        height: 56px !important;
        padding: 8px 10px !important;
        box-sizing: border-box !important;
    }

    /* Brand/logo stays left and is reduced to make room for the two dropdowns. */
    header .ibd-brand,
    header .brand,
    header > a:first-child {
        order: 1 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 8px !important;
        margin: 0 auto 0 0 !important;
        padding: 0 !important;
        min-width: 0 !important;
        flex: 1 1 auto !important;
        max-width: calc(100% - 150px) !important;
        white-space: nowrap !important;
        overflow: hidden !important;
    }

    /* IB square/logo */
    header .ibd-brand span,
    header .brand span,
    header > a:first-child span {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        border-radius: 13px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 14px !important;
        line-height: 1 !important;
        flex: 0 0 auto !important;
    }

    /* InspectBook text */
    header .ibd-brand strong,
    header .brand strong,
    header > a:first-child strong {
        display: inline-block !important;
        font-size: 20px !important;
        line-height: 1 !important;
        font-weight: 950 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        max-width: 122px !important;
    }

    /* Hide original desktop nav/actions on mobile; JS clones their links into the mobile dropdown. */
    header nav.ib-mobile-nav-original,
    header .ibd-nav-actions.ib-mobile-actions-original {
        display: none !important;
    }

    /* Hide duplicate floating language selector on mobile. Header language remains visible. */
    .ib-lang-switcher-floating {
        display: none !important;
    }

    /* Header language dropdown: same line, compact. */
    header .ib-lang-switcher-header,
    header .ib-lang-dropdown {
        order: 2 !important;
        position: relative !important;
        margin: 0 !important;
        flex: 0 0 66px !important;
        width: 66px !important;
        min-width: 66px !important;
        height: 34px !important;
        z-index: 100004 !important;
    }

    header .ib-lang-current {
        width: 66px !important;
        height: 34px !important;
        min-width: 66px !important;
        padding: 0 5px !important;
        gap: 3px !important;
        border-radius: 999px !important;
    }

    header .ib-lang-globe {
        font-size: 12px !important;
    }

    header .ib-lang-current-code {
        font-size: 10px !important;
        font-weight: 950 !important;
    }

    header .ib-lang-arrow {
        font-size: 8px !important;
    }

    header .ib-lang-menu {
        top: 38px !important;
        right: 0 !important;
        width: 66px !important;
        min-width: 66px !important;
        padding: 4px !important;
        border-radius: 12px !important;
    }

    header .ib-lang-option {
        height: 26px !important;
        font-size: 10px !important;
        border-radius: 8px !important;
        margin: 2px 0 !important;
    }

    /* Mobile Menu button: same line, compact. */
    .ib-mobile-menu-btn {
        order: 3 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 4px !important;
        flex: 0 0 76px !important;
        width: 76px !important;
        min-width: 76px !important;
        height: 34px !important;
        padding: 0 6px !important;
        border-radius: 999px !important;
        border: 1px solid rgba(255,255,255,.16) !important;
        background: rgba(3, 7, 19, .92) !important;
        color: #f6c95b !important;
        font-size: 10px !important;
        font-weight: 950 !important;
        letter-spacing: .01em !important;
        cursor: pointer !important;
        box-shadow: 0 14px 44px rgba(0,0,0,.36) !important;
        backdrop-filter: blur(14px) !important;
        -webkit-backdrop-filter: blur(14px) !important;
        z-index: 100003 !important;
    }

    .ib-mobile-menu-icon {
        font-size: 14px !important;
        line-height: 1 !important;
        margin-top: -1px !important;
    }

    .ib-mobile-menu-label,
    .ib-mobile-menu-arrow {
        line-height: 1 !important;
    }

    .ib-mobile-menu-arrow {
        color: #b9c8dd !important;
        font-size: 8px !important;
        transition: transform .16s ease !important;
    }

    header.ib-mobile-menu-open .ib-mobile-menu-arrow {
        transform: rotate(180deg) !important;
    }

    /* Dropdown panel opens below the one-line header. */
    .ib-mobile-menu-panel {
        display: none;
        position: absolute !important;
        right: 10px !important;
        top: calc(100% + 8px) !important;
        width: 210px !important;
        max-width: calc(100vw - 20px) !important;
        padding: 8px !important;
        border-radius: 18px !important;
        background: rgba(3, 7, 19, .97) !important;
        border: 1px solid rgba(255,255,255,.16) !important;
        box-shadow: 0 24px 80px rgba(0,0,0,.58) !important;
        backdrop-filter: blur(16px) !important;
        -webkit-backdrop-filter: blur(16px) !important;
        z-index: 100002 !important;
    }

    header.ib-mobile-menu-open .ib-mobile-menu-panel {
        display: block !important;
    }

    .ib-mobile-menu-panel a {
        width: 100% !important;
        min-height: 38px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        padding: 0 12px !important;
        margin: 3px 0 !important;
        border-radius: 12px !important;
        color: #dbe7fb !important;
        text-decoration: none !important;
        font-size: 13px !important;
        font-weight: 850 !important;
        letter-spacing: .01em !important;
        background: transparent !important;
        border: 1px solid transparent !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
    }

    .ib-mobile-menu-panel a:hover,
    .ib-mobile-menu-panel a:focus {
        color: #07111f !important;
        background: #f6c95b !important;
        border-color: rgba(255,255,255,.22) !important;
        outline: none !important;
    }
}

/* Smaller phones: shorten title a little, keep same row. */
@media (max-width: 430px) {
    header,
    header.ibd-nav,
    .ibd-nav {
        gap: 5px !important;
        padding: 8px 8px !important;
    }

    header .ibd-brand,
    header .brand,
    header > a:first-child {
        max-width: calc(100% - 140px) !important;
        gap: 7px !important;
    }

    header .ibd-brand span,
    header .brand span,
    header > a:first-child span {
        width: 35px !important;
        height: 35px !important;
        min-width: 35px !important;
        border-radius: 12px !important;
        font-size: 13px !important;
    }

    header .ibd-brand strong,
    header .brand strong,
    header > a:first-child strong {
        font-size: 18px !important;
        max-width: 104px !important;
    }

    header .ib-lang-switcher-header,
    header .ib-lang-dropdown,
    header .ib-lang-current {
        width: 62px !important;
        min-width: 62px !important;
        flex-basis: 62px !important;
    }

    .ib-mobile-menu-btn {
        width: 72px !important;
        min-width: 72px !important;
        flex-basis: 72px !important;
        font-size: 10px !important;
    }
}

/* Very narrow phones: hide word "Meniu", keep icon + arrow, still one line. */
@media (max-width: 360px) {
    header .ibd-brand strong,
    header .brand strong,
    header > a:first-child strong {
        font-size: 17px !important;
        max-width: 88px !important;
    }

    .ib-mobile-menu-btn {
        width: 44px !important;
        min-width: 44px !important;
        flex-basis: 44px !important;
    }

    .ib-mobile-menu-label {
        display: none !important;
    }
}
