@import '_content/MHDS.SharedQueue/MHDS.SharedQueue.qt6qhi94pq.bundle.scp.css';
@import '_content/Microsoft.AspNetCore.Components.QuickGrid/Microsoft.AspNetCore.Components.QuickGrid.25o87uqmvr.bundle.scp.css';

/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-0631327ce5] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    overflow: visible !important;
}

.top-row[b-0631327ce5] {
    width: 100%;
    background: #f5f4ee;
    border-bottom: 1px solid #d6d5d5;
    height: 3.5rem;
    display: flex;
    align-items: center;
    /* Add your topbar styles here */
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    z-index: 10;
}

.main-area[b-0631327ce5] {
    display: flex;
    flex: 1;
    min-height: 0;
    overflow: visible !important;
}

.sidebar[b-0631327ce5] {
    width: 250px;
    min-width: 250px;
    background-color: #f5f4ee;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    box-shadow: 2px 0 8px rgba(0,0,0,0.03);
    border-right: 1px solid #e0e0e0;
    background: linear-gradient(180deg, #f5f4ee 90%, #ecebe3 100%);
    overflow: visible !important;
}

.sidebar-logo[b-0631327ce5] {
    width: 100%;
    text-align: center;
}

main[b-0631327ce5] {
    flex: 1;
    min-width: 0;
    background: #fff;
    padding: 2rem 2.5vw 1.5rem 2.5vw;
}

/* Sticky footer layout in the layout wrapper */
.wrapper[b-0631327ce5] {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

/* Let the page content grow and push footer down */
.content[b-0631327ce5] {
    flex: 1 1 auto;
}

/* Footer styling */
.footer[b-0631327ce5] {
    margin-top: auto; /* stick to bottom when content is short */
    background: #f8f8f2;
    border-top: 1px solid #e0e0e0;
    color: #4a4a4a;
    font-size: 1rem;
    padding: 1.25rem 2vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    flex-wrap: wrap;
}

/* Hide the <hr/> since we draw the border on the footer */
.footer > hr[b-0631327ce5] {
    display: none;
}

/* Footer links */
.footer a[b-0631327ce5] {
    color: #2b5c9c;
    text-decoration: none;
}

.footer a:hover[b-0631327ce5],
.footer a:focus[b-0631327ce5] {
    text-decoration: underline;
}

/* Small text helper if you add any */
.footer small[b-0631327ce5] {
    color: #6b6b6b;
}

/* Responsive: center on small screens */
@media (max-width: 640.98px) {
    .main-area[b-0631327ce5] {
        flex-direction: column;
    }
    .sidebar[b-0631327ce5] {
        width: 100%;
        min-width: 0;
        min-height: 60px;
    }
    .footer[b-0631327ce5] {
        justify-content: center;
        text-align: center;
    }
    main[b-0631327ce5] {
        padding: 1rem 0.5rem;
    }
    .sidebar[b-0631327ce5] {
        min-height: 48px;
    }
}

/* Dark mode */
@media (prefers-color-scheme: dark) {
    main[b-0631327ce5] {
        background: #141414;
    }
    .sidebar[b-0631327ce5], .top-row[b-0631327ce5], .footer[b-0631327ce5] {
        background: #1f1f1f;
        border-color: #333;
        color: #ddd;
    }
    .footer a[b-0631327ce5] {
        color: #94b8ff;
    }
}

/* Print */
@media print {
    .footer[b-0631327ce5] {
        background: transparent;
        color: #000;
        border-top: 1px solid #000;
    }
}

#blazor-error-ui[b-0631327ce5] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss[b-0631327ce5] {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-fccqizin4v] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-fccqizin4v] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-fccqizin4v] {
    view-height: 8px;   /* was 75px inline */
    height: auto !important;
    margin-bottom: .5rem !important;   /* was 75px inline */
    padding-top: .25rem;
    padding-bottom: .25rem;
}
    .top-row a.brand-logo[b-fccqizin4v] {
        overflow: visible; /* override earlier overflow:hidden */
        display: flex;
        align-items: center;
    }

        .top-row a.brand-logo img[b-fccqizin4v] {
            max-height: clamp(80px, 9vh, 150px); /* grows with viewport, caps at 110px */
            width: auto;
            height: auto;
            display: block;
        }
.navbar-brand[b-fccqizin4v] {
    font-size: 1.1rem;
}

.bi[b-fccqizin4v] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-fccqizin4v] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-fccqizin4v] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-fccqizin4v] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-fccqizin4v] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-fccqizin4v] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-fccqizin4v] {
        padding-bottom: 1rem;
    }

    .nav-item[b-fccqizin4v]  .nav-link {
        color: #4e5438;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

    .nav-item[b-fccqizin4v]  a.active {
        background-color: rgba(255,255,255,0.1);
        color: #3e3854;
    }

    .nav-item[b-fccqizin4v]  .nav-link:hover {
        background-color: rgba(255,255,255,0.1);
        color: #3e3854;
    }

.nav-scrollable[b-fccqizin4v] {
    display: none;
    overflow: visible !important; /* CRITICAL: allow submenus to escape */
}

.navbar-toggler:checked ~ .nav-scrollable[b-fccqizin4v] {
    display: block;
    max-height: none; /* Remove max-height animation that requires overflow:hidden */
}

.top-row.ps-3[b-fccqizin4v] { padding-left: 0 !important; }

.top-row .container-fluid[b-fccqizin4v] {
    display: flex;
    align-items: center;
    justify-content: center;   /* centers logo (and hr) */
    gap: .5rem;
}



/* Ensure navbar can accommodate the larger logo */
.top-row.navbar[b-fccqizin4v] {
  align-items: center;
  min-height: 70px;
}

/* Responsive tweaks */
@media (max-width: 576px) {
  .brand-logo img[b-fccqizin4v] {
    height: 48px;
  }
}
@media (min-width: 992px) {
  .brand-logo img[b-fccqizin4v] {
    height: 72px;
  }
}

/* Make the hr not add extra vertical space */
.top-row .container-fluid hr[b-fccqizin4v] {
    margin: 0;                  /* remove 10px inline margins */
    border: 0;
    border-top: 1px solid rgba(78,84,56,.25); /* subtle brand line */
    width: 160px;               /* optional: slightly narrower */
}

/* Remove big gap before the menu items */
.nav-scrollable[b-fccqizin4v] {
    margin-top: 0 !important;   /* was 100px inline */
}

@media (min-width: 641px) {
    .navbar-toggler[b-fccqizin4v] {
        display: none;
    }

    .nav-scrollable[b-fccqizin4v] {
        display: block;
        height: calc(100vh - 3.5rem);
        overflow: visible !important; /* Keep visible for submenus */
    }
}
@media (max-width:640.98px) {
    .top-row a.brand-logo img[b-fccqizin4v] {
        max-height: 72px; /* was 56px */
    }
}

/* Highlight active nav item with a left border */
.nav-item a.active[b-fccqizin4v] {
    border-left: 4px solid #7c5e99;
    background: #f3f0fa;
    color: #3e3854;
    font-weight: 600;
}

/* Add hover effect for nav items */
.nav-item .nav-link:hover[b-fccqizin4v] {
    background: #ede9f6;
    color: #3e3854;
    transition: background 0.15s, color 0.15s;
}

/* Add spacing between nav items */
.nav-item[b-fccqizin4v] {
    margin-bottom: 0.25rem;
}

/* Make icons more visible */
.nav-item .bi[b-fccqizin4v] {
    filter: drop-shadow(0 1px 1px rgba(124,94,153,0.08));
}

/* Responsive: collapse menu with smooth transition */
.nav-scrollable[b-fccqizin4v] {
    transition: max-height 0.3s ease;
    overflow: hidden;
}
.navbar-toggler:checked ~ .nav-scrollable[b-fccqizin4v] {
    max-height: 1000px;
}

/* Add this at the end of the file */

/* Ensure DxMenu submenus can escape the nav container */
.nav-scrollable[b-fccqizin4v] {
    overflow: visible !important;
}

/* Force submenu popups to appear above all content */
.dxbl-menu .dxbl-popup[b-fccqizin4v],
.drawer-menu .dxbl-popup[b-fccqizin4v] {
    z-index: 10001 !important;
    position: fixed !important;
}

/* Add at the end of the file */

/* Ensure the menu has proper stacking context for submenus */
.drawer-menu.dxbl-menu[b-fccqizin4v] {
    position: relative;
    z-index: 1000;
}

/* DevExpress submenu dropdown - force it to appear */
.dxbl-menu .dxbl-dropdown-dialog[b-fccqizin4v],
.dxbl-menu .dxbl-menu-dropdown[b-fccqizin4v] {
    z-index: 10001 !important;
    display: block !important;
}

/* Visual grouping in the drawer: the day-to-day tools, then the MHDS account section, then
   sign out. The hairline reuses the same colour as the divider under the logo so the sidebar
   reads as one system — it should register as a change of subject, not as a border. */
.nav-group[b-fccqizin4v] {
    margin-top: .85rem;
    padding-top: .85rem;
    border-top: 1px solid rgba(78, 84, 56, .18);
}

/* Sign out gets more room above it: it leaves the app rather than navigating inside it. */
.nav-group-signout[b-fccqizin4v] {
    margin-top: 1.75rem;
}

/* Logout button styled to match drawer menu items */
.drawer-menu-logout[b-fccqizin4v] {
    padding: 0;              /* remove extra horizontal offset */
    margin-top: .125rem;
}

.menu-logout-btn[b-fccqizin4v] {
    width: 100%;
    height: 3rem;
    display: flex;
    align-items: center;
    border: none;
    border-radius: 4px;
    background: transparent;
    color: #4e5438;
    font: inherit;
    font-size: 0.9rem;
    text-align: left;
    cursor: pointer;
}

.menu-logout-btn .bi[b-fccqizin4v] {
    margin-right: .75rem;
    position: static;        /* cancel global .bi position offset */
    top: 0;
}
/* /Components/Pages/QueueApprovalsPage.razor.rz.scp.css */
/* Matches the Current Work page: title carried by size and colour, not by a card, and the
   intro line in the brand text colour. Scoped, so the shared .view-irm-header and .title-text
   used elsewhere in the app are untouched. */

.view-irm-header[b-vq522m5wdp] {
    background: none;
    border: 0;
    box-shadow: none;
    padding: 0;
}

.title-text[b-vq522m5wdp] {
    font-family: var(--heading-font, system-ui);
    font-size: 1.85rem;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: .2px;
    color: var(--brand-plum, #3e3854);
}

/* Same treatment as .cq-lede on the queue board. */
.text-muted[b-vq522m5wdp] {
    font-size: .88rem;
    color: var(--brand-olive, #475467) !important;   /* !important: beats Bootstrap's .text-muted */
    max-width: none;
}

@media (max-width: 560px) {
    .title-text[b-vq522m5wdp] { font-size: 1.45rem; }
}
/* /Components/Pages/QueueStatusPage.razor.rz.scp.css */
/* Scoped to the Current Work page, so the shared .view-irm-header / .title-text used across
   the rest of the app are untouched. Colours come from the brand variables in app.css rather
   than new ones, so this stays in step if the palette changes.

   No card around the title: it sits directly on the page, carried by size and colour alone. */

.view-irm-header[b-jqmw1cox4x] {
    background: none;
    border: 0;
    box-shadow: none;
    padding: 0;
}

.title-text[b-jqmw1cox4x] {
    font-family: var(--heading-font, system-ui);
    font-size: 1.85rem;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: .2px;
    color: var(--brand-plum, #3e3854);
}

@media (max-width: 560px) {
    .title-text[b-jqmw1cox4x] { font-size: 1.45rem; }
}
/* /Components/Pages/Welcome.razor.rz.scp.css */
/* FocusOnNavigate (Routes.razor) focuses the page h1 on navigation for screen
   readers; suppress the visible focus ring — the heading isn't interactive. */
.welcome-title:focus[b-xf3ledcks8],
.welcome-title:focus-visible[b-xf3ledcks8] {
    outline: none;
}