/* ============================================================
   ControlPlan Application Shell — v2.20.2
   Single source of truth for desktop collapse + mobile drawer.
   ============================================================ */

html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

.dashboard {
  display: flex;
  min-height: 100vh;
  background: var(--cp-bg-page);
}

.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 40;
  width: var(--cp-sidebar-width);
  overflow-y: auto;
  overflow-x: hidden;
  background: var(--cp-nav-bg);
  color: var(--cp-nav-text);
  box-shadow: 4px 0 18px rgba(12, 22, 38, .12);
  transition: width var(--cp-transition-normal), transform var(--cp-transition-normal);
}

.sidebar::before {
  content: "CONTROLPLAN";
  display: block;
  padding: 1.4rem 1.35rem 1rem;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  color: var(--cp-white);
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: .08em;
}

.sidebar .menu {
  padding: 1rem .75rem;
}

.sidebar .menu-label {
  padding: .5rem .65rem;
  color: var(--cp-muted);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.sidebar .menu-list {
  margin: 0;
}

.sidebar .menu-list li {
  margin: 2px 0;
}

.sidebar .menu-list a {
  display: flex;
  align-items: center;
  min-height: 42px;
  padding: .65rem .75rem;
  overflow: hidden;
  border-left: 3px solid transparent;
  border-radius: 0 var(--cp-radius-sm) var(--cp-radius-sm) 0;
  color: var(--cp-nav-text);
  font-weight: 500;
  white-space: nowrap;
  transition: background var(--cp-transition-fast), color var(--cp-transition-fast);
}

.sidebar .menu-list a:hover {
  background: var(--cp-nav-hover-bg);
  color: var(--cp-nav-text-hover);
}

.sidebar .menu-list a:focus,
.sidebar .menu-list a.is-active {
  border-left-color: var(--cp-nav-active-border);
  background: var(--cp-nav-active-bg);
  color: var(--cp-nav-active-text);
}

.dashboard-main {
  flex: 1 1 auto;
  min-width: 0;
  width: calc(100% - var(--cp-sidebar-width));
  margin-left: var(--cp-sidebar-width);
  transition: width var(--cp-transition-normal), margin-left var(--cp-transition-normal);
}

body.sidebar-collapsed .sidebar {
  width: 72px;
}

body.sidebar-collapsed .sidebar::before {
  content: "CP";
  padding-left: 1.25rem;
}

body.sidebar-collapsed .sidebar .menu-label {
  overflow: hidden;
  font-size: 0;
  text-align: center;
}

body.sidebar-collapsed .sidebar .menu-label::after {
  content: "•••";
  font-size: .72rem;
}

body.sidebar-collapsed .sidebar .menu-list a {
  justify-content: center;
  color: transparent;
  font-size: 0;
}

body.sidebar-collapsed .dashboard-main {
  width: calc(100% - 72px);
  margin-left: 72px;
}

/* Header */
.navbar {
  min-height: var(--cp-navbar-height);
  border-bottom: 1px solid var(--cp-border-subtle);
  background: var(--cp-bg-header);
  box-shadow: var(--cp-shadow-xs);
}

.controlplan-navbar {
  display: flex;
  align-items: center;
  gap: .75rem;
  width: 100%;
  min-width: 0;
  min-height: var(--cp-navbar-height);
  padding: .5rem 1rem;
}

.controlplan-navbar__brand,
.controlplan-navbar__product,
.controlplan-navbar__main,
.controlplan-navbar__organization,
.controlplan-navbar__context,
.controlplan-navbar__account {
  min-width: 0;
}

.controlplan-navbar__brand {
  display: flex;
  align-items: center;
  flex: 0 1 auto;
}

.controlplan-navbar__toggle {
  flex: 0 0 auto;
  padding-left: 0;
  padding-right: .35rem;
}

.sidebar-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.controlplan-navbar__product {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding-left: 0;
}

.controlplan-navbar__logo {
  flex: 0 0 auto;
  max-width: 120px;
  max-height: 32px;
}

.controlplan-navbar__product-name {
  display: block;
  max-width: clamp(140px, 22vw, 360px);
  overflow: hidden;
  color: var(--cp-text-heading);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.controlplan-navbar__main {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  justify-content: flex-end;
  gap: .65rem;
}

.controlplan-navbar__organization {
  flex: 0 1 240px;
  min-width: 150px;
}

.controlplan-navbar__org-form,
.controlplan-navbar__org-select,
.controlplan-navbar__org-select select {
  width: 100%;
}

.controlplan-navbar__context {
  display: flex;
  flex: 0 1 auto;
  align-items: center;
  gap: .5rem;
}

.controlplan-navbar__tenant {
  display: block;
  max-width: 250px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.controlplan-navbar__version {
  flex: 0 0 auto;
  white-space: nowrap;
}

.controlplan-navbar__account {
  display: flex;
  flex: 0 1 auto;
  align-items: center;
  gap: .65rem;
}

.controlplan-navbar__user {
  display: block;
  max-width: 220px;
  overflow: hidden;
  color: var(--cp-text-secondary);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.controlplan-navbar__logout {
  flex: 0 0 auto;
}

/* Content */
.dashboard-content {
  width: 100%;
  max-width: var(--cp-content-max);
  min-width: 0;
  margin: 0 auto;
  padding: 2rem;
}

.container {
  max-width: var(--cp-content-max);
}

.dashboard-content,
.box,
.card,
.column {
  min-width: 0;
}

.table-container,
.controlplan-scroll-x {
  max-width: 100%;
  overflow-x: auto;
}

.controlplan-breadcrumbs {
  margin-bottom: 1rem;
}

.controlplan-breadcrumbs span {
  padding: 0 .75em;
  color: var(--cp-text-secondary);
}

.footer {
  border-top: 1px solid var(--cp-border-subtle);
  background: var(--cp-bg-surface);
  color: var(--cp-text-muted);
}

.sidebar-overlay {
  display: none;
}

.controlplan-mobile-account {
  display: none;
}

/* Progressive desktop compression */
@media (max-width: 1450px) {
  .controlplan-navbar__user { max-width: 160px; }
  .controlplan-navbar__tenant { max-width: 190px; }
  .controlplan-navbar__organization { flex-basis: 210px; }
}

@media (max-width: 1220px) {
  .controlplan-navbar__tenant { display: none; }
  .controlplan-navbar__organization { flex-basis: 190px; }
  .controlplan-navbar__user { max-width: 130px; }
}

@media (max-width: 1050px) {
  .controlplan-navbar__version { display: none; }
  .controlplan-navbar__user { display: none; }
  .controlplan-navbar__organization { flex-basis: 170px; }
}

/* Mobile/tablet drawer */
@media (max-width: 900px) {
  body.sidebar-mobile-open {
    overflow: hidden;
  }

  .dashboard {
    display: block;
  }

  .dashboard-main,
  body.sidebar-collapsed .dashboard-main {
    width: 100%;
    margin-left: 0;
  }

  .sidebar,
  body.sidebar-collapsed .sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: min(84vw, 320px);
    max-height: none;
    transform: translateX(-105%);
    overflow-y: auto;
    overflow-x: hidden;
  }

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

  body.sidebar-collapsed .sidebar::before {
    content: "CONTROLPLAN";
    padding: 1.4rem 1.35rem 1rem;
  }

  body.sidebar-collapsed .sidebar .menu-label {
    font-size: .72rem;
    text-align: left;
  }

  body.sidebar-collapsed .sidebar .menu-label::after {
    content: "";
  }

  body.sidebar-collapsed .sidebar .menu-list a {
    justify-content: flex-start;
    color: var(--cp-nav-text);
    font-size: inherit;
  }

  body.sidebar-mobile-open .sidebar-overlay {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 39;
    width: 100vw;
    height: 100dvh;
    padding: 0;
    border: 0;
    background: rgba(12, 22, 38, .54);
  }

  .controlplan-navbar {
    flex-wrap: nowrap;
    min-height: 64px;
    padding: .5rem .75rem;
  }

  .controlplan-navbar__brand {
    flex: 1 1 auto;
    overflow: hidden;
  }

  .controlplan-navbar__product {
    flex: 1 1 auto;
    overflow: hidden;
  }

  .controlplan-navbar__product-name {
    max-width: none;
  }

  /* Workspace/account are available inside the drawer on mobile. */
  .controlplan-navbar__main {
    display: none;
  }

  .controlplan-mobile-account {
    display: block;
    margin: 1rem .65rem .5rem;
    padding: 1rem .75rem;
    border-top: 1px solid rgba(255, 255, 255, .12);
  }

  .controlplan-mobile-account .menu-label {
    padding-left: 0;
  }

  .controlplan-mobile-account__form {
    margin-bottom: .85rem;
  }

  .controlplan-mobile-account__identity {
    margin-bottom: .6rem;
    overflow: hidden;
    color: var(--cp-nav-text);
    font-size: .8rem;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .dashboard-content {
    width: 100%;
    max-width: 100%;
    padding: 1rem;
    overflow-x: hidden;
  }
}

@media (min-width: 901px) {
  .sidebar-overlay {
    display: none !important;
  }
}

/* Risk matrix helpers retained from the risk module. */
.risk-cell { min-width: 90px; }
.risk-low { background: #effaf3; }
.risk-moderate { background: #fffaeb; }
.risk-high { background: #fff3e6; }
.risk-critical { background: #feecf0; font-weight: 700; }

/* v2.22.1 screenshot-confirmed UI layout hotfix */
.dashboard-content > .level,
.controlplan-page-header { align-items:flex-start; flex-wrap:wrap; gap:1rem; }
.dashboard-content > .level > .level-left,
.dashboard-content > .level > .level-right,
.controlplan-page-header > .level-left,
.controlplan-page-header > .level-right { min-width:0; }
.dashboard-content > .level > .level-left,
.controlplan-page-header > .level-left { flex:1 1 360px; }
.dashboard-content > .level > .level-right,
.controlplan-page-header > .level-right {
  display:flex; flex:0 1 auto; flex-wrap:wrap; justify-content:flex-end;
  gap:.5rem; max-width:100%;
}
.dashboard-content > .level > .level-right.buttons .button,
.controlplan-page-header > .level-right.buttons .button { margin:0; }
.controlplan-equal-box { height:100%; }
@media (max-width:1200px) {
  .dashboard-content > .level > .level-right,
  .controlplan-page-header > .level-right { flex:1 1 100%; justify-content:flex-start; }
}
@media (max-width:768px) {
  .dashboard-content { padding:1.25rem; }
  .dashboard-content > .level > .level-left,
  .dashboard-content > .level > .level-right,
  .controlplan-page-header > .level-left,
  .controlplan-page-header > .level-right { flex-basis:100%; width:100%; }
  .dashboard-content > .level > .level-right .button,
  .controlplan-page-header > .level-right .button { white-space:normal; }
}

/* v2.23.1 Risk Register table hotfix */
.risk-register-table {
  min-width: 1180px;
}
.risk-register-table th,
.risk-register-table td {
  vertical-align: middle;
}
.risk-register-table .risk-select-cell {
  width: 2.75rem;
  min-width: 2.75rem;
  text-align: center;
}
.risk-register-table .risk-name-cell {
  min-width: 190px;
  max-width: 260px;
  overflow-wrap: anywhere;
}
.risk-register-table td:last-child {
  min-width: 140px;
}
.risk-register-table td:last-child .button {
  display: block;
  width: 100%;
  margin: 0 0 .35rem 0;
}
.risk-bulk-toolbar .columns {
  margin-bottom: 0;
}
.risk-bulk-toolbar .column {
  min-width: 220px;
}
.risk-bulk-toolbar .column.is-narrow {
  min-width: auto;
}
@media (max-width: 768px) {
  .risk-bulk-toolbar .column,
  .risk-bulk-toolbar .column.is-narrow {
    flex: 1 1 100%;
    width: 100%;
  }
  .risk-bulk-toolbar .button {
    width: 100%;
  }
}

/* ============================================================
   v2.24 GRC Suite shared shell — DataPlan visual baseline
   Behavior remains ControlPlan-native; geometry/visual language is shared.
   ============================================================ */
:root{
  --cp-sidebar-width:var(--grc-sidebar-width);
  --cp-navbar-height:var(--grc-topbar-height);
  --cp-content-max:var(--grc-content-max);
}
.sidebar{
  width:var(--grc-sidebar-width);
  padding:18px 14px;
  background:linear-gradient(180deg,var(--grc-sidebar),#0d162b);
  color:#fff;
}
.dashboard-main{width:calc(100% - var(--grc-sidebar-width));margin-left:var(--grc-sidebar-width)}
.sidebar .menu-label{padding:17px 11px 5px;color:#7687a7;font-size:10px;font-weight:800;letter-spacing:.12em}
.sidebar .menu-list a{min-height:39px;margin:3px 0;padding:8px 10px;border-radius:8px;color:var(--grc-sidebar-text);font-weight:580}
.sidebar .menu-list a:hover{background:#1c2c4e;color:#fff}
.navbar{height:var(--grc-topbar-height);background:rgba(255,255,255,.94);border-bottom:1px solid var(--grc-line);box-shadow:none;backdrop-filter:blur(10px)}
.controlplan-navbar{padding:0 28px}
.dashboard-content{max-width:var(--grc-content-max);padding:26px 30px 42px}
.box,.card{border:1px solid var(--grc-line);border-radius:var(--grc-radius);box-shadow:var(--grc-shadow)}
body.sidebar-collapsed .sidebar{width:var(--grc-sidebar-collapsed)}
body.sidebar-collapsed .dashboard-main{width:calc(100% - var(--grc-sidebar-collapsed));margin-left:var(--grc-sidebar-collapsed)}
@media(max-width:900px){
  .dashboard-main,body.sidebar-collapsed .dashboard-main{width:100%;margin-left:0}
  .dashboard-content{padding:18px}
}