/* Shared Authentication styles are collected & compiled into one static css file: */
/* wwwroot/css/Authentication.css */
/* Standard Color Definitions for Elements */
/* Teaching & Learning Stuff Logo Colors in Hexadecimal */
/* Updated for 2023 Rebranding & New Logo */
/* Standard Color Definitions for Elements */
/* Standard Colors & Shades */
/* Updated for 2023 Rebranding & New Logo */
/* Standard Text Color Definitions */
/* Media Breakpoints -- Not Expected to Match Specific Devices */
/* Sizes & Spacing */
/* Font Variable Definitions - Without @import Statements */
/* CSS Transitions */
.identityNavigation {
  --identityBackgroundColor: #650b0f;
  --identityBorderColor: #a91214;
  padding: 0;
  font-family: "Barlow Condensed", "Barlow", "Helvetica Neue", "Helvetica", "Arial Narrow", "Arial", sans-serif;
  font-size: 13pt;
  background-color: var(--identityBackgroundColor);
  border-bottom: 1px solid var(--identityBorderColor);
}
.identityNavigation .navbar-toggler:focus {
  box-shadow: 0 0 0 0;
}
.identityNavigation .dropdown-menu[data-bs-popper] {
  margin-top: 0;
}
.identityNavigation .navbar-nav .nav-link {
  color: #fcddde;
  opacity: 0.75;
  transition: color 0.25s, opacity 0.25s;
}
.identityNavigation .navbar-nav .nav-link:hover {
  color: #fff;
  opacity: 1;
}
.identityNavigation .navbar-nav .nav-link.registerLink {
  color: #f9c1ce;
}
.identityNavigation .navbar-nav .nav-link.loginLink {
  font-weight: 500;
  color: #e0dedf;
  opacity: 1;
  transition: color 0.25s;
}
.identityNavigation .navbar-nav .nav-link.loginLink:hover {
  color: #fff;
}
.identityNavigation .navbar-nav .nav-link.hiddenLink {
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
  font-size: 0;
  line-height: 0;
}
.identityNavigation .environmentIndicator {
  font-family: "Barlow Condensed", "Barlow", "Helvetica Neue", "Helvetica", "Arial Narrow", "Arial", sans-serif;
  font-size: 9pt;
  flex-grow: 1;
  text-align: left;
  opacity: 0.75;
}
.identityNavigation .environmentIndicator .dev {
  color: #f99fb5;
}
.identityNavigation .environmentIndicator .staging {
  color: #009444;
}
.identityNavigation .environmentIndicator .production {
  color: #ed1c24;
  opacity: 0.125;
  font-size: 1pt;
}
.identityNavigation .homeLink {
  font-size: 0;
  line-height: 0;
}
.identityNavigation .homeLink svg {
  width: 20px;
  height: 20px;
  fill: #e0dedf;
  opacity: 0.75;
  transition: fill 0.25s, opacity 0.25s;
}
.identityNavigation .homeLink:hover svg {
  fill: #fff;
  opacity: 1;
}
.identityNavigation .userRole {
  display: block;
  color: #e0dedf;
  font-family: "Barlow Condensed", "Barlow", "Helvetica Neue", "Helvetica", "Arial Narrow", "Arial", sans-serif;
  font-size: 10pt;
  opacity: 0.5;
}
.identityNavigation .userOptionsMenu {
  background-color: #232121;
  border-radius: 0 0 8px 8px;
  border: 1px solid rgba(90, 87, 87, 0.25);
  border-top: 1px solid #000;
  padding-top: 4px;
}
.identityNavigation .userOptionsMenu li .dropdown-item {
  border-radius: 0;
  cursor: pointer;
}
.identityNavigation .userOptionsMenu li .dropdown-item.userOption {
  color: #179e55;
  border-radius: 0;
  border-width: 0;
  font-size: 13pt;
}
.identityNavigation .userOptionsMenu li .dropdown-item.userOption:hover {
  background-color: rgba(208, 203, 203, 0.2);
  color: #52b680;
  text-decoration: none;
}
.identityNavigation .userOptionsMenu li .dropdown-item.userOption.logout {
  color: #fe7697;
}
.identityNavigation .userOptionsMenu li .dropdown-item.userOption.logout:hover {
  background-color: rgba(237, 28, 36, 0.35);
  color: #fad922;
  text-decoration: none;
}
.identityNavigation .shopLink {
  font-size: 0;
  line-height: 0;
}
.identityNavigation .shopLink svg {
  width: 20px;
  height: 20px;
  fill: #e0dedf;
  opacity: 0.75;
  transition: fill 0.25s, opacity 0.25s;
}
.identityNavigation .shopLink:hover svg {
  fill: #fff;
  opacity: 1;
}

/* DARK MODE */
@media (prefers-color-scheme: dark) {
  .identityNavigation {
    --identityBackgroundColor: rgb(64, 7, 9.5);
    --identityBorderColor: #650b0f;
  }
}
.identityPage {
  font-family: "Rajdhani", "Helvetica", "Arial", sans-serif;
  font-size: 11pt;
}
.identityPage label.form-label {
  font-family: "Barlow Condensed", "Barlow", "Helvetica Neue", "Helvetica", "Arial Narrow", "Arial", sans-serif;
  font-weight: 400;
  color: #d7d3d3;
  font-size: 12pt;
}
.identityPage .checkbox label.form-label {
  display: flex;
  flex-flow: row nowrap;
  gap: 0.3333333333rem;
  align-items: center;
  font-family: "Barlow", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
  font-weight: 400;
}
.identityPage .checkbox label.form-label input[type=checkbox] {
  margin: 0;
  padding: 0;
}

.whateverLight_Mode {
  color: #232121;
  background-color: rgba(194, 188, 188, 0.25);
  border-color: #a29c9c;
}
.whateverLight_Mode .header {
  background-color: rgba(194, 188, 188, 0.5);
}

.whateverDark_Mode.grey {
  color: #d7d3d3;
  background-color: rgba(129, 125, 125, 0.33);
}
.whateverDark_Mode.grey .header {
  background-color: rgba(129, 125, 125, 0.33);
}

:root {
  --loginStatusCard_gutter: 0.5rem;
  --loginStatusCard_borderWidth: 2px;
  --loginStatusCard_buttonHeight: 2rem;
  --loginStatusCard_background: rgba(194, 188, 188, 0.25);
  --loginStatusCard_statusBackground: rgba(194, 188, 188, 0.5);
  --loginStatusCard_authorizedColumnBackground: rgba(194, 188, 188, 0.25);
  --loginStatusCard_color: #232121;
  --loginStatusCard_authorizedColumnColor: #4c2e13;
  --loginStatusCard_borderColor: #a29c9c;
  --loginStatusCard_innerBorderColor: #c2bcbc;
}

.loginStatusCard {
  max-width: 420px;
  background-color: var(--loginStatusCard_background);
  border: var(--loginStatusCard_borderWidth) solid var(--loginStatusCard_borderColor);
  border-radius: 4px;
  color: var(--loginStatusCard_color);
}
.loginStatusCard * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: "Rajdhani", "Helvetica", "Arial", sans-serif;
  font-size: 13pt;
}
.loginStatusCard .status {
  padding: calc(var(--loginStatusCard_gutter) / 2) 0;
  border-bottom: 1px solid var(--loginStatusCard_innerBorderColor);
  background-color: var(--loginStatusCard_statusBackground);
  text-align: center;
  font-weight: 600;
  font-size: 13pt;
  color: #005d29;
}
.loginStatusCard .userCard {
  display: flex;
  flex-flow: row nowrap;
}
.loginStatusCard .userCard .authorizedColumn {
  display: flex;
  flex-flow: column nowrap;
  font-size: 0;
  padding: var(--loginStatusCard_gutter);
  padding-bottom: calc(var(--loginStatusCard_buttonHeight) + var(--loginStatusCard_gutter));
  background-color: var(--loginStatusCard_authorizedColumnBackground);
}
.loginStatusCard .userCard .authorizedColumn .badge {
  display: flex;
  flex-flow: column nowrap;
  gap: var(--loginStatusCard_gutter);
  align-items: center;
  margin-bottom: calc(var(--loginStatusCard_gutter) * 2);
  color: var(--loginStatusCard_authorizedColumnColor);
}
.loginStatusCard .userCard .authorizedColumn .badge img, .loginStatusCard .userCard .authorizedColumn .badge svg {
  width: 36px;
  height: auto;
  fill: var(--loginStatusCard_authorizedColumnColor);
}
.loginStatusCard .userCard .authorizedColumn .role {
  display: none;
  font-size: 11pt;
  font-weight: 400;
  font-family: "Barlow Condensed", "Barlow", "Helvetica Neue", "Helvetica", "Arial Narrow", "Arial", sans-serif;
  text-align: center;
  margin-bottom: var(--loginStatusCard_gutter);
}
.loginStatusCard .userCard .infoColumn {
  padding: var(--loginStatusCard_gutter);
  padding-bottom: calc(var(--loginStatusCard_buttonHeight) + var(--loginStatusCard_gutter));
}
.loginStatusCard .userCard .infoColumn .name,
.loginStatusCard .userCard .infoColumn .message {
  font-weight: bold;
  font-size: 22pt;
  line-height: 22pt;
  margin-bottom: calc(var(--loginStatusCard_gutter) / 1);
  color: var(--loginStatusCard_authorizedColumnColor);
}
.loginStatusCard .userCard .infoColumn .role {
  display: block;
  font-family: "Barlow Condensed", "Barlow", "Helvetica Neue", "Helvetica", "Arial Narrow", "Arial", sans-serif;
  font-size: 12pt;
  font-weight: 400;
  margin: calc(var(--loginStatusCard_gutter) / 2) 0;
  color: var(--loginStatusCard_authorizedColumnColor);
}
.loginStatusCard .userCard .infoColumn .phone {
  font-size: 17pt;
  font-weight: normal;
  margin: calc(var(--loginStatusCard_gutter) / 2) 0;
}
.loginStatusCard .userCard .infoColumn .email {
  font-family: "Barlow Condensed", "Barlow", "Helvetica Neue", "Helvetica", "Arial Narrow", "Arial", sans-serif;
  font-size: 14pt;
  font-weight: 300;
  margin: var(--loginStatusCard_gutter) 0;
}
.loginStatusCard .userCard .infoColumn .account,
.loginStatusCard .userCard .infoColumn .register {
  margin: calc(var(--loginStatusCard_gutter) * 1.5) 0;
}
.loginStatusCard .userCard .infoColumn .account a,
.loginStatusCard .userCard .infoColumn .register a {
  display: flex;
  flex-flow: row nowrap;
  gap: calc(var(--loginStatusCard_gutter) / 2);
  align-items: center;
  color: #1c803a;
}
.loginStatusCard .userCard .infoColumn .account a img,
.loginStatusCard .userCard .infoColumn .account a svg,
.loginStatusCard .userCard .infoColumn .register a img,
.loginStatusCard .userCard .infoColumn .register a svg {
  width: 1rem;
  height: 1rem;
  fill: #1c803a;
}
.loginStatusCard .action {
  margin-top: calc((var(--loginStatusCard_buttonHeight) + var(--loginStatusCard_gutter) * 2 - var(--loginStatusCard_borderWidth)) * -1);
  padding: var(--loginStatusCard_gutter);
}
.loginStatusCard .action a.button.logIn,
.loginStatusCard .action a.button.logOut,
.loginStatusCard .action button.logOut {
  font-size: 1.25rem;
  line-height: calc(var(--loginStatusCard_buttonHeight) - var(--loginStatusCard_borderWidth));
  border: 0px solid transparent;
  height: calc(var(--loginStatusCard_buttonHeight) - var(--loginStatusCard_borderWidth));
  padding: 0;
}
.loginStatusCard a.hiddenLink {
  color: inherit;
  text-decoration: none;
}

/* RESPONSIVE SIZE ADJUSTMENTS */
@media screen and (min-width: 768px) {
  :root {
    --loginStatusCard_gutter: .75rem;
  }
  .loginStatusCard .userCard .authorizedColumn .badge img,
  .loginStatusCard .userCard .authorizedColumn .badge svg {
    width: 72px;
    height: auto;
  }
  .loginStatusCard .userCard .authorizedColumn .role {
    display: block;
  }
  .loginStatusCard .userCard .infoColumn .role {
    display: none;
  }
}
/* DARK MODE */
@media (prefers-color-scheme: dark) {
  .loginStatusCard .status {
    color: #179e55;
    color: #8ccfab;
  }
  .loginStatusCard .userCard .infoColumn .phone {
    color: #8ccfab;
  }
  .loginStatusCard .userCard .infoColumn .account a,
  .loginStatusCard .userCard .infoColumn .register a {
    color: #179e55;
  }
  .loginStatusCard .userCard .infoColumn .account a img,
  .loginStatusCard .userCard .infoColumn .account a svg,
  .loginStatusCard .userCard .infoColumn .register a img,
  .loginStatusCard .userCard .infoColumn .register a svg {
    fill: #179e55;
  }
  :root {
    --loginStatusCard_background: rgba(129, 125, 125, 0.33);
    --loginStatusCard_statusBackground: rgba(129, 125, 125, 0.33);
    --loginStatusCard_authorizedColumnBackground: rgba(129, 125, 125, 0.16);
    --loginStatusCard_color: #d7d3d3;
    --loginStatusCard_authorizedColumnColor: #f99fb5;
    --loginStatusCard_borderColor: #a29c9c;
    --loginStatusCard_innerBorderColor: rgba(162, 156, 156, 0.5);
  }
}