@charset "UTF-8";@font-face {
  font-family: Onest;
  src: url("../assets/fonts/Onest-Thin.woff2") format("woff2");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Onest;
  src: url("../assets/fonts/Onest-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Onest;
  src: url("../assets/fonts/Onest-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Onest;
  src: url("../assets/fonts/Onest-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Onest;
  src: url("../assets/fonts/Onest-Light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Onest;
  src: url("../assets/fonts/Onest-ExtraLight.woff2") format("woff2");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Onest;
  src: url("../assets/fonts/Onest-ExtraBold.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Onest;
  src: url("../assets/fonts/Onest-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Onest;
  src: url("../assets/fonts/Onest-Black.woff2") format("woff2");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
/* Icons */
@font-face {
  font-family: 'iconfont';
  src: url('../assets/fonts/iconfont.woff2?6ba53dca3a531c7450babf78a4031a41')
    format('woff2');
  font-display: swap;
  font-weight: 400;
}

[class*='icon-'] {
  display: inline-flex;
  align-items: center;
  font-style: normal;
}

[class*='icon-']::before {
  font-family: iconfont;
  font-style: normal;
}

[class*='icon-unlock']::before {
  content: '\f101';
}

[class*='icon-rating-star']::before {
  content: '\f102';
}

[class*='icon-profile']::before {
  content: '\f103';
}

[class*='icon-plus']::before {
  content: '\f104';
}

[class*='icon-minus']::before {
  content: '\f105';
}

[class*='icon-map-pin']::before {
  content: '\f106';
}

[class*='icon-mail']::before {
  content: '\f107';
}

[class*='icon-lock']::before {
  content: '\f108';
}

[class*='icon-lock-slash']::before {
  content: '\f109';
}

[class*='icon-info']::before {
  content: '\f10a';
}

[class*='icon-info-circle']::before {
  content: '\f10b';
}

[class*='icon-grid']::before {
  content: '\f10c';
}

[class*='icon-grid-outline']::before {
  content: '\f10d';
}

[class*='icon-eye']::before {
  content: '\f10e';
}

[class*='icon-eye-slash']::before {
  content: '\f10f';
}

[class*='icon-close']::before {
  content: '\f110';
}

[class*='icon-chevrons-up']::before {
  content: '\f111';
}

[class*='icon-chevrons-right']::before {
  content: '\f112';
}

[class*='icon-chevrons-left']::before {
  content: '\f113';
}

[class*='icon-chevrons-down']::before {
  content: '\f114';
}

[class*='icon-chevron-up']::before {
  content: '\f115';
}

[class*='icon-chevron-right']::before {
  content: '\f116';
}

[class*='icon-chevron-left']::before {
  content: '\f117';
}

[class*='icon-chevron-left-outline']::before {
  content: '\f118';
}

[class*='icon-chevron-down']::before {
  content: '\f119';
}

[class*='icon-checkmark']::before {
  content: '\f11a';
}

[class*='icon-check']::before {
  content: '\f11b';
}

[class*='icon-at-sign']::before {
  content: '\f11c';
}

[class*='icon-arrows-right']::before {
  content: '\f11d';
}

[class*='icon-arrows-left']::before {
  content: '\f11e';
}

[class*='icon-arrow-up']::before {
  content: '\f11f';
}

[class*='icon-arrow-right']::before {
  content: '\f120';
}

[class*='icon-arrow-left']::before {
  content: '\f121';
}

[class*='icon-arrow-down']::before {
  content: '\f122';
}

[class*='icon-alert-circle']::before {
  content: '\f123';
}

/* stylelint-disable */
/* stylelint-disable */
/*
 * https://dev.to/janeori/css-type-casting-to-numeric-tanatan2-scalars-582j
 * https://css-tip.com/screen-dimension/
*/
@property --100vw {
  inherits: false;
  initial-value: 0;
  syntax: "<length>";
}
@property --100vh {
  inherits: false;
  initial-value: 0;
  syntax: "<length>";
}
:root {
  /* Viewport Dimensions */
  --100vw: 100vw;
  --100vh: 100vh;
  --viewport-width: calc(tan(atan2(var(--100vw), 0.0625rem)));
  --viewport-height: calc(tan(atan2(var(--100vh), 0.0625rem)));
  /* calc() wrapper required for Safari, bug:
  // https://bugs.webkit.org/show_bug.cgi?id=263000
  */
  /* BASE (in px) */
  --base-font-size: 1rem;
  /* Container Settings */
  --content-width: 71.625rem;
  --content-width-xs: 47.5rem;
  --content-width-sm: 61.25rem;
  --content-width-lg: 98.75rem;
  --container-padding: 1.5rem;
  --container: calc(var(--content-width) + 2 * var(--container-padding));
  --container-xs: calc(var(--content-width-xs) + 2 * var(--container-padding));
  --container-sm: calc(var(--content-width-sm) + 2 * var(--container-padding));
  --container-lg: calc(var(--content-width-lg) + 2 * var(--container-padding));
  /* Fonts */
  --font-family-poppins: "Poppins", sans-serif;
  --font-family-arial: "Arial", "Helvetica", sans-serif;
  --font-family-onest: "Onest", sans-serif;
  --font-family-primary: var(--font-family-onest);
  --font-family-secondary: var(--font-family-arial);
  --font-icons: "iconfont";
  /* Fonts Body */
  --body-font-family: var(--font-family-primary);
  --body-font-size: 1rem;
  --body-font-weight: 400;
  --body-line-height: 1.4;
  /* Fonts Display (Heading) */
  --display-font-family: var(--font-family-primary);
  --display-font-weight: 700;
  --display-line-height: 1.2;
  /* Colors */
  --color-black: #000;
  --color-black-500: #00000080;
  --color-black-washed: #20272b;
  --color-black-carbon-fiber: #2d302d;
  --color-white: #fff;
  --color-white-snowflake: #f0f0f0;
  --color-white-doctor: #faf9f7;
  --color-white-dr: #fafafa;
  --color-white-morning-snow: #f5f3ee;
  --color-white-arctic-cotton: #e6e4df;
  --color-gray: #c8c8c8;
  --color-gray-carbon-fiber: #2d302d;
  --color-gray-lucky: #777;
  --color-gray-ancestral-water: #d0d0d0;
  --color-gray-cold-morning: #e5e5e5;
  --color-gray-orochimaru: #d9d9d9;
  --color-gray-fog-beacon: #d8d6d0;
  --color-gray-praise-giving: #b4b2ae;
  --color-orange-dwarven-peaches: #ffa17a;
  --color-green-emerald-whispers: #2f8773;
  --color-green-andean-opal: #aecec7;
  --color-green-clover-brook: #196654;
  --color-green-twining-vine: #71a499;
  --color-green-spearmint: #68bda7;
  --color-purple-lilac-geode: #b397ff;
  --color-red-strawberry-field: #f88484;
  --color-red-georgia-peach: #f97575;
  /* State Colors */
  --color-success: var(--color-green-emerald-whispers);
  --color-warning: #ffc107;
  --color-danger: var(--color-red-georgia-peach);
  --color-info: var(--color-purple-lilac-geode);
  /* Primary / Secondary */
  --color-primary: var(--color-green-emerald-whispers);
  /* Transitions */
  --transition-duration: 0.35s;
  --transition-duration-short: 0.25s;
  --transition-duration-long: 0.5s;
  --transition-primary: all var(--transition-duration) ease;
  /* Border Radius */
  --border-radius-4: 0.25rem;
  --border-radius-8: 0.5rem;
  --border-radius-12: 0.75rem;
  --border-radius-16: 1rem;
  --border-radius-20: 1.25rem;
  --border-radius-24: 1.5rem;
  --border-radius-32: 2rem;
  --border-radius-36: 2.25rem;
  /* Scrollbar */
  --scrollbar-border-radius: 0.5rem;
  --scrollbar-width: 0.5rem;
  --scrollbar-height: 0.5rem;
  --scrollbar-bg-color: var(--color-white-morning-snow);
  --scrollbar-thumb-color: var(--color-white-arctic-cotton);
  /* Button */
  --button-border-width: 0.0625rem;
  --button-border-style: solid;
  --button-border-color: var(--color-primary);
  --button-border-radius: 0.25rem;
  --button-height: 3rem;
  --button-padding-x: 1rem;
  --button-padding-y: 0.5rem;
  --button-font-size: 1rem;
  --button-font-weight: 400;
  --button-line-height: 1;
  --button-bg-color: var(--color-primary);
  --button-text-color: var(--color-white);
  /* Input */
  --input-border-width: 0.0625rem;
  --input-border-style: solid;
  --input-border-color: var(--color-black);
  --input-border-radius: 0.25rem;
  --input-height: 3rem;
  --input-padding-x: 1rem;
  --input-padding-y: 0.5rem;
  --input-font-size: 1rem;
  --input-font-weight: 400;
  --input-line-height: 1;
  --input-bg-color: var(--color-white);
  --input-text-color: var(--color-black);
  /* Select */
  --select-border-width: 0.0625rem;
  --select-border-style: solid;
  --select-border-color: var(--color-black);
  --select-border-radius: 0.25rem;
  --select-height: 3rem;
  --select-padding-x: 1rem;
  --select-padding-y: 0.5rem;
  --select-font-size: 1rem;
  --select-font-weight: 400;
  --select-line-height: 1;
  --select-bg-color: var(--color-white);
  --select-text-color: var(--color-black);
  --select-arrow-icon: var(--icon-chevron-down);
  /* Icons */
  --icon-chevron-down: "";
  --icon-eye: "";
  --icon-eye-slash: "";
  --icon-checkmark: "";
  --icon-info-circle: "";
  /* Tablet */
}
@media (max-width: 55.25rem) {
  :root {
    --container-padding: 1rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-duration: 0s;
  }
}
html {
  line-height: 1;
  -webkit-text-size-adjust: 100%;
  scrollbar-gutter: stable;
}

*,
*::after,
*::before {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

main,
header,
footer {
  display: block;
}

hr {
  overflow: visible;
  height: 0;
}

:where(ul[class]) {
  list-style: none;
}

:where(ul, ol):where([class]) {
  padding-left: 0;
}

a {
  display: inline-block;
  background-color: transparent;
  text-decoration: none;
  color: inherit;
}

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
}

b,
strong {
  font-weight: 700;
}

code,
kbd,
samp {
  font-family: monospace;
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub,
sup {
  position: relative;
  vertical-align: baseline;
  font-size: 75%;
  line-height: 0;
}

img {
  vertical-align: middle;
  shape-margin: 1rem;
  height: auto;
  max-width: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  font-size: 0.75rem;
  font-style: italic;
}

video {
  max-width: 100%;
  height: auto;
}

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
}

button,
input {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}

button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 0.0625rem dotted ButtonText;
}

legend {
  display: table;
  max-width: 100%;
  white-space: normal;
  color: inherit;
}

textarea {
  overflow: auto;
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

[type=search] {
  -webkit-appearance: textfield;
  outline-offset: -0.125rem;
}

[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

details {
  display: block;
}

[hidden] {
  display: none;
}

/*[fill] {
  fill: currentColor;
}*/

/*[stroke] {
  stroke: currentColor;
}*/

/*svg * {
  transition-property: fill, stroke;
}*/

/**
  Видаляємо анімації і переходи якщо вони вимкнуті 
 */
@media (prefers-reduced-motion: reduce) {
  *,
  ::before,
  ::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
/* ========== UTILS ========== */
/* Avoid content moving on overflow: hidden */
.disable-scroll {
  position: fixed;
  left: 0;
  top: 0;
  overflow: hidden;
  width: 100%;
  height: 100vh;
}

/* Wrapper to prevent horizontal scroll */
/* if you want use position: sticky; - need to remove // overflow: hidden // !!! */
.wrapper {
  overflow: hidden;
  min-height: 100vh;
}
@media (min-width: 56.25rem) {
  .wrapper--visible {
    overflow: visible;
  }
}
.wrapper:has(.header) {
  padding-top: var(--header-height, 5.125rem);
}

/* Container */
.container {
  margin: 0 auto;
  max-width: var(--container);
  padding: 0 var(--container-padding);
}
.container--sm {
  max-width: var(--container-sm);
}
.container--lg {
  max-width: var(--container-lg);
}

/* Section offset, immit container */
.offset-container {
  padding-left: max(var(--container-padding), (100vw - var(--content-width)) / 2);
}
@media (max-width: 55.25rem) {
  .offset-container {
    padding: 0 var(--container-padding);
  }
}

/* Focus State */
:focus-visible {
  outline: 0.125rem dashed var(--color-primary);
  outline-offset: 0.25rem;
  transition-duration: 0s !important;
}

/* Hiding class, making content visible only to screen readers but not visually */
/* "sr" meaning "screen-reader" */
.sr-only:not(:focus, :active) {
  position: absolute;
  clip-path: inset(50%);
  overflow: hidden;
  width: 0.0625rem;
  height: 0.0625rem;
  white-space: nowrap;
  clip: rect(0 0 0 0);
}

.text-primary {
  color: var(--color-primary);
}

.text-danger {
  color: var(--color-danger);
}

.text-warning {
  color: var(--color-warning);
}

.text-success {
  color: var(--color-success);
}

@media (max-width: 55.25rem) {
  .pc-only {
    display: none !important;
  }
}

@media (min-width: 56.25rem) {
  .mobile-only {
    display: none !important;
  }
}

/* ========== HEADER ========== */
.header {
  position: fixed;
  z-index: 99;
  left: 0;
  top: 0;
  width: 100%;
  padding: 0.5rem 0;
  background-color: transparent;
  transition: box-shadow var(--transition-duration), background-color var(--transition-duration), transform var(--transition-duration);
}
.header._hidden {
  box-shadow: none;
  transform: translateY(-100%);
}
.header__wrap {
  position: relative;
  z-index: 9;
  display: flex;
  align-items: center;
  //justify-content: space-between;
  border-radius: 1rem;
  padding: 1rem 1.25rem;
  background-color: var(--color-primary);
  color: var(--color-white);
}
.header__logo {
    margin-left: auto;
  min-width: 0;
  transition: opacity var(--transition-duration);
}
.header__user-quick {
    margin-left: auto;
}
@media (any-hover: hover) {
  .header__logo:hover {
    opacity: 0.75;
  }
}
.header__logo:focus, .header__logo:active {
  opacity: 0.75;
}
.header__logo img {
  vertical-align: top;
  object-fit: contain;
}

/* Adaptive Menu */
.menu__arrow {
  vertical-align: middle;
  border: none;
  background: none;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1;
  color: inherit;
}
.menu__arrow::before {
  content: var(--icon-chevron-down);
  display: inline-block;
  font-family: var(--font-icons);
  will-change: transform;
  transition: transform var(--transition-duration);
}
.menu__arrow:not(:disabled) {
  cursor: pointer;
}
.menu__btn-box {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem 0.5rem;
}

body.pc .header__menu {
  flex: 1 0 auto;
}
body.pc .menu__btn {
  display: none;
}
body.pc .menu__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: color var(--transition-duration);
}
body.pc .menu__body {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem 2.25rem;
}
body.pc .menu__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1.5rem;
}
body.pc .menu__list > li {
  position: relative;
  white-space: nowrap;
}
@media (any-hover: hover) {
  body.pc .menu__list > li:hover > a {
    color: var(--color-primary);
  }
  body.pc .menu__list > li:hover > .menu__arrow::before {
    transform: rotate(180deg);
  }
  body.pc .menu__list > li:hover > .menu__sublist {
    opacity: 1;
    visibility: visible;
    transform: translateY(0%);
    pointer-events: all;
  }
}
body.pc .menu__list > li > a {
  display: inline-block;
  padding: 0.125rem 0.25rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.2;
  text-transform: capitalize;
  transition: var(--transition-duration);
}
@media (any-hover: hover) {
  body.pc .menu__list > li > a:hover {
    color: var(--color-primary);
  }
}
body.pc .menu__list > li > a:focus, body.pc .menu__list > li > a:active {
  color: var(--color-primary);
}
body.pc .menu__sublist {
  position: absolute;
  z-index: 99;
  left: 0;
  padding: 0.5rem 0;
  background-color: var(--color-white);
  box-shadow: 0 0 1rem rgba(0, 0, 0, 0.15);
  opacity: 0;
  visibility: hidden;
  transform: translateY(10%);
  pointer-events: none;
  transition: var(--transition-duration);
}
body.pc .menu__sublist-inner > li > a {
  display: block;
  width: 100%;
  min-width: 10rem;
  padding: 0.5rem 1rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.2;
  text-transform: capitalize;
  transition: color var(--transition-duration);
}
@media (any-hover: hover) {
  body.pc .menu__sublist-inner > li > a:hover {
    color: var(--color-primary);
  }
}
body.pc .menu__sublist-inner > li > a:focus, body.pc .menu__sublist-inner > li > a:active {
  color: var(--color-primary);
}

body.touch .menu {
  --menu-arrow-width: 3rem;
}
body.touch .menu__btn {
  --btn-size: 2.75rem;
  --btn-height: calc(var(--btn-size) * 0.6);
  --btn-line-height: calc(var(--btn-size) * 0.05);
  position: relative;
  z-index: 99;
  display: block;
  border: none;
  width: var(--btn-size);
  height: var(--btn-height);
  background: none;
}
body.touch .menu__btn span, body.touch .menu__btn::before, body.touch .menu__btn::after {
  position: absolute;
  left: 0;
  width: 100%;
  height: var(--btn-line-height);
  background-color: var(--color-black);
  transform-origin: center;
  transition: var(--transition-duration);
}
body.touch .menu__btn::before, body.touch .menu__btn::after {
  content: "";
}
body.touch .menu__btn::before {
  top: 0;
}
body.touch .menu__btn::after {
  top: auto;
  bottom: 0;
  translate: none;
}
body.touch .menu__btn._active::before {
  top: calc(var(--btn-height) / 2 - var(--btn-line-height) / 2);
  transform: rotate(-45deg);
}
body.touch .menu__btn._active::after {
  bottom: calc(var(--btn-height) / 2 - var(--btn-line-height) / 2);
  transform: rotate(45deg);
}
body.touch .menu__btn._active span {
  transform: scale(0) translate(0, -50%);
}
body.touch .menu__btn:not(:disabled) {
  cursor: pointer;
}
body.touch .menu__btn span {
  top: calc(var(--btn-height) / 2 - var(--btn-line-height) / 2);
  transform: scale(1);
}
body.touch .menu__arrow {
  --arrow-width: var(--menu-arrow-width, 3rem);
  display: inline-flex;
  flex: 0 0 var(--arrow-width);
  align-items: center;
  align-self: stretch;
  justify-content: flex-end;
  width: var(--arrow-width);
  height: auto;
  padding-right: 0.5rem;
  font-size: calc(var(--menu-arrow-width) * 0.5);
}
body.touch .menu__body {
  position: fixed;
  left: -100%;
  top: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: start;
  overflow: hidden auto;
  width: 100%;
  height: 100%;
  padding: calc(var(--header-height, 5rem) + 1.25rem) var(--container-padding) 1.5rem;
  background-color: var(--color-white);
  color: var(--color-black);
  transition: left 0.5s;
}
body.touch .menu__body::after {
  content: "";
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: var(--header-height);
  background-color: inherit;
}
body.touch .menu__body._active {
  left: 0;
}
body.touch .menu__list:not(:last-child) {
  margin-bottom: 1.5rem;
}
body.touch .menu__list > li {
  position: relative;
  display: flex;
  flex-wrap: wrap;
}
body.touch .menu__list > li._active > .menu__sublist {
  grid-template-rows: 1fr;
}
body.touch .menu__list > li._active > .menu__arrow::before {
  transform: rotate(180deg);
}
body.touch .menu__list > li:not(:last-child) {
  border-bottom: 0.0625rem dashed var(--color-primary);
}
body.touch .menu__list > li > a {
  display: inline-block;
  flex: 0 0 calc(100% - var(--menu-arrow-width));
  overflow: hidden;
  width: calc(100% - var(--menu-arrow-width));
  padding: 0.75rem 0.25rem;
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1.2;
  white-space: nowrap;
  text-overflow: ellipsis;
  text-transform: capitalize;
  transition: color var(--transition-duration);
  text-wrap: nowrap;
}
@media (any-hover: hover) {
  body.touch .menu__list > li > a:hover {
    color: var(--color-primary);
  }
}
body.touch .menu__list > li > a:focus, body.touch .menu__list > li > a:active {
  color: var(--color-primary);
}
body.touch .menu__sublist {
  display: grid;
  flex: 0 0 100%;
  grid-template-rows: 0fr;
  padding: 0.25rem 0 0.25rem 0.75rem;
  transition: grid-template-rows var(--transition-duration);
}
body.touch .menu__sublist-inner {
  overflow: hidden;
}
body.touch .menu__sublist-inner > li {
  border-top: 0.0625rem dashed var(--color-primary);
}
body.touch .menu__sublist-inner > li > a {
  display: block;
  overflow: hidden;
  width: 100%;
  padding: 0.75rem 0.125rem;
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.2;
  white-space: nowrap;
  text-overflow: ellipsis;
  text-transform: capitalize;
  text-wrap: nowrap;
}
@media (max-width: 55.25rem) {
  body.touch .menu__btn-box {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.5rem;
  }
}

/* ========== FOOTER ========== */
.footer {
  display: block;
}

/* ========== TABS ========== */
.tabs {
  position: relative;
}
.tabs__nav {
  display: flex;
  flex-wrap: nowrap;
  gap: 0.75rem 2rem;
  overflow-x: auto;
}
.tabs__nav > li > button {
  position: relative;
  z-index: 1;
  border: none;
  width: 100%;
  padding: 0.125rem 0;
  background: none;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  text-align: center;
  color: inherit;
  cursor: pointer;
  transition: color var(--transition-duration);
    outline: none !important;
    box-shadow: none !important;
}
.tabs__nav > li > button::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  border-radius: 0.125rem;
  width: 100%;
  height: 0.125rem;
  background-color: currentcolor;
  transition: background-color var(--transition-duration);
}
.tabs__nav > li > button:disabled, .tabs__nav > li > button._disabled {
  cursor: default;
  pointer-events: none;
}
@media (any-hover: hover) {
  .tabs__nav > li > button:not(:disabled, .disabled):hover {
    color: var(--color-primary);
  }
}
.tabs__nav > li > button:not(:disabled, .disabled):focus, .tabs__nav > li > button:not(:disabled, .disabled):active, .tabs__nav > li > button:not(:disabled, .disabled)._active {
  color: var(--color-primary);
}
.tabs__content {
  padding-top: 1.5rem;
}
.tabs__panel {
  display: none;
  opacity: 0;
  transition: opacity var(--transition-duration), visibility var(--transition-duration);
}
.tabs__panel._active {
  display: block;
  opacity: 1;
}

/* ========== MODAL ========== */
.modal {
  --modal-border-radius: 2rem;
  --modal-width: 61.25rem;
  --modal-width-sm: 27.5rem;
  --modal-bg-color: var(--color-white);
  --modal-transition-time: 0.3s;
  position: fixed;
  z-index: 9999;
  inset: 0;
  overflow: hidden auto;
  background-color: rgba(45, 48, 45, 0.2);
  text-align: center;
  opacity: 0;
  visibility: hidden;
  cursor: pointer;
  transition: opacity var(--modal-transition-time), visibility var(--modal-transition-time);
}
.modal::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}
.modal.is-open {
  opacity: 1;
  visibility: visible;
  transition: opacity var(--modal-transition-time), visibility var(--modal-transition-time);
}
.modal__backdrop {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: var(--color-black-500);
}
.modal__backdrop:not(:disabled) {
  cursor: pointer;
}
.modal__container {
  position: relative;
  z-index: 9;
  display: none;
  overflow: hidden;
  margin: 3rem auto;
  border-radius: var(--modal-border-radius);
  width: var(--modal-width);
  background-color: var(--modal-bg-color);
  text-align: left;
  cursor: default;
}
.modal__container.modal-open {
  display: inline-block;
}
.modal__container--sm {
  width: var(--modal-width-sm);
}
@media (max-width: 47rem) {
  .modal__container--sm {
    width: calc(100% - var(--container-padding) * 2);
  }
}
.modal__close-btn {
  --btn-size: 2.25rem;
  --btn-offset: 1.5rem;
  position: absolute;
  z-index: 9;
  right: var(--btn-offset);
  top: var(--btn-offset);
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: var(--btn-size);
  width: var(--btn-size);
  height: var(--btn-size);
  background-color: var(--color-white-doctor);
  font-size: calc(var(--btn-size) * 0.35);
  font-weight: 400;
  line-height: 1;
  color: var(--color-gray-ancestral-water);
  transition: background-color var(--transition-duration), color var(--transition-duration);
}
.modal__close-btn:not(:disabled) {
  cursor: pointer;
}
@media (any-hover: hover) {
  .modal__close-btn:not(:disabled):hover {
    background-color: var(--color-gray-carbon-fiber);
    color: var(--color-white-doctor);
  }
}

.modal-fade {
  opacity: 0;
  transition: opacity var(--modal-transition-time);
}
.modal-fade.animate-open {
  opacity: 1;
  transition: opacity var(--modal-transition-time);
}

.modal-zoomIn {
  opacity: 0;
  transform: scale(0);
  transition: opacity var(--modal-transition-time);
}
.modal-zoomIn.animate-open {
  opacity: 1;
  transform: scale(1);
  transition: opacity var(--modal-transition-time), transform var(--modal-transition-time);
}

.modal-fadeInUp {
  opacity: 0;
  transform: translateY(-10%);
  transition: opacity var(--modal-transition-time), transform var(--modal-transition-time);
}
.modal-fadeInUp.animate-open {
  opacity: 1;
  transform: translateY(0);
  transition: opacity var(--modal-transition-time), transform var(--modal-transition-time);
}

.disable-scroll {
  position: fixed;
  left: 0;
  top: 0;
  overflow: hidden;
  width: 100%;
  height: 100vh;
}

/* Change Password Modal Content */
.chp-modal-content {
  --content-padding-x: 2.5rem;
  --content-padding-y: 2.5rem;
  padding: var(--content-padding-y) var(--content-padding-x);
}
.chp-modal-content__header {
  --mb: 2rem;
}
.chp-modal-content__header:not(:last-child) {
  margin-bottom: var(--mb);
}
.chp-modal-content__title {
  --mb: 0.375rem;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: var(--display-line-height);
}
.chp-modal-content__title:not(:last-child) {
  margin-bottom: var(--mb);
}
.chp-modal-content__student {
  font-size: 1rem;
  font-weight: var(--body-font-weight);
  line-height: var(--body-line-height);
  color: var(--color-gray-lucky);
}
.chp-modal-content__student strong {
  font-weight: 600;
}
.chp-modal-content__body {
  --mb: 2rem;
}
.chp-modal-content__body:not(:last-child) {
  margin-bottom: var(--mb);
}
.chp-modal-content__btn {
  width: 100%;
}
.chp-modal-content__label {
  --mb: 0.75rem;
}
.chp-modal-content__label:not(:last-child) {
  margin-bottom: var(--mb);
}

/* Student Results Modal Content */
.str-modal-content {
  --content-padding-x: 2.5rem;
  --content-padding-y: 2.5rem;
  --content-img-height: 14.125rem;
  padding: var(--content-padding-y) var(--content-padding-x);
  text-align: center;
}
.str-modal-content__img {
  --mb: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  height: var(--content-img-height);
}
.str-modal-content__img:not(:last-child) {
  margin-bottom: var(--mb);
}
.str-modal-content__img img {
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.str-modal-content__title {
  --mb: 1.25rem;
}
.str-modal-content__title:not(:last-child) {
  margin-bottom: var(--mb);
}
.str-modal-content__labels {
  --mb: 2rem;
}
.str-modal-content__labels:not(:last-child) {
  margin-bottom: var(--mb);
}
.str-modal-content__label {
  --mb: 1rem;
  font-size: 1rem;
  font-weight: var(--body-font-weight);
  line-height: var(--body-line-height);
  color: var(--color-gray-lucky);
}
.str-modal-content__label:not(:last-child) {
  margin-bottom: var(--mb);
}
.str-modal-content__label strong {
  color: var(--color-primary);
}

/* ========== BUTTONS ========== */
.btn {
  --button-border-width: 0.125rem;
  --button-border-radius: 6.25rem;
  --button-height: 2.375rem;
  --button-font-size: 0.75rem;
  --button-font-weight: 600;
  --button-line-height: 1.2;
  --button-box-shadow: 0 0.25rem 0 0 var(--color-green-andean-opal);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  vertical-align: top;
  overflow: hidden;
  outline: none;
  border: var(--button-border-width) var(--button-border-style) var(--button-border-color);
  border-radius: var(--button-border-radius);
  min-height: var(--button-height);
  padding: var(--button-padding-y) var(--button-padding-x);
  background: none;
  background-color: var(--button-bg-color);
  box-shadow: var(--button-box-shadow);
  font-size: var(--button-font-size, 1rem);
  font-weight: var(--button-font-weight, 400);
  line-height: var(--button-line-height, 1);
  white-space: nowrap;
  text-align: center;
  color: var(--button-text-color);
  transition: border-color var(--transition-duration), background-color var(--transition-duration), box-shadow var(--transition-duration), color var(--transition-duration);
}
a.btn {
  text-decoration: none;
}

button.btn {
  -webkit-appearance: none;
}

.btn:disabled, .btn._disabled {
  opacity: 0.7;
  cursor: default;
  pointer-events: none;
}
@media (any-hover: hover) {
  .btn--primary:not(:disabled):hover {
    --button-border-color: var(--color-green-clover-brook);
    --button-bg-color: var(--color-green-clover-brook);
    --button-text-color: var(--color-white);
    --button-box-shadow: 0 0.25rem 0 0 var(--color-green-twining-vine);
  }
}
.btn--primary:not(:disabled):focus, .btn--primary:not(:disabled):active {
  --button-border-color: var(--color-green-clover-brook);
  --button-bg-color: var(--color-green-clover-brook);
  --button-text-color: var(--color-white);
  --button-box-shadow: 0 0.25rem 0 0 var(--color-green-twining-vine);
}
.btn--outline-gray {
  --button-border-color: var(--color-gray-fog-beacon);
  --button-bg-color: var(--color-white-doctor);
  --button-text-color: var(--color-gray-lucky);
  --button-box-shadow: 0 0.25rem 0 0 var(--color-gray-fog-beacon);
}
@media (any-hover: hover) {
  .btn--outline-gray:not(:disabled, ._disabled):hover {
    --button-border-color: var(--color-primary);
    --button-bg-color: var(--color-primary);
    --button-text-color: var(--color-white);
    --button-box-shadow: 0 0.25rem 0 0 var(--color-green-andean-opal);
  }
}
.btn--outline-gray:not(:disabled, ._disabled):focus {
  --button-border-color: var(--color-primary);
  --button-bg-color: var(--color-primary);
  --button-text-color: var(--color-white);
  --button-box-shadow: 0 0.25rem 0 0 var(--color-green-andean-opal);
}
.btn--outline-gray:not(:disabled, ._disabled):active {
  --button-border-color: var(--color-primary);
  --button-bg-color: var(--color-primary);
  --button-text-color: var(--color-white);
  --button-box-shadow: 0 0.25rem 0 0 var(--color-green-andean-opal);
}
.btn--orange {
  --button-border-color: var(--color-orange-dwarven-peaches);
  --button-bg-color: var(--color-orange-dwarven-peaches);
  --button-text-color: var(--color-white);
  --button-box-shadow: 0 0.25rem 0 0 rgb(255 161 122 / 53%);
}
@media (any-hover: hover) {
  .btn--orange:not(:disabled):hover {
    --button-border-color: var(--color-red-georgia-peach);
    --button-bg-color: var(--color-red-georgia-peach);
    --button-text-color: var(--color-white);
    --button-box-shadow: 0 0.25rem 0 0 var(--color-red-strawberry-field);
  }
}
.btn--orange:not(:disabled):focus, .btn--orange:not(:disabled):active {
  --button-border-color: var(--color-red-georgia-peach);
  --button-bg-color: var(--color-red-georgia-peach);
  --button-text-color: var(--color-white);
  --button-box-shadow: 0 0.25rem 0 0 var(--color-red-strawberry-field);
}
.btn--lg {
  --button-height: 3.5rem;
  --button-font-size: 1rem;
}
.btn:not(:disabled, ._disabled) {
  cursor: pointer;
}
.btn:not(:disabled, ._disabled):focus {
  outline: none;
}
/* ========== INPUTS ========== */
.input {
  --input-border-radius: 1.25rem;
  --input-border-width: 0.125rem;
  --input-border-color: var(--color-white-snowflake);
  --input-height: 3.5rem;
  --input-font-size: 1rem;
  --input-font-weight: 500;
  --input-line-height: 1;
  --input-bg-color: var(--color-white-doctor);
  --input-text-color: var(--color-black-carbon-fiber);
  --input-box-shadow: 0 0.25rem 0 0 var(--input-border-color);
  --input-icon-width: 2.625rem;
  --input-icon-color: var(--color-gray-ancestral-water);
  position: relative;
}
.input--error {
  --input-border-color: var(--color-red-strawberry-field);
  --input-box-shadow: 0 0.25rem 0 0 var(--color-danger);
  --input-text-color: var(--color-danger);
}
.input__icon {
  position: absolute;
  z-index: 9;
  left: 0;
  top: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--input-icon-width);
  padding-left: 0.375rem;
  font-size: calc(var(--input-icon-width) * 0.45);
  font-weight: 400;
  line-height: 1;
  color: var(--input-icon-color);
  transform: translateY(-50%);
  pointer-events: none;
}
.input__toggle {
  position: absolute;
  z-index: 9;
  right: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  width: var(--input-icon-width);
  height: 100%;
  padding-right: 0.5rem;
  background: none;
  font-size: calc(var(--input-icon-width) * 0.425);
  font-weight: 400;
  line-height: 1;
  color: var(--input-icon-color);
}
.input__toggle::before {
  content: var(--icon-eye-slash);
  font-family: var(--font-icons);
}
.input__toggle._show::before {
  content: var(--icon-eye);
}
.input__toggle:not(:disabled) {
  cursor: pointer;
}
@media (any-hover: hover) {
  .input__toggle:not(:disabled):hover ~ input {
    --input-border-color: var(--color-primary);
    --input-box-shadow: 0 0.25rem 0 0 var(--input-border-color);
  }
}
@media (any-hover: hover) {
  .input:not(.input--error) input:not(:disabled, ._disabled):hover,
  .input:not(.input--error) textarea:not(:disabled, ._disabled):hover {
    --input-border-color: var(--color-primary);
    --input-box-shadow: 0 0.25rem 0 0 var(--input-border-color);
  }
}
.input:not(.input--error) input:not(:disabled, ._disabled):focus,
.input:not(.input--error) textarea:not(:disabled, ._disabled):focus {
  --input-border-color: var(--color-primary);
  --input-box-shadow: 0 0.25rem 0 0 var(--input-border-color);
}
.input:not(.input--error) input:not(:disabled, ._disabled):active,
.input:not(.input--error) textarea:not(:disabled, ._disabled):active {
  --input-border-color: var(--color-primary);
  --input-box-shadow: 0 0.25rem 0 0 var(--input-border-color);
}
.input input,
.input textarea {
  appearance: none;
  display: block;
  outline: none;
  border: var(--input-border-width) var(--input-border-style) var(--input-border-color);
  border-radius: var(--input-border-radius);
  width: 100%;
  min-height: var(--input-height);
  padding: var(--input-padding-y) var(--input-icon-width);
  background: none;
  background-color: var(--input-bg-color);
  box-shadow: var(--input-box-shadow);
  font-size: var(--input-font-size, 1rem);
  font-weight: var(--input-font-weight, 400);
  line-height: var(--input-line-height, 1);
  color: var(--input-text-color);
  resize: none;
  transition: border-color var(--transition-duration), box-shadow var(--transition-duration);
}
.input input.placeholder,
.input textarea.placeholder {
  color: var(--color-gray-ancestral-water);
}
.input input::placeholder,
.input textarea::placeholder {
  color: var(--color-gray-ancestral-water);
}
.input input:placeholder,
.input textarea:placeholder {
  color: var(--color-gray-ancestral-water);
}
.input input::placeholder,
.input textarea::placeholder {
  color: var(--color-gray-ancestral-water);
}
.input input:input-placeholder,
.input textarea:input-placeholder {
  color: var(--color-gray-ancestral-water);
}
.input input::input-placeholder,
.input textarea::input-placeholder {
  color: var(--color-gray-ancestral-water);
}
.input input:disabled, .input input._disabled,
.input textarea:disabled,
.input textarea._disabled {
  opacity: 0.8;
  cursor: default;
}
.input input::-webkit-search-decoration, .input input::-webkit-search-cancel-button, .input input::-webkit-search-results-button, .input input::-webkit-search-results-decoration,
.input textarea::-webkit-search-decoration,
.input textarea::-webkit-search-cancel-button,
.input textarea::-webkit-search-results-button,
.input textarea::-webkit-search-results-decoration {
  display: none;
}

/* ========== SELECT ========== */
.select {
  --select-border-radius: 1rem;
  --select-border-width: 0.125rem;
  --select-border-color: var(--color-gray-fog-beacon);
  --select-height: 3rem;
  --select-padding-x: 1rem;
  --select-bg-color: var(--color-white-morning-snow);
  --select-font-size: 1rem;
  --select-font-weight: 500;
  --select-line-height: 1.2;
  --select-box-shadow: 0 0.25rem 0 0 var(--color-gray-fog-beacon);
  --select-arrow-color: var(--color-gray-lucky);
}
.select select {
  display: block;
  outline: none;
  border: var(--select-border-width) var(--select-border-style) var(--select-border-color);
  border-radius: var(--select-border-radius);
  width: 100%;
  min-height: var(--select-height);
  padding: var(--select-padding-y) var(--select-padding-x);
  background: none;
  background-color: var(--select-bg-color);
  font-size: var(--select-font-size, 1rem);
  font-weight: var(--select-font-weight, 400);
  line-height: var(--select-line-height, 1);
  color: var(--select-text-color);
  transition: border-color var(--transition-duration);
}
.select select:disabled, .select select._disabled {
  opacity: 0.8;
  cursor: default;
}
@media (any-hover: hover) {
  .select select:not(:disabled, ._disabled):hover {
    border-color: var(--color-primary);
  }
}
.select select:not(:disabled, ._disabled):focus {
  box-shadow: 0 0 0 0.125rem var(--color-primary);
}
.select select:not(:disabled, ._disabled):active {
  border-color: var(--color-primary);
}
.select .choices {
  overflow: visible;
  font-size: var(--select-font-size);
  font-weight: var(--select-font-weight);
  line-height: var(--select-line-height);
}
.select .choices[data-type*=select-one]::after {
  content: var(--select-arrow-icon);
  margin-top: 0;
  border: none;
  width: auto;
  height: auto;
  font-family: var(--font-icons);
  font-size: 0.75rem;
  color: var(--select-arrow-color);
  transform: translateY(-50%);
  transition: transform var(--transition-duration);
}
.select .choices[data-type*=select-one].is-open::after {
  margin-top: 0;
  border: none;
  transform: translateY(-50%) rotate(180deg);
}
.select .choices.is-open .choices__inner {
  border-radius: var(--select-border-radius);
}
.select .choices__inner {
  border: var(--select-border-width) solid var(--select-border-color);
  border-radius: var(--select-border-radius);
  min-height: var(--select-height);
  padding: var(--select-padding-y) var(--select-padding-x);
  background-color: var(--select-bg-color);
  box-shadow: var(--select-box-shadow);
  font-size: var(--select-font-size);
  font-weight: var(--select-font-weight);
  line-height: var(--select-line-height);
  transition: border-color var(--transition-duration);
}
.select .choices__list {
  --scrollbar-bg-color: rgb(230 228 223 / 50%);
  --scrollbar-thumb-bg-color: var(--color-gray-fog-beacon);
}
.select .choices__list--dropdown, .select .choices__list[aria-expanded] {
    z-index: 5;
  margin-top: 0.375rem;
  border: var(--select-border-width) solid var(--select-border-color);
  border-radius: var(--select-border-radius);
  padding: 0.5rem;
  background-color: var(--select-bg-color);
  transition: border-color var(--transition-duration);
}
.select .choices__list--dropdown .choices__item, .select .choices__list[aria-expanded] .choices__item {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-radius: 0.75rem;
  padding: 0.9375rem 0.75rem;
  font-size: var(--select-font-size);
  font-weight: var(--select-font-weight);
  line-height: var(--select-line-height);
  color: var(--color-gray-lucky);
  transition: color var(--transition-duration), background-color var(--transition-duration);
}
.select .choices__list--dropdown .choices__item--selectable::after, .select .choices__list[aria-expanded] .choices__item--selectable::after {
  content: var(--icon-checkmark);
  position: absolute;
  right: 0.75rem;
  top: 50%;
  font-family: var(--font-icons);
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1;
  transform: translateY(-50%);
  transition: visibility var(--transition-duration), opacity var(--transition-duration);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.select .choices__list--dropdown .choices__item--selectable.is-highlighted, .select .choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
  background-color: var(--color-white-arctic-cotton);
  color: var(--color-black-carbon-fiber);
}
.select .choices__list--dropdown .choices__item--selectable.is-selected, .select .choices__list[aria-expanded] .choices__item--selectable.is-selected {
  background-color: var(--color-white-arctic-cotton);
  color: var(--color-black-carbon-fiber);
}
.select .choices__list--dropdown .choices__item--selectable.is-selected::after, .select .choices__list[aria-expanded] .choices__item--selectable.is-selected::after {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
.select .choices__input {
  background: none;
}

/* Form Label */
.form-label {
  display: block;
  max-width: fit-content;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1;
}
.form-label[for] {
  cursor: pointer;
}
.form-label__required-mark {
  color: var(--color-orange-dwarven-peaches);
}

/* Form Error */
.form-error {
  display: flex;
  align-items: center;
  gap: 0.3125rem;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1;
  color: var(--color-danger);
}
.form-error::before {
  content: var(--icon-info-circle);
  font-family: var(--font-icons);
}

.section {
  --section-padding-y: 3rem;
}
.section--full .section__wrap {
  padding: 11.25rem 0 6.25rem;
}
@media (min-width: 56.25rem) {
  .section--full .section__wrap {
    min-height: 100vh;
  }
}
.section__wrap {
  padding: var(--section-padding-y) 0;
}
.section__header:not(:last-child) {
  margin-bottom: 1.25rem;
}
.section__body:not(:last-child) {
  margin-bottom: 2rem;
}
.section__body > *:not(:last-child) {
  margin-bottom: 1rem;
}
.section__btn-box {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

/* ========== Section Hero ========== */
.hero {
  --hero-padding-y: 3rem;
}
.hero__wrap {
  padding: var(--hero-padding-y) 0;
}
.hero__header {
  --mb: 1rem;
}
.hero__header:not(:last-child) {
  margin-bottom: var(--mb);
}
.hero__body {
  --mb: 1.5rem;
}
.hero__body:not(:last-child) {
  margin-bottom: var(--mb);
}
.hero__btn-box {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

/* Section Log In */
.section-login {
  --section-padding-y: 1.5rem;
}
.section-login__wrap {
  padding: var(--section-padding-y) 0;
}
@media (min-width: 56.25rem) {
  .section-login__wrap {
    display: flex;
    flex-direction: column;
    min-height: 100svh;
  }
}
.section-login__row {
  --col-width: 100%;
  --col-gap: 1rem;
  display: flex;
  /*flex: 1 1 auto;*/
  flex-wrap: wrap;
  gap: var(--col-gap) 0;
  margin: 0 calc(var(--col-gap) / 2 * -1);
}
@media (min-width: 56.25rem) {
  .section-login__row {
    --col-width: 50%;
    --col-gap: 1.25rem;
  }
}
.section-login__col {
  flex: 0 0 var(--col-width);
  max-width: var(--col-width);
  padding: 0 calc(var(--col-gap) / 2);
}
.section-login__img {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 2rem;
  min-height: 100%;
  /*padding: 1.125rem;*/
  /*background: linear-gradient(238deg, #e8dfd6 9.52%, #f7f5f1 98%);*/
}
.section-login__img img {
  width: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.section-login__form {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 100%;
}

/* Log In Form */
.login-form {
  --form-border-radius: 2rem;
  --form-padding-x: 3.75rem;
  --form-padding-y: 3.75rem;
  --form-bg-color: var(--color-white);
  --form-text-color: var(--color-black-washed);
  overflow: hidden;
  border-radius: var(--form-border-radius);
  padding: var(--form-padding-y) var(--form-padding-x);
  background-color: var(--form-bg-color);
  color: var(--form-text-color);
}
@media (max-width: 55.25rem) {
  .login-form {
    --form-padding-x: 3rem;
    --form-padding-y: 3rem;
  }
}
.login-form__title {
  --mb: 0.375rem;
  font-size: 2rem;
  font-weight: 600;
}
.login-form__title:not(:last-child) {
  margin-bottom: var(--mb);
}
.login-form__subtitle {
  --mb: 2rem;
  font-size: 1rem;
  font-weight: var(--body-font-weight);
  line-height: var(--body-line-height);
  color: var(--color-gray-lucky);
}
.login-form__subtitle:not(:last-child) {
  margin-bottom: var(--mb);
}
.login-form__groups {
  --mb: 1.5rem;
}
.login-form__groups:not(:last-child) {
  margin-bottom: var(--mb);
}
.login-form__group {
  --mb: 1rem;
}
.login-form__group:not(:last-child) {
  margin-bottom: var(--mb);
}
.login-form__label {
  --mb: 0.75rem;
}
.login-form__label:not(:last-child) {
  margin-bottom: var(--mb);
}
.login-form__input {
  --mb: 0.75rem;
}
.login-form__input:not(:last-child) {
  margin-bottom: var(--mb);
}
.login-form__change-password {
  --mb: 2rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  font-size: 0.875rem;
  font-weight: var(--body-font-weight);
  line-height: 1.2;
  color: var(--color-gray-lucky);
}
.login-form__change-password a {
  position: relative;
  padding-bottom: 0.125rem;
  font-weight: 500;
  color: var(--color-primary);
}
@media (any-hover: hover) {
  .login-form__change-password a:hover::after {
    left: 50%;
    right: 50%;
  }
}
.login-form__change-password a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 0.125rem;
  height: 0.125rem;
  background-color: currentcolor;
  transition: left var(--transition-duration), right var(--transition-duration);
}
.login-form__change-password:not(:last-child) {
  margin-bottom: var(--mb);
}
.login-form__btn {
  vertical-align: top;
  width: 100%;
    opacity: 0.7;
}
.login-form__btn:hover {
    opacity: 1;
}

/* Section Subjects */
.section-subjects {
  --section-padding-y: 1.5rem;
  --section-space-y: 1.5rem;
}
.section-subjects__wrap {
  padding: var(--section-padding-y) 0;
}
.section-subjects__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1.5rem;
}
.section-subjects__header:not(:last-child) {
  margin-bottom: var(--section-space-y);
}
.section-subjects__title {
  flex: 1 1 auto;
  min-width: 0;
  display: block;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.section-subjects__progress-bar {
  flex: 0 0 50%;
}
.section-subjects__cards {
  --cards-cols: 4;
  --cards-gap: 1rem;
  display: grid;
  gap: var(--cards-gap);
  grid-template-columns: repeat(var(--cards-cols), 1fr);
}
.section-subjects__cards li a {
    width: 100%;
    height: 100%;
}
@media (max-width: 55.25rem) {
  .section-subjects__cards {
    --cards-cols: 3;
  }
}
@media (max-width: 47rem) {
  .section-subjects__cards {
    --cards-cols: 2;
  }
}
@media (max-width: 29rem) {
  .section-subjects__cards {
    --cards-cols: 1;
  }
}
.section-subjects__cards:not(:last-child) {
  margin-bottom: var(--section-space-y);
}
.section-subjects__cards > li .subject-card {
  min-height: 100%;
}
.section-subjects__scroll-container {
 /* overflow: hidden auto;
  max-height: calc(100svh - var(--header-height) - var(--section-padding-y) * 2 - var(--section-space-y) - 2rem);*/
    overflow: initial!important;
    height: 100% !important;
    max-height: none !important;
  padding-right: 1.25rem;
}
.section-subjects__control-task-card:not(:last-child) {
  margin-bottom: var(--section-space-y);
}
.section-subjects__lessons {
  --list-space-y: 0.75rem;
}
.section-subjects__lessons > li:not(:last-child) {
  margin-bottom: var(--list-space-y);
}

/* Section Students */
.section-students {
  --section-padding-y: 1.5rem;
}
.section-students__wrap {
  padding: var(--section-padding-y) 0;
}
.section-students__header {
  display: flex;
    flex-direction: column;
}
.section-students__header:not(:last-child) {
  margin-bottom: var(--mb);
}
.section-students__title {
  flex: 1 1 auto;
  min-width: 0;
  display: block;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.section-students__select-wrap .select {
    padding: 24px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.section-students__select-wrap .select .choices {
    width: 47%;
}
.section-students__scroll-container {
  /*overflow: hidden auto;
  max-height: calc(100svh - var(--header-height) - var(--section-padding-y) * 2 - 8rem);*/
    overflow: initial!important;
    height: 100% !important;
    max-height: none !important;
  padding-right: 0.5rem;
}
.section-students__list {
  --list-space-y: 0.75rem;
}
.section-students__list > li:not(:last-child) {
  margin-bottom: var(--list-space-y);
}

/* Section Student Details */
.section-student-details {
  --section-padding-y: 1.5rem;
  --section-space-y: 1.5rem;
}
.section-student-details__wrap {
  padding: var(--section-padding-y) 0;
}
.section-student-details__header {
  display: flex;
  align-items: center;
  gap: 0.75rem 1.5rem;
}
.section-student-details__header:not(:last-child) {
  margin-bottom: var(--section-space-y);
}
.section-student-details__title {
  flex: 1 1 auto;
  min-width: 0;
  display: block;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.section-student-details__btn {
  margin-left: auto;
  min-width: 8.75rem;
}
.section-student-details__scroll-container {
 /* overflow: hidden auto;
  max-height: calc(100svh - var(--header-height) - var(--section-padding-y) * 2 - 4rem);*/
    overflow: initial!important;
    height: 100% !important;
    max-height: none !important;
  padding-right: 0.5rem;
}

/* Section Student Lesson */
.section-student-lesson {
  --section-padding-y: 1.5rem;
  --section-space-y: 1.5rem;
}
.section-student-lesson._details-view._done-view .section-student-lesson__quiz-fixed-panel {
  opacity: 1;
  transform: translateY(0%);
}
.section-student-lesson._details-view._done-view .section-student-lesson__quiz-fixed-panel .btn[data-modal-target] {
  display: inline-flex;
}
.section-student-lesson._details-view._done-view .section-student-lesson__quiz-fixed-panel .btn[data-page-target] {
  display: none;
}
@media (max-width: 55.25rem) {
  .section-student-lesson._details-view .section-student-lesson__header--default {
    display: none;
  }
}
@media (max-width: 55.25rem) {
  .section-student-lesson._details-view .section-student-lesson__header--details {
    display: flex;
  }
}
.section-student-lesson._details-view .section-student-lesson__quiz-fixed-panel {
  opacity: 0;
  transform: translateY(100%);
}
.section-student-lesson._done-view .section-student-lesson__quiz-fixed-panel {
  opacity: 1;
  transform: translateY(0);
}
.section-student-lesson._done-view .section-student-lesson__quiz-fixed-panel .btn[data-modal-target] {
    display: inline-flex;
}
.section-student-lesson__wrap {
  padding: var(--section-padding-y) 0 4rem;
}
.section-student-lesson__header {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.section-student-lesson__header--details {
  display: none;
}
.section-student-lesson__header:not(:last-child) {
  margin-bottom: var(--section-space-y);
}
.section-student-lesson__title {
  flex: 1 1 auto;
  min-width: 0;
}
.section-student-lesson__row {
  --col-width: 100%;
  --col-gap: 1.25rem;
  display: flex;
  flex-wrap: wrap;
  gap: var(--col-gap) 0;
  margin: 0 calc(var(--col-gap) / 2 * -1);
}
@media (min-width: 59.375rem) {
  .section-student-lesson__row {
    --col-width: 50%;
  }
}
.section-student-lesson__col {
  flex: 0 0 var(--col-width);
  max-width: var(--col-width);
  padding: 0 calc(var(--col-gap) / 2);
}
@media (max-width: 55.25rem) {
  .section-student-lesson__col[data-page-state] {
    display: none;
  }
}
@media (max-width: 55.25rem) {
  .section-student-lesson__col[data-page-state]._active {
    display: block;
  }
}
.section-student-lesson__quiz-card {
  min-height: 100%;
}
.section-student-lesson__quiz-fixed-panel {
  position: fixed;
  z-index: 999;
  left: 0;
  bottom: 0;
  width: 100%;
  transition: opacity var(--transition-duration), transform var(--transition-duration);
}

@media (min-width: 56.25rem) {
  .section-student-lesson__quiz-fixed-panel .btn {
    display: none;
  }
}
.section-student-lesson.none_test .section-student-lesson__quiz-fixed-panel .btn {
    display: inline-flex;
}
.section-student-lesson__quiz-fixed-panel .btn[data-modal-target] {
  display: none;
}
.lesson-card__grade {
    --font-size: 1.25rem;
    font-size: var(--font-size);
    font-weight: 600;
    font-family: var(--display-font-family);
    line-height: var(--display-line-height);
    color: var(--color-green-spearmint);
}
/* ========== CARD ========== */
.card {
  --card-text-padding-x: 0.5rem;
  --card-text-padding-y: 1rem;
}
.card__img {
  position: relative;
  display: block;
  overflow: hidden;
  padding-bottom: 56%;
}
.card__img img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.card__text {
  padding: var(--card-text-padding-y) var(--card-text-padding-x);
}
.card__title:not(:last-child) {
  margin-bottom: 0.5rem;
}

/* Subject Card */
.subject-card {
  --card-border-width: 0.125rem;
  --card-border-color: var(--color-white-snowflake);
  --card-border-radius: 2rem;
  --card-padding-x: 1.125rem;
  --card-padding-y: 1.125rem;
  --card-bg-color: var(--color-white);
  --card-text-color: var(--color-black-carbon-fiber);
  display: flex;
  overflow: hidden;
  border: var(--card-border-width) solid var(--card-border-color);
  border-radius: var(--card-border-radius);
  background-color: var(--card-bg-color);
  color: var(--card-text-color);
}
.subject-card__inner {
  flex: 1 1 auto;
  padding: var(--card-padding-y) var(--card-padding-x);
}
@media (any-hover: hover) {
  .subject-card__inner:hover .subject-card__title {
    color: var(--color-primary);
  }
}
.subject-card__img {
  --mb: 1rem;
  position: relative;
  overflow: hidden;
  border-radius: 1.5rem;
  padding-bottom: 71.3043478261%;
  background-color: var(--color-white-doctor);
  aspect-ratio: 230/164;
}
.subject-card__img:not(:last-child) {
  margin-bottom: var(--mb);
}
.subject-card__img img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.subject-card__title {
  font-size: 1.25rem;
  font-weight: 600;
  line-height: var(--display-line-height);
  transition: color var(--transition-duration);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Control Task Card */
.control-task-card {
  --card-border-width: 0.125rem;
  --card-border-color: var(--color-white-arctic-cotton);
  --card-border-radius: 2rem;
  --card-padding-x: 1.125rem;
  --card-padding-y: 1.125rem;
  --card-box-shadow: 0 0.25rem 0 0 var(--color-white-arctic-cotton);
  --card-bg-color: var(--color-white-morning-snow);
  overflow: hidden;
  border: var(--card-border-width) solid var(--card-border-color);
  border-radius: var(--card-border-radius);
  padding: var(--card-padding-y) var(--card-padding-x);
  background-color: var(--card-bg-color);
  box-shadow: var(--card-box-shadow);
}
.control-task-card__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}
.control-task-card__btn {
  min-width: 6.25rem;
}

/* Lesson Card */
.lesson-card {
  --card-border-width: 0.125rem;
  --card-border-color: var(--color-white-snowflake);
  --card-border-radius: 2rem;
  --card-padding-x: 1.125rem;
  --card-padding-y: 1.125rem;
  --card-bg-color: var(--color-white);
  --card-text-color: var(--color-black-carbon-fiber);
  --card-index-size: 1.5rem;
  --card-box-shadow: 0 0.25rem 0 0 var(--color-white-snowflake);
  display: block;
  overflow: hidden;
  border: var(--card-border-width) solid var(--card-border-color);
  border-radius: var(--card-border-radius);
  padding: var(--card-padding-y) var(--card-padding-x);
  background-color: var(--card-bg-color);
  box-shadow: var(--card-box-shadow);
  color: var(--card-text-color);
}
.lesson-card__row {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.lesson-card__index {
  align-self: flex-start;
}
.lesson-card__content {
  flex: 1 1 auto;
}
.lesson-card__title {
  --mb: 0.7375rem;
}
.lesson-card__title:not(:last-child) {
  margin-bottom: var(--mb);
}
.lesson-card__btn {
  min-width: 6.25rem;
}

/* Student Card */
.student-card {
  --card-border-width: 0.125rem;
  --card-border-color: var(--color-white-snowflake);
  --card-border-radius: 2rem;
  --card-padding-x: 1.125rem;
  --card-padding-y: 1.125rem;
  --card-bg-color: var(--color-white);
  --card-text-color: var(--color-black-carbon-fiber);
  --card-shadow: 0 0.25rem 0 0 var(--color-white-snowflake);
  --card-row-gap: 1rem;
  --card-btn-width: 6.25rem;
  overflow: hidden;
  border: var(--card-border-width) solid var(--card-border-color);
  border-radius: var(--card-border-radius);
  padding: var(--card-padding-y) var(--card-padding-x);
  background-color: var(--card-bg-color);
  box-shadow: var(--card-shadow);
  color: var(--color-text-color);
}
.student-card__row {
  display: flex;
  align-items: center;
  gap: var(--card-row-gap);
}
.student-card__name {
  flex: 1 1 auto;
  min-width: 0;
}
.student-card__btn {
  min-width: var(--card-btn-width);
}

/* stylelint-disable @stylistic/max-line-length */
/* Quiz Card */
.quiz-card {
  --quiz-card-border-width: 0.125rem;
  --quiz-card-border-color: var(--color-white-snowflake);
  --quiz-card-border-radius: var(--border-radius-32);
  --quiz-card-padding-top: 2rem;
  --quiz-card-padding-x: 2rem;
  --quiz-card-padding-bottom: 1.25rem;
  --quiz-card-bg-color: var(--color-white-morning-snow);
  --quiz-card-scroll-height: calc(100svh - var(--header-height) - var(--section-padding-y) * 2 - var(--section-space-y) - 2.25rem - var(--quiz-card-padding-top) - var(--quiz-card-padding-bottom));
  overflow: hidden;
  border: var(--quiz-card-border-width) solid var(--quiz-card-border-color);
  border-radius: var(--quiz-card-border-radius);
  padding: var(--quiz-card-padding-top) var(--quiz-card-padding-x) var(--quiz-card-padding-bottom);
  padding-right: calc(var(--quiz-card-padding-x) / 2);
  background: var(--quiz-card-bg-color);
}
.quiz-card__scroll-container {
  display: flex;
  flex-direction: column;
  overflow: hidden auto;
  height: var(--quiz-card-scroll-height);
  max-height: var(--quiz-card-scroll-height);
  padding-right: calc(var(--quiz-card-padding-x) / 2);
}
.quiz-card__preheader {
  --mb: 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
@media (min-width: 56.25rem) {
  .quiz-card__preheader {
    display: none;
  }
}
.quiz-card__preheader:not(:last-child) {
  margin-bottom: var(--mb);
}
.quiz-card__title {
  flex: 1 1 auto;
  min-width: 0;
  text-align: center;
}
.quiz-card__header {
  --mb: 1.5rem;
}
.quiz-card__header:not(:last-child) {
  margin-bottom: var(--mb);
}
.quiz-card__body {
  --mb: 3rem;
  flex: 1 1 auto;
}
.quiz-card__body:not(:last-child) {
  margin-bottom: var(--mb);
}
.quiz-card__footer {
  padding-bottom: 0.375rem;
}
.quiz-card__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}

/* Quiz Answer Btn */
.quiz-answer-btn {
  --btn-border-width: 0.125rem;
  --btn-border-radius: var(--border-radius-20);
  --btn-min-height: 3rem;
  --btn-font-size: 0.875rem;
  --btn-font-weight: 500;
  --btn-line-height: 1.2;
  --btn-border-color: var(--color-white);
  --btn-bg-color: var(--color-white);
  --btn-text-color: var(--color-black-carbon-fiber);
  --btn-border-color-hover: var(--color-info);
  --btn-bg-color-hover: var(--color-info);
  --btn-text-color-hover: var(--color-white);
  --btn-border-color-active: var(--color-info);
  --btn-bg-color-active: var(--color-info);
  --btn-text-color-active: var(--color-white);
  border: var(--btn-border-width) solid var(--btn-border-color);
  border-radius: var(--btn-border-radius);
  min-height: var(--btn-min-height);
  background-color: var(--btn-bg-color);
  font-size: var(--btn-font-size);
  font-weight: var(--btn-font-weight);
  line-height: var(--btn-line-height);
  color: var(--btn-text-color);
  transition: border-color var(--transition-duration), background-color var(--transition-duration), color var(--transition-duration);
  display: block;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.quiz-answer-btn._active {
  border-color: var(--color-green-clover-brook);
  background-color: var(--color-green-clover-brook);
  color: var(--btn-text-color-active);
}
.quiz-answer-btn--error {
  --btn-border-color: var(--color-danger);
  --btn-bg-color: var(--color-danger);
  --btn-text-color: var(--color-white);
}
.quiz-answer-btn:not(:disabled) {
  cursor: pointer;
}
@media (any-hover: hover) {
  .quiz-answer-btn:not(:disabled):not(.quiz-answer-btn--error):hover {
    border-color: var(--btn-border-color-hover);
    background-color: var(--btn-bg-color-hover);
    color: var(--btn-text-color-hover);
  }
}

/* Quiz Nav Btn */
.quiz-nav-btn {
  --btn-border-radius: 6.25rem;
  --btn-gap: 0.75rem;
  --btn-padding-y: 0.75rem;
  --btn-padding-x: 1.75rem;
  --btn-font-size: 0.875rem;
  --btn-font-weight: 600;
  --btn-line-height: 1.2;
  --btn-box-shadow: 0 0.25rem 0 0 var(--color-gray-fog-beacon);
  --btn-bg-color: var(--color-white-arctic-cotton);
  --btn-text-color: var(--color-gray-lucky);
  display: flex;
  align-items: center;
  gap: var(--btn-gap);
  border: none;
  border-radius: var(--btn-border-radius);
  padding: var(--btn-padding-y) var(--btn-padding-x);
  background-color: var(--btn-bg-color);
  box-shadow: var(--btn-box-shadow);
  font-size: var(--btn-font-size);
  font-weight: var(--btn-font-weight);
  line-height: var(--btn-line-height);
  color: var(--btn-text-color);
  transition: opacity var(--transition-duration), background-color var(--transition-duration), color var(--transition-duration);
}
.quiz-nav-btn:disabled {
  opacity: 0.35;
}
.quiz-nav-btn:not(:disabled) {
  cursor: pointer;
}
@media (any-hover: hover) {
  .quiz-nav-btn:not(:disabled):hover {
    --btn-bg-color: var(--color-gray-lucky);
    --btn-text-color: var(--color-white-arctic-cotton);
  }
  .quiz-nav-btn:not(:disabled):hover .quiz-nav-btn__arrow {
    background-color: var(--color-white-arctic-cotton);
    color: var(--color-gray-lucky);
  }
}
.quiz-nav-btn__arrow {
  --arrow-size: 1.5rem;
  display: flex;
  flex: 0 0 var(--arrow-size);
  align-items: center;
  justify-content: center;
  border-radius: var(--arrow-size);
  width: var(--arrow-size);
  height: var(--arrow-size);
  background-color: var(--color-gray-lucky);
  font-size: calc(var(--arrow-size) * 0.5);
  font-weight: 400;
  line-height: 1;
  color: var(--color-white-arctic-cotton);
  transition: background-color var(--transition-duration), color var(--transition-duration);
}

/* Quiz Progress */
.quiz-progress__header {
  --mb: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}
.quiz-progress__header:not(:last-child) {
  margin-bottom: var(--mb);
}
.quiz-progress__title {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: var(--display-line-height);
}
.quiz-progress__pagination {
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.2;
  color: rgba(45, 48, 45, 0.2);
}
.quiz-progress__steps {
  display: flex;
  gap: 0.25rem;
}
.quiz-progress__step {
  flex: 1 1 auto;
  overflow: hidden;
  border-radius: 0.625rem;
  height: 0.625rem;
  background-color: var(--color-white-arctic-cotton);
  transition: background-color var(--transition-duration);
}
.quiz-progress__step[data-step-active] {
  background-color: var(--color-primary);
}
.quiz-progress__step--success {
  background-color: var(--color-success);
}
.quiz-progress__step--error {
  background-color: var(--color-danger);
}

/* Quiz Fixed Panel */
.quiz-fixed-panel {
  --panel-padding-x: 1rem;
  --panel-padding-y: 1rem;
  overflow: hidden;
  border-radius: var(--border-radius-32) var(--border-radius-32) 0 0;
  padding: var(--panel-padding-y) var(--panel-padding-x);
  background-color: var(--color-white);
  box-shadow: 0 0.25rem 0 0.375rem var(--color-white-snowflake);
  text-align: center;
}
.quiz-fixed-panel__btn {
  --button-height: 2.75rem;
  --button-font-size: 0.875rem;
  min-width: 22.625rem;
}

/* Quiz Question Block */
.quiz-question-block[data-stepper-step] {
  display: none;
}
.quiz-question-block[data-stepper-step]._active {
  display: block;
}
.quiz-question-block__img-wrap {
  --mb: 1.5rem;
  margin: 0 auto;
  max-width: 22.6875rem;
}
.quiz-question-block__img-wrap:not(:last-child) {
  margin-bottom: var(--mb);
}
.quiz-question-block__img {
  position: relative;
  overflow: hidden;
  border: 0.0625rem solid var(--color-white-snowflake);
  border-radius: 1rem;
  padding-bottom: 54.5454545455%;
  background-color: var(--color-white);
}
.quiz-question-block__img img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.quiz-question-block__question {
  --quiz-card-question-font-size: 1.25rem;
  --quiz-card-question-font-weight: 600;
  --quiz-card-question-line-height: var(--display-line-height);
  --quiz-card-question-mb: 1.5rem;
  font-size: var(--quiz-card-question-font-size);
  font-weight: var(--quiz-card-question-font-weight);
  line-height: var(--quiz-card-question-line-height);
}
.quiz-question-block__question:not(:last-child) {
  margin-bottom: var(--quiz-card-question-mb);
}
.quiz-question-block__answers {
  --quiz-card-answers-gap: 0.75rem;
  --quiz-card-answers-cols: 2;
  display: grid;
  gap: var(--quiz-card-answers-gap);
  grid-template-columns: repeat(var(--quiz-card-answers-cols), 1fr);
}
.quiz-question-block__answers > li > button {
  vertical-align: top;
  width: 100%;
}

/* Grades Table */
.grades-table {
  --table-border-radius: 2rem;
  --table-border-width: 0.125rem;
  --table-border-color: var(--color-white-snowflake);
  --table-padding-x: 1.375rem;
  --table-padding-y: 1.375rem;
  --table-bg-color: var(--color-white);
  --table-box-shadow: 0 0.25rem 0 0 var(--color-white-snowflake);
  --table-th-padding-x: 1rem;
  --table-th-padding-y: 1rem;
  --table-td-padding-x: 1rem;
  --table-td-padding-y: 1rem;
  overflow: hidden;
  border: var(--table-border-width) solid var(--table-border-color);
  border-radius: var(--table-border-radius);
  padding: var(--table-padding-y) var(--table-padding-x);
  background-color: var(--table-bg-color);
  box-shadow: var(--table-box-shadow);
}
.grades-table__work-type {
  color: var(--color-gray-lucky);
}
.grades-table__date {
  color: var(--color-gray-ancestral-water);
}
.grades-table__sort-btn {
  position: relative;
  display: flex;
  align-items: center;
  border: none;
  background: none;
  font-weight: inherit;
  line-height: inherit;
  color: inherit;
}
.grades-table__sort-btn[data-dir=desc] .grades-table__chev-up {
  opacity: 0.35;
}
.grades-table__sort-btn[data-dir=asc] .grades-table__chev-down {
  opacity: 0.35;
}
.grades-table__sort-btn:not(:disabled) {
  cursor: pointer;
}
.grades-table__sort-icons {
  display: inline-flex;
  flex-direction: column;
  padding: 0.125rem 0.25rem;
  font-size: 0.5rem;
  font-weight: 400;
  line-height: 1;
}
.grades-table table {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.2;
}
.grades-table table th {
  padding: var(--table-th-padding-y) var(--table-th-padding-x);
  background-color: var(--color-white-morning-snow);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.2;
  text-align: left;
}
.grades-table table th:first-child {
  border-top-left-radius: 1rem;
  border-bottom-left-radius: 1rem;
}
.grades-table table th:last-child {
  border-top-right-radius: 1rem;
  border-bottom-right-radius: 1rem;
}
.grades-table table td {
  padding: var(--table-td-padding-y) var(--table-td-padding-x);
}
.grades-table table tbody tr:not(:last-child) td {
  border-bottom: 0.0625rem solid var(--color-white-morning-snow);
}

/* Status Badge */
.status {
  --status-border-radius: 0.5rem;
  --status-height: 1.5rem;
  --status-padding-x: 1rem;
  --status-padding-y: 0.25rem;
  --status-font-size: 0.75rem;
  --status-font-weight: 600;
  --status-line-height: 1.2;
  --status-bg-color: var(--color-gray-cold-morning);
  --status-text-color: var(--color-black);
  display: inline-flex;
  align-items: center;
  border-radius: var(--status-border-radius);
  min-height: var(--status-height);
  padding: var(--status-padding-y) var(--status-padding-x);
  background-color: var(--status-bg-color);
  font-size: var(--status-font-size);
  font-weight: var(--status-font-weight);
  line-height: var(--status-line-height);
  color: var(--status-text-color);
}
.status[data-status=done] {
  --status-bg-color: var(--color-green-spearmint);
  --status-text-color: var(--color-white);
}
.status[data-status=ongoing] {
  --status-bg-color: var(--color-purple-lilac-geode);
  --status-text-color: var(--color-white);
}
.status[data-status=unstarted] {
  --status-bg-color: var(--color-gray-cold-morning);
  --status-text-color: var(--color-white);
}

/* Progress Bar */
.progress-bar {
  --progress-gap: 1rem;
  --progress-font-size: 0.875rem;
  --progress-font-weight: 600;
  --progress-line-height: 1;
  --progress-width: 0%;
  --progress-bar-height: 0.375rem;
  --progress-bar-border-radius: 0.375rem;
  --progress-bar-fill: var(--color-primary);
  --progress-bar-bg-color: var(--color-white-arctic-cotton);
  display: flex;
  align-items: center;
  gap: var(--progress-gap);
  font-size: var(--progress-font-size);
  font-weight: var(--progress-font-weight);
  line-height: var(--progress-line-height);
}
.progress-bar__bar {
  position: relative;
  flex: 1 1 auto;
  overflow: hidden;
  border-radius: var(--progress-bar-border-radius);
  height: var(--progress-bar-height);
  background-color: var(--progress-bar-bg-color);
}
.progress-bar__bar::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: var(--progress-width);
  height: 100%;
  background-color: var(--progress-bar-fill);
  transition: width 0.3s ease;
}

/* ---------- User Quick ---------- */
.user-quick {
  --control-border-width: 0.0625rem;
  --control-border-color: #ddd;
  --control-border-radius: 0.25rem;
  --control-toggle-border-color: var(--control-border-color);
  --control-toggle-padding-x: 1rem;
  --control-toggle-padding-y: 0.5rem;
  --control-toggle-bg-color: #f9f9f9;
  --control-popup-border-color: var(--control-border-color);
  --control-popup-bg-color: #fff;
  --control-popup-shadow: 0 0.25rem 1rem rgb(0 0 0 / 5%);
  position: relative;
  display: inline-block;
}
.user-quick._open .user-quick__popup {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
.user-quick__popup {
  position: absolute;
  z-index: 99;
  right: 0;
  top: calc(100% + 0.25rem);
  min-width: 15.125rem;
  transition: opacity var(--transition-duration), visibility var(--transition-duration), transform var(--transition-duration);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.user-quick-toggle {
  display: block;
  border: none;
  background: none;
  text-align: left;
  color: inherit;
}
.user-quick-toggle:not(:disabled) {
  cursor: pointer;
}
.user-quick-toggle__row {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.user-quick-toggle__img {
  --img-size: 2.125rem;
  flex: 0 0 var(--img-size);
  overflow: hidden;
  border-radius: var(--img-size);
  width: var(--img-size);
  height: var(--img-size);
  min-width: var(--img-size);
  background-color: var(--color-gray-orochimaru);
}
.user-quick-toggle__img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.user-quick-toggle__name {
  --mb: 0.375rem;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1;
}
.user-quick-toggle__name:not(:last-child) {
  margin-bottom: var(--mb);
}
.user-quick-toggle__level {
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1;
  color: rgba(255, 255, 255, 0.7);
}

.user-quick-card {
  --card-border-radius: 1rem;
  --card-border-width: 0.125rem;
  --card-border-color: var(--color-white-arctic-cotton);
  --card-padding-x: 1.25rem;
  --card-padding-y: 1.25rem;
  --card-bg-color: var(--color-white-doctor);
  --card-text-color: var(--color-black-carbon-fiber);
  overflow: hidden;
  border: var(--card-border-width) solid var(--card-border-color);
  border-radius: var(--card-border-radius);
  padding: var(--card-padding-y) var(--card-padding-x);
  background-color: var(--card-bg-color);
  text-align: center;
  color: var(--card-text-color);
}
.user-quick-card__img {
  --img-mb: 0.75rem;
  --img-size: 4.625rem;
  flex: 0 0 var(--img-size);
  overflow: hidden;
  margin: 0 auto;
  border-radius: var(--img-size);
  width: var(--img-size);
  height: var(--img-size);
}
.user-quick-card__img:not(:last-child) {
  margin-bottom: var(--img-mb);
}
.user-quick-card__img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.user-quick-card__name {
  --mb: 0.375rem;
}
.user-quick-card__name:not(:last-child) {
  margin-bottom: var(--mb);
}
.user-quick-card__level {
  --mb: 1rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1;
  color: var(--color-gray-lucky);
}
.user-quick-card__level:not(:last-child) {
  margin-bottom: var(--mb);
}
.user-quick-card__rating {
  --mb: 1.25rem;
}
.user-quick-card__rating:not(:last-child) {
  margin-bottom: var(--mb);
}
.user-quick-card__btn {
  width: 100%;
}

.user-quick-rating {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
}
.user-quick-rating__num {
  min-width: 4ch;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.2;
  text-transform: uppercase;
  color: var(--color-primary);
}
.user-quick-rating__star {
  --size: 2.875rem;
  display: flex;
  flex: 0 0 var(--size);
  align-items: center;
  justify-content: center;
  border: 0.0625rem solid var(--color-white-arctic-cotton);
  border-radius: 1rem;
  width: var(--size);
  height: var(--size);
  font-size: calc(var(--size) * 0.4);
  font-weight: 400;
  line-height: 1;
  color: var(--color-orange-dwarven-peaches);
}
.user-quick-rating__label {
  flex: 0 0 100%;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.2;
  color: var(--color-gray-lucky);
}

/* Score Badge */
.score-badge {
  --badge-color: var(--color-green-spearmint);
  --badge-border-width: 0.125rem;
  --badge-radius: 1rem;
  --badge-padding: 0.5rem;
  --badge-min-width: 5ch;
  --badge-font-size: 1rem;
  --badge-font-weight: 500;
  --badge-line-height: 1;
  --badge-text-align: center;
  display: inline-block;
  border: var(--badge-border-width) solid currentcolor;
  border-radius: var(--badge-radius);
  min-width: var(--badge-min-width);
  padding: var(--badge-padding);
  font-size: var(--badge-font-size);
  font-weight: var(--badge-font-weight);
  line-height: var(--badge-line-height);
  text-align: var(--badge-text-align);
  color: var(--badge-color);
}
.score-badge--error {
  --badge-color: var(--color-red-georgia-peach);
}
.score-badge--info {
  --badge-color: var(--color-purple-lilac-geode);
}

/* Card Index */
.card-index {
  --card-index-size: 1.5rem;
  display: flex;
  flex: 0 0 var(--card-index-size);
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: var(--card-index-size);
  width: var(--card-index-size);
  height: var(--card-index-size);
  background-color: var(--color-orange-dwarven-peaches);
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1;
  color: var(--color-white);
}

/* Back Link */
.back-link {
  --link-size: 1.75rem;
  display: inline-flex;
  flex: 0 0 var(--link-size);
  align-items: center;
  justify-content: center;
  width: var(--link-size);
  height: var(--link-size);
  font-size: calc(var(--link-size) * 0.5);
  font-weight: 400;
  line-height: 1;
  transition: color var(--transition-duration);
}
@media (any-hover: hover) {
  .back-link:hover {
    color: var(--color-primary);
  }
}

/* stylelint-disable @stylistic/max-line-length */
/* PDF View */
.pdf-view {
  --pdf-view-border-width: 0.125rem;
  --pdf-view-border-color: var(--color-white-snowflake);
  --pdf-view-border-radius: var(--border-radius-32);
  --pdf-view-bg-color: var(--color-white-morning-snow);
  --pdf-view-space-y: 0.5rem;
    /*--pdf-view-scroll-height: calc(100svh - var(--header-height) - var(--section-padding-y) * 2 - var(--section-space-y) - 2.25rem);*/
    --pdf-view-scroll-height: 100%;
  display: block;
  overflow: hidden;
  border: var(--pdf-view-border-width) solid var(--pdf-view-border-color);
  border-radius: var(--pdf-view-border-radius);
  background-color: var(--pdf-view-bg-color);
}
.pdf-view__scroll-container {
  overflow: hidden auto;
  height: var(--pdf-view-scroll-height);
  max-height: var(--pdf-view-scroll-height);
}
.pdf-view__content > *:not(:last-child) {
  margin-bottom: var(--pdf-view-space-y);
}
.pdf-view__content img {
  vertical-align: top;
  width: 100%;
  object-fit: contain;
}

/* Icon Link */
.icon-link {
  --link-size: 2.25rem;
  display: inline-flex;
  flex: 0 0 var(--link-size);
  align-items: center;
  justify-content: center;
  border: 0.125rem solid currentcolor;
  border-radius: var(--link-size);
  width: var(--link-size);
  height: var(--link-size);
  color: var(--color-gray-praise-giving);
  transition: border-color var(--transition-duration), color var(--transition-duration);
}
@media (any-hover: hover) {
  .icon-link:hover {
    color: var(--color-primary);
  }
}
.icon-link:focus, .icon-link:active {
  color: var(--color-primary);
}

/* Typography */
.text-block {
  --text-space-y: clamp(0.75rem, 0.6rem + 0.75vw, 1.5rem);
}
.text-block ol,
.text-block ul {
  --list-space-y: 0.75rem;
}
.text-block ol li:not(:last-child),
.text-block ul li:not(:last-child) {
  margin-bottom: var(--list-space-y);
}
.text-block ul {
  list-style: disc outside;
  padding-left: 1.25rem;
}
.text-block strong,
.text-block b {
  font-weight: 700;
}
.text-block em,
.text-block i {
  font-style: italic;
}
.text-block mark {
  background-color: var(--color-primary);
  color: var(--color-white);
}
.text-block del {
  background-color: #fbb;
  text-decoration: line-through;
}
.text-block ins {
  background-color: #d4fcbc;
  text-decoration: none;
}
.text-block blockquote {
  border-left: 0.125rem solid var(--color-primary);
  padding-left: 1rem;
}
.text-block > *:not(:last-child) {
  margin-bottom: var(--text-space-y);
}

a[x-apple-data-detectors] {
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  text-decoration: none !important;
  color: inherit !important;
}

a:not(.menu__btn, .input__toggle, .modal__close-btn)[aria-label],
button:not(.menu__btn, .input__toggle, .modal__close-btn)[aria-label] {
  position: relative;
}
a:not(.menu__btn, .input__toggle, .modal__close-btn)[aria-label]::after,
button:not(.menu__btn, .input__toggle, .modal__close-btn)[aria-label]::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  width: 2.75rem;
  height: 2.75rem;
}

picture {
  display: inline-block;
}
picture img {
  vertical-align: middle;
}

code {
  border: 0.0625rem dashed #999;
  border-radius: 0.2rem;
  padding: 0.1rem 0.3rem 0.2rem;
  background: #fff3f4;
  box-decoration-break: clone;
  word-wrap: break-word;
}

h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
  font-family: var(--display-font-family);
  font-weight: var(--display-font-weight);
  line-height: var(--display-line-height);
}

h1,
.h1 {
  --font-size: 2rem;
  font-size: var(--font-size);
}

h2,
.h2 {
  --font-size: 1.5rem;
  font-size: var(--font-size);
}

h3,
.h3 {
  --font-size: 1.25rem;
  font-size: var(--font-size);
  font-weight: 600;
}

h4,
.h4 {
  --font-size: 1.25rem;
  font-size: var(--font-size);
}
@media (max-width: 55.25rem) {
  h4,
  .h4 {
    --font-size: 1.125rem;
  }
}

h5,
.h5 {
  --font-size: 1rem;
  font-size: var(--font-size);
}

h6,
.h6 {
  --font-size: 0.75rem;
  font-size: var(--font-size);
}

/* stylelint-disable declaration-no-important */
/* ========== GLOBALS ========== */
/* Body */
body {
  background-color: var(--color-white-dr);
  font-family: var(--body-font-family);
  font-size: var(--body-font-size);
  font-weight: var(--body-font-weight);
  line-height: var(--body-line-height);
  color: var(--color-black-carbon-fiber);
}
body:has(.preloader) {
  overflow: hidden;
}

/* Scrollbars */
*::-webkit-scrollbar {
  border-radius: var(--scrollbar-border-radius);
  width: var(--scrollbar-width);
  height: var(--scrollbar-width);
}
*::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-color);
  border-radius: var(--scrollbar-border-radius);
}
*::-webkit-scrollbar-track {
  border-radius: var(--scrollbar-border-radius);
  background: var(--scrollbar-bg-color);
}
* {
  scrollbar-face-color: var(--scrollbar-thumb-color);
  scrollbar-track-color: var(--scrollbar-bg-color);
}

/* Selection */
::selection {
  background-color: var(--color-primary);
  color: var(--color-white);
}

/* Scrolling Target */
:target {
  scroll-margin-top: var(--header-height, 3rem);
}

/* Pages List */
.pages-list {
  --list-space-y: 0.75rem;
  padding-left: 1rem;
}
.pages-list > li:not(:last-child) {
  margin-bottom: var(--list-space-y);
}
.pages-list > li > a,
.pages-list > li > button {
  border: none;
  background: none;
  text-decoration: underline;
  transition: color var(--transition-duration);
}
@media (any-hover: hover) {
  .pages-list > li > a:hover,
  .pages-list > li > button:hover {
    color: var(--color-primary);
  }
  .pages-list > li > a:hover:not(:disabled),
  .pages-list > li > button:hover:not(:disabled) {
    cursor: pointer;
  }
}/* ===============================
=            Choices            =
=============================== */
.choices {
  position: relative;
  overflow: hidden;
  font-size: 1rem;
}
.choices:focus {
  outline: none;
}
.choices:last-child {
  margin-bottom: 0;
}
.choices.is-open {
  overflow: visible;
}
.choices.is-disabled .choices__inner,
.choices.is-disabled .choices__input {
  background-color: #eaeaea;
  cursor: not-allowed;
  -webkit-user-select: none;
          user-select: none;
}
.choices.is-disabled .choices__item {
  cursor: not-allowed;
}
.choices [hidden] {
  display: none !important;
}

.choices[data-type*=select-one] {
  cursor: pointer;
}
.choices[data-type*=select-one] .choices__inner {
  padding-bottom: 0.46875rem;
}
.choices[data-type*=select-one] .choices__input {
  display: block;
  width: 100%;
  padding: 0.625rem;
  border-bottom: 0.0625rem solid #ddd;
  background-color: #fff;
  margin: 0;
}
.choices[data-type*=select-one] .choices__button {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjMDAwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==");
  padding: 0;
  background-size: 0.5rem;
  position: absolute;
  top: 50%;
  right: 0;
  margin-top: -0.625rem;
  margin-right: 1.5625rem;
  height: 1.25rem;
  width: 1.25rem;
  border-radius: 10em;
  opacity: 0.25;
}
.choices[data-type*=select-one] .choices__button:hover, .choices[data-type*=select-one] .choices__button:focus {
  opacity: 1;
}
.choices[data-type*=select-one] .choices__button:focus {
  box-shadow: 0 0 0 0.125rem #005F75;
}
.choices[data-type*=select-one] .choices__item[data-placeholder] .choices__button {
  display: none;
}
.choices[data-type*=select-one]::after {
  content: "";
  height: 0;
  width: 0;
  border-style: solid;
  border-color: #333 transparent transparent transparent;
  border-width: 0.3125rem;
  position: absolute;
  right: 0.71875rem;
  top: 50%;
  margin-top: -0.15625rem;
  pointer-events: none;
}
.choices[data-type*=select-one].is-open::after {
  border-color: transparent transparent #333;
  margin-top: -0.46875rem;
}
.choices[data-type*=select-one][dir=rtl]::after {
  left: 0.71875rem;
  right: auto;
}
.choices[data-type*=select-one][dir=rtl] .choices__button {
  right: auto;
  left: 0;
  margin-left: 1.5625rem;
  margin-right: 0;
}

.choices[data-type*=select-multiple] .choices__inner,
.choices[data-type*=text] .choices__inner {
  cursor: text;
}
.choices[data-type*=select-multiple] .choices__button,
.choices[data-type*=text] .choices__button {
  position: relative;
  display: inline-block;
  margin-top: 0;
  margin-right: -0.25rem;
  margin-bottom: 0;
  margin-left: 0.5rem;
  padding-left: 1rem;
  border-left: 0.0625rem solid #003642;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==");
  background-size: 0.5rem;
  width: 0.5rem;
  line-height: 1;
  opacity: 0.75;
  border-radius: 0;
}
.choices[data-type*=select-multiple] .choices__button:hover, .choices[data-type*=select-multiple] .choices__button:focus,
.choices[data-type*=text] .choices__button:hover,
.choices[data-type*=text] .choices__button:focus {
  opacity: 1;
}

.choices__inner {
  display: inline-block;
  vertical-align: top;
  width: 100%;
  background-color: #f9f9f9;
  padding: 0.46875rem 0.46875rem 0.234375rem;
  border: 0.0625rem solid #ddd;
  border-radius: 0.15625rem;
  font-size: 0.875rem;
  min-height: 2.75rem;
  overflow: hidden;
}
.is-focused .choices__inner, .is-open .choices__inner {
  border-color: #b7b7b7;
}
.is-open .choices__inner {
  border-radius: 0.15625rem 0.15625rem 0 0;
}
.is-flipped.is-open .choices__inner {
  border-radius: 0 0 0.15625rem 0.15625rem;
}

.choices__list {
  margin: 0;
  padding-left: 0;
  list-style: none;
}
.choices__list--single {
  display: inline-block;
  padding: 0.25rem 1rem 0.25rem 0.25rem;
  width: 100%;
}
[dir=rtl] .choices__list--single {
  padding-right: 0.25rem;
  padding-left: 1rem;
}
.choices__list--single .choices__item {
  width: 100%;
}

.choices__list--multiple {
  display: inline;
}
.choices__list--multiple .choices__item {
  display: inline-block;
  vertical-align: middle;
  border-radius: 1.25rem;
  padding: 0.25rem 0.625rem;
  font-size: 0.75rem;
  font-weight: 500;
  margin-right: 0.234375rem;
  margin-bottom: 0.234375rem;
  background-color: #005F75;
  border: 0.0625rem solid #004a5c;
  color: #fff;
  word-break: break-all;
  box-sizing: border-box;
}
.choices__list--multiple .choices__item[data-deletable] {
  padding-right: 0.3125rem;
}
[dir=rtl] .choices__list--multiple .choices__item {
  margin-right: 0;
  margin-left: 0.234375rem;
}
.choices__list--multiple .choices__item.is-highlighted {
  background-color: #004a5c;
  border: 0.0625rem solid #003642;
}
.is-disabled .choices__list--multiple .choices__item {
  background-color: #aaaaaa;
  border: 0.0625rem solid #919191;
}

.choices__list--dropdown, .choices__list[aria-expanded] {
  display: none;
  z-index: 1;
  position: absolute;
  width: 100%;
  background-color: #fff;
  border: 0.0625rem solid #ddd;
  top: 100%;
  margin-top: -0.0625rem;
  border-bottom-left-radius: 0.15625rem;
  border-bottom-right-radius: 0.15625rem;
  overflow: hidden;
  word-break: break-all;
}
.is-active.choices__list--dropdown, .is-active.choices__list[aria-expanded] {
  display: block;
}
.is-open .choices__list--dropdown, .is-open .choices__list[aria-expanded] {
  border-color: #b7b7b7;
}
.is-flipped .choices__list--dropdown, .is-flipped .choices__list[aria-expanded] {
  top: auto;
  bottom: 100%;
  margin-top: 0;
  margin-bottom: -0.0625rem;
  border-radius: 0.25rem 0.25rem 0 0;
}
.choices__list--dropdown .choices__list, .choices__list[aria-expanded] .choices__list {
  position: relative;
  max-height: 18.75rem;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  will-change: scroll-position;
}
.choices__list--dropdown .choices__item, .choices__list[aria-expanded] .choices__item {
  position: relative;
  padding: 0.625rem;
  font-size: 0.875rem;
}
[dir=rtl] .choices__list--dropdown .choices__item, [dir=rtl] .choices__list[aria-expanded] .choices__item {
  text-align: right;
}
@media (min-width: 40rem) {
  .choices__list--dropdown .choices__item--selectable[data-select-text], .choices__list[aria-expanded] .choices__item--selectable[data-select-text] {
    padding-right: 6.25rem;
  }
  .choices__list--dropdown .choices__item--selectable[data-select-text]::after, .choices__list[aria-expanded] .choices__item--selectable[data-select-text]::after {
    content: attr(data-select-text);
    font-size: 0.75rem;
    opacity: 0;
    position: absolute;
    right: 0.625rem;
    top: 50%;
    transform: translateY(-50%);
  }
  [dir=rtl] .choices__list--dropdown .choices__item--selectable[data-select-text], [dir=rtl] .choices__list[aria-expanded] .choices__item--selectable[data-select-text] {
    text-align: right;
    padding-left: 6.25rem;
    padding-right: 0.625rem;
  }
  [dir=rtl] .choices__list--dropdown .choices__item--selectable[data-select-text]::after, [dir=rtl] .choices__list[aria-expanded] .choices__item--selectable[data-select-text]::after {
    right: auto;
    left: 0.625rem;
  }
}
.choices__list--dropdown .choices__item--selectable.is-highlighted, .choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
  background-color: #f2f2f2;
}
.choices__list--dropdown .choices__item--selectable.is-highlighted::after, .choices__list[aria-expanded] .choices__item--selectable.is-highlighted::after {
  opacity: 0.5;
}

.choices__item {
  cursor: default;
}

.choices__item--selectable {
  cursor: pointer;
}

.choices__item--disabled {
  cursor: not-allowed;
  -webkit-user-select: none;
          user-select: none;
  opacity: 0.5;
}

.choices__heading {
  font-weight: 600;
  font-size: 0.75rem;
  padding: 0.625rem;
  border-bottom: 0.0625rem solid #f7f7f7;
  color: gray;
}

.choices__button {
  text-indent: -624.9375rem;
  appearance: none;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
}
.choices__button:focus {
  outline: none;
}

.choices__input {
  display: inline-block;
  vertical-align: baseline;
  background-color: #f9f9f9;
  font-size: 0.875rem;
  margin-bottom: 0.3125rem;
  border: 0;
  border-radius: 0;
  max-width: 100%;
  padding: 0.25rem 0 0.25rem 0.125rem;
}
.choices__input:focus {
  outline: 0;
}
.choices__input::-webkit-search-decoration, .choices__input::-webkit-search-cancel-button, .choices__input::-webkit-search-results-button, .choices__input::-webkit-search-results-decoration {
  display: none;
}
.choices__input::-ms-clear, .choices__input::-ms-reveal {
  display: none;
  width: 0;
  height: 0;
}
[dir=rtl] .choices__input {
  padding-right: 0.125rem;
  padding-left: 0;
}

.choices__placeholder {
  opacity: 0.5;
}
.quiz-error {
    background: #F97575!important;
}
.error-card {
    border: 1px solid #F97575!important;
}
.question-text-error {
    border: 1px solid #F97575!important;
}
.error-card .title {
    color: #F97575!important;
}
/* =====  End of Choices  ====== */
.quiz-correct {
    background-color: var(--color-primary)!important;
}
.saccc {
    display: none;
}
.saccc_active {
    display: flex;
    align-items: center;
    justify-content: center;

}
.back_link {
    padding-top: 15px;
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}
.back_link span {
    padding-left: 10px;
}
.student-avatar-form, .teacher-image-form {
    display: flex;
    flex-wrap: wrap;
}
.student-avatar-form__preview, .student-avatar-form__field, .teacher-image-form__preview, .teacher-image-form__field {
    width: 50%;
    margin-bottom: 20px;
}
.student-avatar-form__preview img, .teacher-image-form__preview img {
    border-radius: 12px;
    width: 90%;
}


#NotificationsSlider.notif{
    min-height: 36px;
    max-width: 200px;
    width: 100%;
    overflow: hidden;
    color: #fff;
    margin-left: 0;
    margin-right: 0;
    display: flex;
    align-items: center;
}

/* выравниваем контент слайдов в строку */
#NotificationsSlider .swiper-wrapper{ align-items: center; }

/* сами слайды — ссылки */
#NotificationsSlider .swiper-slide{
    display: block;
    font-weight: 400;
    font-size: 14px;
}

#NotificationsSlider .no_underline{ text-decoration: none; color: inherit; }
#NotificationsSlider .subject{ font-weight: 400; margin: 0 .35rem 0 0; }

.gross {
    max-width: 100%!important;
    flex: 0 0 100% !important;
}
.grosse {
    position: relative;
}
.section-student-lesson__col {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 3;
}
.section-student-lesson__col:first-of-type {
    position: absolute;
    left: 0;
    top: 0;
    right: initial;
    z-index: 3;
}
.section-student-lesson__col.gross {
    position: initial;
    z-index: 2;
}
.section-student-lesson__col.half {
    position: initial;
    max-width: 50%!important;
    flex: 0 0 50% !important;
}
@media (max-width: 59.375rem) {
    .grosse {
        display: flex;
        flex-direction: column;
    }
    .section-student-lesson__col.half {
        position: initial;
        max-width: 100%!important;
        flex: initial !important;
    }
    .section-student-lesson__col:first-of-type {
        margin-bottom: 25px;
    }
}
.inh_log {
    display: none;
}
@media (max-width: 900px) {
    .section-login__img img {
        display: none;
    }
    .inh_log {
        display: block!important;
        max-height: 494px;
    }
}

.welcome_body {
    display: flex;
    justify-content: space-between;
}
.welcome_body_item {
    max-width: 555px;
    width: 100%;
    border-radius: 32px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: auto;
    box-sizing: border-box;
    padding: 20px;
    background: #ffffff;
    border: 2px solid #f0f0f0;
    box-shadow: 0 4px 0 0 #f0f0f0;
    min-height: 270px;
    margin-right: 20px;
}
.welcome_body_item .welcome_body_item_title {
    font-family: "Onest", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 20px;
    line-height: 120%;
    letter-spacing: 0px;
    color: #2D302D;
}
.welcome_body img {
    display: block;
    max-width: 555px;
    width: 100%;
    border-radius: 32px;
    max-height: 270px;
}
.welcome_body_item_link {
    max-width: 170px;
    width: 100%
    font-family: "Onest", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    font-weight: 600;           /* SemiBold */
    font-style: normal;
    font-size: 12px;
    line-height: 120%;          /* или 1.2 */
    letter-spacing: 0px;
    text-align: center;         /* Horizontal align: Center */
    color: #FFFFFF;  ;
}
@media (max-width: 1000px) {
    .welcome_body img {
        max-width: 505px;
        min-width: 505px;
        height: 270px;
        object-fit: cover;
    }
}
@media (max-width: 800px) {
    .welcome_body {
        display: flex;
        flex-direction: column;
    }
    .welcome_body img {
        display: block;
        max-width: 800px;
        width: 100%;
        min-width: 505px;
        border-radius: 32px;
    }
    .welcome_body_item {
        max-width: 800px;
        margin-bottom: 15px;
        margin-right: 0;
    }
}
@media (max-width: 565px) {
    .welcome_body img {
        min-width: initial;
    }
}
iframe {
    width: 100%;
    background-color: white;
}