/* Consortium Vault v0.44.1 – Desktop Narrow Layout Fix */

/* Grundregel: kein Inhalt darf rechts aus dem sichtbaren Bereich laufen */
html,
body {
  max-width: 100%;
  overflow-x: hidden !important;
}

main,
.page-shell,
.container,
.wrapper,
.dashboard,
.admin-dashboard,
.portal-shell,
.cv-demo-shell,
.cv-data-room,
.cv-admin-flow {
  max-width: 100% !important;
  overflow-x: hidden !important;
}

/* Rechte Content-Bereiche dürfen schrumpfen */
section,
article,
.content-section,
.document-cover,
.toc-card,
.card,
.panel,
.box,
.module,
.tile {
  min-width: 0 !important;
  max-width: 100% !important;
}

/* Tabellen immer in ihrem Bereich halten */
.table-scroll {
  max-width: 100% !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

/* Wichtig für kleinere Desktop-/Laptop-Fenster:
   Layouts mit Navigation + Content werden untereinander gestellt */
@media (max-width: 1180px) {
  .page-shell {
    width: calc(100% - 28px) !important;
    max-width: calc(100% - 28px) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .document-layout,
  .dashboard-layout,
  .admin-layout,
  .portal-layout,
  .deployment-layout,
  .control-center-layout,
  .roadmap-layout,
  .content-layout,
  .two-column-layout,
  .split-layout,
  .main-layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Navigation nicht mehr links kleben lassen */
  aside,
  nav,
  .toc-card,
  .sidebar,
  .side-nav,
  .deployment-navigation,
  .document-navigation,
  .admin-navigation {
    position: relative !important;
    top: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  /* Falls Navigation und Content direkte Kinder eines Containers sind */
  .page-shell > .toc-card,
  .page-shell > aside,
  .page-shell > nav {
    width: 100% !important;
    max-width: 100% !important;
  }

  .content-section {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Noch kleineres Fenster: alles kompakter */
@media (max-width: 980px) {
  .page-shell {
    width: calc(100% - 22px) !important;
    max-width: calc(100% - 22px) !important;
  }

  .toc-card,
  .content-section,
  .document-cover,
  .cv-demo-hero,
  .cv-data-room-hero,
  .cv-admin-flow-hero {
    padding: 18px !important;
    border-radius: 18px !important;
  }

  h1 {
    font-size: clamp(30px, 5vw, 48px) !important;
  }

  h2 {
    font-size: clamp(24px, 4vw, 36px) !important;
  }
}

/* Sehr wichtig:
   Wenn irgendwo ein Grid mit Sidebar fest 300px + Content hat,
   dann bei kleinerem Screen hart auf 1 Spalte setzen. */
@media (max-width: 1180px) {
  [class*="layout"],
  [class*="Layout"],
  [class*="grid"],
  [class*="Grid"] {
    min-width: 0 !important;
  }

  [class*="sidebar"],
  [class*="Sidebar"],
  [class*="navigation"],
  [class*="Navigation"] {
    max-width: 100% !important;
    min-width: 0 !important;
  }
}