:root {
  --z-sidebar: 100;
  --z-dropdown: 200;
  --z-sticky: 300;
  --z-overlay: 800;
  --z-modal: 900;
  --z-toast: 1000;
}

body.certus-app {
  min-height: 100dvh;
  display: flex;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-body);
}

.app-sidebar {
  flex: 0 0 var(--sidebar-width);
  width: var(--sidebar-width);
  height: 100dvh;
  position: sticky;
  top: 0;
  overflow: hidden;
  z-index: var(--z-sidebar);
}

.app-sidebar-scroll {
  height: 100%;
  overflow-y: auto;
}

.app-main,
body.certus-app > .main {
  flex: 1;
  min-width: 0;
  max-width: none;
  margin: 0;
  padding: 24px;
}

body.certus-app > .main {
  width: 100%;
}

.page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 24px;
}

.page-title {
  margin: 0;
}

.page-subtitle {
  margin: 6px 0 0;
  color: var(--text-muted);
}

.empty-state {
  border: 1px solid var(--border);
  background: var(--surface);
  border-radius: var(--radius-lg);
  padding: 32px;
  text-align: center;
}

.empty-state h2 {
  margin: 0 0 8px;
}

.empty-state p {
  margin: 0 auto 20px;
  max-width: 560px;
  color: var(--text-muted);
}

.global-nav-badge:empty,
.nav-badge:empty {
  display: none;
}

@media (max-width: 980px) {
  body.certus-app {
    display: block;
  }

  .app-sidebar {
    position: relative;
    width: 100%;
    height: auto;
  }

  .app-main,
  body.certus-app > .main {
    padding: 16px;
  }

  .page-header {
    flex-direction: column;
  }
}

/* CERTUS SPRINT 2 — Dashboard layout */
.dashboard-grid {
  display: grid;
  gap: 20px;
}

.dashboard-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.dashboard-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr);
  gap: 20px;
  align-items: start;
}

.dashboard-side-stack {
  display: grid;
  gap: 20px;
}

@media (max-width: 1100px) {
  .dashboard-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dashboard-main-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .dashboard-kpis {
    grid-template-columns: 1fr;
  }
}

/* CERTUS SPRINT 4 BATCH 1 — Responsive app shell guardrails */
.certus-app,.app-shell,.workspace-frame,.workspace-body{min-width:0}
.app-main,.app-content{min-width:0;max-width:100%}
@media(max-width:980px){
  .certus-app{display:block}
  .app-shell{display:block;min-width:0}
  .app-sidebar{position:relative;width:100%;max-width:100%;height:auto;min-height:0}
  .app-main,.app-content{width:100%;max-width:100%;padding:16px}
  .workspace-frame{width:100%;max-width:100%;min-height:auto}
}
@media(max-width:640px){.app-main,.app-content{padding:12px}}

/* CERTUS SPRINT 4 BATCH 4 — Mobile content reachability */
@media(max-width:980px){
  body.certus-app,
  .certus-app{
    overflow-x:hidden;
  }

  .app-main,
  .app-content,
  main{
    clear:both;
  }

  .workspace-frame,
  .dashboard-grid,
  .dashboard-main-grid,
  .dashboard-kpis,
  .dashboard-side-stack,
  .page-grid,
  .profile-layout,
  .case-layout,
  .case-grid{
    width:100%;
    max-width:100%;
  }
}

@media(max-width:430px){
  .page-actions .btn,
  .hero-actions .btn,
  .profile-actions .btn,
  .actions-row .btn{
    width:100%;
    justify-content:center;
  }
}
