@import '_content/BlazorColorPicker/BlazorColorPicker.d6615pwxbx.bundle.scp.css';
@import '_content/Blazored.Modal/Blazored.Modal.bundle.scp.css';

/* _content/ActionLog.Web/Shared/MainLayout.razor.rz.scp.css */
body[b-pnoudsbnqo] {
    /*background-color: #f7f7f7 !important;*/
}

.page[b-pnoudsbnqo] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-pnoudsbnqo] {
    flex: 1;
}

/* Make navbar-toggler smaller on mobile devices */
.navbar-toggler-icon[b-pnoudsbnqo] {
    width: 1em;
    height: 1em;
}

/* Fix mobile navbar width issues */
@media (max-width: 576px) {
    .navbar[b-pnoudsbnqo] {
        padding: 0.25rem 0.5rem !important;
        overflow-x: hidden;
        width: 100vw !important;
        max-width: 100vw !important;
        box-sizing: border-box;
    }

    .container-fluid[b-pnoudsbnqo] {
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
        max-width: 100% !important;
        width: 100% !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
    }

    .navbar-brand[b-pnoudsbnqo] {
        font-size: 0.9rem !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: calc(100vw - 100px) !important;
        /* More space for toggler */
        flex-shrink: 1;
        margin-right: 0.5rem !important;
    }

    .navbar-brand strong[b-pnoudsbnqo] {
        font-size: 0.85rem;
    }

    .navbar-brand img.logo[b-pnoudsbnqo] {
        width: 18px !important;
        height: 18px !important;
        margin-right: 0.25rem !important;
    }

    .navbar-toggler[b-pnoudsbnqo] {
        padding: 0.2rem 0.3rem !important;
        font-size: 0.8rem !important;
        border: 1px solid rgba(255, 255, 255, 0.2) !important;
        flex-shrink: 0 !important;
        width: auto !important;
        height: auto !important;
        min-width: 30px;
        margin-left: auto !important;
    }

    .navbar-toggler-icon[b-pnoudsbnqo] {
        width: 0.8em !important;
        height: 0.8em !important;
    }

    /* Fix navbar-collapse layout on mobile */
    [b-pnoudsbnqo] .navbar-collapse {
        margin-top: 0.5rem !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    [b-pnoudsbnqo] .navbar-collapse.show,
    [b-pnoudsbnqo] .navbar-collapse.collapsing {
        display: block !important;
        width: 100% !important;
    }

    /* Style collapsed navbar items */
    [b-pnoudsbnqo] .navbar-collapse .btn,
    [b-pnoudsbnqo] .navbar-collapse a,
    [b-pnoudsbnqo] .navbar-collapse>div {
        display: inline-block !important;
    }


    /* Ensure LoginControl and other components get proper spacing */
    [b-pnoudsbnqo] .navbar-collapse>* {
        margin: 0.25rem 0.5rem !important;
        display: inline-block !important;
        vertical-align: middle !important;
    }

    [b-pnoudsbnqo] .navbar-collapse>*:last-child {
        display: block !important;
    }
}

@media (min-width: 641px) {
    .page[b-pnoudsbnqo] {
        flex-direction: row;
    }
}
