/* 1Transit authenticated application shell. */

body.app-shell-body {
  min-height: 100%;
  padding-top: 0;
  background: var(--tm-bg);
}

body.app-shell-body.modal-open .modal-backdrop,
body.app-shell-body.modal-open .modal {
  top: 0;
  height: 100%;
}

.top-accent {
  height: var(--tm-accent-height);
  background: var(--tm-brand) !important;
}

.app-shell {
  min-height: 100vh;
}

.app-sidebar {
  position: fixed;
  z-index: 1035;
  top: var(--tm-accent-height);
  bottom: 0;
  left: 0;
  width: var(--tm-sidebar-width);
  display: flex;
  flex-direction: column;
  background: var(--tm-surface);
  border-right: 1px solid var(--tm-border);
}

.app-sidebar__brand {
  min-height: 84px;
  display: flex;
  align-items: center;
  padding: 14px 16px 10px;
  border-bottom: 1px solid var(--tm-border);
}

.app-sidebar__brand-link {
  display: flex;
  align-items: center;
  width: 100%;
  color: var(--tm-text);
  text-decoration: none;
}

.app-sidebar__logo {
  display: block;
  width: 154px;
  max-height: 62px;
  object-fit: contain;
  object-position: left center;
}

.app-sidebar__context {
  margin: 12px 12px 6px;
  padding: 10px 11px;
  border: 1px solid var(--tm-border);
  border-radius: var(--tm-radius-md);
  background: var(--tm-surface-muted);
}

.app-sidebar__context-label {
  display: block;
  margin-bottom: 2px;
  color: var(--tm-text-subtle);
  font-size: .6875rem;
  font-weight: 700;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.app-sidebar__context-value {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--tm-text);
  font-size: .9rem;
  font-weight: 700;
}

.app-sidebar__context-dot {
  width: 8px;
  height: 8px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--tm-brand);
  box-shadow: 0 0 0 2px rgba(254, 204, 19, .22);
}

.app-sidebar__scroll {
  min-height: 0;
  flex: 1 1 auto;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 8px 10px 14px;
}

.app-sidebar__section-label {
  margin: 14px 9px 6px;
  color: var(--tm-text-subtle);
  font-size: .6875rem;
  font-weight: 700;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.app-sidebar__nav {
  display: grid;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.app-sidebar__link,
.app-sidebar__legacy-summary {
  position: relative;
  min-height: 40px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  color: #48515a;
  font-size: .875rem;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
  border: 1px solid transparent;
  border-radius: var(--tm-radius-md);
  cursor: pointer;
  transition: background-color .12s ease, color .12s ease, border-color .12s ease;
}

.app-sidebar__link:hover,
.app-sidebar__legacy-summary:hover {
  color: var(--tm-text);
  background: #f3f4f5;
}

.app-sidebar__link.is-active {
  color: #171a1d;
  background: var(--tm-brand-soft);
  border-color: #f0dc78;
}

.app-sidebar__link.is-active::before {
  content: "";
  position: absolute;
  top: 8px;
  bottom: 8px;
  left: -7px;
  width: 3px;
  border-radius: 4px;
  background: var(--tm-brand);
}

.app-sidebar__icon {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  color: currentColor;
}

.app-sidebar__legacy {
  margin-top: 8px;
  border-top: 1px solid var(--tm-border);
  padding-top: 8px;
}

.app-sidebar__legacy > summary {
  list-style: none;
}

.app-sidebar__legacy > summary::-webkit-details-marker {
  display: none;
}

.app-sidebar__legacy-chevron {
  width: 15px;
  height: 15px;
  margin-left: auto;
  transition: transform .12s ease;
}

.app-sidebar__legacy[open] .app-sidebar__legacy-chevron {
  transform: rotate(90deg);
}

.app-sidebar__legacy-links {
  display: grid;
  gap: 1px;
  padding: 3px 0 0 28px;
}

.app-sidebar__legacy-links .app-sidebar__link {
  min-height: 34px;
  padding: 6px 9px;
  font-size: .8125rem;
  font-weight: 500;
}

.app-sidebar__footer {
  flex: 0 0 auto;
  padding: 10px 12px 12px;
  border-top: 1px solid var(--tm-border);
  background: var(--tm-surface);
}

.app-user {
  display: flex;
  align-items: center;
  gap: 9px;
}

.app-user__avatar {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: grid;
  place-items: center;
  color: #202020;
  font-size: .8rem;
  font-weight: 800;
  text-transform: uppercase;
  border: 1px solid #e1c85e;
  border-radius: 50%;
  background: var(--tm-brand-soft);
}

.app-user__meta {
  min-width: 0;
  flex: 1 1 auto;
}

.app-user__name,
.app-user__role {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-user__name {
  color: var(--tm-text);
  font-size: .8125rem;
  font-weight: 700;
}

.app-user__role {
  margin-top: 1px;
  color: var(--tm-text-subtle);
  font-size: .6875rem;
}

.app-user__logout {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  flex: 0 0 32px;
  color: var(--tm-text-muted);
  border-radius: var(--tm-radius-sm);
  text-decoration: none;
}

.app-user__logout:hover {
  color: var(--tm-danger);
  background: var(--tm-danger-soft);
}

.app-main-column {
  min-height: 100vh;
  margin-left: var(--tm-sidebar-width);
}

.app-content {
  min-height: 100vh;
  padding: 1px 22px 34px;
}

.app-content > .container-narrow {
  width: 100%;
  margin-top: 18px;
  margin-bottom: 0;
}

.app-mobile-header,
.app-sidebar-backdrop {
  display: none;
}

@media (max-width: 991.98px) {
  body.app-shell-body {
    padding-top: calc(var(--tm-mobile-header-height) + var(--tm-accent-height));
  }

  .app-sidebar {
    width: min(286px, calc(100vw - 42px));
    transform: translateX(-104%);
    box-shadow: var(--tm-shadow-md);
    transition: transform .18s ease;
  }

  body.app-sidebar-open {
    overflow: hidden;
  }

  body.app-sidebar-open .app-sidebar {
    transform: translateX(0);
  }

  .app-sidebar-backdrop {
    position: fixed;
    z-index: 1030;
    inset: var(--tm-accent-height) 0 0 0;
    display: block;
    pointer-events: none;
    opacity: 0;
    background: rgba(22, 27, 31, .34);
    transition: opacity .18s ease;
  }

  body.app-sidebar-open .app-sidebar-backdrop {
    pointer-events: auto;
    opacity: 1;
  }

  .app-main-column {
    min-height: 0;
    margin-left: 0;
  }

  .app-mobile-header {
    position: fixed;
    z-index: 1025;
    top: var(--tm-accent-height);
    right: 0;
    left: 0;
    height: var(--tm-mobile-header-height);
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 14px;
    background: var(--tm-surface);
    border-bottom: 1px solid var(--tm-border);
  }

  .app-mobile-header__toggle {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    flex: 0 0 38px;
    padding: 0;
    color: var(--tm-text);
    border: 1px solid var(--tm-border);
    border-radius: var(--tm-radius-md);
    background: var(--tm-surface);
  }

  .app-mobile-header__brand {
    min-width: 0;
    display: flex;
    flex-direction: column;
    line-height: 1.1;
  }

  .app-mobile-header__brand strong {
    font-size: .9rem;
  }

  .app-mobile-header__brand span {
    margin-top: 3px;
    color: var(--tm-text-subtle);
    font-size: .68rem;
  }

  .app-content {
    min-height: 0;
    padding: 1px 12px 24px;
  }

  .app-content > .container-narrow {
    margin-top: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .app-sidebar,
  .app-sidebar-backdrop,
  .app-sidebar__link,
  .app-sidebar__legacy-chevron {
    transition: none !important;
  }
}

/* UI03 workspace switcher and transitional workspace home. */
.app-workspace-switcher {
  width: 100%;
  padding: 0;
  color: inherit;
  text-align: left;
  border: 0;
  background: transparent;
}

.app-workspace-switcher:focus-visible {
  outline: none;
  border-radius: var(--tm-radius-sm);
  box-shadow: var(--tm-focus-ring);
}

.app-workspace-switcher__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.app-workspace-switcher__chevron {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  color: var(--tm-text-subtle);
  transition: transform .12s ease;
}

.app-sidebar__context.show .app-workspace-switcher__chevron {
  transform: rotate(180deg);
}

.app-workspace-switcher__scope {
  display: block;
  margin-top: 7px;
  color: var(--tm-text-subtle);
  font-size: .7rem;
  line-height: 1.25;
}

.app-workspace-switcher__scope strong {
  color: var(--tm-text-muted);
  font-weight: 700;
}

.app-sidebar__context-dot.is-iway,
.app-workspace-option__indicator.is-iway {
  background: #30363d;
  box-shadow: 0 0 0 2px rgba(48, 54, 61, .14);
}

.app-workspace-menu {
  width: 300px;
  max-width: calc(100vw - 28px);
  margin-top: 7px !important;
  padding: 8px;
  border-color: var(--tm-border-strong);
  border-radius: var(--tm-radius-lg);
  box-shadow: var(--tm-shadow-md);
}

.app-workspace-menu__title {
  padding: 5px 9px 8px;
  color: var(--tm-text-subtle);
  font-size: .6875rem;
  font-weight: 700;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.app-workspace-menu__form + .app-workspace-menu__form {
  margin-top: 2px;
}

.app-workspace-option {
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  color: var(--tm-text);
  border-radius: var(--tm-radius-md);
  white-space: normal;
}

.app-workspace-option:hover,
.app-workspace-option:focus {
  color: var(--tm-text);
  background: var(--tm-surface-muted);
}

.app-workspace-option.is-current {
  background: var(--tm-brand-soft);
}

.app-workspace-option__indicator {
  width: 9px;
  height: 9px;
  flex: 0 0 9px;
  border-radius: 50%;
  background: var(--tm-brand);
  box-shadow: 0 0 0 2px rgba(254, 204, 19, .22);
}

.app-workspace-option__copy {
  min-width: 0;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
}

.app-workspace-option__copy strong {
  font-size: .825rem;
  line-height: 1.2;
}

.app-workspace-option__copy small {
  margin-top: 3px;
  color: var(--tm-text-subtle);
  font-size: .7rem;
  line-height: 1.25;
}

.app-workspace-option__check {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  color: #5b4a00;
}

.app-sidebar__scope-badge {
  margin-left: auto;
  padding: 2px 5px;
  color: var(--tm-text-subtle);
  font-size: .62rem;
  font-weight: 700;
  line-height: 1.15;
  border: 1px solid var(--tm-border);
  border-radius: 999px;
  background: var(--tm-surface);
}

.workspace-home {
  max-width: 1180px;
  margin: 0 auto;
}

.workspace-home__notice {
  color: var(--tm-text-muted);
  background: var(--tm-surface) !important;
}

.workspace-home-card {
  min-height: 128px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 18px;
  padding: 18px;
  color: var(--tm-text);
  text-decoration: none;
  border: 1px solid var(--tm-border);
  border-radius: var(--tm-radius-lg);
  background: var(--tm-surface);
  box-shadow: var(--tm-shadow-sm);
  transition: border-color .12s ease, box-shadow .12s ease, transform .12s ease;
}

.workspace-home-card:hover {
  color: var(--tm-text);
  border-color: var(--tm-border-strong);
  box-shadow: var(--tm-shadow-md);
  transform: translateY(-1px);
}

.workspace-home-card:focus-visible {
  outline: none;
  box-shadow: var(--tm-focus-ring);
}

.workspace-home-card__label {
  font-size: 1rem;
  font-weight: 750;
}

.workspace-home-card__meta {
  color: var(--tm-text-subtle);
  font-size: .79rem;
  line-height: 1.35;
}

@media (prefers-reduced-motion: reduce) {
  .app-workspace-switcher__chevron,
  .workspace-home-card {
    transition: none !important;
  }
}

/* ========================================================================== */
/* UI15 · visual QA density and desktop width                                 */
/* ========================================================================== */
@media (min-width: 992px) {
  .app-content {
    padding-right: 26px;
    padding-left: 26px;
  }

  .app-content > .container-narrow {
    max-width: none;
    width: 100%;
    margin-right: 0;
    margin-left: 0;
  }
}

.app-sidebar__brand {
  min-height: 76px;
  padding-top: 10px;
  padding-bottom: 8px;
}

.app-sidebar__logo {
  width: 146px;
  max-height: 56px;
}

.app-sidebar__context {
  margin-top: 10px;
  padding-top: 8px;
  padding-bottom: 8px;
}

.app-workspace-switcher__scope { display: none; }