:root {
  --soumu-fluid-font-min: 14px;
  --soumu-fluid-font-max: 18px;
  font-size: clamp(14px, calc(13.25px + .32vw), 18px);
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { min-width: 320px; max-width: 100%; }
body { overflow-x: hidden; font-size: 1rem; }
.speed-dial { display: none !important; }
.dashboard-home-page .speed-dial { display: block !important; }
img, video, canvas { max-width: 100%; height: auto; }
input, select, textarea, button { max-width: 100%; font: inherit; }
input, select, textarea { min-width: 0; }

.soumu-header { gap: clamp(.5rem, 1.2vw, 1rem); padding-inline: clamp(.65rem, 1.4vw, 1rem); }
.soumu-header-title { min-width: 0; font-size: clamp(.95rem, .8rem + .75vw, 1.25rem); }
.soumu-user { min-width: 0; }
.soumu-welcome { overflow: hidden; text-overflow: ellipsis; }
.soumu-main, .employee-page-main, .destination-main, .managed-users-main,
.employee-subpage-content, .att-shell, main { min-width: 0; }
.soumu-main { padding: clamp(1.25rem, 3vw, 3rem) clamp(.75rem, 2.4vw, 1.75rem); }

/* Tables retain readable columns and scroll inside their own panel on narrow screens. */
.overflow-x-auto, .att-table-wrap, .managed-users-table-wrap,
.MuiTableContainer-root { max-width: 100%; overscroll-behavior-inline: contain; }
table { max-width: 100%; }
pre, code { overflow-wrap: anywhere; }

.employee-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.employee-page-heading, .employee-subpage-heading, .destination-heading,
.business-title-row, .managed-users-heading { min-width: 0; }
.employee-page-title-row, .destination-heading, .business-title-row,
.managed-users-heading { flex-wrap: wrap; }
.employee-account-workspace form[data-employee-account-search] { grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
.employee-page-main .MuiPaper-root { min-width: 0; }

.leave-admin-page #businessSidebar.business-collapsible-sidebar {
  position: fixed;
  top: 72px;
  bottom: 0;
  left: 0;
  z-index: 40;
  flex: 0 0 264px;
  width: 264px;
  max-width: none;
  height: auto;
  transform: none;
  translate: 0 0;
}
.leave-admin-page .la-workspace {
  display: grid;
  grid-template-columns: 264px minmax(0, 1fr);
  max-width: none;
  padding-left: 0;
}
.leave-admin-page .la-shell {
  grid-column: 2;
  width: 100%;
  margin: 0;
}

@media (max-width: 1023px) {
  .employee-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .soumu-header { min-height: 56px; }
  .soumu-header-logo { width: 32px; height: 32px; }
  .dashboard-page #businessSidebar.business-collapsible-sidebar { max-width: min(84vw, 300px); }
}

@media (max-width: 767px) {
  .leave-admin-page .la-workspace { grid-template-columns: minmax(0, 1fr); }
  .leave-admin-page .la-shell { grid-column: 1; }
  .leave-admin-page #businessSidebar.business-collapsible-sidebar {
    position: fixed;
    top: 72px;
    bottom: 0;
    left: 0;
    z-index: 40;
    flex-basis: min(84vw, 300px);
    width: min(84vw, 300px);
    max-width: min(84vw, 300px);
    height: auto;
    transform: none;
    translate: -100% 0;
  }
  .leave-admin-page #businessSidebar.business-collapsible-sidebar.translate-x-0 { translate: 0 0; }
}

@media (max-width: 767px) {
  .soumu-header { gap: .5rem; }
  .soumu-header-title { gap: .4rem; }
  .soumu-header-title > span:last-child { max-width: 36vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .soumu-header .ml-auto { gap: .5rem; }
  .soumu-welcome { display: none; }
  .soumu-avatar, .soumu-avatar-fallback { width: 32px !important; height: 32px !important; flex-basis: 32px !important; }
  .employee-page-main, .managed-users-main { padding: 1rem .75rem !important; }
  .employee-page-heading, .employee-subpage-heading { padding: 1rem !important; }
  .employee-page-heading h1, .employee-subpage-heading h1,
  .business-title-row h1, body.admin-access-page main > section > header h1 {
    font-size: clamp(1.15rem, 1rem + 1.2vw, 1.5rem);
    line-height: 1.35;
  }
  .employee-page-title-row { align-items: flex-start; }
  .employee-kpis { gap: .5rem; }
  .employee-kpi { padding: .7rem; }
  .employee-kpi-icon { width: 36px; height: 36px; flex-basis: 36px; }
  .employee-account-workspace [data-employee-account-results] { overflow: hidden; }
  .destination-heading { align-items: stretch; flex-direction: column; }
  .business-master-toolbar { align-items: stretch; flex-direction: column; }
  .record-pagination { gap: 4px; padding: 12px 6px; }
  .record-pagination a, .record-pagination > span:not(.is-ellipsis) { min-width: 36px; height: 38px; padding-inline: 8px; font-size: .9rem; }
  .soumu-page-zoom { right: 10px; bottom: 10px; }
}

@media (max-width: 480px) {
  .employee-kpis { grid-template-columns: minmax(0, 1fr); }
  .employee-kpi { min-height: 66px; }
  .employee-page-heading p, .employee-subpage-heading p { font-size: .9rem; line-height: 1.55; }
  .employee-page-title-icon { flex: 0 0 auto; }
  .record-pagination a, .record-pagination > span:not(.is-ellipsis) { min-width: 32px; height: 36px; padding-inline: 6px; }
  .soumu-header-title > span:last-child { max-width: 30vw; }
}

/* Keep every administrator workspace sidebar aligned to the shared header. */
@media (min-width: 1024px) {
  body.employee-workspace *:has(> #businessSidebar) {
    padding-left: 264px;
  }
  body.employee-workspace *:has(> #businessSidebar.is-collapsed) {
    padding-left: 72px;
  }
  body.employee-workspace #businessSidebar.is-collapsed {
    width: 72px !important;
  }
  body.employee-workspace #businessSidebar {
    position: fixed !important;
    inset: var(--soumu-header-height, 72px) auto 0 0 !important;
    z-index: 1020 !important;
    width: 264px !important;
    height: auto !important;
    max-height: none !important;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  body.dashboard-page div:has(> #adminSidebar) {
    flex: 0 0 270px;
  }
  body.dashboard-page #adminSidebar {
    position: fixed !important;
    inset: var(--soumu-header-height, 72px) auto 0 0 !important;
    z-index: 1020 !important;
    width: 270px !important;
    height: auto !important;
    min-height: 0 !important;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
}

@media (min-width: 701px) {
  body.attendance-page .att-shell {
    max-width: none !important;
    margin: 0 !important;
  }
  body.attendance-page .att-layout {
    display: block !important;
  }
  body.attendance-page #attendanceSidebar {
    position: fixed !important;
    inset: var(--soumu-header-height, 72px) auto 0 0 !important;
    z-index: 1020 !important;
    width: 225px !important;
    overflow-y: auto;
    border-radius: 0 !important;
    overscroll-behavior: contain;
  }
  body.attendance-page .att-main {
    margin-left: 249px;
  }
}

@media (max-width: 1023px) {
  body.employee-workspace *:has(> #businessSidebar) {
    padding-left: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}