@import '_content/Cobra.Shared.Components/Cobra.Shared.Components.hhfsz07ns0.bundle.scp.css';

/* _content/Cobra.Core.UI/Components/Layout/MainLayout.razor.rz.scp.css */
/* paths */
/*
----------------------------------------
COLORS
----------------------------------------
*/
/* palette */
/* stylelint-disable color-no-hex */
/* palette shades */
/* primary */
/* accent */
/* red-brand */
/* yellow-brand */
/* Function colours */
/* Main Text colors */
/* Background colors */
/* colour opacities (mainly used for font-colors & hovers) */
/* utility colors */
/* font colour (on eg. buttons) */
/* layout colors and helpers */
/*
--------------------------------------
Color Maps
--------------------------------------
*/
/* theme colors */
/* theme shades map */
/* functional colors map */
/* functional color shades map */
/* provide neutral text grayscale map for css variable generation */
/* provide surface grayscale map for css variable generation */
/*
----------------------------------------
Fonts
----------------------------------------
*/
/* fonts */
/*
html font-size: 100% = 16px -> REM is based on this!!!
body font-size: 0.875rem = 14px
*/
/* box shadows */
/* elevation levels */
/* kinda the same as box shadow variables, but for now extra variables to not break anything */
/* borders */
/* badge */
/* navbar & footer */
/* sidebar */
/* bootstrap nav vars */
/* stylelint-disable-next-line color-named */
/* TODO on rework of slidein, these can probably be removed */
/* pagination */
/* arrow */
/* tooltip */
/* stylelint-disable-next-line color-named */
/* table */
/* List group */
/* form elements */
/** inputs -fields general **/
/* stylelint-disable-next-line color-named */
/**
* input fields (and buttons inside input-fields)
* heights
**/
/**
* buttons
* bootstrap uses:
* @include button-size($btn-padding-y, $btn-padding-x, $btn-font-size, $btn-line-height, $btn-border-radius);
**/
/* stylelint-disable-next-line color-named */
/* grid */
/** grid breakpoints **/
/** defines the minimum dimensions at which your layout will change, adapting to different screen sizes, for use in media queries **/
/** container breakpoints **/
/** defines the maximum width of `.container` for different screen sizes **/
/** grid columns **/
/** sets the number of columns and specifies the width of the gutters **/
/* toggles */
/** (keep these at the bottom of the file please) **/
/* add 'inherit' to the $overflows of bootstrap, to get the .overflow-inherit class */
/* Modals */
/* Drawer */
main[b-9r4hx5aocw] {
  flex: 1;
}

.page[b-9r4hx5aocw] {
  display: grid;
  grid-template-areas: "header header" "nav content";
  grid-template-rows: 3rem 1fr;
  grid-template-columns: min-content 1fr;
}
.page:has(.sd-header.d-none)[b-9r4hx5aocw] {
  grid-template-rows: auto 1fr;
}

.sd-header[b-9r4hx5aocw] {
  grid-area: header;
}

.sd-navigation[b-9r4hx5aocw] {
  grid-area: nav;
  height: calc(100vh - 3.4rem);
}

.sd-content[b-9r4hx5aocw] {
  grid-area: content;
  height: calc(100vh - 3.4rem);
  overflow: hidden;
}
.page:has(.sd-header.d-none) .sd-content[b-9r4hx5aocw] {
  height: 100vh;
}

.pageframe[b-9r4hx5aocw] {
  display: flex;
  flex-direction: column;
  top: 3rem;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

.sd-navigation-mobile .offcanvas.show[b-9r4hx5aocw], .sd-navigation-mobile .offcanvas.hidden[b-9r4hx5aocw] {
  transition: all 0.3s ease;
}

.sd-header .cobra-topmenu[b-9r4hx5aocw] {
  display: none;
}

.offcanvas-header[b-9r4hx5aocw] {
  padding-bottom: 1rem;
}

.offcanvas-body[b-9r4hx5aocw] {
  padding-top: 0;
  padding-bottom: 0;
}

/*Desktop*/
@media screen and (min-width: 876px) {
  .sd-header .hamburger-toggler[b-9r4hx5aocw] {
    display: none;
  }
  .sd-header .cobra-topmenu[b-9r4hx5aocw] {
    display: block;
    width: 100%;
  }
}
/* _content/Cobra.Core.UI/Components/MainPageframeBackground.razor.rz.scp.css */
.MainPageframeBackground[b-onuxg1mejy] {
    display: flex;
    align-items: end;
    width: 100%;
    height: 100%;
    opacity: 0.6;
}


/* Mobile portrait */
@media (max-width: 575.98px) and (orientation: portrait) {
    .MainPageframeBackground img[b-onuxg1mejy] {
        max-width: 7rem;
    }
}

/* Mobile and Ipad landscape */
@media (max-width: 811.98px) and (orientation: landscape) {
    .MainPageframeBackground img[b-onuxg1mejy] {
        max-width: 7rem;
    }
}
/* _content/Cobra.Core.UI/Components/Menu/NavMenu.razor.rz.scp.css */
/* paths */
/*
----------------------------------------
COLORS
----------------------------------------
*/
/* palette */
/* stylelint-disable color-no-hex */
/* palette shades */
/* primary */
/* accent */
/* red-brand */
/* yellow-brand */
/* Function colours */
/* Main Text colors */
/* Background colors */
/* colour opacities (mainly used for font-colors & hovers) */
/* utility colors */
/* font colour (on eg. buttons) */
/* layout colors and helpers */
/*
--------------------------------------
Color Maps
--------------------------------------
*/
/* theme colors */
/* theme shades map */
/* functional colors map */
/* functional color shades map */
/* provide neutral text grayscale map for css variable generation */
/* provide surface grayscale map for css variable generation */
/*
----------------------------------------
Fonts
----------------------------------------
*/
/* fonts */
/*
html font-size: 100% = 16px -> REM is based on this!!!
body font-size: 0.875rem = 14px
*/
/* box shadows */
/* elevation levels */
/* kinda the same as box shadow variables, but for now extra variables to not break anything */
/* borders */
/* badge */
/* navbar & footer */
/* sidebar */
/* bootstrap nav vars */
/* stylelint-disable-next-line color-named */
/* TODO on rework of slidein, these can probably be removed */
/* pagination */
/* arrow */
/* tooltip */
/* stylelint-disable-next-line color-named */
/* table */
/* List group */
/* form elements */
/** inputs -fields general **/
/* stylelint-disable-next-line color-named */
/**
* input fields (and buttons inside input-fields)
* heights
**/
/**
* buttons
* bootstrap uses:
* @include button-size($btn-padding-y, $btn-padding-x, $btn-font-size, $btn-line-height, $btn-border-radius);
**/
/* stylelint-disable-next-line color-named */
/* grid */
/** grid breakpoints **/
/** defines the minimum dimensions at which your layout will change, adapting to different screen sizes, for use in media queries **/
/** container breakpoints **/
/** defines the maximum width of `.container` for different screen sizes **/
/** grid columns **/
/** sets the number of columns and specifies the width of the gutters **/
/* toggles */
/** (keep these at the bottom of the file please) **/
/* add 'inherit' to the $overflows of bootstrap, to get the .overflow-inherit class */
/* Modals */
/* Drawer */
.sd-sidebar[b-97bjqnj4ci] {
  padding: 12px 0px 24px 0px;
  width: 17rem;
  transition: 0.5s ease-in-out;
}
.sd-sidebar.miniSideBar[b-97bjqnj4ci] {
  width: 32px;
  padding-top: 12px;
  padding-bottom: 12px;
}
.sd-sidebar.miniSideBar .profileHeader[b-97bjqnj4ci] {
  padding: 12px 0 0 0;
  gap: 12px;
  margin: 2px;
  height: 100%;
}
.sd-sidebar .profileHeader[b-97bjqnj4ci] {
  padding: 12px 12px 12px 20px;
  gap: 12px;
  margin: 2px;
  height: 100%;
}
.sd-sidebar .profileHeader .avatar[b-97bjqnj4ci] {
  min-width: 48px;
}
.sd-sidebar .profileHeader .arrow[b-97bjqnj4ci] {
  height: 48px;
  width: 24px;
  padding: 12px 4px 12px 4px;
}
.sd-sidebar.hideSideBar[b-97bjqnj4ci] {
  margin-left: -300px;
}
.sd-sidebar .nav li .active[b-97bjqnj4ci] {
  color: #870b58;
  /*font-weight: 500;*/
}
.sd-sidebar .nav li:not(.active) a:not([href]):not([class])[b-97bjqnj4ci] {
  color: var(--neutral-text-80) !important;
}
.sd-sidebar .nav li:not(.active) > div:hover > a > .nav-text[b-97bjqnj4ci],
.sd-sidebar .nav li:not(.active) > div:hover > a > span > i[b-97bjqnj4ci],
.sd-sidebar .nav li:not(.active) > div:hover > button.toggle-group > i[b-97bjqnj4ci] {
  color: var(--primary) !important;
}
.sd-sidebar .nav li.sidenav-group ul.sd-subsubnav[b-97bjqnj4ci] {
  display: none;
}
.sd-sidebar .nav li.sidenav-group ul.sd-subnav li.active .sidenav-subGroupHeader a[b-97bjqnj4ci] {
  padding-left: 3.5rem;
}
.sd-sidebar .nav li.sidenav-group ul.sd-subnav ul.sd-subsubnav li a[b-97bjqnj4ci] {
  padding-left: calc(5rem - 4px);
}
.sd-sidebar .nav li.sidenav-group ul.sd-subnav ul.sd-subsubnav li:not(.active) a[b-97bjqnj4ci] {
  padding-left: 5rem !important;
}

.form-switch.theme[b-97bjqnj4ci] {
  --form-switch-with-value-content: "light";
  --form-switch-with-value-checked-content: "dark";
}

.sidenav-group .toggle-group[b-97bjqnj4ci] {
  padding-right: 1rem;
}

/* Custom Subsubmenu */
.sd-sidebar:not(.folded) li.sidenav-group.open ul.sd-subnav li.sidenav-group.open ul.sd-subsubnav[b-97bjqnj4ci], .sd-sidebar:not(.folded) li.sidenav-group.active.open ul.sd-subnav li.sidenav-group.active.open ul.sd-subsubnav[b-97bjqnj4ci] {
  display: block;
}

.sd-sidebar .sd-subnav li .toggle-group i[b-97bjqnj4ci] {
  color: var(--neutral-surface-80);
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
  transition: 250ms ease-in-out;
}

.sd-sidebar .sd-subnav li.open .toggle-group i[b-97bjqnj4ci] {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.top-row[b-97bjqnj4ci] {
  height: 46px;
  background-color: rgba(0, 0, 0, 0.4);
}

.oi[b-97bjqnj4ci] {
  width: 2rem;
  font-size: 1.1rem;
  vertical-align: text-top;
  top: -2px;
}

.nav-item[b-97bjqnj4ci] {
  font-size: 0.9rem;
  padding-bottom: 0.5rem;
}
.nav-item:first-of-type[b-97bjqnj4ci] {
  padding-top: 1rem;
}
.nav-item:last-of-type[b-97bjqnj4ci] {
  padding-bottom: 1rem;
}
.nav-item[b-97bjqnj4ci]  a {
  color: #d7d7d7;
  border-radius: 4px;
  height: 3rem;
  display: flex;
  align-items: center;
  line-height: 3rem;
}
.nav-item[b-97bjqnj4ci]  a.active {
  /*background-color: rgba(255,255,255,0.25);*/
  /*color: white;*/
}
.nav-item[b-97bjqnj4ci]  ahover {
  /*background-color: rgba(255,255,255,0.1);*/
  /*color: white;*/
}

.offcanvas .sd-sidebar[b-97bjqnj4ci] {
  padding-top: 0;
  width: 100%;
  border-right: none;
}
.offcanvas .sd-sidebar ul li[b-97bjqnj4ci] {
  padding-bottom: 0.1rem;
  padding-top: 0.1rem;
}
.offcanvas .sidebar-toggler[b-97bjqnj4ci] {
  display: none !important;
}
.offcanvas .offcanvas-width[b-97bjqnj4ci] {
  width: 100%;
}

.icons8-cobra-favicon-white[b-97bjqnj4ci]::before {
  background-image: url("images/cobra-fav_white_28px.svg");
  width: 1.8rem;
}

.active-bottom-menu-item[b-97bjqnj4ci] {
  font-weight: 500;
  background-color: var(--neutral-surface-10) !important;
  border-left: solid 4px var(--yellow-brand) !important;
}

.active-bottom-menu-link[b-97bjqnj4ci] {
  color: #870b58 !important;
}
/* _content/Cobra.Core.UI/Components/Menu/TopMenu.razor.rz.scp.css */
/* paths */
/*
----------------------------------------
COLORS
----------------------------------------
*/
/* palette */
/* stylelint-disable color-no-hex */
/* palette shades */
/* primary */
/* accent */
/* red-brand */
/* yellow-brand */
/* Function colours */
/* Main Text colors */
/* Background colors */
/* colour opacities (mainly used for font-colors & hovers) */
/* utility colors */
/* font colour (on eg. buttons) */
/* layout colors and helpers */
/*
--------------------------------------
Color Maps
--------------------------------------
*/
/* theme colors */
/* theme shades map */
/* functional colors map */
/* functional color shades map */
/* provide neutral text grayscale map for css variable generation */
/* provide surface grayscale map for css variable generation */
/*
----------------------------------------
Fonts
----------------------------------------
*/
/* fonts */
/*
html font-size: 100% = 16px -> REM is based on this!!!
body font-size: 0.875rem = 14px
*/
/* box shadows */
/* elevation levels */
/* kinda the same as box shadow variables, but for now extra variables to not break anything */
/* borders */
/* badge */
/* navbar & footer */
/* sidebar */
/* bootstrap nav vars */
/* stylelint-disable-next-line color-named */
/* TODO on rework of slidein, these can probably be removed */
/* pagination */
/* arrow */
/* tooltip */
/* stylelint-disable-next-line color-named */
/* table */
/* List group */
/* form elements */
/** inputs -fields general **/
/* stylelint-disable-next-line color-named */
/**
* input fields (and buttons inside input-fields)
* heights
**/
/**
* buttons
* bootstrap uses:
* @include button-size($btn-padding-y, $btn-padding-x, $btn-font-size, $btn-line-height, $btn-border-radius);
**/
/* stylelint-disable-next-line color-named */
/* grid */
/** grid breakpoints **/
/** defines the minimum dimensions at which your layout will change, adapting to different screen sizes, for use in media queries **/
/** container breakpoints **/
/** defines the maximum width of `.container` for different screen sizes **/
/** grid columns **/
/** sets the number of columns and specifies the width of the gutters **/
/* toggles */
/** (keep these at the bottom of the file please) **/
/* add 'inherit' to the $overflows of bootstrap, to get the .overflow-inherit class */
/* Modals */
/* Drawer */
navbar[b-ohhgrmmqiu] {
  position: relative;
}

.dropdown-submenu[b-ohhgrmmqiu] {
  position: absolute;
}
.dropdown-submenu li[b-ohhgrmmqiu] {
  display: inline-block;
  width: 100%;
}

.dropdown-menu[b-ohhgrmmqiu] {
  width: 17rem;
}
.dropdown-menu li[b-ohhgrmmqiu] {
  position: relative;
}
.dropdown-menu li > a[b-ohhgrmmqiu] {
  font-weight: 500;
}
.dropdown-menu li:hover[b-ohhgrmmqiu] {
  background-color: var(--accent);
}
.dropdown-menu .dropdown-submenu[b-ohhgrmmqiu] {
  display: none;
  position: absolute;
  left: 100%;
  top: -7px;
}
.dropdown-menu .dropdown-submenu-left[b-ohhgrmmqiu] {
  right: 100%;
  left: auto;
}
.dropdown-menu > li:hover > .toggle-group i[b-ohhgrmmqiu] {
  color: var(--white) !important;
  -webkit-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
.dropdown-menu > li:hover > .dropdown-submenu[b-ohhgrmmqiu] {
  display: block;
}

.nav li .toggle-group i[b-ohhgrmmqiu] {
  display: inline-flex;
  color: var(--neutral-surface-80);
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
  transition: 250ms ease-in-out;
  font-size: 1rem !important;
  height: 1rem;
}

.dropdown-menu > li:hover > a[b-ohhgrmmqiu],
.dropdown-menu > li.active:hover > a[b-ohhgrmmqiu],
.dropdown-menu li.expanded:hover > a[b-ohhgrmmqiu],
.dropdown-menu li.expanded:hover > .toggle-group > i[b-ohhgrmmqiu],
.dropdown-submenu li.active:hover > a[b-ohhgrmmqiu] {
  color: var(--white) !important;
  background-color: transparent;
}

.dropdown-item[b-ohhgrmmqiu] {
  position: relative;
}

.nav li.active .dropdown-item[b-ohhgrmmqiu] {
  background-color: rgba(0, 0, 0, 0.065);
  border-radius: 3px;
}
.nav li.active .dropdown-item:first-child[b-ohhgrmmqiu] {
  margin-top: 6px;
}
.nav li.active .dropdown-item:last-child[b-ohhgrmmqiu] {
  margin-bottom: 6px;
}
.nav li.active .dropdown-item[b-ohhgrmmqiu]::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  /*border-left: solid 4px var(--yellow-brand);*/
}

.nav-link[b-ohhgrmmqiu],
.nav-item .dropdown-item[b-ohhgrmmqiu] {
  color: var(--neutral-text-80) !important;
}

.nav li.active > a[b-ohhgrmmqiu],
.nav li.expanded > a[b-ohhgrmmqiu],
.nav-link.expanded[b-ohhgrmmqiu],
.nav-link.show[b-ohhgrmmqiu],
.dropdown-menu li.expanded > a[b-ohhgrmmqiu],
.dropdown-menu li.expanded > .toggle-group > i[b-ohhgrmmqiu],
.dropdown-submenu li.active > a[b-ohhgrmmqiu] {
  color: var(--accent) !important;
}

.nav-link:focus[b-ohhgrmmqiu]::before {
  background-color: transparent;
}

.nav-link:hover[b-ohhgrmmqiu] {
  background-color: transparent;
  color: var(--accent) !important;
}

.nav-link:hover[b-ohhgrmmqiu]::before,
.nav-link.expanded[b-ohhgrmmqiu]::before,
.nav-link.show[b-ohhgrmmqiu]::before {
  border-bottom: 3px solid var(--yellow-brand) !important;
  opacity: 1;
  left: 0%;
  right: 0%;
}

.nav-text[b-ohhgrmmqiu] {
  line-height: 1rem;
}
/* _content/Cobra.Core.UI/Components/Menu/UserMenu.razor.rz.scp.css */
.cobra-user-header[b-afuq5xfc5y] {
  display: flex;
  padding: 12px 12px 12px 20px;
  align-items: center;
  gap: 12px;
  align-self: stretch;
  font-family: roboto;
  font-size: 12px;
  line-height: 16px;
}
.cobra-user-header .avatar[b-afuq5xfc5y] {
  display: flex;
  padding: 0;
  justify-content: center;
  align-items: center;
  top: 0;
}
.cobra-user-header .name[b-afuq5xfc5y] {
  align-self: start;
  font-weight: 500;
  font-size: 1rem;
  line-height: 20px;
}

.sd-header-profile .sd-header-profile-list .sd-header-profile-list-item[b-afuq5xfc5y] {
  background-color: var(--white);
}

.dropdown-toggle[b-afuq5xfc5y]::after {
  display: none;
}