/* Responsive shell corrections kept outside CSS isolation so deployed clients
   receive the same layout behavior even when an older scoped bundle is cached. */

@media (min-width: 901px) {
    .app-layout.layout-horizontal {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 100vh;
    }

    .layout-horizontal .workspace,
    .layout-horizontal .topbar,
    .layout-horizontal .page-content {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        box-sizing: border-box;
    }

    .layout-horizontal .topbar {
        height: 64px !important;
    }

    .layout-horizontal .horizontal-navigation {
        display: block !important;
        width: 100% !important;
        height: 46px !important;
        position: sticky;
        top: 64px;
        z-index: 49;
        overflow: visible !important;
        background: #10241d;
    }

    .layout-horizontal .horizontal-navigation .nav-menu.nav-horizontal {
        display: flex !important;
        flex-direction: row !important;
        align-items: stretch !important;
        width: 100% !important;
        max-width: 100% !important;
        height: 46px !important;
        min-height: 46px !important;
        overflow: visible !important;
    }

    .layout-horizontal .nav-horizontal .nav-header,
    .layout-horizontal .nav-horizontal .nav-footer {
        display: none !important;
    }

    .layout-horizontal .nav-horizontal .nav-scroll {
        display: flex !important;
        flex: 1 1 auto;
        align-items: stretch !important;
        gap: 2px;
        width: 100% !important;
        height: 46px !important;
        min-width: 0 !important;
        min-height: 46px !important;
        padding: 0 14px !important;
        overflow: visible !important;
        box-sizing: border-box;
    }

    .layout-horizontal .nav-horizontal .nav-group {
        position: relative;
        flex: 0 0 auto;
        margin: 0;
    }

    .layout-horizontal .nav-horizontal .nav-group-title {
        height: 46px;
        padding: 0 13px;
        display: flex;
        align-items: center;
        gap: 7px;
        color: #c8d7d0;
        font-size: .76rem;
        letter-spacing: 0;
        text-transform: none;
        white-space: nowrap;
    }

    .layout-horizontal .nav-horizontal .nav-group-links {
        width: 224px;
        max-height: min(70vh, 560px);
        padding: 7px;
        position: absolute;
        top: 42px;
        left: 0;
        z-index: 70;
        display: none;
        gap: 2px;
        overflow-y: auto;
        border: 1px solid rgba(255,255,255,.1);
        border-radius: 0 0 10px 10px;
        background: #10241d;
        box-shadow: 0 16px 38px rgba(7,20,15,.28);
        box-sizing: border-box;
    }

    .layout-horizontal .nav-horizontal .nav-group[open] > .nav-group-links {
        display: grid !important;
    }

    .layout-horizontal .nav-horizontal .nav-group:not([open]) > .nav-group-links {
        display: none !important;
    }

    .layout-horizontal .nav-horizontal .nav-item,
    .layout-horizontal .nav-horizontal .nav-link {
        min-height: 34px;
        padding: 0 10px 0 30px;
        display: flex;
        align-items: center;
        position: relative;
        border-radius: 8px;
        color: #bfd0c7;
        text-decoration: none;
        font-size: .76rem;
    }
}

@media (max-width: 900px) {
    .layout-horizontal .horizontal-navigation { display: none !important; }
}

.jobcalendar-filter-toggle {
    min-height: 38px;
    padding: 8px 12px;
    flex: 0 0 auto;
    border: 1px solid #bfd2ca;
    border-radius: 10px;
    background: #edf5f1;
    color: #0f5a43;
    font-size: .78rem;
    font-weight: 750;
    white-space: nowrap;
    cursor: pointer;
}

.jobcalendar-filter-toggle:hover { background: #dfede7; }

.jobcalendar-toolbar.filters-collapsed {
    padding: 10px 14px;
    flex-wrap: nowrap;
}

.jobcalendar-toolbar.filters-collapsed .jobcalendar-toolbar-right {
    min-width: 0;
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

@media (max-width: 760px) {
    .jobcalendar-toolbar.filters-collapsed {
        align-items: stretch;
        flex-wrap: wrap;
    }

    .jobcalendar-toolbar.filters-collapsed .jobcalendar-filter-toggle {
        order: 2;
    }

    .jobcalendar-toolbar.filters-collapsed .jobcalendar-toolbar-right {
        order: 1;
        width: 100%;
        flex: 1 0 100%;
        justify-content: flex-start;
        overflow-x: auto;
    }
}

@media (max-width: 620px) {
    .myprofile-hero {
        display: grid !important;
        grid-template-columns: 64px minmax(0, 1fr) !important;
        align-items: start !important;
        gap: .8rem !important;
        padding: 1rem !important;
    }

    .myprofile-avatar {
        width: 64px !important;
        height: 64px !important;
        border-radius: 18px !important;
        font-size: 1.35rem !important;
    }

    .myprofile-identity h1 {
        font-size: clamp(1.55rem, 9vw, 2rem) !important;
        line-height: 1.05 !important;
        overflow-wrap: anywhere;
    }

    .myprofile-identity p { line-height: 1.35; }
    .myprofile-badges { gap: .35rem; }

    .myprofile-hero-actions {
        grid-column: 1 / -1;
        display: grid !important;
        grid-template-columns: 1fr;
        width: 100%;
        gap: .5rem;
    }

    .myprofile-hero-actions button {
        width: 100% !important;
        min-width: 0;
        min-height: 42px;
        margin: 0 !important;
    }

    .jobcalendar-workspace.is-expanded {
        width: auto !important;
        max-width: 100vw !important;
        gap: 8px !important;
        padding: 8px !important;
        box-sizing: border-box;
    }

    .jobcalendar-workspace.is-expanded .jobcalendar-toolbar,
    .jobcalendar-workspace.is-expanded .jobcalendar-dispatch-layout,
    .jobcalendar-workspace.is-expanded .jobcalendar-main,
    .jobcalendar-workspace.is-expanded .jobcalendar-agenda,
    .jobcalendar-workspace.is-expanded .jobcalendar-agenda-day {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }

    .jobcalendar-workspace.is-expanded .jobcalendar-toolbar {
        max-height: none !important;
        overflow: visible !important;
    }

    .jobcalendar-workspace.is-expanded .jobcalendar-toolbar > * {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .jobcalendar-workspace.is-expanded .jobcalendar-view-switch {
        display: flex !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
        overflow-x: auto;
    }

    .jobcalendar-workspace.is-expanded .jobcalendar-view-switch button {
        flex: 1 0 auto;
        padding: .48rem .65rem;
    }

    .jobcalendar-workspace.is-expanded .jobcalendar-dispatch-layout {
        overflow-x: hidden !important;
        overflow-y: auto !important;
    }

    .jobcalendar-workspace.is-expanded .jobcalendar-agenda-day > header {
        gap: .5rem;
        padding: .7rem;
    }

    .jobcalendar-workspace.is-expanded .jobcalendar-agenda-heading {
        flex-wrap: wrap;
        gap: .35rem;
    }

    .jobcalendar-workspace.is-expanded .jobcalendar-agenda-heading strong {
        white-space: normal;
    }
}
