:root {
  --shell-sidebar-w: 252px;
  --shell-topbar-h: 58px;
  --shell-bg: #f6f8fb;
  --shell-surface: #ffffff;
  --shell-border: #e4e8f0;
  --shell-text: #172033;
  --shell-muted: #667085;
  --shell-primary: #1f5eff;
  --shell-primary-soft: #eef4ff;
  --shell-hover: #f7f9fc;
  --shell-danger: #b42318;
  --shell-success: #067647;
  --shell-shadow:
    0 1px 2px rgba(16,24,40,.04),
    0 8px 24px rgba(16,24,40,.06);
}

html {
  -webkit-text-size-adjust: 100%;
}

body.tchc-shell-enabled {
  margin-left: var(--shell-sidebar-w) !important;
  padding-top: var(--shell-topbar-h) !important;
  background: var(--shell-bg);
  min-height: 100vh;
}

#tchcShellSidebar {
  position: fixed;
  inset: 0 auto 0 0;
  width: var(--shell-sidebar-w);
  background: var(--shell-surface);
  border-right: 1px solid var(--shell-border);
  z-index: 1000;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.tchc-shell-brand {
  min-height: 70px;
  padding: 14px 18px;
  display: flex;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--shell-border);
}

.tchc-shell-brand-mark {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: var(--shell-primary);
  color: #fff;
  font: 700 13px/36px system-ui,sans-serif;
  text-align: center;
  flex: 0 0 auto;
}

.tchc-shell-brand-title {
  font: 700 14px/1.25 system-ui,sans-serif;
  color: var(--shell-text);
}

.tchc-shell-brand-subtitle {
  margin-top: 2px;
  font: 500 11px/1.25 system-ui,sans-serif;
  color: var(--shell-muted);
}

.tchc-shell-nav {
  display: block;
  min-height: 0;
  margin: 0;
  padding: 12px 10px 20px;
  overflow-y: auto;
  flex: 1;
}

.tchc-shell-section {
  margin: 14px 8px 6px;
  color: #98a2b3;
  font: 700 10px/1.2 system-ui,sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
}

#tchcShellSidebar [hidden] { display: none !important; }

.tchc-shell-link {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  margin: 2px 0;
  padding: 8px 10px;
  border-radius: 9px;
  color: #344054;
  text-decoration: none;
  font: 600 13px/1.25 system-ui,sans-serif;
  transition:
    background-color .15s ease,
    color .15s ease;
}

.tchc-shell-link:hover {
  background: var(--shell-hover);
}

.tchc-shell-link.active {
  background: var(--shell-primary-soft);
  color: var(--shell-primary);
}

.tchc-shell-icon {
  width: 20px;
  flex: 0 0 20px;
  text-align: center;
  font-size: 16px;
}

.tchc-shell-footer {
  padding: 12px 14px;
  border-top: 1px solid var(--shell-border);
  background: #fff;
}

.tchc-shell-footer-title {
  font: 600 12px/1.3 system-ui,sans-serif;
  color: var(--shell-text);
}

.tchc-shell-footer-subtitle {
  margin-top: 2px;
  font: 500 11px/1.3 system-ui,sans-serif;
  color: var(--shell-muted);
}

#tchcShellTopbar {
  position: fixed;
  left: var(--shell-sidebar-w);
  right: 0;
  top: 0;
  height: var(--shell-topbar-h);
  z-index: 990;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 20px;
  background: rgba(255,255,255,.96);
  border-bottom: 1px solid var(--shell-border);
  backdrop-filter: blur(10px);
}

.tchc-shell-mobile-toggle {
  display: none;
  width: 44px;
  height: 44px;
  min-height: 44px;
  padding: 0;
  border: 1px solid var(--shell-border);
  border-radius: 9px;
  background: #fff;
  cursor: pointer;
  font-size: 19px;
}

.tchc-shell-top-title-wrap {
  min-width: 0;
}

.tchc-shell-breadcrumb {
  color: #98a2b3;
  font: 500 11px/1.2 system-ui,sans-serif;
}

.tchc-shell-page-title {
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--shell-text);
  font: 700 14px/1.25 system-ui,sans-serif;
}

.tchc-shell-top-spacer {
  flex: 1;
}

.tchc-shell-role-badge {
  max-width: 260px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 6px 9px;
  border-radius: 999px;
  background: #f2f4f7;
  color: #475467;
  font: 600 11px/1.2 system-ui,sans-serif;
}

#tchcShellOverlay {
  display: none;
}

body.tchc-shell-enabled main,
body.tchc-shell-enabled .container,
body.tchc-shell-enabled .page-container {
  max-width: 100%;
}

body.tchc-shell-enabled .card,
body.tchc-shell-enabled .panel {
  border-color: var(--shell-border);
}

body.tchc-shell-enabled table thead th {
  position: sticky;
  top: var(--shell-topbar-h);
  z-index: 5;
}

@media (max-width: 900px) {
  /* Mobile pages have a fixed shell topbar. Sticky table headers can cover
     section titles/content while scrolling, so keep headers in normal flow. */
  body.tchc-shell-enabled table thead th {
    position: static;
  }
}

@media (max-width: 900px) {
  body.tchc-shell-enabled {
    margin-left: 0 !important;
  }

  #tchcShellSidebar {
    transform: translateX(-100%);
    box-shadow: var(--shell-shadow);
    transition: transform .2s ease;
  }

  body.tchc-shell-open #tchcShellSidebar {
    transform: translateX(0);
  }

  #tchcShellTopbar {
    left: 0;
    padding-left: 12px;
    padding-right: 12px;
  }

  .tchc-shell-mobile-toggle {
    display: inline-grid;
    place-items: center;
  }

  #tchcShellOverlay {
    position: fixed;
    inset: 0;
    z-index: 995;
    background: rgba(16,24,40,.38);
  }

  body.tchc-shell-open #tchcShellOverlay {
    display: block;
  }

  .tchc-shell-role-badge {
    max-width: 150px;
  }
}

@media (max-width: 560px) {
  .tchc-shell-role-badge {
    display: none;
  }

  #tchcShellTopbar {
    gap: 8px;
  }

  .tchc-shell-page-title {
    max-width: 220px;
  }
}

@media (prefers-reduced-motion: reduce) {
  #tchcShellSidebar {
    transition: none;
  }
}

.tchc-workspace-box{
  padding:12px 14px 13px;flex:0 0 auto;
  background:#f8faff;border-bottom:1px solid var(--shell-border);
}
.tchc-workspace-box label{
  display:block;margin:0 0 7px;
  font:700 11px/1.4 system-ui,sans-serif;color:#52637b;
}
.tchc-workspace-box select{
  width:100%;min-height:44px;padding:9px 12px;
  border:1px solid #bbcee9;border-radius:10px;
  background:#fff;color:#163f72;font:650 13px/1.4 system-ui,sans-serif;
}
.tchc-workspace-box select:focus-visible,.tchc-shell-link:focus-visible{
  outline:3px solid #87b2f6;outline-offset:2px;
}

/* TCHC_P2_20261024: scoped dashboard and queue tools */
#workboardView .p2-board-heading{display:flex;align-items:start;justify-content:space-between;gap:12px;flex-wrap:wrap}
#workboardView .p2-board-heading h2{margin:0 0 6px}
#workboardView .p2-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:16px 0}
#workboardView .p2-metric{display:flex;flex-direction:column;gap:12px;padding:17px;border:1px solid #dce5ef;background:#fff;color:#17395d;text-decoration:none;border-radius:12px;min-height:130px}
#workboardView .p2-metric b{font-size:30px;font-weight:750;color:#174b87}
#workboardView .p2-metric small{color:#4772a2}
#workboardView .p2-metric-error{background:#fff6f5;color:#963b2c}
#workboardView .p2-priority{margin:12px 0}
#workboardView .p2-priority-row{display:grid;grid-template-columns:minmax(145px,1fr) minmax(180px,2fr) 145px;gap:12px;align-items:center;padding:13px 4px;border-bottom:1px solid #e5ebf4;color:#273b52;text-decoration:none}
#workboardView .p2-priority-row:hover{background:#f5f8fc}
.p2-filter-bar{display:flex;gap:10px;align-items:end;flex-wrap:wrap;padding:12px 0 14px}
.p2-filter-bar label{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:700;color:#435774;min-width:130px;flex:1}
.p2-filter-bar .p2-search{min-width:200px}
.p2-filter-bar input,.p2-filter-bar select{width:100%;height:44px;padding:8px 10px;border:1px solid #cfdaea;border-radius:9px;background:#fff;color:#152c48;font:500 13px system-ui,sans-serif}
.p2-filter-bar button{min-height:44px}
.p2-filter-bar .p2-tally{font-size:12px;color:#52647a;padding:12px 0;white-space:nowrap}
.p2-scroll{max-width:100%;overflow-x:auto}
.p2-scroll tr[hidden]{display:none!important}
.p2-filter-empty{padding:18px;text-align:center;background:#f6f9fd;border-radius:10px;color:#53677c}
@media(max-width:640px){#workboardView .p2-priority-row{grid-template-columns:1fr;gap:3px;padding:12px}.p2-filter-bar label{flex:1 1 100%}}
