/* Dashboard polish zonder extra bestanden */
@view-transition {
  navigation: auto;
}

::view-transition-group(root) {
  animation-duration: 220ms;
  animation-timing-function: cubic-bezier(.22, 1, .36, 1);
}

::view-transition-old(root) {
  animation: app-page-out 180ms cubic-bezier(.4, 0, 1, 1) both;
}

::view-transition-new(root) {
  animation: app-page-in 240ms cubic-bezier(.22, 1, .36, 1) both;
}

::view-transition-group(app-sidebar),
::view-transition-group(app-header) {
  animation-duration: 180ms;
  animation-timing-function: ease;
}

::view-transition-old(app-sidebar),
::view-transition-new(app-sidebar),
::view-transition-old(app-header),
::view-transition-new(app-header) {
  animation: app-chrome-crossfade 180ms ease both;
  mix-blend-mode: normal;
}

@keyframes app-page-out {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
  to {
    opacity: 0;
    transform: translate3d(-18px, -2px, 0) scale(.992);
  }
}

@keyframes app-page-in {
  from {
    opacity: 0;
    transform: translate3d(22px, 4px, 0) scale(.992);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes app-chrome-crossfade {
  from { opacity: .98; }
  to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(root),
  ::view-transition-group(app-sidebar),
  ::view-transition-group(app-header),
  ::view-transition-old(root),
  ::view-transition-new(root),
  ::view-transition-old(app-sidebar),
  ::view-transition-new(app-sidebar),
  ::view-transition-old(app-header),
  ::view-transition-new(app-header) {
    animation-duration: 1ms;
    animation-timing-function: linear;
  }
}

    html,
    body {
      max-width: 100%;
      overflow-x: hidden;
    }
    body { background: #f6f7fb; }
    .app-shell {
      min-height: 100vh;
      min-width: 0;
      max-width: 100vw;
    }

    /* Sidebar */
    .sidebar {
      view-transition-name: app-sidebar;
      width: 280px;
      min-width: 280px;
      flex: 0 0 280px;
      background: #ffffff;
      border-right: 1px solid rgba(0,0,0,.08);
    }
    .sidebar .nav-link {
      color: #344054;
      border-radius: .6rem;
      padding: .6rem .75rem;
    }
    .sidebar .nav-link:hover {
      background: rgba(125,135,126,.16);
      color: #2F3D34;
    }
    .sidebar .nav-link.active {
      background: #2F3D34;
      color: #F7F3EA;
      font-weight: 600;
    }

    /* Content */
    .content {
      --content-pad-x: 1.25rem;
      min-width: 0;
      max-width: 100%;
      padding: 0 0 1rem;
    }
    @media (min-width: 992px) {
      .content {
        --content-pad-x: 2rem;
        padding: 0 0 1.5rem;
      }
    }

    .app-header {
      view-transition-name: app-header;
      position: relative;
      z-index: 1220;
      display: flex;
      flex-direction: column;
      align-items: stretch;
      gap: .85rem;
      min-height: 64px;
      margin-bottom: 1rem;
      padding: .95rem var(--content-pad-x) .85rem;
      border-bottom: 1px solid rgba(15,23,42,.08);
      background: rgba(255,255,255,.92);
      box-shadow: 0 10px 30px rgba(16,24,40,.04);
      backdrop-filter: blur(10px);
    }
    .app-header__main {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
      min-width: 0;
    }
    .app-header__left {
      min-width: 0;
      display: flex;
      align-items: center;
      gap: .75rem;
      flex: 1 1 auto;
    }
    .app-header__title {
      min-width: 0;
      display: flex;
      align-items: center;
      gap: .75rem;
      flex-wrap: wrap;
    }
    .app-header__page-title {
      margin: 0;
      font-size: 1.05rem;
      line-height: 1.1;
      font-weight: 800;
      color: #0f172a;
    }
    .app-header__right {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: .55rem;
      flex: 0 0 auto;
    }
    .app-header__page-tools {
      display: flex;
      align-items: stretch;
      justify-content: stretch;
      width: 100%;
      min-width: 0;
    }
    @media (min-width: 992px) {
      .app-header--compact-desktop {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: .9rem;
      }
      .app-header--compact-desktop .app-header__main {
        flex: 1 1 auto;
        min-width: 0;
      }
      .app-header--compact-desktop .app-header__page-tools {
        flex: 0 1 auto;
        width: auto;
      }
    }
    .app-header-icon {
      position: relative;
      width: 40px;
      height: 40px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border: 1px solid #dbe3ef;
      border-radius: 999px;
      background: #fff;
      color: #0f172a;
      text-decoration: none;
      box-shadow: 0 8px 24px rgba(15,23,42,.06);
      transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
    }
    .app-header__sidebar-toggle {
      flex: 0 0 auto;
    }
    .app-header__mobile-menu {
      flex: 0 0 auto;
    }
    .app-header-icon:hover {
      transform: translateY(-1px);
      border-color: #bfd2ea;
      box-shadow: 0 12px 28px rgba(15,23,42,.10);
      color: #0f172a;
    }
    .app-header-icon--location {
      width: auto;
      max-width: 240px;
      gap: .45rem;
      padding-inline: .8rem;
      cursor: default;
    }
    .app-header-icon__badge {
      position: absolute;
      top: 1px;
      right: 1px;
      min-width: 18px;
      height: 18px;
      padding: 0 4px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 999px;
      background: #dc2626;
      color: #fff;
      font-size: .62rem;
      font-weight: 700;
      line-height: 1;
    }
    .app-header-notifications {
      position: relative;
      z-index: 1200;
    }
    .app-header-notifications .dropdown-toggle::after {
      display: none;
    }
    .app-header-notifications__menu {
      z-index: 1210;
      width: min(360px, calc(100vw - 1.5rem));
      padding: .35rem;
      border: 1px solid #dbe3ef;
      border-radius: 1rem;
      box-shadow: 0 18px 42px rgba(15,23,42,.16);
    }
    .app-header-notifications__head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: .75rem;
      padding: .7rem .75rem .5rem;
    }
    .app-header-notifications__title {
      font-size: .92rem;
      font-weight: 800;
      color: #0f172a;
    }
    .app-header-notifications__count {
      font-size: .76rem;
      font-weight: 700;
      color: #64748b;
    }
    .app-header-notifications__list {
      display: grid;
      gap: .35rem;
      padding: 0 .25rem .25rem;
    }
    .app-header-notifications__item {
      display: grid;
      gap: .22rem;
      padding: .75rem;
      border-radius: .85rem;
      text-decoration: none;
      color: inherit;
      background: #fff;
      border: 1px solid #eef2f7;
      transition: background .14s ease, border-color .14s ease, transform .14s ease;
    }
    .app-header-notifications__item:hover {
      background: #f8fafc;
      border-color: #dbe3ef;
      transform: translateY(-1px);
      color: inherit;
    }
    .app-header-notifications__item-meta {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: .5rem;
      font-size: .72rem;
      color: #64748b;
    }
    .app-header-notifications__item-type {
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .04em;
      color: #0f766e;
    }
    .app-header-notifications__item-title {
      font-size: .86rem;
      line-height: 1.25;
      font-weight: 700;
      color: #0f172a;
    }
    .app-header-notifications__item-summary {
      font-size: .8rem;
      line-height: 1.3;
      color: #475569;
    }
    .app-header-notifications__empty {
      padding: .9rem .75rem;
      border-radius: .85rem;
      background: #f8fafc;
      color: #64748b;
      font-size: .84rem;
    }
    .app-header-notifications__footer {
      padding: .35rem;
      border-top: 1px solid #eef2f7;
    }
    .app-header-notifications__footer .btn {
      width: 100%;
    }
    .app-connection-toast {
      max-width: min(360px, calc(100vw - 1.5rem));
      box-shadow: 0 18px 42px rgba(15,23,42,.18);
    }
    .app-connection-toast-container {
      right: 1rem;
      bottom: 1rem;
      z-index: 1265;
    }
    .app-connection-toast .toast-body {
      display: flex;
      align-items: flex-start;
      gap: .7rem;
    }
    .app-connection-toast__icon {
      flex: 0 0 auto;
      font-size: 1rem;
      line-height: 1.2;
    }
    .app-connection-toast__copy {
      flex: 1 1 auto;
      min-width: 0;
    }
    .app-connection-toast__title {
      font-size: .9rem;
      font-weight: 700;
      line-height: 1.2;
    }
    .app-connection-toast__text {
      margin-top: .2rem;
      font-size: .8rem;
      color: rgba(255,255,255,.78);
      line-height: 1.35;
    }
    .unsaved-changes-modal .modal-content {
      border: 1px solid rgba(226,232,240,.9);
      border-radius: 1.4rem;
      box-shadow: 0 30px 80px rgba(15,23,42,.24);
      overflow: hidden;
    }
    .modal {
      z-index: 2200;
    }
    .modal-backdrop {
      z-index: 2190;
    }
    .unsaved-changes-modal {
      z-index: 2300;
    }
    .modal-backdrop.unsaved-changes-backdrop {
      z-index: 2290;
    }
    .unsaved-changes-modal .modal-header {
      padding: 1.1rem 1.2rem .8rem;
      border-bottom: 0;
      align-items: flex-start;
    }
    .unsaved-changes-modal .modal-body {
      padding: 0 1.2rem 1rem;
      color: #475569;
    }
    .unsaved-changes-modal .modal-footer {
      padding: 0 1.2rem 1.2rem;
      border-top: 0;
      display: grid;
      gap: .65rem;
    }
    .unsaved-changes-modal__badge {
      width: 48px;
      height: 48px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 1rem;
      background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%);
      color: #c2410c;
      box-shadow: inset 0 0 0 1px rgba(249,115,22,.12);
      font-size: 1.15rem;
      flex: 0 0 auto;
    }
    .unsaved-changes-modal__copy {
      display: grid;
      gap: .3rem;
      min-width: 0;
    }
    .unsaved-changes-modal__title {
      margin: 0;
      font-size: 1.15rem;
      font-weight: 800;
      color: #0f172a;
    }
    .unsaved-changes-modal__text {
      margin: 0;
      font-size: .94rem;
      line-height: 1.5;
    }
    .unsaved-changes-modal__actions {
      display: grid;
      gap: .65rem;
    }
    .unsaved-changes-modal__actions .btn {
      width: 100%;
      padding: .8rem 1rem;
      border-radius: .95rem;
      font-weight: 700;
    }
    @media (max-width: 991.98px) {
      .app-connection-toast-container {
        right: .75rem;
        left: .75rem;
        bottom: .75rem;
      }
      .app-connection-toast {
        max-width: none;
        width: 100%;
      }
    }
    .app-header-account .dropdown-toggle {
      border: 1px solid #dbe3ef;
      border-radius: 999px;
      background: #fff;
      color: #0f172a;
      box-shadow: 0 8px 24px rgba(15,23,42,.06);
    }
    .app-header-account .dropdown-toggle {
      width: 40px;
      height: 40px;
      padding: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }
    .app-header-account {
      position: relative;
      z-index: 1230;
    }
    .app-header-account .dropdown-menu {
      z-index: 1240;
    }
    .app-header-more {
      position: relative;
      z-index: 1240;
    }
    .app-header-more .dropdown-toggle::after {
      display: none;
    }
    .app-header-more__toggle {
      flex: 0 0 auto;
    }
    .app-header-more__dot {
      position: absolute;
      top: 5px;
      right: 5px;
      width: 9px;
      height: 9px;
      border: 2px solid #fff;
      border-radius: 999px;
      background: #dc2626;
      box-shadow: 0 0 0 1px rgba(220,38,38,.12);
    }
    .app-header-more__menu {
      z-index: 1260;
      width: min(380px, calc(100vw - 1.5rem));
      padding: .45rem;
      border: 1px solid #dbe3ef;
      border-radius: 1rem;
      background: rgba(255,255,255,.98);
      box-shadow: 0 18px 42px rgba(15,23,42,.16);
      backdrop-filter: blur(10px);
    }
    @media (max-width: 991.98px) {
      .app-header-more__menu {
        position: fixed !important;
        inset: calc(var(--app-header-mobile-h, 58px) + .25rem) .75rem auto .75rem !important;
        width: auto;
        max-height: calc(100vh - var(--app-header-mobile-h, 58px) - 1rem);
        overflow: auto;
        transform: none !important;
      }
    }
    .app-header-more__section {
      display: grid;
      gap: .22rem;
      padding: .28rem;
    }
    .app-header-more__section + .app-header-more__section {
      border-top: 1px solid #eef2f7;
      padding-top: .38rem;
      margin-top: .12rem;
    }
    .app-header-more__item {
      min-height: 34px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: .6rem;
      padding: .42rem .56rem;
      border-radius: .75rem;
      color: #334155;
      text-decoration: none;
      font-size: .78rem;
      font-weight: 700;
    }
    .app-header-more__item:hover {
      background: #f8fafc;
      color: #0f172a;
    }
    .app-header-more__item-main {
      min-width: 0;
      display: inline-flex;
      align-items: center;
      gap: .48rem;
    }
    .app-header-more__item-main i {
      flex: 0 0 auto;
      color: #64748b;
    }
    .app-header-more__badge {
      min-width: 1.35rem;
      height: 1.35rem;
      padding: 0 .4rem;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 999px;
      background: #dc2626;
      color: #fff;
      font-size: .7rem;
      font-weight: 800;
      line-height: 1;
    }
    .app-header-more__account {
      padding: .2rem .56rem;
      color: #64748b;
      font-size: .72rem;
      font-weight: 800;
    }
    .app-header-more__logout {
      margin: 0;
      padding: .2rem .35rem .35rem;
    }
    .page-subcontrols {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: .75rem;
      margin-bottom: .85rem;
    }
    .page-controls {
      display: flex;
      align-items: center;
      gap: .75rem;
      margin-bottom: .85rem;
    }
    .page-controls__left {
      display: flex;
      align-items: center;
      gap: .5rem;
      min-width: 96px;
    }
    .page-controls__center {
      flex: 1 1 auto;
      display: flex;
      justify-content: center;
      align-items: center;
      min-width: 0;
    }
    .page-controls__right {
      min-width: 96px;
      display: flex;
      justify-content: flex-end;
      align-items: center;
      gap: .5rem;
    }

    @media (min-width: 992px) {
      .app-header {
        margin-bottom: 1.15rem;
      }
    }

    /* Card-style page wrapper */
    .page-card {
      background: #ffffff;
      border: 1px solid rgba(0,0,0,.08);
      border-radius: 1rem;
      box-shadow: 0 10px 30px rgba(16,24,40,.04);
    }

    /* ===== Collapsible sidebar ===== */

.sidebar {
  width: 280px;
  min-width: 280px;
  flex: 0 0 280px;
  transition: width 0.25s ease;
  overflow: visible;
  position: relative;
  z-index: 1250;
}

.sidebar-collapsed .sidebar {
  width: 88px;
  min-width: 88px;
  flex-basis: 88px;
}

.sidebar-collapsed .sidebar .nav-text,
.sidebar-collapsed .sidebar .section-label,
.sidebar-collapsed .sidebar .sidebar-location__name {
  display: none;
}

.sidebar-brand {
  width: 100%;
  min-height: 44px;
  padding-bottom: 4px;
  border-bottom: 1px solid rgba(15, 23, 42, .06);
  margin-bottom: .75rem !important;
}

.sidebar-toggle-inside {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.sidebar-collapsed .sidebar .sidebar-brand {
  flex-direction: column;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
}

.sidebar-collapsed .sidebar .sidebar-toggle-inside {
  display: inline-flex !important;
}

.sidebar-location {
  position: relative;
  z-index: 1260;
  margin-bottom: .65rem !important;
}

.sidebar-location__toggle {
  width: 100%;
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: .45rem;
  padding: .38rem .55rem;
  border: 1px solid #e2e8f0;
  border-radius: .65rem;
  background: #f8fafc;
  color: #334155;
  font-size: .74rem;
  font-weight: 800;
  line-height: 1.1;
  text-decoration: none;
}

.sidebar-location__toggle:hover,
.sidebar-location__toggle:focus {
  border-color: #cbd5e1;
  background: #fff;
  color: #0f172a;
}

.sidebar-location__toggle::after {
  margin-left: auto;
}

.sidebar-location__toggle--static::after {
  display: none;
}

.sidebar-location__toggle i {
  flex: 0 0 auto;
  color: #64748b;
}

.sidebar-location__name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebar-location__menu {
  z-index: 1270;
  min-width: min(260px, calc(100vw - 1.5rem));
  max-width: min(320px, calc(100vw - 1.5rem));
  padding: .35rem;
  border: 1px solid #dbe3ef;
  border-radius: .85rem;
  background: rgba(255,255,255,.98);
  box-shadow: 0 18px 42px rgba(15,23,42,.16);
  backdrop-filter: blur(10px);
}

.sidebar-location__menu .dropdown-item {
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .4rem .55rem;
  border-radius: .65rem;
  color: #334155;
  font-size: .76rem;
  font-weight: 750;
  line-height: 1.2;
}

.sidebar-location__menu .dropdown-item span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebar-location__menu .dropdown-item:hover,
.sidebar-location__menu .dropdown-item:focus {
  background: #f8fafc;
  color: #0f172a;
}

.sidebar-location__menu .dropdown-item.active,
.sidebar-location__menu .dropdown-item:active {
  background: #ecfeff;
  color: #0f766e;
}

.sidebar-location__menu .dropdown-item i {
  flex: 0 0 auto;
  color: #0f766e;
}

.sidebar-collapsed .sidebar .sidebar-location {
  display: flex;
  justify-content: center;
}

.sidebar-collapsed .sidebar .sidebar-location__toggle {
  width: 42px;
  min-width: 42px;
  height: 42px;
  justify-content: center;
  padding: 0;
}

.sidebar-collapsed .sidebar .sidebar-location__toggle::after {
  display: none;
}

.sidebar-collapsed .sidebar .sidebar-location__menu {
  margin-left: .45rem !important;
}

.sidebar .nav-link {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 36px;
  padding: .42rem .6rem;
  font-size: .8rem;
  line-height: 1.15;
}

.sidebar .nav {
  width: 100%;
  padding: 0;
  border-bottom: 0;
  gap: .15rem !important;
  margin-bottom: .75rem !important;
}

.sidebar .section-label {
  margin-bottom: .35rem !important;
  font-size: .66rem;
}

.sidebar-collapsed .sidebar .nav {
  align-items: center;
}

.sidebar-collapsed .sidebar .nav-item {
  display: flex;
  width: 100%;
  justify-content: center;
}

.sidebar-collapsed .sidebar .nav-link {
  width: 56px;
  flex: 0 0 56px;
  justify-content: center;
  margin-inline: auto;
  min-height: 44px;
  padding-inline: 0;
  position: relative;
}

.sidebar-collapsed .sidebar .nav-link i {
  margin: 0;
  text-align: center;
  width: 1.25rem;
}

.sidebar-collapsed .sidebar .nav-link[data-sidebar-tooltip]::before,
.sidebar-collapsed .sidebar .nav-link[data-sidebar-tooltip]::after {
  position: absolute;
  top: 50%;
  left: calc(100% + .55rem);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(-.25rem, -50%);
  transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
  z-index: 1280;
}

.sidebar-collapsed .sidebar .nav-link[data-sidebar-tooltip]::before {
  content: "";
  width: .65rem;
  height: .65rem;
  left: calc(100% + .26rem);
  background: #2F3D34;
  border-radius: 2px;
  transform: translate(-.25rem, -50%) rotate(45deg);
}

.sidebar-collapsed .sidebar .nav-link[data-sidebar-tooltip]::after {
  content: attr(data-sidebar-tooltip);
  min-width: max-content;
  max-width: 220px;
  padding: .48rem .68rem;
  border: 1px solid rgba(247, 243, 234, .14);
  border-radius: .55rem;
  background: #2F3D34;
  color: #F7F3EA;
  box-shadow: 0 16px 34px rgba(31, 42, 36, .22);
  font-size: .8rem;
  font-weight: 700;
  line-height: 1.15;
  white-space: nowrap;
}

.sidebar-collapsed .sidebar .nav-link[data-sidebar-tooltip]:hover::before,
.sidebar-collapsed .sidebar .nav-link[data-sidebar-tooltip]:hover::after,
.sidebar-collapsed .sidebar .nav-link[data-sidebar-tooltip]:focus-visible::before,
.sidebar-collapsed .sidebar .nav-link[data-sidebar-tooltip]:focus-visible::after {
  opacity: 1;
  visibility: visible;
}

.sidebar-collapsed .sidebar .nav-link[data-sidebar-tooltip]:hover::before,
.sidebar-collapsed .sidebar .nav-link[data-sidebar-tooltip]:focus-visible::before {
  transform: translate(0, -50%) rotate(45deg);
}

.sidebar-collapsed .sidebar .nav-link[data-sidebar-tooltip]:hover::after,
.sidebar-collapsed .sidebar .nav-link[data-sidebar-tooltip]:focus-visible::after {
  transform: translate(0, -50%);
}

body.shared-actor-modal-open .modal-backdrop.show {
  z-index: 2090;
}
body.shared-actor-modal-open #sharedActorModal {
  z-index: 2100;
}

    @media (max-width: 991.98px) {
      html,
      body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
        overscroll-behavior-x: none;
      }

      .app-shell,
      .app-shell > .flex-grow-1,
      .content,
      .content > .container-fluid {
        min-width: 0;
        width: 100%;
        max-width: 100vw;
      }

      .content {
        --content-pad-x: .75rem;
        padding: 0 0 .75rem;
      }

      .content > .container-fluid {
        padding-top: var(--app-header-mobile-h, 58px);
      }

      .app-header {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        padding: .62rem var(--content-pad-x);
        margin-bottom: .75rem;
        gap: .6rem;
        min-height: 58px;
        border-bottom-color: rgba(15,23,42,.10);
        width: 100%;
      }
      .app-header__main {
        align-items: center;
        gap: .65rem;
      }
      .app-header__left {
        align-items: center;
        gap: .55rem;
        min-width: 0;
      }
      .app-header__title {
        flex: 1 1 auto;
        min-width: 0;
        overflow: hidden;
      }
      .app-header__title > * {
        min-width: 0;
        max-width: 100%;
      }
      .app-header__page-title {
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 1rem;
      }
      .app-header__right {
        gap: .35rem;
        flex: 0 0 auto;
        flex-wrap: nowrap;
        max-width: calc(100vw - 5.1rem);
        overflow: visible;
      }
      .app-header__persistent-action {
        order: 1;
        flex: 0 0 auto;
      }
      .app-header-account {
        order: 2;
      }
      .app-header-icon,
      .app-header-account .dropdown-toggle {
        width: 44px;
        height: 44px;
        min-width: 44px;
        box-shadow: none;
      }
      button.btn-sm,
      a.btn-sm,
      input.btn-sm {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
      }
      .app-header-notifications__menu {
        position: fixed !important;
        inset: calc(var(--app-header-mobile-h, 58px) + .25rem) .75rem auto .75rem !important;
        width: auto;
        max-height: min(72vh, 520px);
        overflow: auto;
        transform: none !important;
      }
      .app-header-account .dropdown-menu {
        max-width: calc(100vw - 1.5rem);
      }
      .app-header__page-tools {
        overflow: visible;
      }
      .app-header__page-tools > * {
        min-width: 0;
      }
      .page-subcontrols {
        justify-content: stretch;
      }
      .page-controls {
        flex-wrap: wrap;
        gap: .5rem;
    margin-bottom: .65rem;
  }

  .page-controls__left {
    order: 1;
    min-width: auto;
  }

  .page-controls__right {
    order: 2;
    min-width: auto;
    margin-left: auto;
  }

  .page-controls__center {
    order: 3;
    width: 100%;
    justify-content: flex-start;
  }

      .page-card {
        border-radius: .8rem;
      }

  #mobileSidebar.app-mobile-sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 2050;
    width: min(86vw, 340px);
    max-width: calc(100vw - 1rem);
    transform: translateX(-100%);
    visibility: hidden;
    will-change: transform;
  }

  #mobileSidebar.app-mobile-sidebar.show,
  #mobileSidebar.app-mobile-sidebar.showing {
    transform: none !important;
    visibility: visible !important;
  }

  #mobileSidebar.app-mobile-sidebar.hiding {
    transform: translateX(-100%) !important;
  }

  #mobileSidebar.app-mobile-sidebar .offcanvas-body {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  #mobileSidebar.app-mobile-sidebar .btn-close,
  #mobileSidebar.app-mobile-sidebar .nav-link,
  #mobileSidebar.app-mobile-sidebar .dropdown-item,
  #mobileSidebar.app-mobile-sidebar .sidebar-location__toggle {
    min-height: 44px;
  }

  .offcanvas-backdrop {
    z-index: 2040;
  }

  .page-card--timeline {
    width: auto;
    max-width: calc(100vw - .7rem);
    overflow: hidden;
    margin-inline: .35rem !important;
  }

  .page-card--timeline .timeline-service-shell,
  .page-card--timeline .timeline-service-main,
  .page-card--timeline #timelineRoot,
  .page-card--timeline #timelineListView {
    min-width: 0;
    max-width: 100%;
  }

  .page-card--timeline .timetable {
    width: 100%;
    max-width: 100%;
  }

  .page-card--timeline .tt-scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }
}

/* Bon Maître brand layer */
body {
  background: #E7E2D6;
  color: #1F2A24;
}

.sidebar {
  background: #F7F3EA;
  border-right-color: #D8D2C4;
}

.sidebar .nav-link {
  color: #1F2A24;
  font-weight: 500;
}

.sidebar .nav-link:hover {
  background: rgba(125, 135, 126, .16);
  color: #2F3D34;
}

.sidebar .nav-link.active {
  background: #2F3D34;
  color: #F7F3EA;
}

.sidebar .section-label {
  color: #6F766F !important;
}

.brand-logo {
  display: block;
  object-fit: contain;
}

.brand-logo--horizontal {
  width: 100%;
  max-width: 100%;
  height: auto;
}

.brand-logo--icon {
  display: none;
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
}

#mobileSidebar.app-mobile-sidebar .sidebar-brand {
  width: 100%;
  align-items: stretch !important;
}

#mobileSidebar.app-mobile-sidebar .brand-logo--horizontal {
  width: 100%;
  max-width: 100%;
}

#mobileSidebar.app-mobile-sidebar .brand-logo--icon {
  display: none;
}

#mobileSidebar.app-mobile-sidebar .nav-link {
  color: #1F2A24;
  font-weight: 500;
  text-decoration: none;
}

#mobileSidebar.app-mobile-sidebar .nav-link:hover,
#mobileSidebar.app-mobile-sidebar .nav-link:focus {
  background: rgba(125, 135, 126, .16);
  color: #2F3D34;
}

#mobileSidebar.app-mobile-sidebar .nav-link.active {
  background: #2F3D34;
  color: #F7F3EA;
}

#mobileSidebar.app-mobile-sidebar .dropdown-item,
#mobileSidebar.app-mobile-sidebar .sidebar-location__toggle {
  color: #1F2A24;
  text-decoration: none;
}

.sidebar-collapsed .sidebar .brand-logo--horizontal {
  display: none;
}

.sidebar-collapsed .sidebar .brand-logo--icon {
  display: block;
  width: 54px;
  height: 54px;
}

.app-header {
  border-bottom-color: #D8D2C4;
  background: rgba(247, 243, 234, .93);
  box-shadow: 0 10px 30px rgba(31, 42, 36, .04);
}

.app-header__page-title {
  color: #1F2A24;
  font-weight: 600;
}

.app-header-icon,
.app-header-account .dropdown-toggle {
  border-color: #D8D2C4;
  background: #F7F3EA;
  color: #1F2A24;
  box-shadow: 0 8px 24px rgba(31, 42, 36, .06);
}

.app-header-icon:hover,
.app-header-account .dropdown-toggle:hover {
  border-color: #7D877E;
  color: #2F3D34;
  box-shadow: 0 12px 28px rgba(31, 42, 36, .10);
}

.app-header-icon__badge,
.app-header-more__badge,
.app-header-more__dot {
  background: #8D4A43;
}

.page-card {
  background: #F7F3EA;
  border-color: #D8D2C4;
  border-radius: .75rem;
  box-shadow: 0 10px 30px rgba(31, 42, 36, .04);
}

.sidebar-location__toggle {
  border-color: #D8D2C4;
  background: #fffaf1;
  color: #1F2A24;
}

.sidebar-location__toggle:hover,
.sidebar-location__toggle:focus {
  border-color: #7D877E;
  background: #F7F3EA;
  color: #2F3D34;
}

.sidebar-location__menu,
.app-header-notifications__menu,
.app-header-more__menu {
  border-color: #D8D2C4;
  background: rgba(247, 243, 234, .98);
  box-shadow: 0 18px 42px rgba(31, 42, 36, .14);
}

.sidebar-location__menu .dropdown-item.active,
.sidebar-location__menu .dropdown-item:active {
  background: #2F3D34;
  color: #F7F3EA;
}

.app-header-notifications__item,
.app-header-notifications__empty,
.app-header-more__item:hover {
  background: #fffaf1;
}