.print-layout {
  display: none;
}

@media print {
  #root {
    display: none !important;
  }
  .print-layout {
    display: block !important;
  }
}/* styles.css in themeV2 */
/* Keep this minimal so it doesn't fight MUI's CssBaseline */
/* 1) predictable box model */
*,
*::before,
*::after {
    box-sizing: border-box;
}
/* 2) layout baseline */
html,
body,
#root {
    min-height: 100%;
}
/* 3) base body */
body {
    margin: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
/* 4) media elements behave */
img,
svg,
video,
canvas {
    display: block;
    max-width: 100%;
    height: auto;
}
/* 5) lists default (let components decide) */
ol[role],
ul[role] {
    list-style: none;
    padding: 0;
    margin: 0;
}
/* 6) accessible focus ring with your brand */
/* Global focus reset (⚠ removes visible focus ring) */
*:focus,
*:focus-visible {
    outline: none !important;
}
input:focus,
select:focus,
textarea:focus,
button:focus,
[tabindex]:focus,
[role="button"]:focus {
    outline: none !important;
    box-shadow: none !important;
}
/* Firefox inner focus */
::-moz-focus-inner {
    border: 0;
}
/* 7) tables (safe) */
table {
    border-collapse: collapse;
    border-spacing: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    margin-block: 0;
    /* removes top & bottom margin */
}
/* Enable where typography matters */
.article-text,
.marketing-copy {
    font-feature-settings: "liga" on, "clig" on;
}
:root {
    /* Radius */
    --radius-xs: .25rem;
    /* 4px */
    --radius-sm: .375rem;
    /* 6px */
    --radius-md: .5rem;
    /* 8px */
    --radius-lg: .75rem;
    /* 12px */
    --radius-xl: 1rem;
    /* 16px */
    --radius-pill: 9999px;

    /* Spacing scale (rem) */
    --space-0: 0;
    /* 4px */
    --space-1: .25rem;
    /* 8px */
    --space-2: .5rem;
    /* 12px */
    --space-3: .75rem;
    /* 16px */
    --space-4: 1rem;
    /* 24px */
    --space-5: 1.5rem;
    /* 32px */
    --space-6: 2rem;
    /* 48px */
    --space-7: 3rem;
    /* 64px */
    --space-8: 4rem;


    /* Borders & focus */
    --border-width-1: 1px;
    --border-width-2: 2px;
    --focus-ring-width: 2px;
    --focus-ring-offset: 2px;

    /* Elevation */
    --shadow-1: 0 2px 1px -1px rgba(95, 101, 119, 0.07);
    --shadow-2: 0 2px 6px rgba(16, 24, 40, .12), 0 1px 2px rgba(16, 24, 40, .08);
    --shadow-3: 0 4px 12px rgba(16, 24, 40, .14), 0 2px 4px rgba(16, 24, 40, .10);
    --shadow-inset: inset 0 0 0 1px #BDC9DB;


    /* Controls */
    --control-h-sm: 2rem;
    /* 32px */
    --control-h-md: 2.5rem;
    /* 40px */
    --control-h: 2.875rem;
    /* 46px */
    --control-h-lg: 3rem;
    /* 48px */
    --control-radius: var(--radius-md);
    --control-px: .75rem;
    /* 12px */

    /* Layout */
    --container-max: 80rem;
    /* 1280px */
    --drawer-w-open: 17.5rem;
    /* 280px */
    --drawer-w-closed: 5.75rem;
    /* 92px */
    --topbar-h: 3.5rem;
    /* 56px */

    /* Motion */
    --duration-fast: 120ms;
    --duration-base: 180ms;
    --duration-slow: 240ms;
    --easing-standard: cubic-bezier(.2, 0, 0, 1);

    /* Overlays */
    --overlay: rgba(0, 0, 0, .45);

    /* App layout helpers */
    --drawer-open: clamp(17.5rem, 22vw, 23.75rem);
    --drawer-closed: 68px;

    /* Consistent scrollbars (Chromium/Safari/Edge + Firefox) */
    --scrollbar-size: .25rem;
    --scrollbar-radius: var(--radius-xs);
    --scrollbar-radius-hover: var(--radius-lg);
    --scrollbar-track: var(#EFF9FE);
    --scrollbar-thumb: #BDC9DB;
    --scrollbar-thumb-hover: #BDC9DB;

    /* Z-Index Scale */
    --z-auto: auto;
    --z-0: 0;
    --z-10: 10;
    --z-20: 20;
    --z-30: 30;
    --z-40: 40;
    --z-50: 50;
    --z-dropdown: 1000;
    --z-sticky: 1020;
    --z-fixed: 1030;
    --z-modal-backdrop: 1040;
    --z-modal: 1050;
    --z-popover: 1060;
    --z-tooltip: 1070;
    --z-toast: 1080;
}
:root{
    --fs-root: 16px;
    --font-family: 'Open Sans', Helvetica, Arial, sans-serif;

    --fw-regular: 400;
    --fw-medium: 500;
    --fw-semibold: 600;
    --fw-bold: 700;
    --fw-xbold: 800;

    /* Font sizes (rem) + unitless line-height RATIOS */
    --fs-display: 2rem;     --lh-display: 1.25;  /* 48/60 */
    --fs-h1:      1.75rem;  --lh-h1:      1.286; /* 28/36 */
    --fs-h2:      1.5rem;   --lh-h2:      1.25;  /* 24/30 */
    --fs-h3:      1.25rem;  --lh-h3:      1.3;   /* 20/26 */
    --fs-h4:      1.125rem; --lh-h4:      1.333; /* 18/24 */
    --fs-h5:      1.125rem; --lh-h5:      1.333; /* 18/24 */
    --fs-body:    1rem;     --lh-body:    1.25;  /* 16/20 */
    --fs-caption: .875rem;  --lh-caption: 1.429; /* 14/20 */
    --fs-label:   1rem;     --lh-label:   1.5;   /* 16/24 */
    --fs-eyebrow: .625rem;  --lh-eyebrow: 1.4;   /* 10/14 */
    --ls-eyebrow: .2em;
}
:root[data-brand="fastenal"][data-mode="light"] {
    /* These are the raw colors that make up the palette */
    --color-primary-0: #FFFFFF;
    --color-primary-100: #DDDDDD;
    --color-primary-500: #00599C;
    --color-primary-900: #1C1B1A;

    --color-secondary-100: #5A5858;
    --color-secondary-500: #003B69;

    --color-accent-success-500: #296600;
    --color-accent-error-500: #AE0922;
    --color-accent-warning-500: #F6C514;

    /* Standard Colors */
    --color-white: var(--color-primary-0);
    --color-black: var(--color-primary-900);
    --color-light-grey: var(--color-primary-100);
    --color-grey: var(--color-secondary-100);


    /* Colors not from pallet */
    --secondary-3: #BDD3E5;

    --color-scrollbar-bg: #99B1C3;

    /* Global background */
    --color-background: #F6F7FA;

    /* Sidebar */
    --color-sidebar-bg: var(--color-primary-500);
    --color-sidebar-section-divider: #0C4A79;
    --color-sidebar-header-avatar: var(--color-primary-0);
    --color-sidebar-header-burger: var(--color-primary-0);

    --color-sidebar-section-title: #9BD4FF;

    --color-sidebar-menu-text: var(--color-primary-0);
    --color-sidebar-menu-text-active: var(--color-primary-0);
    --color-sidebar-menu-bg-hover: var(--color-secondary-500);
    --color-sidebar-menu-bg-active: var(--color-secondary-500);
    --color-sidebar-subenu-text: var(--color-sidebar-section-title);

    --color-sidebar-footer-avatar-bg: var(--color-primary-0);
    --color-sidebar-footer-avatar-text: var(--color-secondary-500);
    --color-sidebar-footer-username: var(--color-primary-0);
    --color-sidebar-footer-email: var(--color-primary-0);
    --color-sidebar-footer-icon: var(--color-primary-0);

    /* Breadcrumbs */
    --color-Breadcrumbs-text: var(--color-primary-500);
    --color-Breadcrumbs-muted: var(--color-secondary-100);
    --color-Breadcrumbs-divider: var(--color-secondary-100);

    /* Topbar */
    --color-topbar-bg: var(--color-primary-0);
    --color-topbar-chip-bg: #E6EFF5;
    --color-topbar-border: #ECEDF0;
    --shadow-topbar: 0 2px 1px -1px rgba(95, 101, 119, 0.07);

    /* Paper (cards, form containers) */
    --color-paper-bg: #FFFFFF;
    --color-paper-border: #E6E6E6;
    --shadow-paper: 0 2px 8px 1px rgba(0, 0, 0, 0.03);

    /* Text Colors */
    --color-text-heading: var(--color-primary-500);
    --color-text-subheading: #5A5858;

    --color-text-body: var(--color-primary-900);
    --color-text-secondary: #5A5858;
    --color-text-muted: #DDDDDD;
    --color-text-inverse: var(--color-primary-0);

    --color-text-link: #00599C;
    --color-text-link-hover: #003B69;
    --color-text-link-visited: #4B0082;

    --color-text-success: #296600;
    --color-text-error: #AE0922;
    --color-text-warning: #F6C514;

    /* Controls */
    --color-control-border: #B3C5D2;
    --color-control-border-hover: var(--color-primary-500);
    --color-control-border-focus: var(--color-primary-500);
    --color-control-border-disabled: #E0E6EB;

    --color-control-bg: #FFFFFF;
    --color-control-bg-hover: #F8FAFB;
    --color-control-bg-focus: #FFFFFF;
    --color-control-bg-disabled: #ECEFF1;

    --color-control-text: var(--color-primary-900);
    --color-control-text-placeholder: #90A4AE;
    --color-control-text-disabled: rgba(38, 50, 56, 0.38);
    --color-control-shadow-focus: 0 0 0 2px rgba(0, 89, 156, 0.25);

    --color-control-icon: var(--color-primary-500);

    /* Page Headings */
    --color-page-title-text: var(--color-primary-500);
    --color-standard-heading-text: var(--color-primary-500);

    /* Data Grid */
    --color-datagrid-bg: var(--color-primary-0);
    --color-datagrid-row-hover: #E1F5FE;
    --color-datagrid-row-alter: #F2F5F7;

    /* Deprecated Colors-Don't use these colors */
    --primary-3: #2E3F56;
}
:root[data-brand="fastenal"][data-mode="dark"] {
    /* These are the raw colors that make up the palette */
    --color-primary-0: #FFFFFF;
    --color-primary-100: #DDDDDD;
    --color-primary-500: #00599C;
    --color-primary-900: #1C1B1A;

    --color-secondary-100: #5A5858;
    --color-secondary-500: #003B69;

    --color-accent-success-500: #296600;
    --color-accent-error-500: #AE0922;
    --color-accent-warning-500: #F6C514;

    /* Colors not from pallet */
    --secondary-3: #BDD3E5;

    --color-scrollbar-bg: #99B1C3;

    /* Global background */
    --color-background: #F6F7FA;

    /* Sidebar */
    --color-sidebar-bg: var(--color-secondary-500);
    --color-sidebar-section-divider: #0C4A79;
    --color-sidebar-header-avatar: var(--color-primary-0);
    --color-sidebar-header-burger: var(--secondary-3);

    --color-sidebar-section-title: #6AA6D4;

    --color-sidebar-menu-text: var(--secondary-3);
    --color-sidebar-menu-text-active: var(--color-primary-0);
    --color-sidebar-menu-bg-hover: rgba(0, 0, 0, 0.14);
    --color-sidebar-menu-bg-active: rgba(0, 0, 0, 0.14);
    --color-sidebar-subenu-text: #6AA6D4;

    --color-sidebar-footer-avatar: #B3E5FC;

    /* Breadcrumbs */
    --color-Breadcrumbs-text: var(--color-secondary-500);
    --color-Breadcrumbs-muted: var(--color-secondary-100);
    --color-Breadcrumbs-divider: var(--color-secondary-100);

    /* Topbar */
    --color-topbar-bg: #FFFFFF;
    --color-topbar-chip-bg: #EBF4FC;
    --color-topbar-border: #E9E9E9;
    --shadow-topbar: 0 2px 1px -1px rgba(95, 101, 119, 0.07);

    /* Paper (cards, form containers) */
    --color-paper-bg: #FFFFFF;
    --color-paper-border: #E6E6E6;
    --shadow-paper: 0 2px 8px 1px rgba(0, 0, 0, 0.03);

    /* Text Colors */
    --color-text-heading: var(--color-secondary-500);
    --color-text-subheading: #5A5858;

    --color-text-body: var(--color-primary-900);
    --color-text-secondary: #5A5858;
    --color-text-muted: #DDDDDD;
    --color-text-inverse: var(--color-primary-0);

    --color-text-link: #00599C;
    --color-text-link-hover: #003B69;
    --color-text-link-visited: #4B0082;

    --color-text-success: #296600;
    --color-text-error: #AE0922;
    --color-text-warning: #F6C514;

    /* Controls */
    --color-control-border: #B3C5D2;
    --color-control-border-hover: #1A6AA6;
    --color-control-border-focus: var(--color-secondary-500);
    --color-control-border-disabled: #E0E6EB;

    --color-control-bg: #FFFFFF;
    --color-control-bg-hover: #F8FAFB;
    --color-control-bg-focus: #FFFFFF;
    --color-control-bg-disabled: #ECEFF1;

    --color-control-text: var(--color-primary-900);
    --color-control-text-placeholder: #90A4AE;
    --color-control-text-disabled: rgba(38, 50, 56, 0.38);
    --color-control-shadow-focus: 0 0 0 2px rgba(0, 89, 156, 0.25);

    --color-control-icon: rgba(102, 137, 165, 1);

    /* Page Headings */
    --color-page-title-text: var(--color-secondary-500);
    --color-standard-heading-text: var(--color-secondary-500);

    /* Data Grid */
    --color-datagrid-bg: var(--color-primary-0);


    /* Deprecated Colors-Don't use these colors */
    --primary-3: #2E3F56;
}
/* Base (and phones — mobile not in scope but safe floor) */
html {
  font-size: clamp(14px, 0.4vw + 0.52rem, 18px);
}
body {
  background: var(--color-background) !important;
  color: var(--color-text-body);
  font-family: var(--font-family);
  font-size: 0.875rem;

  /* Global reset: disable ligatures */
  font-feature-settings: 'liga' off, 'clig' off;
  -webkit-font-smoothing: antialiased;
}
code {
  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
    monospace;
}
/* Apply to all scrollable elements */
* {
  /* Firefox */
  scrollbar-color: var(--color-scrollbar-bg) transparent;
}
/* Chrome, Edge, Safari */
*::-webkit-scrollbar {
  width: var(--scrollbar-size);
  height: var(--scrollbar-size);
  transition: width 0.2s ease, height 0.2s ease;
}
*::-webkit-scrollbar-track {
  background: transparent;
}
/* Hover effect: expand scrollbar */
*::-webkit-scrollbar:hover {
  width: var(--scrollbar-size-hover);
  height: var(--scrollbar-size-hover);
}
*::-webkit-scrollbar-thumb {
  background-color: transparent;
  border-radius: var(--scrollbar-radius);
}
.MuiDataGrid-root {
  padding-right: 0% !important;
}
/* For Custom Bin Auto Complete */
.MuiAutocomplete-root .MuiOutlinedInput-root {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
/* Datatime Picker Adjustments */
.dateAutoComplete {
  height: 2.875rem;
  line-height: 2.875rem;

  .MuiPickersSectionList-root {
    font-size: 0.875rem;
    color: var(--color-text-body);
    font-weight: var(--fw-medium, 500);
    padding: 0.8rem 0 !important;
  }

  .MuiInputAdornment-root {
    max-height: 2.875rem !important;
  }

  .MuiPickersOutlinedInput-notchedOutline {
    border-color: var(--color-control-border);
  }

  .MuiBox-root {
    top: 0.375rem;
  }
}/* ===============================
   Sticky header
   =============================== */
._header_xcr4o_4 {
    position: sticky;
    top: 0;
    inset-inline: 0;
    display: flex;
    align-items: center;
    min-height: 4.375rem;
    /* 70px */
    gap: 0.75rem;
    /* space between avatar and info */
    padding-inline: 0.813rem 1.563rem;
    /* 13px 25px */
    border-bottom: 1px solid var(--color-sidebar-section-divider);
    /* Safer on iOS notch if the drawer is full height */
    padding-top: env(safe-area-inset-top, 0);
    z-index: 2;
    background-color: var(--color-sidebar-bg);
}

/* Keep content mounted; toggle visibility in collapsed state */
._header_xcr4o_4[data-open="true"] ._headerAvatar_xcr4o_24,
._header_xcr4o_4[data-open="true"] ._headerInfo_xcr4o_25 {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}

._header_xcr4o_4[data-open="false"] ._headerAvatar_xcr4o_24,
._header_xcr4o_4[data-open="false"] ._headerInfo_xcr4o_25 {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    width: 0;
    margin: 0;
    overflow: hidden;
    flex: 0 0 auto;
    padding: 0;
}

/* Logo */
._headerAvatar_xcr4o_24 {
    width: 2.75rem;
    height: 2.75rem;
    background: var(--color-sidebar-header-avatar);
    flex-shrink: 0;
}

._headerAvatar_xcr4o_24 img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* Info block */
._headerInfo_xcr4o_25 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.125rem;
    /* 2px between role and company */
    min-width: 0;
    flex: 1 0 0;
}

._headerRole_xcr4o_68 {
    color: var(--secondary-3);
    line-height: 1.2;
    white-space: nowrap;
}

._headerCompany_xcr4o_74 {
    color: var(--color-text-inverse);
    font-size: var(--fs-body);
    font-weight: var(--fw-regular);
    line-height: var(--lh-body);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: 0.05em;
}

/* Toggle button */
._headerBurger_xcr4o_86 {
    margin-left: auto;
    width: 1.25rem;
    height: 1.25rem;
    aspect-ratio: 1/1;
}

._header_xcr4o_4[data-open="false"] ._headerBurger_xcr4o_86 {
    margin: 0;
}

._iconSlot_xcr4o_97 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

._headerBurger_xcr4o_86 svg {
    color: var(--color-sidebar-header-burger);
}/* Sticky footer INSIDE the Drawer scroll container */
._footer_es6aj_2 {
    position: sticky;
    bottom: 0;

    display: flex;
    align-items: center;
    gap: 0.688rem;
    /* 11px */

    /* lock height exactly */
    block-size: 3.5625rem;
    /* 57px at 16px root */
    min-block-size: 3.5625rem;
    max-block-size: 3.5625rem;
    flex: 0 0 3.5625rem;
    /* don't let flex sizing alter height */
    box-sizing: border-box;

    /* keep only horizontal padding so height stays fixed */
    padding-block: 0;
    padding-inline: 1.5rem 0.75rem;

    border-top: 1px solid var(--color-sidebar-section-divider);
    background-color: var(--color-sidebar-bg);
    overflow: hidden;
}

._footer_es6aj_2+button {
    width: 70%;
    bottom: 3.5rem;
    left: 1.6rem;
    border: var(--color-sidebar-section-divider);
    font-family: var(--font-family) !important;
    font-size: 1rem;
}


._footerAvatar_es6aj_39 {
    /* 35px */
    width: 2.188rem;
    /* 35px */
    height: 2.188rem;
    /* light blue circle per design */
    background: var(--color-sidebar-footer-avatar-bg);
    color: var(--color-sidebar-footer-avatar-text);
    font-weight: var(--fw-semibold);
    display: flex;
    justify-content: center;
    align-items: center;
    /* 10px */
    gap: 0.625rem;
    font-size: 0.875rem;
    line-height: 1.5rem;
}

._footerInfo_es6aj_57 {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
    /* enable ellipsis */
    align-items: flex-start;
    padding-bottom: 0.125rem;
    /* 2px to center vertically with avatar */
    flex: 1 0 0;
}

._footerName_es6aj_69 {
    font-size: 0.875rem;
    /* 16px */
    line-height: 1.538;
    /* 20px */
    font-weight: var(--fw-medium);
    color: var(--color-sidebar-footer-username);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: 0.06em;
    max-width: 100%;
}

._footerEmail_es6aj_83 {
    font-size: 0.75rem;
    /* 14px */
    line-height: 1.2;
    /* 18px */
    font-weight: var(--fw-regular);
    color: var(--color-sidebar-footer-email);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: 0.06em;
    max-width: 105%;
    /* 0.4px relative to font size */
}

._footerMenuBtn_es6aj_98 {
    flex-shrink: 0;
    margin-left: auto;
}

._footerMenuBtn_es6aj_98 svg {
    color: var(--color-sidebar-footer-icon);
}

/* Collapsed state: keep layout stable; just hide info block */
._footer_es6aj_2[data-open="false"] ._footerInfo_es6aj_57 {
    visibility: hidden;
    opacity: 0;
    width: 0;
    margin: 0;
    pointer-events: none;
}

._footer_es6aj_2[data-open="false"] ._footerMenuBtn_es6aj_98 {
    visibility: hidden;
    opacity: 0;
    width: 0;
    margin: 0;
    pointer-events: none;
}/* ---------- Section ---------- */
._section_1org3_2 {
    display: flex;
    padding: 1.563rem 0.5rem;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.938rem;
    align-self: stretch;
    border-bottom: 1px solid var(--color-sidebar-section-divider);
}

._section_1org3_2:last-of-type {
    border-bottom: 0;
}

._menuTitle_1org3_16 {
    color: var(--color-sidebar-section-title);
    font-size: 0.6875rem;
    font-weight: var(--fw-medium);
    line-height: 1.09;
    letter-spacing: 0.0909em;
    padding: 0 0.625rem;
    flex: 1;
    width: 100%;
}

/* Don't use flex here, it is fighting with MUI's CSS */
._listReset_1org3_28 {
    padding: 0;
    display: block;
    align-self: stretch;
}

._listReset_1org3_28>li+li {
    margin-top: 0.25rem;
}

/* ---------- Parent item ---------- */
._listItem_1org3_39 {
    flex: 1;
    width: 100%;
}

._itemButton_1org3_44 {
    display: flex;
    padding: 0.625rem 0.625rem;
    align-items: center;
    gap: 0.5rem;
    align-self: stretch;
    border-radius: var(--radius-xs);
    color: var(--color-sidebar-menu-text);

}

._itemButton_1org3_44:hover {
    background: var(--color-sidebar-menu-bg-hover);
}

._itemButton_1org3_44[data-expanded="true"] {
    background: var(--color-sidebar-menu-bg-active);
}

._itemButton_1org3_44[data-active="true"] {
    color: var(--color-sidebar-menu-text-active);
    background: var(--color-sidebar-menu-bg-hover);
}

._itemRow_1org3_68 {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    gap: 0.75rem;
    align-self: stretch;
}

._iconSlot_1org3_77 {
    display: inline-flex;
}

._iconSlot_1org3_77 svg {
    width: 1.25rem;
    height: 1.25rem;
    aspect-ratio: 1/1;
}

._itemText_1org3_87 {
    flex: 1 0 0;
    font-size: 0.875rem;
    /* 14px */
    font-weight: var(--fw-medium);
    line-height: 1.4286;
    letter-spacing: 0.04em;
    margin: 0 auto;
}

._chevronBox_1org3_97 {
    margin-left: auto;
    width: 1rem;
    height: 1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

._expandIcon_1org3_106 {
    width: 1rem;
    height: 1rem;
}

/* ---------- Sub list ---------- */
._collapse_1org3_112 {
    will-change: height;
    flex: 1;
    width: 100%;

    ._MuiCollapse-wrapper_1org3_117 {
        flex: 1;
        width: 100%;
        padding: 0;
        margin: 0;

        ._MuiCollapse-wrapperInner_1org3_123 {
            flex: 1;
            width: 100% !important;
            padding: 0;
            margin: 0;
        }
    }
}

._collapseList_1org3_132 {
    display: flex;
    padding: 0.313rem 0 0.6rem 1.6rem;
    /*adjusted not figma matched*/
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 0.25rem;
    align-self: stretch;
    box-sizing: border-box;

}

._subListItem_1org3_145 {
    padding: 0;

}

._subItemButton_1org3_150 {
    transition: background-color 120ms ease;
}

._subItemButton_1org3_150:hover {
    background: transparent;
    border-radius: var(--radius-xs);
}

._subItemButton_1org3_150:hover ._iconSubSlot_1org3_159 {
    color: var(--color-primary-0);
    font-weight: var(--fw-medium);
}

._subItemButton_1org3_150:hover ._subItemText_1org3_164 {
    color: var(--color-sidebar-menu-text-active);
    font-weight: var(--fw-medium);
}

._subItemButton_1org3_150[data-active="true"] ._subItemText_1org3_164 {
    color: var(--color-sidebar-menu-text-active);
}

._subItemRow_1org3_173 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    align-self: stretch;
    color: var(--color-sidebar-subenu-text);
    transition:
        opacity var(--nav-slide-enter) var(--ease-enter),
        transform var(--nav-slide-enter) var(--ease-enter);
}

._subItemText_1org3_164 {
    color: var(--color-sidebar-subenu-text);
    font-size: 0.875rem;
    line-height: 1.4286;
    letter-spacing: 0.04em;
    font-weight: var(--fw-medium);
    transition:
        opacity var(--nav-slide-enter) var(--ease-enter),
        transform var(--nav-slide-enter) var(--ease-enter);
}

._iconSubSlot_1org3_159 {
    display: inline-flex;
}

._iconSubSlot_1org3_159 svg {
    width: 1.1rem;
    height: 1.1rem;
    flex-shrink: 0;
}

._subItemButton_1org3_150[data-active="true"] ._iconSubSlot_1org3_159 {
    color: var(--color-sidebar-menu-text-active);
}

/* nav-menu.module.css */
._section_1org3_2[data-open="true"] ._collapseList_1org3_132 {
    padding-left: 1.5rem;
}

._section_1org3_2[data-open="false"] ._collapseList_1org3_132 {
    padding-left: 0;
}

/* Center parent items when the drawer is collapsed (mini) */
._section_1org3_2[data-open="false"] ._itemButton_1org3_44 {
    padding-inline: 0;
    /* remove side padding that offsets the icon */
    justify-content: center;
    /* center contents within the button */
}

/* Sub-items: also center in collapsed state */
._section_1org3_2[data-open="false"] ._subItemButton_1org3_150 {
    justify-content: center;
}

._section_1org3_2[data-open="false"] ._chevronBox_1org3_97 {
    position: absolute;
    right: 0.25rem;
    /* tweak to taste */
    top: 50%;
    transform: translateY(-50%);
}

._afterTextIcon_1org3_240 {
    margin-left: 0.375rem;
    font-size: 0.3rem;
    vertical-align: middle;
}:root {
  /* 280px / 92px equivalents; use rem so it scales with root font size */
  /* 280px */
  --drawer-max: 17.5rem;
  /* 92px */
  --drawer-min: 6rem;
}

/* Make the Drawer paper a flex column and prevent whole-drawer scrolling */
._paper_jtdza_10 {
  background: var(--color-sidebar-bg);
  color: var(--color-paper-bg, #fff);
  border-right: 10px solid var(--color-sidebar-section-divider);
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}

/* Only this area scrolls */
._scrollArea_jtdza_21 {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;

  /* reserve equal space on left & right */
  scrollbar-gutter: stable both-edges;

  /* Default hidden scrollbar appearance */
  scroll-behavior: smooth;
}

/* For WebKit browsers (Chrome, Safari, Edge) */
._scrollArea_jtdza_21::-webkit-scrollbar-button {
  display: none !important;
  /* Hides the scrollbar arrows */
  width: 0 !important;
  height: 0 !important;
}
._header-content_1educ_1 {
    display: flex;
    height: 2.5rem;
    justify-content: center;
    align-items: center;
    gap: 0.75rem;
}

._header-title_1educ_9 {
    font-weight: var(--fw-semibold);
    color: var(--color-text-body);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.6;
    letter-spacing: normal;
    text-transform: capitalize;
}

._header-chip_1educ_20 {
    padding: 0.063rem 0.688rem;
    border-radius: 4px;
    background-color: var(--color-topbar-chip-bg);
    font-size: 0.875rem;
    font-weight: var(--fw-medium);
    line-height: 1.6;
    letter-spacing: normal;
    text-transform: capitalize;
    color: var(--color-text-heading);
    min-height: 1.625rem;
}

._header-actions_1educ_33 {
    padding: 0.063rem 0.688rem;
    border-radius: 4px;
    color: var(--color-secondary-500);
    min-height: 1.625rem;
    border: 2px solid var(--color-secondary-500);
}

._header-actions_1educ_33:hover {
    background-color: var(--color-secondary-500);
    color: var(--color-primary-0);
    border: 2px solid var(--color-secondary-500);
    cursor: pointer;
}._navbar_i00lf_1 {
  background-color: #343a40;
  padding: 15px;
  border-radius: 8px;
  margin-bottom: 20px;
  color: #ffffff;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

._navbar_i00lf_1 ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
  display: flex;
  position: relative;
}

._navbar_i00lf_1 li {
  margin: 0 15px;
  position: relative;
}

._navbar_i00lf_1 a {
  text-decoration: none;
  color: #ffffff;
  font-weight: bold;
  transition: color 0.3s ease;
}

._navbar_i00lf_1 a:hover {
  color: #ffc107;
}

._submenu_i00lf_36 {
  display: none;
  position: absolute;
  background-color: #495057;
  padding: 10px;
  border-radius: 8px;
  top: 100%;
  left: 0;
  z-index: 1000;
}

._navbar_i00lf_1 li:hover ._submenu_i00lf_36 {
  display: block;
}

._submenu_i00lf_36 li {
  margin: 5px 0;
}

._submenu_i00lf_36 a {
  color: #ffffff;
}

._submenu_i00lf_36 a:hover {
  color: #ffc107;
}


._mainContainer_i00lf_64 {
  width: 100%;
  height: 100dvh;
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;

  ._header_i00lf_72 {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.25rem;
    border-bottom: 1px solid var(--color-topbar-border);
    background-color: var(--color-topbar-bg);
    box-shadow: var(--shadow-topbar);
    min-height: var(--topbar-h);
  }

  ._contentContainer_i00lf_83 {
    width: 100%;
    padding: 1.5rem 1.5rem 0.625rem 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.5rem;
    flex: 1;
    min-height: 0;
    overflow: hidden;
  }

  /* when a descendant marks itself with data-page-kind="scrollable" */
  ._contentContainer_i00lf_83:has([data-page-kind="scrollable"]) {
    overflow-y: auto;
    display: block;
    /* remove flex */
    flex: initial;
    /* cancel flex:1 */
    flex-direction: unset;
    padding: 1.5rem !important;
  }

  ._contentContainer_i00lf_83>div {
    width: 100%;
  }
}._welcomeContainer_gp974_1 {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-height: calc(100dvh - var(--topbar-h) - 3rem);
    width: 100%;
}

._welcomeBox_gp974_11 {
    max-width: 42rem;
    width: 100%;
    background: #fff;
    padding: 2rem;
    border-radius: 0.5rem;
    text-align: center;
    position: relative;
    overflow: hidden;
}

._welcomeBox_gp974_11::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

._welcomeTitle_gp974_29 {
    font-weight: 700;
    color: var(--color-text-heading);
}

._welcomeMessage_gp974_34 {
    max-width: 35.625rem;
    color: var(--color-text-body);
    line-height: 1.6;
}/* =========================
   Login page (CSS Modules)
   ========================= */

._login_19ecr_5 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    width: 100%;
}

._logo_19ecr_14 {
    width: 15.313rem;
    height: 3.75rem;
    aspect-ratio: 49/12;
}

._panel_19ecr_20 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2rem;
    align-self: stretch;
    padding: 2rem !important;
    background-color: var(--color-paper-bg);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-paper);
}

._title_19ecr_32 {
    color: var(--color-page-title-text);
    font-size: 1.75rem !important;
    font-weight: var(--fw-bold) !important;
    line-height: 1.2;
    text-transform: capitalize;
    letter-spacing: 0.04em;
}

._loginFrom_19ecr_41 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
    gap: 1rem;
}

._remember-me_19ecr_49 {
    letter-spacing: unset;
}._errorContainer_bvvle_1 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
  text-align: center;
  background-color: #f8d7da;
  color: #721c24;
  padding: 20px;
  border: 1px solid #f5c6cb;
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

._errorTitle_bvvle_16 {
  font-size: 2rem;
  font-weight: bold;
  margin-bottom: 10px;
}

._errorMessage_bvvle_22 {
  font-size: 1.2rem;
  margin-bottom: 20px;
}

._retryButton_bvvle_27 {
  padding: 10px 20px;
  font-size: 1rem;
  color: #fff;
  background-color: #007bff;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  text-decoration: none;
}

._retryButton_bvvle_27:hover {
  background-color: #0056b3;
}