/*
These styles apply spacing to the content area to accommodate the fixed header
and main menu. This stylesheet should be loaded conditionally, only when the header
and main menu are rendered.

See hide_header and hide_main_menu settings in the main template wrapper.
*/
/* success */
/* info */
/* warning */
/* error */
:root {
  --cp-font-weight-semi-bold: 600;
}

.cp-layout-page {
  height: 100%;
}

.cp-layout-main-menu {
  min-width: clamp(240px, 14.8vw, 320px);
  max-width: clamp(240px, 14.8vw, 320px);
  border-left: 0;
  z-index: 1032;
  /* Apply menu color to the empty main-menu container. Prevents a white flash before the menu component finishes rendering */
  background-color: var(--cp-primary-color);
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  overflow: hidden;
}
@media (max-width: 767.98px) {
  .cp-layout-main-menu {
    display: none;
  }
}
.cp-layout-main-menu.cp-layout-main-menu--show {
  display: block;
}

.cp-layout-wrapper {
  margin-right: clamp(240px, 14.8vw, 320px);
  min-width: 0;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
@media (max-width: 767.98px) {
  .cp-layout-wrapper {
    margin-right: 0;
  }
}

.cp-layout-header {
  position: sticky;
  top: 0;
  height: 60px;
  width: 100%;
  z-index: 1030;
  background: #ffffff;
}

.cp-layout-main-content {
  padding: 0 24px;
  flex-grow: 1;
}

.cp-layout-footer {
  padding: 0 24px;
}

.cp-layout-main-content--with-header {
  padding-top: 24px;
}

.container-lg {
  /* had to mark these important to override bootstrap container-lg class */
  padding: 0 !important;
  margin-right: 0 !important;
}

.cp-layout-header, .cp-layout-main-content, .cp-layout-footer {
  flex-shrink: 0;
}
.cp-layout-wrapper .alert-list-container.position-top-right,
.cp-layout-wrapper .alert-list-container.position-bottom-right {
  right: clamp(240px, 14.8vw, 320px);
}
/*# sourceMappingURL=main_content_spacing.rtl.css.map */