@charset "UTF-8";
/* Order matters: settings → tools → base → layout → components → utilities */
@font-face {
  font-family: "Manrope";
  src: url("/assets/fonts/Manrope-Bold.woff") format("woff");
  font-weight: 700;
}
@font-face {
  font-family: "Manrope";
  src: url("/assets/fonts/Manrope-Light.woff") format("woff");
  font-weight: 300;
}
@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/Inter-Regular.woff") format("woff");
  font-weight: 400;
}
@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/Inter-Italic.woff") format("woff");
  font-weight: 400;
  font-style: italic;
}
@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/Inter-SemiBold.woff") format("woff");
  font-weight: 600;
}
@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/Inter-SemiBoldItalic.woff") format("woff");
  font-weight: 600;
  font-style: italic;
}
@font-face {
  font-family: "Space Mono";
  src: url("/assets/fonts/SpaceMono-Regular.woff") format("woff");
  font-weight: 400;
}
@font-face {
  font-family: "Space Mono";
  src: url("/assets/fonts/SpaceMono-Italic.woff") format("woff");
  font-weight: 400;
  font-style: italic;
}
/* Order matters: settings → tools → base → layout → components → utilities */
* {
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
}

html {
  position: relative;
  height: 100%;
  margin: 0;
  padding: 0;
  font-size: 0;
}

body {
  position: relative;
  height: 100%;
  min-width: 320px;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  margin: 0;
  padding: 0;
  background-color: #f2f0e7;
}

body.modal-open {
  overflow: hidden;
  height: 100%;
}

/* -------------------------------------------------------------------------- */
/* Root wrapper                                                               */
/* -------------------------------------------------------------------------- */
main#root {
  position: relative;
  flex: 1;
  width: 100%;
  padding: 0;
  display: flex; /* ✅ required */
  flex-direction: column; /* ✅ required */
  min-height: 0; /* ✅ prevents flex children overflow issues */
}

/* Hardening: guarantee hidden always wins (prevents flicker / layout bleed) */
#auth[hidden],
#verify[hidden],
#app[hidden] {
  display: none !important;
}

/* -------------------------------------------------------------------------- */
/* Auth / Verify sections                                                     */
/* -------------------------------------------------------------------------- */
#auth,
#verify {
  position: relative;
  width: 100%;
}

/* -------------------------------------------------------------------------- */
/* App shell                                                                  */
/* -------------------------------------------------------------------------- */
#app {
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 1;
  width: 100%;
  min-height: 0;
}

#app .mainContent {
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 1;
  width: 100%;
  padding: 60px 0 0 0;
  margin: 0 auto;
  min-height: 0;
}

/* Order matters: settings → tools → base → layout → components → utilities */
body nav.globalNav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 60px;
  padding: 0 20px;
  margin: 0;
  font-size: initial;
  color: #fefefe;
  background-color: #172fe0;
  background-image: url("/assets/images/globalNav-bg.jpg");
  background-size: cover;
  z-index: 10000;
}
body nav.globalNav ul {
  position: relative;
  width: 100%;
  max-width: 1200px;
  padding: 0;
  margin: 0 auto;
  list-style: none;
}
body nav.globalNav ul > li {
  display: inline-block;
  vertical-align: middle;
}
body nav.globalNav ul > li.nomineeLogo {
  position: relative;
  height: 60px;
  padding: 15px 10px 15px 0;
}
body nav.globalNav ul > li.nomineeLogo a {
  display: inline-block;
  height: 100%;
  width: auto;
}
body nav.globalNav ul > li.nomineeLogo a > img {
  height: 100%;
  width: auto;
}
body nav.globalNav ul > li.button {
  position: relative;
}
body nav.globalNav ul > li.button a {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 700;
  line-height: 1.1em;
  display: block;
  margin: 0;
  padding: 0 10px;
  height: 60px;
  line-height: 60px;
  color: #fefefe;
  text-decoration: none;
}
body nav.globalNav ul > li.button.selected a {
  color: #d0f921;
  border-bottom: 2px solid #d0f921;
}
@media (max-width: 675px) {
  body nav.globalNav ul > li.button {
    display: none;
  }
}
body nav.globalNav ul > li.button[hidden] {
  display: none !important;
}
body nav.globalNav ul > li.mobileMenuButton {
  display: none;
  position: relative;
  width: 30px;
  height: 60px;
}
body nav.globalNav ul > li.mobileMenuButton > div.gridButton {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 30px;
  height: 30px;
  transform: translate(-50%, -50%);
  background-image: url("/assets/images/icons/icon_grid-w.svg");
  background-size: cover;
}
@media (max-width: 675px) {
  body nav.globalNav ul > li.mobileMenuButton {
    display: inline-block;
  }
}
body nav.globalNav ul > li.mobileMenuButton > nav.mobileMenu {
  display: none;
  position: absolute;
  top: 65px;
  left: 0;
  width: 200px;
  padding: 10px;
  background-color: #1c1c1c;
  border-radius: 10px;
  list-style: none;
}
body nav.globalNav ul > li.mobileMenuButton > nav.mobileMenu ul {
  position: relative;
  list-style: none;
  margin: 0;
  padding: 0;
}
body nav.globalNav ul > li.mobileMenuButton > nav.mobileMenu ul > li {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 14px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 700;
  line-height: 1.1em;
  position: relative;
  width: 100%;
  display: block;
}
body nav.globalNav ul > li.mobileMenuButton > nav.mobileMenu ul > li > a {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 14px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 700;
  line-height: 1.1em;
  position: relative;
  display: block;
  width: 100%;
  margin: 0;
  padding: 10px;
  color: #fefefe;
  text-decoration: none;
  border-radius: 5px;
}
body nav.globalNav ul > li.mobileMenuButton > nav.mobileMenu ul > li.selected > a {
  background-color: #d0f921;
  color: #1c1c1c;
}
body nav.globalNav ul > li.mobileMenuButton.open > div.gridButton {
  background-image: url("/assets/images/icons/icon_grid-fill-n.svg");
}
body nav.globalNav ul > li.mobileMenuButton.open > nav.mobileMenu {
  display: block;
}
body nav.globalNav ul div.userWidgets {
  position: absolute;
  top: 0;
  right: 0;
  height: 60px;
  padding: 0;
  display: flex;
  gap: 10px;
  flex-direction: row;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget {
  position: relative;
  height: 60px;
  padding: 0;
  flex-shrink: 1;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > button.notificationsTrigger {
  position: relative;
  width: 40px;
  height: 40px;
  margin: 10px 0;
  border-radius: 20px;
  background-color: #172fe0;
  appearance: none;
  outline: none;
  border: 0;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > button.notificationsTrigger:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 30px;
  height: 30px;
  background-image: url("/assets/images/icons/icon_bell-w.svg");
  background-size: cover;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > button.notificationsTrigger div.badge {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 11px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  position: absolute;
  top: -2px;
  right: -2px;
  min-width: 16px;
  height: 16px;
  line-height: 16px;
  border-radius: 8px;
  background-color: #e11d48;
  color: #fefefe;
  text-align: center;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > div.notificationsPanel {
  display: none;
  position: absolute;
  top: 65px;
  right: 0;
  width: 280px;
  padding: 20px;
  background-color: #1c1c1c;
  border-radius: 10px;
  flex-direction: column;
  gap: 0;
  color: #fefefe;
  overflow-y: scroll;
  max-height: 70vh;
  z-index: 10000;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > div.notificationsPanel div.notificationsPanelHeader {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 18px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  position: relative;
  width: 100%;
  flex-shrink: 1;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > div.notificationsPanel div.notificationsPanelHeader a.notificationsSettings {
  position: absolute;
  top: 50%;
  right: 0;
  width: 30px;
  height: 30px;
  transform: translateY(-50%);
  background-image: url("/assets/images/icons/icon_settings-w.svg");
  background-size: cover;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > div.notificationsPanel .notificationsEmpty {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  background-color: rgba(254, 254, 254, 0.05);
  margin: 10px auto;
  padding: 20px 10px;
  text-align: center;
  border-radius: 20px;
  color: rgba(254, 254, 254, 0.5);
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > div.notificationsPanel div.notificationsListGroup {
  display: flex;
  flex-direction: column;
  gap: 0;
  flex-shrink: 1;
  padding: 10px 0;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > div.notificationsPanel div.notificationsListGroup > div {
  position: relative;
  width: 100%;
  flex-shrink: 1;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > div.notificationsPanel div.notificationsListGroup div.notificationsListGroupHeader {
  position: relative;
  display: flex;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > div.notificationsPanel div.notificationsListGroup div.notificationsListGroupHeader span {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 14px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  flex-grow: 1;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > div.notificationsPanel div.notificationsListGroup div.notificationsListGroupHeader .notificationsClearSeen {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 11px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  flex-shrink: 1;
  appearance: none;
  outline: none;
  border: 0;
  background: transparent;
  text-decoration: underline;
  color: #fefefe;
  padding: 0;
  margin: 0;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > div.notificationsPanel div.notificationsListGroup a.notificationItem {
  display: flex;
  flex-direction: row;
  gap: 10px;
  padding: 10px 0;
  color: #fefefe;
  text-decoration: none;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > div.notificationsPanel div.notificationsListGroup a.notificationItem div.notificationImage {
  width: 40px;
  height: 40px;
  border-radius: 20px;
  background-color: #DDDDDD;
  flex: 0 0 40px;
  overflow: hidden;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > div.notificationsPanel div.notificationsListGroup a.notificationItem div.notificationImage img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > div.notificationsPanel div.notificationsListGroup a.notificationItem div.notificationContent {
  flex-grow: 1;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > div.notificationsPanel div.notificationsListGroup a.notificationItem div.notificationContent div.notificationText {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  line-height: 1.2em;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > div.notificationsPanel div.notificationsListGroup a.notificationItem div.notificationContent div.notificationTime {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 10px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  opacity: 0.5;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget > div.notificationsPanel div.notificationsListGroup a.notificationItem div.notificationActions {
  flex-shrink: 1;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget.open > button.notificationsTrigger {
  background-color: #d0f921;
}
body nav.globalNav ul div.userWidgets div.notificationsWidget.open > button.notificationsTrigger:before {
  background-image: url("/assets/images/icons/icon_bell-fill-b.svg");
}
body nav.globalNav ul div.userWidgets div.notificationsWidget.open > div.notificationsPanel {
  display: flex;
}
body nav.globalNav ul div.userWidgets nav.userBar {
  position: relative;
  height: 60px;
  flex-shrink: 1;
  padding: 0;
}
body nav.globalNav ul div.userWidgets nav.userBar > div.userIcon {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  position: relative;
  width: 40px;
  height: 40px;
  line-height: 40px;
  margin: 10px 0;
  text-align: center;
  color: #fefefe;
  background-color: #DDDDDD;
  border: 1px solid #fefefe;
  border-radius: 20px;
  overflow: hidden;
}
body nav.globalNav ul div.userWidgets nav.userBar > div.userIcon > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
body nav.globalNav ul div.userWidgets nav.userBar > div.userPanel {
  display: none;
  position: absolute;
  top: 65px;
  right: 10px;
  width: 250px;
  padding: 10px;
  background-color: #1c1c1c;
  border-radius: 10px;
}
body nav.globalNav ul div.userWidgets nav.userBar > div.userPanel div.userInfo {
  position: relative;
  display: block;
  width: 100%;
  color: #fefefe;
  padding: 10px;
  text-align: center;
}
body nav.globalNav ul div.userWidgets nav.userBar > div.userPanel div.userInfo > div#whoami {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  display: block;
  width: 100%;
}
body nav.globalNav ul div.userWidgets nav.userBar > div.userPanel div.userInfo > div#userEmail {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  display: block;
  width: 100%;
}
body nav.globalNav ul div.userWidgets nav.userBar > div.userPanel > button {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 14px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  display: block;
  width: 100%;
  color: #fefefe;
  padding: 5px 0;
  margin-top: 5px;
  border: 0;
  outline: none;
  background-color: #777777;
  border-radius: 5px;
}
body nav.globalNav ul div.userWidgets nav.userBar.open > div.userIcon {
  border: 1px solid #d0f921;
}
body nav.globalNav ul div.userWidgets nav.userBar.open > div.userPanel {
  display: block;
}

/* Order matters: settings → tools → base → layout → components → utilities */
div.floatingBar {
  position: fixed;
  bottom: 20px;
  left: 50%;
  max-width: 100%;
  transform: translateX(-50%);
  z-index: 1000;
  white-space: nowrap;
}
div.floatingBar div.mentorshipsTrigger {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 50px;
  border-radius: 25px;
  vertical-align: middle;
  background-color: #172fe0;
  margin-left: 5px;
  border: 2px solid #1c1c1c;
}
div.floatingBar div.mentorshipsTrigger .triggerBadge {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 11px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 700;
  line-height: 1.1em;
  position: absolute;
  top: -6px;
  right: -6px;
  min-width: 18px;
  height: 18px;
  padding: 0 6px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  line-height: 1;
  font-weight: 700;
  background: #E02020; /* red bubble */
  color: #fff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18);
}
div.floatingBar div.mentorshipsTrigger .triggerBadge[hidden],
div.floatingBar div.mentorshipsTrigger #mentorshipsTriggerBadge[hidden] {
  display: none !important;
}
div.floatingBar div.mentorshipsTrigger:before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 32px;
  height: 32px;
  background-image: url("/assets/images/icons/icon_mentorships-w.svg");
  background-size: cover;
}
div.floatingBar div.mentorshipsTrigger.selected {
  background-color: #d0f921;
}
div.floatingBar div.mentorshipsTrigger.selected:before {
  background-image: url("/assets/images/icons/icon_mentorships-b.svg");
}

menu.mainMenu {
  position: relative;
  display: inline-block;
  height: 50px;
  border-radius: 25px;
  background-color: #1c1c1c;
  margin: 0;
  padding: 5px;
  list-style: none;
  white-space: nowrap;
  vertical-align: middle;
}
menu.mainMenu > li {
  display: inline-block;
}
menu.mainMenu > li a {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  position: relative;
  display: block;
  color: #fefefe;
  padding: 0 20px 0 45px;
  margin: 0;
  height: 40px;
  line-height: 40px;
  border-radius: 20px;
  text-decoration: none;
}
menu.mainMenu > li a:before {
  content: "";
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  background-size: cover;
}
menu.mainMenu > li.matchmaking a:before {
  background-image: url("/assets/images/icons/icon_matchmaking-w.svg");
}
menu.mainMenu > li.mentors a:before {
  background-image: url("/assets/images/icons/icon_mentors-w.svg");
}
menu.mainMenu > li.chat a:before {
  background-image: url("/assets/images/icons/icon_chat-w.svg");
}
menu.mainMenu > li.profile a:before {
  background-image: url("/assets/images/icons/icon_profile-w.svg");
}
menu.mainMenu > li.selected a {
  color: #1c1c1c;
  background-color: #d0f921;
}
menu.mainMenu > li.selected.matchmaking a:before {
  background-image: url("/assets/images/icons/icon_matchmaking-b.svg");
}
menu.mainMenu > li.selected.mentors a:before {
  background-image: url("/assets/images/icons/icon_mentors-b.svg");
}
menu.mainMenu > li.selected.chat a:before {
  background-image: url("/assets/images/icons/icon_chat-b.svg");
}
menu.mainMenu > li.selected.profile a:before {
  background-image: url("/assets/images/icons/icon_profile-b.svg");
}
@media (max-width: 675px) {
  menu.mainMenu > li a {
    font-size: 0;
    width: 40px;
    padding: 0;
    margin: 0 5px;
  }
  menu.mainMenu > li a:before {
    left: 50%;
    transform: translate(-50%, -50%);
  }
}

/* Order matters: settings → tools → base → layout → components → utilities */
main div.pageHeader {
  position: relative;
  width: 100%;
  max-width: 1200px;
  padding: 10px 20px;
  margin: 0 auto;
}
main div.pageHeader:after {
  content: "";
  display: block;
  height: 1px;
  width: 100%;
  max-width: 1200px;
  background-color: #1c1c1c;
}
main div.pageHeader div.pageTitle {
  padding: 10px 0;
}
main div.pageHeader div.pageTitle > h1 {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 40px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  font-size: clamp(22px, 13.5294117647px + 0.0264705882 * 100vw, 40px);
  margin: 0;
}
main div.pageHeader div.pageTitle div.breadcrumbs {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
}
main div.pageHeader div.pageTitle div.breadcrumbs a {
  color: #1c1c1c;
  text-decoration: underline;
}
main div.pageHeader div.pageActions {
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
}
main div.pageHeader div.pageActions button {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 14px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  position: relative;
  padding: 0 10px;
  margin-left: 5px;
  height: 30px;
  line-height: 30px;
  border-radius: 15px;
  color: #fefefe;
  background-color: #172fe0;
  outline: none;
  border: 0;
}
main div.pageHeader div.pageActions button.primary {
  color: #fefefe;
  background-color: #172fe0;
}
main div.pageHeader div.pageActions button.secondary {
  background-color: transparent;
  border: 1px solid #172fe0;
  line-height: 28px;
  color: #172fe0;
}
main div.pageHeader div.pageActions button:disabled {
  opacity: 0.3;
}

@media (min-width: 675px) {
  main div.pageHeader div.pageActions button {
    font-family: "Manrope", Arial, sans-serif;
    font-size: 16px;
    text-transform: none;
    font-weight: 700;
    line-height: 1.2em;
    letter-spacing: normal;
    padding: 0 20px;
    height: 40px;
    line-height: 40px;
    border-radius: 20px;
  }
  main div.pageHeader div.pageActions button.secondary {
    line-height: 38px;
  }
}
/* Order matters: settings → tools → base → layout → components → utilities */
body div.pageBody {
  position: relative;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 10px 20px;
  border-radius: 10px;
}

/* Order matters: settings → tools → base → layout → components → utilities */
body dialog {
  width: 100%;
  max-width: 600px;
  padding: 30px;
  border: 0;
  border-radius: 10px;
}
body dialog form {
  padding: 0;
  margin: 0;
}
body dialog h2 {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 30px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  margin: 0;
}
body dialog label {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
  display: block;
  width: 100%;
  color: #1c1c1c;
  vertical-align: middle;
  padding: 5px 0;
}
body dialog input[type=text],
body dialog input[type=email],
body dialog input[readonly] {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  width: 100%;
  border-radius: 5px;
  border: 0;
  outline: none;
}
body dialog input[type=text],
body dialog input[type=email] {
  background-color: #EEEEEE;
  padding: 5px 10px;
  margin: 3px 0;
}
body dialog input[readonly] {
  background-color: transparent;
  padding: 5px 0;
}
body dialog input[type=radio] {
  margin: 3px;
}

/* Order matters: settings → tools → base → layout → components → utilities */
body section.loginFormWrapper {
  position: relative;
  width: 100%;
  padding: 20px;
  text-align: center;
}
body section.loginFormWrapper section.loginForm {
  display: block;
  position: relative;
  width: 100%;
  max-width: 550px;
  text-align: left;
  padding: 40px;
  margin: 0 auto;
  font-size: initial;
  color: #fefefe;
  background-color: #172fe0;
  background-image: url("/assets/images/login-bg.jpg");
  background-size: cover;
  border-radius: 10px;
}
body section.loginFormWrapper section.loginForm.partnerWelcome {
  max-width: 550px;
}
body section.loginFormWrapper section.loginForm section.logoHeading {
  display: flex;
  width: 100%;
  flex-direction: row;
  gap: 20px;
  align-items: center;
  justify-content: center;
}
body section.loginFormWrapper section.loginForm section.logoHeading img.nomineeLogo {
  flex-shrink: 0;
  height: 20px;
  width: auto;
}
body section.loginFormWrapper section.loginForm section.logoHeading img.crossIcon {
  flex-shrink: 0;
  height: 14px;
  width: auto;
}
body section.loginFormWrapper section.loginForm section.logoHeading img.gpcLogo {
  flex-shrink: 0;
  height: 35px;
  width: auto;
}
body section.loginFormWrapper section.loginForm h1 {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 30px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  font-size: clamp(26px, 24.1176470588px + 0.0058823529 * 100vw, 30px);
  margin: 30px auto 10px auto;
  text-align: center;
}
body section.loginFormWrapper section.loginForm label {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
}
body section.loginFormWrapper section.loginForm input {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  width: 100%;
  height: 40px;
  border-radius: 5px;
  padding: 0 10px;
  line-height: 40px;
  margin-top: 5px;
  outline: none;
  border: 0;
}
body section.loginFormWrapper section.loginForm button {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  position: relative;
  width: 100%;
  text-align: center;
  border-radius: 5px;
  padding: 10px;
  outline: none;
  border: 0;
  background-color: #d0f921;
  color: #1c1c1c;
}
body section.loginFormWrapper section.loginForm button .buttonSpinner {
  width: 1em;
  height: 1em;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 999px;
  display: inline-block;
  vertical-align: -0.15em;
  margin-right: 0.5rem;
  animation: buttonSpinnerSpin 0.8s linear infinite;
}
body section.loginFormWrapper section.loginForm button:disabled {
  cursor: not-allowed;
  opacity: 0.75;
}
body section.loginFormWrapper section.loginForm p {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  font-size: clamp(14px, 13.0588235294px + 0.0029411765 * 100vw, 16px);
}
body section.loginFormWrapper section.loginForm p.loginIntro, body section.loginFormWrapper section.loginForm p.signinLink {
  text-align: center;
}
body section.loginFormWrapper section.loginForm p.loginNotes {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 11px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
}
body section.loginFormWrapper section.loginForm a {
  color: #d0f921;
}
body section.loginFormWrapper section.faq {
  display: block;
  position: relative;
  width: 100%;
  max-width: 550px;
  color: #1c1c1c;
  margin: 30px auto;
  text-align: left;
}
body section.loginFormWrapper section.faq h2 {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 20px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  font-size: clamp(16px, 14.1176470588px + 0.0058823529 * 100vw, 20px);
}
body section.loginFormWrapper section.faq div.qaBlock {
  display: block;
  position: relative;
  width: 100%;
}
body section.loginFormWrapper section.faq div.qaBlock div.qaRow {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
}
body section.loginFormWrapper section.faq div.qaBlock div.qaRow div.question {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  font-size: clamp(16px, 16px + 0 * 100vw, 16px);
  line-height: 1.4em;
  flex-grow: 1;
  padding: 10px 0;
  cursor: pointer;
}
body section.loginFormWrapper section.faq div.qaBlock div.qaRow:after {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 24px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  content: "+";
  display: block;
  width: 30px;
  height: 30px;
  line-height: 30px;
  flex: 0 0 30px;
  text-align: center;
}
body section.loginFormWrapper section.faq div.qaBlock div.answer {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  font-size: clamp(14px, 13.0588235294px + 0.0029411765 * 100vw, 16px);
  max-height: 0;
  overflow: hidden;
  border-bottom: 1px solid #DDDDDD;
  transition: max-height 0.3s ease-in-out;
}
body section.loginFormWrapper section.faq div.qaBlock.open div.qaRow:after {
  content: "-";
}
body section.loginFormWrapper section.faq div.qaBlock.open div.answer {
  max-height: 600px;
}

@media (max-width: 675px) {
  body section.loginFormWrapper {
    padding: 5px;
  }
  body section.loginFormWrapper section.loginForm {
    padding: 20px;
  }
}
@keyframes buttonSpinnerSpin {
  to {
    transform: rotate(360deg);
  }
}
/* Order matters: settings → tools → base → layout → components → utilities */
body section#verify {
  position: relative;
  width: 100%;
  padding: 20px;
  text-align: center;
}
body section#verify div.verifyConfirm {
  display: inline-block;
  position: relative;
  width: 100%;
  max-width: 320px;
  text-align: left;
  padding: 20px;
  margin: 0;
  font-size: initial;
  color: #fefefe;
  background-color: #172fe0;
  background-image: url("/assets/images/login-bg.jpg");
  background-size: cover;
  border-radius: 10px;
}
body section#verify div.verifyConfirm h1 {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 18px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
}
body section#verify div.verifyConfirm label {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
}
body section#verify div.verifyConfirm input {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  width: 100%;
  border-radius: 5px;
  padding: 5px 10px;
  margin-top: 5px;
  outline: none;
  border: 0;
}
body section#verify div.verifyConfirm button {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  position: relative;
  width: 100%;
  text-align: center;
  border-radius: 5px;
  padding: 10px;
  outline: none;
  border: 0;
  background-color: #d0f921;
  color: #1c1c1c;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 46px;
  cursor: pointer;
}
body section#verify div.verifyConfirm button.isLoading {
  pointer-events: none;
  opacity: 0.9;
}
body section#verify div.verifyConfirm button.isLoading::before {
  content: "";
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid rgba(0, 0, 0, 0.25);
  border-top-color: #1c1c1c;
  animation: nomineeButtonSpin 0.7s linear infinite;
  flex: 0 0 16px;
}
body section#verify div.verifyConfirm p {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
}
body section#verify div.verifyConfirm a {
  color: #d0f921;
}

@keyframes nomineeButtonSpin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
/* Order matters: settings → tools → base → layout → components → utilities */
body div.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 20px;
  z-index: 50000000000;
  background-color: rgba(28, 28, 28, 0.6);
  text-align: center;
  display: none;
}
body div.overlay:before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -0.25em; /* Adjusts for spacing */
}
body div.overlay.open {
  display: block;
}

/* Order matters: settings → tools → base → layout → components → utilities */
body div.overlay div.modal {
  display: inline-block;
  position: relative;
  width: 100%;
  max-width: 600px;
  padding: 0;
  color: #1c1c1c;
  background-color: #fefefe;
  border-radius: 10px;
  text-align: left;
  font-size: initial;
  vertical-align: middle;
  overflow: hidden;
}
body div.overlay div.modal div.modalTitleBar {
  position: relative;
  display: block;
  width: 100%;
  height: 50px;
  background-color: #fefefe;
  border-bottom: 1px solid rgba(28, 28, 28, 0.1);
}
body div.overlay div.modal div.modalTitleBar h2 {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 18px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  width: 100%;
  height: 50px;
  line-height: 50px;
  margin: 0;
  padding: 0 10px;
}
body div.overlay div.modal div.modalTitleBar div.closeModal {
  position: absolute;
  top: 0;
  right: 0;
  width: 50px;
  height: 50px;
  padding: 15px;
}
body div.overlay div.modal div.modalTitleBar div.closeModal:after {
  content: "";
  display: inline-block;
  width: 100%;
  height: 100%;
  background-image: url("/assets/images/icons/icon_close.svg");
  background-size: contain;
  background-position: center center;
  vertical-align: middle;
}
body div.overlay div.modal div.modalBody {
  position: relative;
  width: 100%;
  max-height: 60vh;
  padding: 0;
  overflow-y: scroll;
}
body div.overlay div.modal div.modalBody h2 {
  margin: 0 0 10px 0;
}
body div.overlay div.modal div.modalBody h3, body div.overlay div.modal div.modalBody h4, body div.overlay div.modal div.modalBody h5 {
  margin: 20px 0 0 0;
}
body div.overlay div.modal div.modalBody h2 {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 24px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
}
body div.overlay div.modal div.modalBody h3 {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 18px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
}
body div.overlay div.modal div.modalBody ul {
  margin: 10px 0 30px 0;
}
body div.overlay div.modal div.modalBody p, body div.overlay div.modal div.modalBody li {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
}
body div.overlay div.modal div.modalActions {
  position: relative;
  display: block;
  width: 100%;
  padding: 10px;
  background-color: #fefefe;
  text-align: right;
  border-top: 1px solid rgba(28, 28, 28, 0.1);
}
body div.overlay div.modal div.modalActions button {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  position: relative;
  display: inline-block;
  width: auto;
  padding: 0 20px;
  margin: 0 2px;
  height: 40px;
  line-height: 40px;
  border-radius: 20px;
  outline: none;
  border: 0;
}
body div.overlay div.modal div.modalActions button.primary {
  color: #fefefe;
  background-color: #172fe0;
}
body div.overlay div.modal div.modalActions button.secondary {
  background-color: transparent;
  border: 1px solid #172fe0;
  line-height: 38px;
  color: #172fe0;
}
body div.overlay div.modal div.modalActions button.alert {
  color: #fefefe;
  background-color: #e11d48;
}
body div.overlay div.modal div.modalActions button:disabled {
  opacity: 0.3;
}
body div.overlay div.modal div.modalActions .modalStatus,
body div.overlay div.modal div.modalActions #availabilityModalStatus {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
  text-align: left;
}
body div.overlay div.modal.confirm div.modalBody {
  padding: 20px;
}
body div.overlay div.modal.visibilityModal div.modalBody {
  padding: 20px;
}
body div.overlay div.modal.visibilityModal div.modalBody p {
  padding: 0;
  margin: 0;
}
body div.overlay div.modal.visibilityModal div.modalBody fieldset {
  position: relative;
  display: block;
  border: 0;
  outline: none;
  padding: 20px 0;
  margin: 0;
}
body div.overlay div.modal.visibilityModal div.modalBody fieldset legend {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
  position: relative;
  float: left;
  display: block;
  width: 100%;
  opacity: 0.7;
  padding: 10px 0;
  margin: 0;
}
body div.overlay div.modal.visibilityModal div.modalBody fieldset label {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  display: block;
  position: relative;
  width: 100%;
  padding: 5px 0;
}
body div.overlay div.modal.betaAcknowledgement .modalBody, body div.overlay div.modal.releaseNotes .modalBody {
  padding: 20px;
}
body div.overlay div.modal.releaseNotes .modalBody .releaseVersion {
  border-bottom: 1px solid #EFEFEF;
  margin-bottom: 30px;
}
body div.overlay div.modal.releaseNotes .modalBody .releaseVersion .releaseLabel {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
  display: inline-block;
  padding: 3px 5px;
  color: #1c1c1c;
  background-color: #d0f921;
  margin: 0 5px;
  vertical-align: middle;
  border-radius: 2px;
}
body div.overlay div.modal.releaseNotes .modalBody .releaseVersion:last-of-type {
  border: 0;
}
body div.overlay div.modal.editProfile {
  padding: 0;
}
body div.overlay div.modal.editProfile div.modalBody {
  padding: 20px;
}
body div.overlay div.modal.editProfile div.modalBody h3 {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
}
body div.overlay div.modal.editProfile div.modalBody label {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  display: block;
  width: 100%;
  margin-top: 20px;
}
body div.overlay div.modal.editProfile div.modalBody fieldset {
  position: relative;
  display: block;
  width: 100%;
  margin-top: 20px;
  padding: 0;
  border: 0;
}
body div.overlay div.modal.editProfile div.modalBody fieldset legend {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
}
body div.overlay div.modal.editProfile div.modalBody fieldset label {
  margin-top: 5px;
}
body div.overlay div.modal.editProfile div.modalBody div.profilePhotoPrev {
  position: relative;
  width: 360px;
  height: 360px;
  margin: 5px auto;
  overflow: hidden;
  position: relative;
}
body div.overlay div.modal.editProfile div.modalBody div.profilePhotoPrev img#profilePhotoPreview {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
}
body div.overlay div.modal.editProfile div.modalBody input[type=text],
body div.overlay div.modal.editProfile div.modalBody input[type=url],
body div.overlay div.modal.editProfile div.modalBody input[type=email] {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  width: 100%;
  padding: 5px 10px;
  margin: 5px 0;
  border-radius: 5px;
  outline: 0;
  border: 1px solid rgba(28, 28, 28, 0.2);
}
body div.overlay div.modal.editProfile div.modalBody select {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  width: 100%;
  padding: 5px 10px;
  margin: 5px 0;
  border-radius: 5px;
  outline: 0;
  border: 1px solid rgba(28, 28, 28, 0.2);
}
body div.overlay div.modal.editProfile div.modalBody textarea {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  width: 100%;
  padding: 5px 10px;
  margin: 5px 0;
  border-radius: 5px;
  outline: 0;
  border: 1px solid rgba(28, 28, 28, 0.2);
}
body div.overlay div.modal.editProfile div.modalBody button {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  position: relative;
  width: 100%;
  padding: 0 20px;
  margin: 5px 0;
  height: 40px;
  line-height: 40px;
  border-radius: 20px;
  outline: none;
  border: 0;
}
body div.overlay div.modal.editProfile div.modalBody button.primary {
  color: #fefefe;
  background-color: #172fe0;
}
body div.overlay div.modal.editProfile div.modalBody button.secondary {
  background-color: transparent;
  border: 1px solid #172fe0;
  line-height: 38px;
  color: #172fe0;
}
body div.overlay div.modal.editProfile div.modalBody button:disabled {
  opacity: 0.3;
}
body div.overlay div.modal.editProfile.open {
  opacity: 1;
  transform: scale(1);
  pointer-events: auto;
}

/* Order matters: settings → tools → base → layout → components → utilities */
body div.pageBody div.accountContainer {
  position: relative;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
@media (min-width: 675px) {
  body div.pageBody div.accountContainer {
    flex-direction: row;
    gap: 40px;
  }
  body div.pageBody div.accountContainer div.accountMenu {
    flex: 0 0 250px;
  }
  body div.pageBody div.accountContainer div.accountBody {
    flex-grow: 1;
  }
}
/* Order matters: settings → tools → base → layout → components → utilities */
body div.pageBody div.accountContainer .accountMenuDesktop,
body div.pageBody div.accountContainer .accountMenuMobile {
  width: 100%;
}
body div.pageBody div.accountContainer .accountMenuDesktop {
  display: block;
}
body div.pageBody div.accountContainer .accountMenuMobile {
  display: none;
}
body div.pageBody div.accountContainer .accountMenuDesktop ul {
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}
body div.pageBody div.accountContainer .accountMenuDesktop ul li {
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
}
body div.pageBody div.accountContainer .accountMenuDesktop ul li a {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 10px 10px;
  display: block;
  color: #1c1c1c;
  text-decoration: none;
  border-radius: 5px;
}
body div.pageBody div.accountContainer .accountMenuDesktop ul li a:hover {
  color: #172fe0;
}
body div.pageBody div.accountContainer .accountMenuDesktop ul li.selected a {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 700;
  line-height: 1.1em;
  background-color: rgba(28, 28, 28, 0.05);
}
body div.pageBody div.accountContainer .accountMenuMobile {
  position: relative;
}
body div.pageBody div.accountContainer .accountMenuMobile .accountMenuMobileToggle {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 14px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 700;
  line-height: 1.1em;
  width: 100%;
  min-height: 44px;
  padding: 0 12px;
  border: 0;
  border-radius: 8px;
  background-color: rgba(28, 28, 28, 0.05);
  color: #1c1c1c;
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-align: left;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}
body div.pageBody div.accountContainer .accountMenuMobile .accountMenuMobileChevron {
  transition: transform 0.2s ease;
  flex-shrink: 0;
  margin-left: 10px;
}
body div.pageBody div.accountContainer .accountMenuMobile.isOpen .accountMenuMobileChevron {
  transform: rotate(180deg);
}
body div.pageBody div.accountContainer .accountMenuMobile .accountMenuMobileList {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  width: 100%;
  margin: 0;
  padding: 6px;
  list-style: none;
  border-radius: 10px;
  background: white;
  box-shadow: 0 10px 30px rgba(28, 28, 28, 0.12);
  z-index: 50;
  box-sizing: border-box;
}
body div.pageBody div.accountContainer .accountMenuMobile .accountMenuMobileList li {
  margin: 0;
  padding: 0;
}
body div.pageBody div.accountContainer .accountMenuMobile .accountMenuMobileList li a {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  display: block;
  width: 100%;
  padding: 10px 10px;
  color: #1c1c1c;
  text-decoration: none;
  border-radius: 6px;
}
body div.pageBody div.accountContainer .accountMenuMobile .accountMenuMobileList li a:hover {
  color: #172fe0;
  background-color: rgba(28, 28, 28, 0.03);
}
body div.pageBody div.accountContainer .accountMenuMobile .accountMenuMobileList li.selected a {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 14px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 700;
  line-height: 1.1em;
  background-color: rgba(28, 28, 28, 0.05);
}

@media (max-width: 675px) {
  body div.pageBody div.accountContainer .accountMenuDesktop {
    display: none;
  }
  body div.pageBody div.accountContainer .accountMenuMobile {
    display: block;
  }
}
/* Order matters: settings → tools → base → layout → components → utilities */
body div.pageBody div.accountContainer div.accountBody div.subForm h2 {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 30px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  margin: 0;
  padding: 0 0 20px 0;
}
body div.pageBody div.accountContainer div.accountBody div.subForm h3 {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 18px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  margin: 0;
  padding: 30px 0 10px 0;
  border-bottom: 1px solid #DDDDDD;
}
body div.pageBody div.accountContainer div.accountBody div.subForm h3:first-of-type {
  padding: 10px 0;
}
body div.pageBody div.accountContainer div.accountBody div.subForm p {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
}
body div.pageBody div.accountContainer div.accountBody div.subForm p.formIntro {
  margin-top: 0;
}
body div.pageBody div.accountContainer div.accountBody div.subForm div.breadcrumbs {
  position: relative;
  display: block;
  width: 100%;
  padding-bottom: 5px;
}
body div.pageBody div.accountContainer div.accountBody div.subForm div.breadcrumbs div.breadcrumb {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
}
body div.pageBody div.accountContainer div.accountBody div.subForm div.breadcrumbs div.breadcrumb a {
  color: #1c1c1c;
}
body div.pageBody div.accountContainer div.accountBody div.subForm label,
body div.pageBody div.accountContainer div.accountBody div.subForm .fieldRow {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  display: block;
  width: 100%;
  margin-top: 20px;
}
body div.pageBody div.accountContainer div.accountBody div.subForm label .unchangeable,
body div.pageBody div.accountContainer div.accountBody div.subForm .fieldRow .unchangeable {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 18px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  padding: 5px 0;
}
body div.pageBody div.accountContainer div.accountBody div.subForm label .note,
body div.pageBody div.accountContainer div.accountBody div.subForm .fieldRow .note {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 11px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  opacity: 0.5;
  padding: 5px 0;
}
body div.pageBody div.accountContainer div.accountBody div.subForm fieldset {
  position: relative;
  display: block;
  width: 100%;
  margin-top: 20px;
  padding: 0;
  border: 0;
}
body div.pageBody div.accountContainer div.accountBody div.subForm fieldset legend {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
}
body div.pageBody div.accountContainer div.accountBody div.subForm fieldset label {
  margin-top: 5px;
}
body div.pageBody div.accountContainer div.accountBody div.subForm div.profilePhotoPrev {
  position: relative;
  width: 360px;
  height: 360px;
  margin: 5px auto;
  overflow: hidden;
  position: relative;
}
body div.pageBody div.accountContainer div.accountBody div.subForm div.profilePhotoPrev img#profilePhotoPreview {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
}
body div.pageBody div.accountContainer div.accountBody div.subForm input[type=text],
body div.pageBody div.accountContainer div.accountBody div.subForm input[type=url] {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  width: 100%;
  padding: 5px 10px;
  margin: 5px 0;
  border-radius: 5px;
  outline: 0;
  border: 1px solid rgba(28, 28, 28, 0.2);
}
body div.pageBody div.accountContainer div.accountBody div.subForm select {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  width: 100%;
  padding: 5px 10px;
  margin: 5px 0;
  border-radius: 5px;
  outline: 0;
  border: 1px solid rgba(28, 28, 28, 0.2);
}
body div.pageBody div.accountContainer div.accountBody div.subForm textarea {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  width: 100%;
  padding: 5px 10px;
  margin: 5px 0;
  border-radius: 5px;
  outline: 0;
  border: 1px solid rgba(28, 28, 28, 0.2);
}
body div.pageBody div.accountContainer div.accountBody div.subForm button.regular {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  position: relative;
  width: 100%;
  max-width: 300px;
  padding: 0 20px;
  margin: 5px 0;
  height: 40px;
  line-height: 40px;
  border-radius: 5px;
  outline: none;
  border: 0;
}
body div.pageBody div.accountContainer div.accountBody div.subForm button.regular.primary {
  color: #fefefe;
  background-color: #172fe0;
}
body div.pageBody div.accountContainer div.accountBody div.subForm button.regular.secondary {
  background-color: transparent;
  border: 1px solid #172fe0;
  line-height: 38px;
  color: #172fe0;
}
body div.pageBody div.accountContainer div.accountBody div.subForm button.regular:disabled {
  opacity: 0.3;
}
body div.pageBody div.accountContainer div.accountBody div.subForm div.formActions {
  position: relative;
  width: 100%;
  padding: 10px 0;
}
body div.pageBody div.accountContainer div.accountBody div.subForm div.formActions > button {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  position: relative;
  width: 100%;
  max-width: 300px;
  padding: 0 20px;
  margin: 5px 0;
  height: 40px;
  line-height: 40px;
  border-radius: 20px;
  outline: none;
  border: 0;
}
body div.pageBody div.accountContainer div.accountBody div.subForm div.formActions > button.primary {
  color: #fefefe;
  background-color: #172fe0;
}
body div.pageBody div.accountContainer div.accountBody div.subForm div.formActions > button.secondary {
  background-color: transparent;
  border: 1px solid #172fe0;
  line-height: 38px;
  color: #172fe0;
}
body div.pageBody div.accountContainer div.accountBody div.subForm div.formActions > button.alert {
  background-color: #e11d48;
  line-height: 38px;
  color: #fefefe;
}
body div.pageBody div.accountContainer div.accountBody div.subForm div.formActions > button:disabled {
  opacity: 0.3;
}
body div.pageBody div.accountContainer div.accountBody div.subForm div.formActions .fieldNote {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  padding: 5px 0;
}

/* Order matters: settings → tools → base → layout → components → utilities */
body div.pageBody div.myPlanCard div.planCard {
  position: relative;
  width: 100%;
  max-width: 400px;
  background-color: #fefefe;
  border-radius: 10px;
  padding: 35px 20px 20px 20px;
  margin: 10px 0;
  color: #1c1c1c;
  overflow: hidden;
}
body div.pageBody div.myPlanCard div.planCard div.planName {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 26px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  font-size: clamp(20px, 17.1764705882px + 0.0088235294 * 100vw, 26px);
}
body div.pageBody div.myPlanCard div.planCard div.planPrice {
  padding: 10px 0;
}
body div.pageBody div.myPlanCard div.planCard div.planPrice span.numberAmount {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 50px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  font-size: clamp(36px, 29.4117647059px + 0.0205882353 * 100vw, 50px);
}
body div.pageBody div.myPlanCard div.planCard div.planPrice span.cadence {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  font-size: clamp(12px, 11.0588235294px + 0.0029411765 * 100vw, 14px);
  margin-left: 3px;
}
body div.pageBody div.myPlanCard div.planCard div.planOrg {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 50px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  font-size: clamp(36px, 29.4117647059px + 0.0205882353 * 100vw, 50px);
  padding: 10px 0;
  opacity: 0.3;
}
body div.pageBody div.myPlanCard div.planCard div.planDescription {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  font-size: clamp(14px, 13.0588235294px + 0.0029411765 * 100vw, 16px);
  padding: 0 0 5px 0;
  height: auto;
}
body div.pageBody div.myPlanCard div.planCard button {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  position: relative;
  width: 100%;
  padding: 0 20px;
  margin: 5px 0;
  height: 40px;
  line-height: 40px;
  border-radius: 20px;
  outline: none;
  border: 0;
}
body div.pageBody div.myPlanCard div.planCard button.primary {
  color: #fefefe;
  background-color: #172fe0;
}
body div.pageBody div.myPlanCard div.planCard button.secondary {
  background-color: transparent;
  border: 1px solid #172fe0;
  line-height: 38px;
  color: #172fe0;
}
body div.pageBody div.myPlanCard div.planCard button:disabled {
  opacity: 0.3;
}
body div.pageBody div.myPlanCard div.planCard div.planTransitionNote {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  width: 100%;
  text-align: center;
  padding: 5px 0;
  color: #e11d48;
}
body div.pageBody div.myPlanCard div.planCard div.featuresLabel {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
  opacity: 0.6;
  padding: 20px 0 10px 0;
}
body div.pageBody div.myPlanCard div.planCard div.orgNote {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  font-size: clamp(14px, 13.0588235294px + 0.0029411765 * 100vw, 16px);
  padding: 5px 0;
}
body div.pageBody div.myPlanCard div.planCard ul.planFeatures {
  margin: 0;
  padding: 0;
  list-style: none;
}
body div.pageBody div.myPlanCard div.planCard ul.planFeatures li {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  font-size: clamp(14px, 13.0588235294px + 0.0029411765 * 100vw, 16px);
  padding: 2px 5px 2px 25px;
  background-image: url("/assets/images/icons/icon_ui_checkmark-blue.svg");
  background-size: 15px 15px;
  background-repeat: no-repeat;
  background-position: left 3px;
}
body div.pageBody div.myPlanCard div.planCard.current {
  border: 2px solid #d0f921;
}
body div.pageBody div.myPlanCard div.planCard.current:after {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
  content: "Your Plan";
  position: absolute;
  top: 0;
  right: 0;
  text-align: center;
  color: #1c1c1c;
  background-color: #d0f921;
  padding: 5px 10px;
  border-radius: 0 0 0 5px;
}
body div.pageBody div.myPlanCard div.planCard.featured:before {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
  content: "Best Value";
  position: absolute;
  top: 20px;
  left: 20px;
  color: #172fe0;
}
body div.pageBody div.myPlanCard div.planCard.transitionPlan:after, body div.pageBody div.myPlanCard div.planCard.scheduledCancel:after {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
  position: absolute;
  top: 0;
  right: 0;
  text-align: center;
  padding: 5px 10px;
  border-radius: 0 0 0 5px;
}
body div.pageBody div.myPlanCard div.planCard.transitionPlan {
  border: 2px solid #172fe0;
}
body div.pageBody div.myPlanCard div.planCard.transitionPlan:after {
  content: "Scheduled Switch";
  color: #fefefe;
  background-color: #172fe0;
}
body div.pageBody div.myPlanCard div.planCard.scheduledCancel {
  border: 2px solid #e11d48;
}
body div.pageBody div.myPlanCard div.planCard.scheduledCancel:after {
  content: "Ending Soon";
  color: #fefefe;
  background-color: #e11d48;
}

@media (min-width: 675px) {
  body div.pageBody div.plansContainer div.planCard {
    padding: 40px 30px 30px 30px;
  }
  body div.pageBody div.plansContainer div.planCard div.planDescription {
    min-height: 80px;
  }
  body div.pageBody div.plansContainer div.planCard ul.planFeatures li {
    padding: 2px 5px 2px 30px;
    background-size: 20px 20px;
    background-position: left 4px;
  }
  body div.pageBody div.plansContainer div.planCard.featured:before {
    top: 25px;
    left: 30px;
  }
}
/* Order matters: settings → tools → base → layout → components → utilities */
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage {
  width: 100%;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard {
  padding-bottom: 40px;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .notificationSectionHeader {
  display: flex;
  gap: 5px;
  flex-direction: row;
  align-items: center;
  border-bottom: 1px solid #DDDDDD;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .notificationSectionHeader .notificationSectionHeaderLeft {
  flex-grow: 1;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .notificationSectionHeader .notificationSectionHeaderLeft h3 {
  border: 0;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .notificationSectionHeader .notificationSectionHeaderColumns {
  display: flex;
  gap: 10px;
  flex-direction: row;
  align-items: center;
  flex-shrink: 1;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .notificationSectionHeader .notificationSectionHeaderColumns .notificationColumnLabel {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 9px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
  width: 36px;
  text-align: center;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .settingsRow {
  display: flex;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .settingsRow.notificationRow {
  gap: 10px;
  border-bottom: 1px solid #DDDDDD;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .settingsRow .settingsRowCopy {
  flex-grow: 1;
  padding: 5px 0;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .settingsRow .settingsRowCopy h4 {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  margin: 0;
  padding: 0;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .settingsRow #notificationsMasterToggle {
  display: flex;
  gap: 10px;
  flex-direction: row;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .settingsRow #notificationsMasterToggle .srOnly {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .settingsRow .notificationToggleColumns {
  display: flex;
  gap: 10px;
  flex-direction: row;
  align-items: center;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .settingsRow .filterToggle {
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  flex-shrink: 1;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .settingsRow .filterToggleTrack {
  display: inline-flex;
  align-items: center;
  width: 36px;
  height: 20px;
  border-radius: 999px;
  padding: 0.125rem;
  transition: 0.2s ease;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .settingsRow .filterToggle.on .filterToggleTrack {
  background: #172fe0;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .settingsRow .filterToggle.off .filterToggleTrack {
  background: #DDDDDD;
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .settingsRow .filterToggleThumb {
  display: block;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fefefe;
  transition: transform 0.2s ease;
  transform: translateX(2px);
}
body div.pageBody div.accountContainer div.accountBody div.accountNotificationsPage .settingsCard .settingsRow .filterToggle.on .filterToggleThumb {
  transform: translateX(18px);
}

/* Order matters: settings → tools → base → layout → components → utilities */
div.mainContent div.pageBody div.accountContainer div.accountBody .subForm .availabilitySessionLengths .availabilityCheckRow {
  display: block;
  width: 100%;
  padding: 5px 0;
  margin: 0;
}
div.mainContent div.pageBody div.accountContainer div.accountBody .subForm .availabilitySessionLengths .availabilityCheckRow span {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
}
div.mainContent div.pageBody div.accountContainer div.accountBody .subForm .availabilitySection {
  position: relative;
  width: 100%;
  padding: 20px 0;
}
div.mainContent div.pageBody div.accountContainer div.accountBody .subForm .availabilitySection h3 > button.addTime {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 20px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  width: 26px;
  height: 26px;
  border-radius: 20px;
  line-height: 20px;
  color: #fefefe;
  background-color: #172fe0;
  outline: none;
  border: 0;
  vertical-align: middle;
  margin: 0 0 5px 5px;
}
div.mainContent div.pageBody div.accountContainer div.accountBody .subForm .availabilitySection .dayBlock {
  position: relative;
  width: 100%;
  padding: 10px 0 20px 0;
}
div.mainContent div.pageBody div.accountContainer div.accountBody .subForm .availabilitySection .dayBlock .dayHeader {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  margin-bottom: 10px;
}
div.mainContent div.pageBody div.accountContainer div.accountBody .subForm .availabilitySection .dayBlock .dayHeader h4 {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
  margin: 0;
  padding: 5px 0;
  flex-grow: 1;
}
div.mainContent div.pageBody div.accountContainer div.accountBody .subForm .availabilitySection .dayBlock .dayHeader button {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 12px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  color: #1c1c1c;
  background-color: #d0f921;
  outline: none;
  border: 0;
  border-radius: 5px;
  padding: 0 20px;
}
div.mainContent div.pageBody div.accountContainer div.accountBody .subForm .availabilitySection .dayBlock .timeBlock {
  position: relative;
  width: 100%;
  background-color: #fefefe;
  margin: 5px 0;
  border-radius: 5px;
}
div.mainContent div.pageBody div.accountContainer div.accountBody .subForm .availabilitySection .dayBlock .timeBlock div.timeRange {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 18px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  position: relative;
  width: 100%;
  padding: 20px;
}
div.mainContent div.pageBody div.accountContainer div.accountBody .subForm .availabilitySection .dayBlock .timeBlock div.deleteTime {
  position: absolute;
  top: 50%;
  right: 10px;
  width: 26px;
  height: 26px;
  transform: translateY(-50%);
}
div.mainContent div.pageBody div.accountContainer div.accountBody .subForm .availabilitySection .dayBlock .timeBlock div.deleteTime > img {
  width: 26px;
  height: 26px;
}

div.overlay div.modal div.modalBody div.availabilityPickerContainer {
  position: relative;
  width: 100%;
  height: 500px;
  display: flex;
  flex-direction: row;
  align-items: stretch;
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar {
  position: relative;
  /* fixed column */
  flex: 0 0 300px;
  width: 300px;
  min-width: 300px;
  max-width: 300px;
  border-right: 1px solid #EFEFEF;
  overflow: hidden; /* prevents content from forcing width */
  /* -------------------------------------------------------------------------- */
  /* Calendar wrapper                                                           */
  /* -------------------------------------------------------------------------- */
  /* -------------------------------------------------------------------------- */
  /* Header                                                                      */
  /* -------------------------------------------------------------------------- */
  /* -------------------------------------------------------------------------- */
  /* Weekday labels                                                             */
  /* -------------------------------------------------------------------------- */
  /* -------------------------------------------------------------------------- */
  /* Day grid                                                                   */
  /* -------------------------------------------------------------------------- */
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .calendarMonth {
  width: 100%;
  max-width: 520px;
  padding: 16px;
  border-radius: 12px;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .calendarHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .calendarTitle {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .calendarNav {
  display: flex;
  gap: 8px;
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .calendarNavBtn {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: none;
  cursor: pointer;
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .calendarNavBtn:hover {
  background: #d0f921;
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .calendarWeekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 8px;
  margin-bottom: 8px;
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .calendarWeekday {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 10px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
  text-align: center;
  font-weight: 600;
  color: #6b7280;
  letter-spacing: 0.04em;
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .calendarGrid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 8px;
  /* Individual day cell */
  /* Optional states you may want later */
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .calendarGrid .calendarDay {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
  width: 100%;
  aspect-ratio: 1/1; /* keeps circles */
  border-radius: 50%;
  border: none;
  color: #1c1c1c;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .calendarGrid .calendarDay:hover {
  background: #d0f921;
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .calendarGrid .calendarDay.is-today {
  border: 1px solid rgba(23, 47, 224, 0.3);
  color: #172fe0;
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .calendarGrid .calendarDay.is-selected {
  background: #172fe0;
  color: #fefefe;
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .calendarGrid .calendarDay.is-edited {
  background: rgba(23, 47, 224, 0.2);
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .calendarGrid .calendarDay.is-disabled {
  opacity: 0.4;
  pointer-events: none;
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .recurringDaysList {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  padding: 16px;
  /* Individual day cell */
  /* Optional states you may want later */
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .recurringDaysList .calendarDay {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  width: 100%;
  border-radius: 5px;
  border: none;
  background: #f2f5fc;
  color: #2f6bff;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .recurringDaysList .calendarDay:hover {
  background: #e6ebf8;
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .recurringDaysList .calendarDay.is-today {
  background: #2f6bff;
  color: #fff;
}
div.overlay div.modal div.modalBody div.availabilityPickerContainer div.availabilityPickerCalendar .recurringDaysList .calendarDay.is-disabled {
  opacity: 0.4;
  pointer-events: none;
}

div.availabilityPickerTimes,
div.availabilityEditOnly {
  position: relative;
  flex-grow: 1;
  min-height: 500px;
  padding: 20px;
}
div.availabilityPickerTimes div.timePickerHeader,
div.availabilityEditOnly div.timePickerHeader {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  position: relative;
  width: 100%;
  padding: 8px 0;
}
div.availabilityPickerTimes div.timePickerHeader > button,
div.availabilityEditOnly div.timePickerHeader > button {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 20px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  position: absolute;
  top: 4px;
  right: 0;
  width: 26px;
  height: 26px;
  border-radius: 20px;
  line-height: 20px;
  color: #fefefe;
  background-color: #172fe0;
  outline: none;
  border: 0;
  vertical-align: middle;
  margin: 0 0 5px 5px;
}
div.availabilityPickerTimes div.timePickerIntro,
div.availabilityEditOnly div.timePickerIntro {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  transform: translateY(-50%);
  opacity: 0.5;
  padding: 20px;
  text-align: center;
}
div.availabilityPickerTimes div#availabilityRangesMount,
div.availabilityPickerTimes div#availabilityEditRangesMount,
div.availabilityEditOnly div#availabilityRangesMount,
div.availabilityEditOnly div#availabilityEditRangesMount {
  padding: 10px 0;
}
div.availabilityPickerTimes div#availabilityRangesMount div.rangesEmpty,
div.availabilityPickerTimes div#availabilityEditRangesMount div.rangesEmpty,
div.availabilityEditOnly div#availabilityRangesMount div.rangesEmpty,
div.availabilityEditOnly div#availabilityEditRangesMount div.rangesEmpty {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  opacity: 0.5;
  text-align: center;
  padding: 40px 20px;
  background-color: #EFEFEF;
  border-radius: 5px;
}
div.availabilityPickerTimes div#availabilityRangesMount div.timePickerRow,
div.availabilityPickerTimes div#availabilityEditRangesMount div.timePickerRow,
div.availabilityEditOnly div#availabilityRangesMount div.timePickerRow,
div.availabilityEditOnly div#availabilityEditRangesMount div.timePickerRow {
  position: relative;
  width: 100%;
  padding: 5px;
  background-color: #EFEFEF;
  border-radius: 5px;
  margin: 5px auto;
}
div.availabilityPickerTimes div#availabilityRangesMount div.timePickerRow .timeStart, div.availabilityPickerTimes div#availabilityRangesMount div.timePickerRow .timeEnd,
div.availabilityPickerTimes div#availabilityEditRangesMount div.timePickerRow .timeStart,
div.availabilityPickerTimes div#availabilityEditRangesMount div.timePickerRow .timeEnd,
div.availabilityEditOnly div#availabilityRangesMount div.timePickerRow .timeStart,
div.availabilityEditOnly div#availabilityRangesMount div.timePickerRow .timeEnd,
div.availabilityEditOnly div#availabilityEditRangesMount div.timePickerRow .timeStart,
div.availabilityEditOnly div#availabilityEditRangesMount div.timePickerRow .timeEnd {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  padding: 5px 15px 5px 5px;
  background: #fefefe;
  outline: none;
  border: 0;
  border-radius: 3px;
  appearance: none;
}
div.availabilityPickerTimes div#availabilityRangesMount div.timePickerRow .timeStart:after, div.availabilityPickerTimes div#availabilityRangesMount div.timePickerRow .timeEnd:after,
div.availabilityPickerTimes div#availabilityEditRangesMount div.timePickerRow .timeStart:after,
div.availabilityPickerTimes div#availabilityEditRangesMount div.timePickerRow .timeEnd:after,
div.availabilityEditOnly div#availabilityRangesMount div.timePickerRow .timeStart:after,
div.availabilityEditOnly div#availabilityRangesMount div.timePickerRow .timeEnd:after,
div.availabilityEditOnly div#availabilityEditRangesMount div.timePickerRow .timeStart:after,
div.availabilityEditOnly div#availabilityEditRangesMount div.timePickerRow .timeEnd:after {
  content: "▼";
  position: absolute;
  top: 50%;
  right: 5px;
  width: 10px;
  height: 10px;
  transform: translateY(-50%);
  pointer-events: none;
  color: #333;
  font-size: 12px;
}
div.availabilityPickerTimes div#availabilityRangesMount div.timePickerRow .timeDash,
div.availabilityPickerTimes div#availabilityEditRangesMount div.timePickerRow .timeDash,
div.availabilityEditOnly div#availabilityRangesMount div.timePickerRow .timeDash,
div.availabilityEditOnly div#availabilityEditRangesMount div.timePickerRow .timeDash {
  margin: 0 5px;
}
div.availabilityPickerTimes div#availabilityRangesMount div.timePickerRow .timeRangeHint,
div.availabilityPickerTimes div#availabilityEditRangesMount div.timePickerRow .timeRangeHint,
div.availabilityEditOnly div#availabilityRangesMount div.timePickerRow .timeRangeHint,
div.availabilityEditOnly div#availabilityEditRangesMount div.timePickerRow .timeRangeHint {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 11px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  color: #e11d48;
}
div.availabilityPickerTimes div#availabilityRangesMount div.timePickerRow .timeDelete,
div.availabilityPickerTimes div#availabilityEditRangesMount div.timePickerRow .timeDelete,
div.availabilityEditOnly div#availabilityRangesMount div.timePickerRow .timeDelete,
div.availabilityEditOnly div#availabilityEditRangesMount div.timePickerRow .timeDelete {
  position: absolute;
  top: 50%;
  right: 0;
  width: 30px;
  height: 30px;
  font-size: 24px;
  border: 0;
  outline: none;
  transform: translateY(-50%);
}

@media (max-width: 675px) {
  div.overlay div.modal div.modalBody div.availabilityPickerContainer {
    flex-direction: column;
    height: auto; /* let it grow naturally on mobile */
  }
  div.overlay div.modal div.modalBody div.availabilityPickerCalendar {
    flex: 0 0 auto;
    width: 100%;
    min-width: 0;
    max-width: none;
    border-right: 0;
    border-bottom: 1px solid #EFEFEF;
  }
  div.overlay div.modal div.modalBody div.availabilityPickerTimes {
    width: 100%;
  }
}
/* Order matters: settings → tools → base → layout → components → utilities */
body div.pageBody div.accountContainer div.accountBody div.orgBody {
  position: relative;
  width: 100%;
  padding: 0;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody p {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgList {
  position: relative;
  width: 100%;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgList div.orgCard {
  position: relative;
  width: 100%;
  margin: 10px auto;
  padding: 20px;
  background-color: #fefefe;
  border-radius: 10px;
  display: flex;
  flex-direction: row;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgList div.orgCard div.orgInfo {
  position: relative;
  flex-grow: 1;
  align-items: center;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgList div.orgCard div.orgInfo div.orgName {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 18px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  position: relative;
  width: 100%;
  padding-bottom: 5px;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgList div.orgCard div.orgInfo div.orgMeta {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  width: 100%;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgList div.orgCard div.orgInfo div.orgMeta span.metaDetail {
  opacity: 0.7;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgList div.orgCard div.orgActions {
  flex: 0 0 120px;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgList div.orgCard div.orgActions button {
  font-size: 14px;
  width: 100%;
  text-align: center;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgActions {
  position: relative;
  width: 100%;
  padding: 0 0 10px 0;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgActions button {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 14px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  position: relative;
  padding: 0 20px;
  margin: 0 5px 0 0;
  height: 30px;
  line-height: 30px;
  border-radius: 5px;
  outline: none;
  border: 0;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgActions button.primary {
  color: #fefefe;
  background-color: #172fe0;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgActions button.secondary {
  background-color: transparent;
  border: 1px solid #172fe0;
  line-height: 38px;
  color: #172fe0;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgActions button.alert {
  background-color: #e11d48;
  line-height: 38px;
  color: #fefefe;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgActions button:disabled {
  opacity: 0.3;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgStats {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: row;
  gap: 10px;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgStats div.stat {
  flex-grow: 1;
  padding: 20px;
  background-color: #fefefe;
  border-radius: 10px;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgStats div.stat div.number {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 36px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  position: relative;
  width: 100%;
  text-align: center;
  padding-bottom: 5px;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.orgStats div.stat div.label {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
  position: relative;
  width: 100%;
  text-align: center;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.memberList {
  position: relative;
  width: 100%;
  margin: 10px auto;
  padding: 20px;
  background-color: #fefefe;
  border-radius: 10px;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.memberList table {
  position: relative;
  width: 100%;
  padding: 10px;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.memberList table thead tr th {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
  text-align: left;
  color: rgba(28, 28, 28, 0.7);
  padding: 5px 0;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.memberList table thead tr th:last-of-type {
  text-align: right;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.memberList table tbody tr td {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  text-align: left;
  padding: 10px 0;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.memberList table tbody tr td:last-of-type {
  text-align: right;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.memberList table tbody tr td button {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 12px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  position: relative;
  padding: 0 10px;
  margin: 0 0 0 5px;
  height: 28px;
  line-height: 28px;
  border-radius: 5px;
  outline: none;
  border: 0;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.memberList table tbody tr td button.primary {
  color: #fefefe;
  background-color: #172fe0;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.memberList table tbody tr td button.secondary {
  background-color: transparent;
  border: 1px solid #172fe0;
  line-height: 26px;
  color: #172fe0;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.memberList table tbody tr td button.alert {
  background-color: #e11d48;
  color: #fefefe;
}
body div.pageBody div.accountContainer div.accountBody div.orgBody div.memberList table tbody tr td button:disabled {
  opacity: 0.3;
}

/* Order matters: settings → tools → base → layout → components → utilities */
.feedbackContainer {
  position: relative;
  width: 100%;
  padding: 0 0 100px 0;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.feedbackContainer h3 {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 20px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  margin: 10px 0;
  padding: 0;
}
.feedbackContainer .leaveFeedback {
  position: relative;
  flex-grow: 1;
}
.feedbackContainer .leaveFeedback .feedbackForm {
  position: relative;
  width: 100%;
  background-color: #fefefe;
  padding: 20px;
  border-radius: 10px;
  margin-bottom: 10px;
}
.feedbackContainer .leaveFeedback .feedbackForm label {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  position: relative;
  width: 100%;
  display: block;
  padding: 10px 0;
}
.feedbackContainer .leaveFeedback .feedbackForm label input,
.feedbackContainer .leaveFeedback .feedbackForm label textarea,
.feedbackContainer .leaveFeedback .feedbackForm label select {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  display: block;
  width: 100%;
  margin: 5px auto;
  padding: 10px;
  border: 1px solid #DDDDDD;
  outline: none;
  border-radius: 5px;
}
.feedbackContainer .leaveFeedback .feedbackForm .feedbackActions {
  position: relative;
  width: 100%;
  padding: 15px 0;
}
.feedbackContainer .leaveFeedback .feedbackForm .feedbackActions button {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  padding: 20px 30px;
  border-radius: 5px;
  border: 0;
  outline: none;
  display: inline-block;
  vertical-align: middle;
  margin: 0 10px 10px 0;
}
.feedbackContainer .leaveFeedback .feedbackForm .feedbackActions button.primary {
  background-color: #172fe0;
  color: #fefefe;
}
.feedbackContainer .leaveFeedback .feedbackForm .feedbackActions button.secondary {
  background-color: #1c1c1c;
  color: #fefefe;
}
.feedbackContainer .leaveFeedback .feedbackForm .feedbackActions button:disabled {
  opacity: 0.3;
}
.feedbackContainer .pastFeedback {
  flex: 0 0 360px;
}
.feedbackContainer .pastFeedback div.feedbackItem {
  position: relative;
  width: 100%;
  background-color: #fefefe;
  padding: 20px;
  border-radius: 10px;
  margin-bottom: 10px;
}
.feedbackContainer .pastFeedback div.feedbackItem h4 {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 18px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  margin: 5px 0;
  padding: 0;
}
.feedbackContainer .pastFeedback div.feedbackItem .status {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 10px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
  display: inline-block;
  padding: 3px 5px;
  border-radius: 2px;
}
.feedbackContainer .pastFeedback div.feedbackItem .status.open {
  background-color: #d0f921;
  color: #1c1c1c;
}
.feedbackContainer .pastFeedback div.feedbackItem .status.inprogress {
  background-color: #172fe0;
  color: #fefefe;
}
.feedbackContainer .pastFeedback div.feedbackItem .status.moredetail {
  background-color: #e11d48;
  color: #fefefe;
}
.feedbackContainer .pastFeedback div.feedbackItem .status.closed {
  background-color: #EFEFEF;
  color: #1c1c1c;
}
.feedbackContainer .pastFeedback div.feedbackItem .date {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 11px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  opacity: 0.3;
}
.feedbackContainer .pastFeedback #pastFeedbackEmpty {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  text-align: center;
  padding: 50px 20px;
  background-color: rgba(28, 28, 28, 0.05);
  border-radius: 10px;
  font-style: italic;
}

@media (min-width: 1000px) {
  .feedbackContainer {
    flex-direction: row;
  }
}
/* Order matters: settings → tools → base → layout → components → utilities */
div.pageBody .feedbackBlock {
  position: relative;
  width: 100%;
  padding: 20px 0;
}
div.pageBody .feedbackBlock .feedbackDate {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  width: 100%;
  opacity: 0.5;
  padding: 5px 0;
}
div.pageBody .feedbackBlock .status {
  font-family: "Space Mono", "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.2em;
  letter-spacing: 0.02em;
  display: inline-block;
  padding: 3px 5px;
  border-radius: 2px;
}
div.pageBody .feedbackBlock .status.open {
  background-color: #d0f921;
  color: #1c1c1c;
}
div.pageBody .feedbackBlock .status.inprogress {
  background-color: #172fe0;
  color: #fefefe;
}
div.pageBody .feedbackBlock .status.moredetail {
  background-color: #e11d48;
  color: #fefefe;
}
div.pageBody .feedbackBlock .status.closed {
  background-color: #EFEFEF;
  color: #1c1c1c;
}
div.pageBody .feedbackBlock h2 {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 60px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  position: relative;
  width: 100%;
  padding: 10px 0;
  margin: 0;
}
div.pageBody .feedbackBlock p {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  padding: 10px 0;
  margin: 0;
}
div.pageBody .feedbackBlock .ticketBody h3 {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 18px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  position: relative;
  width: 100%;
  padding: 20px 0 5px 0;
  margin: 0;
}
div.pageBody .feedbackBlock .ticketActions {
  position: relative;
  width: 100%;
  padding: 15px 0;
}
div.pageBody .feedbackBlock .ticketActions button {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  padding: 20px 30px;
  border-radius: 5px;
  border: 0;
  outline: none;
  display: inline-block;
  vertical-align: middle;
  margin: 0 10px 10px 0;
}
div.pageBody .feedbackBlock .ticketActions button.primary {
  background-color: #172fe0;
  color: #fefefe;
}
div.pageBody .feedbackBlock .ticketActions button.secondary {
  background-color: #1c1c1c;
  color: #fefefe;
}
div.pageBody .commentsBlock {
  position: relative;
  width: 100%;
  padding: 20px 0 100px 0;
}
div.pageBody .commentsBlock h2 {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 24px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  padding: 20px 0;
}
div.pageBody .commentsBlock .commentList {
  position: relative;
  width: 100%;
}
div.pageBody .commentsBlock .comment {
  position: relative;
  width: 100%;
  padding: 30px;
  margin: 20px auto;
  background-color: #fefefe;
  border-radius: 10px;
}
div.pageBody .commentsBlock .comment .commenter {
  position: relative;
  width: 100%;
}
div.pageBody .commentsBlock .comment .commenter .name {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 20px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  display: block;
}
div.pageBody .commentsBlock .comment .commenter .title {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  display: block;
  opacity: 0.3;
}
div.pageBody .commentsBlock .comment .message {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  position: relative;
  width: 100%;
  padding: 20px 0;
}
div.pageBody .commentsBlock .commentActions {
  position: relative;
  width: 100%;
  padding: 15px 0;
}
div.pageBody .commentsBlock .commentActions button {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: normal;
  padding: 20px 30px;
  border-radius: 5px;
  border: 0;
  outline: none;
  display: inline-block;
  vertical-align: middle;
  margin: 0 10px 10px 0;
}
div.pageBody .commentsBlock .commentActions button.primary {
  background-color: #172fe0;
  color: #fefefe;
}
div.pageBody .commentsBlock .commentActions button.secondary {
  background-color: #1c1c1c;
  color: #fefefe;
}

/* Order matters: settings → tools → base → layout → components → utilities */
div.overlay div.modal.addComment div.modalBody div.commentContainer {
  padding: 20px;
}
div.overlay div.modal.addComment div.modalBody div.commentContainer label {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  position: relative;
  width: 100%;
  display: block;
  padding: 10px 0;
}
div.overlay div.modal.addComment div.modalBody div.commentContainer label input,
div.overlay div.modal.addComment div.modalBody div.commentContainer label textarea,
div.overlay div.modal.addComment div.modalBody div.commentContainer label select {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  display: block;
  width: 100%;
  margin: 5px auto;
  padding: 10px;
  border: 1px solid #DDDDDD;
  outline: none;
  border-radius: 5px;
}

/* Order matters: settings → tools → base → layout → components → utilities */
div.overlay div.modal.editFeedback div.modalBody div.editFeedbackContainer {
  padding: 20px;
}
div.overlay div.modal.editFeedback div.modalBody div.editFeedbackContainer label {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: -0.03em;
  font-weight: 700;
  line-height: 1.1em;
  position: relative;
  width: 100%;
  display: block;
  padding: 10px 0;
}
div.overlay div.modal.editFeedback div.modalBody div.editFeedbackContainer label input,
div.overlay div.modal.editFeedback div.modalBody div.editFeedbackContainer label textarea,
div.overlay div.modal.editFeedback div.modalBody div.editFeedbackContainer label select {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1.5em;
  display: block;
  width: 100%;
  margin: 5px auto;
  padding: 10px;
  border: 1px solid #DDDDDD;
  outline: none;
  border-radius: 5px;
}

/*# sourceMappingURL=main.css.map */