/* Scoped install and standalone navigation styles; native portal layouts remain intact. */
[data-hiperasia-pwa-root] .o_portal_docs .o_portal_icon {
    flex: 0 0 64px;
    width: 64px;
}

[data-hiperasia-pwa-root] .o_portal_docs .o_portal_icon img {
    display: block;
    width: 64px;
    height: 64px;
    object-fit: contain;
}

[data-hiperasia-pwa-root] .o_portal_index_card .o_portal_icon + div {
    min-width: 0;
    overflow-wrap: anywhere;
}

.o_hiperasia_pwa_shell [hidden],
.o_hiperasia_pwa_languages [hidden],
.o_hiperasia_site_footer [hidden],
.o_hiperasia_pwa_guide [hidden] {
    display: none !important;
}

.o_hiperasia_pwa_nav {
    background: var(--body-bg, #fff);
    border-bottom: 1px solid rgba(0, 0, 0, .1);
    padding: .5rem max(.75rem, env(safe-area-inset-right)) .5rem max(.75rem, env(safe-area-inset-left));
}

/* Only standalone customer pages collapse the ordinary site header. The real
   header/menu is retained and can be expanded; normal website pages are untouched. */
[data-hiperasia-pwa-root].o_hiperasia_pwa_standalone:not(.o_hiperasia_pwa_site_menu_open) > header {
    display: none !important;
}
[data-hiperasia-pwa-root].o_hiperasia_pwa_standalone .o_portal_submenu.breadcrumb {
    display: none;
}
.o_hiperasia_pwa_toolbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    padding-block: .35rem;
}
.o_hiperasia_pwa_shell {
    background: var(--body-bg, #fff);
    border-bottom: 1px solid rgba(48, 39, 115, .08);
}
.o_hiperasia_account_actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: .5rem;
    min-width: 0;
    margin-left: auto;
}
.o_hiperasia_account_link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    min-height: 44px;
    padding: .6rem .85rem;
    border: 1px solid #302773;
    border-radius: 999px;
    color: #fff;
    background: #302773;
    font-size: .875rem;
    font-weight: 700;
    line-height: 1.25;
    white-space: nowrap;
}
.o_hiperasia_account_link:hover { color: #fff; background: #241d59; text-decoration: none; }
.o_hiperasia_account_link:focus-visible { outline: 3px solid #302773; outline-offset: 3px; }
.o_hiperasia_account_session { margin-block: 1.25rem .5rem; }
.o_hiperasia_sign_out,
.o_hiperasia_backend_entry > a { display: inline-flex; align-items: center; gap: .45rem; min-height: 44px; }
.o_hiperasia_sign_out { padding: .5rem .75rem; color: #6c757d; border-radius: .5rem; }
.o_hiperasia_sign_out:hover { color: #302773; background: #f3f2f8; }
.o_hiperasia_sign_out:focus-visible { outline: 3px solid #302773; outline-offset: 3px; }
/* The ordering theme has its own accent; only this shared account action uses
   the same brand treatment. Its existing leave-page handler is untouched. */
.o_hiperasia_quick_order_page .o_qo_account {
    color: #fff;
    background: #302773;
    border-color: #302773;
}
.o_hiperasia_quick_order_page .o_qo_account:hover,
.o_hiperasia_quick_order_page .o_qo_account:focus {
    color: #fff;
    background: #241d59;
    box-shadow: 0 0 0 3px rgba(48, 39, 115, .15);
}
.o_hiperasia_quick_order_page .o_qo_account:focus-visible { outline: 3px solid #302773; outline-offset: 3px; }
/* Keep account and language together; the logo may occupy its own row on
   small screens or enlarged text rather than pushing controls off-screen. */
.o_hiperasia_quick_order_page .o_qo_header_inner { flex-wrap: wrap; padding-block: .5rem; }
.o_hiperasia_pwa_nav {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex: 1 1 auto;
    min-width: 0;
    padding: 0;
    border: 0;
}
.o_hiperasia_pwa_title {
    flex: 1;
    min-width: 0;
    font-weight: 600;
    overflow-wrap: anywhere;
}
.o_hiperasia_site_footer {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .6rem;
    padding: 1.25rem max(1rem, env(safe-area-inset-right)) max(1.25rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));
    border-top: 1px solid rgba(48, 39, 115, .08);
    background: var(--body-bg, #fff);
}
.o_hiperasia_site_copyright { color: #6c757d; font-size: .8rem; }
.o_hiperasia_pwa_languages { position: relative; }
.o_hiperasia_pwa_languages summary,
.o_hiperasia_site_language > .o_hiperasia_pwa_language_trigger {
    cursor: pointer;
    min-height: 44px;
    min-width: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    padding: .6rem .85rem;
    color: #302773;
    background: #f3f2f8;
    border: 1px solid rgba(48, 39, 115, .12);
    border-radius: 999px;
    font-size: .875rem;
    font-weight: 500;
    line-height: 1.25;
    list-style: none;
    white-space: nowrap;
}
.o_hiperasia_pwa_languages summary::-webkit-details-marker { display: none; }
.o_hiperasia_pwa_languages summary::marker { content: ""; }
.o_hiperasia_pwa_languages summary:hover,
.o_hiperasia_pwa_languages[open] summary,
.o_hiperasia_site_language > .o_hiperasia_pwa_language_trigger:hover {
    background: #eae8f3;
    border-color: rgba(48, 39, 115, .25);
}
.o_hiperasia_pwa_languages summary .fa-globe { font-size: 1.05rem; }
.o_hiperasia_site_language_globe { order: -1; font-size: 1.05rem; }
.o_hiperasia_pwa_language_chevron { font-size: .65rem; }
.o_hiperasia_pwa_languages[open] .o_hiperasia_pwa_language_chevron { transform: rotate(180deg); }
.o_hiperasia_pwa_languages form {
    position: absolute;
    z-index: 1050;
    right: 0;
    top: calc(100% + .5rem);
    width: min(12rem, calc(100vw - 2rem));
    max-height: calc(100vh - 6rem);
    max-height: calc(100dvh - 6rem);
    overflow-y: auto;
    padding: .375rem;
    background: var(--body-bg, #fff);
    border: 1px solid rgba(48, 39, 115, .15);
    border-radius: .5rem;
    box-shadow: 0 .25rem 1rem #0002;
}
.o_hiperasia_pwa_languages select,
.o_hiperasia_pwa_languages button,
.o_hiperasia_site_language .dropdown-item { min-height: 48px; }
.o_hiperasia_language_choice { display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; padding: .65rem .8rem; border: 0; border-radius: .375rem; background: transparent; color: #212529; font: inherit; text-align: start; }
.o_hiperasia_language_choice:hover, .o_hiperasia_language_choice[aria-current="true"] { color: #302773; background: #f3f2f8; }
.o_hiperasia_language_choice:disabled { opacity: .55; cursor: wait; }
.o_hiperasia_language_choice:focus-visible { outline: 3px solid #302773; outline-offset: -3px; }
.o_hiperasia_pwa_languages summary:focus-visible,
.o_hiperasia_site_language > .o_hiperasia_pwa_language_trigger:focus-visible,
.o_hiperasia_pwa_languages select:focus-visible {
    outline: 3px solid currentColor;
    outline-offset: 3px;
}
.o_hiperasia_site_language .dropdown-menu { max-width: calc(100vw - 2rem); }
@media (max-width: 575.98px) {
    .o_hiperasia_pwa_standalone .o_hiperasia_pwa_shell {
        position: sticky;
        top: 0;
        z-index: 1030;
        background: var(--body-bg, #fff);
        padding-top: env(safe-area-inset-top);
        border-bottom: 1px solid #ddd;
    }
    .o_hiperasia_pwa_toolbar { padding-inline: max(.75rem, env(safe-area-inset-left)) max(.75rem, env(safe-area-inset-right)); }
    .o_hiperasia_pwa_nav .btn { min-height: 48px; }
}

.o_hiperasia_pwa_nav .btn,
.o_hiperasia_pwa_guide .btn {
    min-height: 44px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    white-space: normal;
}

.o_hiperasia_pwa_offline {
    padding-left: max(1rem, env(safe-area-inset-left));
    padding-right: max(1rem, env(safe-area-inset-right));
}

.o_hiperasia_pwa_guide {
    max-width: 60rem;
    padding-bottom: max(1.5rem, env(safe-area-inset-bottom));
    overflow-wrap: anywhere;
}

.o_hiperasia_pwa_guide .o_hiperasia_pwa_icon {
    flex: 0 0 64px;
    object-fit: contain;
}

.o_hiperasia_pwa_guide li + li {
    margin-top: .65rem;
}

.o_hiperasia_pwa_guide .card {
    border-color: rgba(0, 0, 0, .12);
    box-shadow: none;
}

.o_hiperasia_pwa_help summary {
    cursor: pointer;
    min-height: 44px;
    padding-block: .65rem;
}

.o_hiperasia_pwa_nav a:focus-visible,
.o_hiperasia_pwa_guide a:focus-visible,
.o_hiperasia_pwa_guide button:focus-visible {
    outline: 3px solid currentColor;
    outline-offset: 3px;
}

.o_hiperasia_pwa_help summary:focus-visible {
    outline: 3px solid currentColor;
    outline-offset: 3px;
}

@media (max-width: 575.98px) {
    [data-hiperasia-pwa-root] .o_portal_docs .o_portal_icon {
        flex-basis: 48px;
        width: 48px;
    }

    [data-hiperasia-pwa-root] .o_portal_docs .o_portal_icon img {
        width: 48px;
        height: 48px;
    }

    .o_hiperasia_pwa_guide .btn {
        width: 100%;
    }

    .o_hiperasia_pwa_nav .container {
        padding-left: 0;
        padding-right: 0;
    }
}