:root {
  --sans-serif-font-family: "Aventa", -apple-system, BlinkMacSystemFont, "Segoe UI", "Ubuntu", "Roboto", "Noto Sans", "Droid Sans", sans-serif;
  --serif-font-family: Georgia, Cambria, "Times New Roman", Times, serif;
}

html, body {
  font-family: var(--sans-serif-font-family);
  font-weight: 700;
  font-style: normal;
}

.u-font--light {
  font-weight: 300;
}

.u-font--normal {
  font-weight: 400;
}

.u-font--medium {
  font-weight: 500;
}

.u-font--bold, strong, b {
  font-weight: 700;
}

.u-font--italic, em, i {
  font-style: italic;
}

.u-font--sans-serif {
  font-family: var(--sans-serif-font-family);
}

.u-font--serif {
  font-family: var(--serif-font-family);
}

.u-text--uppercase {
  text-transform: uppercase;
}

.u-text--lowercase {
  text-transform: lowercase;
}

.u-text--capitalize {
  text-transform: capitalize;
}

@font-face {
  font-family: "Aventa";
  src: url("./font/Aventa/Aventa-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Aventa";
  src: url("./font/Aventa/Aventa-Bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
}
:root {
  --debug: magenta;
  --brand-chartreuse: #DFFF00;
  --brand-ardoise: #2D2D2B;
  --brand-white: #FFFFFF;
  --primary-action-500: #384000;
  --surface-100: #FFFFFF;
  --surface-200: #FAFAFA;
  --surface-300: #F5F5F5;
  --surface-400: #F5F5F5;
  --surface-500: #EBEBEB;
  --text-100: #FFFFFF;
  --text-300: #C1C1C1;
  --text-500: #707070;
  --text-700: #3D3D3D;
  --text-800: #242424;
  --text-900: #1A1A1A;
  --accent-cyan: #00FFFF;
  --accent-info-500: #00C2FF;
  --accent-info-700: #0099CA;
  --accent-success-500: #2BE18A;
  --accent-success-700: #0E9554;
  --accent-warning-500: #FFB800;
  --accent-warning-700: #C18B00;
  --accent-error-400: #FD6B50;
  --accent-error-500: #FB471F;
  --accent-error-700: #C52A08;
}

.u-text--debug {
  color: var(--debug);
}

.u-bg--debug {
  background-color: var(--debug);
}

.u-border--debug {
  border-color: var(--debug);
}

.u-text--brand-chartreuse {
  color: var(--brand-chartreuse);
}

.u-bg--brand-chartreuse {
  background-color: var(--brand-chartreuse);
}

.u-border--brand-chartreuse {
  border-color: var(--brand-chartreuse);
}

.u-text--brand-ardoise {
  color: var(--brand-ardoise);
}

.u-bg--brand-ardoise {
  background-color: var(--brand-ardoise);
}

.u-border--brand-ardoise {
  border-color: var(--brand-ardoise);
}

.u-text--brand-white {
  color: var(--brand-white);
}

.u-bg--brand-white {
  background-color: var(--brand-white);
}

.u-border--brand-white {
  border-color: var(--brand-white);
}

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

.u-bg--primary-action-500 {
  background-color: var(--primary-action-500);
}

.u-border--primary-action-500 {
  border-color: var(--primary-action-500);
}

.u-text--surface-100 {
  color: var(--surface-100);
}

.u-bg--surface-100 {
  background-color: var(--surface-100);
}

.u-border--surface-100 {
  border-color: var(--surface-100);
}

.u-text--surface-200 {
  color: var(--surface-200);
}

.u-bg--surface-200 {
  background-color: var(--surface-200);
}

.u-border--surface-200 {
  border-color: var(--surface-200);
}

.u-text--surface-300 {
  color: var(--surface-300);
}

.u-bg--surface-300 {
  background-color: var(--surface-300);
}

.u-border--surface-300 {
  border-color: var(--surface-300);
}

.u-text--surface-400 {
  color: var(--surface-400);
}

.u-bg--surface-400 {
  background-color: var(--surface-400);
}

.u-border--surface-400 {
  border-color: var(--surface-400);
}

.u-text--surface-500 {
  color: var(--surface-500);
}

.u-bg--surface-500 {
  background-color: var(--surface-500);
}

.u-border--surface-500 {
  border-color: var(--surface-500);
}

.u-text--text-100 {
  color: var(--text-100);
}

.u-bg--text-100 {
  background-color: var(--text-100);
}

.u-border--text-100 {
  border-color: var(--text-100);
}

.u-text--text-300 {
  color: var(--text-300);
}

.u-bg--text-300 {
  background-color: var(--text-300);
}

.u-border--text-300 {
  border-color: var(--text-300);
}

.u-text--text-500 {
  color: var(--text-500);
}

.u-bg--text-500 {
  background-color: var(--text-500);
}

.u-border--text-500 {
  border-color: var(--text-500);
}

.u-text--text-700 {
  color: var(--text-700);
}

.u-bg--text-700 {
  background-color: var(--text-700);
}

.u-border--text-700 {
  border-color: var(--text-700);
}

.u-text--text-800 {
  color: var(--text-800);
}

.u-bg--text-800 {
  background-color: var(--text-800);
}

.u-border--text-800 {
  border-color: var(--text-800);
}

.u-text--text-900 {
  color: var(--text-900);
}

.u-bg--text-900 {
  background-color: var(--text-900);
}

.u-border--text-900 {
  border-color: var(--text-900);
}

.u-text--accent-cyan {
  color: var(--accent-cyan);
}

.u-bg--accent-cyan {
  background-color: var(--accent-cyan);
}

.u-border--accent-cyan {
  border-color: var(--accent-cyan);
}

.u-text--accent-info-500 {
  color: var(--accent-info-500);
}

.u-bg--accent-info-500 {
  background-color: var(--accent-info-500);
}

.u-border--accent-info-500 {
  border-color: var(--accent-info-500);
}

.u-text--accent-info-700 {
  color: var(--accent-info-700);
}

.u-bg--accent-info-700 {
  background-color: var(--accent-info-700);
}

.u-border--accent-info-700 {
  border-color: var(--accent-info-700);
}

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

.u-bg--accent-success-500 {
  background-color: var(--accent-success-500);
}

.u-border--accent-success-500 {
  border-color: var(--accent-success-500);
}

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

.u-bg--accent-success-700 {
  background-color: var(--accent-success-700);
}

.u-border--accent-success-700 {
  border-color: var(--accent-success-700);
}

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

.u-bg--accent-warning-500 {
  background-color: var(--accent-warning-500);
}

.u-border--accent-warning-500 {
  border-color: var(--accent-warning-500);
}

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

.u-bg--accent-warning-700 {
  background-color: var(--accent-warning-700);
}

.u-border--accent-warning-700 {
  border-color: var(--accent-warning-700);
}

.u-text--accent-error-400 {
  color: var(--accent-error-400);
}

.u-bg--accent-error-400 {
  background-color: var(--accent-error-400);
}

.u-border--accent-error-400 {
  border-color: var(--accent-error-400);
}

.u-text--accent-error-500 {
  color: var(--accent-error-500);
}

.u-bg--accent-error-500 {
  background-color: var(--accent-error-500);
}

.u-border--accent-error-500 {
  border-color: var(--accent-error-500);
}

.u-text--accent-error-700 {
  color: var(--accent-error-700);
}

.u-bg--accent-error-700 {
  background-color: var(--accent-error-700);
}

.u-border--accent-error-700 {
  border-color: var(--accent-error-700);
}

:root {
  --text-font-family-heading-xl: var(--sans-serif-font-family);
  --text-font-weight-heading-xl: 700;
  --text-font-size-heading-xl: 2rem;
  --text-line-height-heading-xl: normal;
  --text-letter-spacing-heading-xl: normal;
  --text-font-family-heading-lg: var(--sans-serif-font-family);
  --text-font-weight-heading-lg: 700;
  --text-font-size-heading-lg: 1.5rem;
  --text-line-height-heading-lg: normal;
  --text-letter-spacing-heading-lg: normal;
  --text-font-family-heading-md: var(--sans-serif-font-family);
  --text-font-weight-heading-md: 700;
  --text-font-size-heading-md: 1.25rem;
  --text-line-height-heading-md: normal;
  --text-letter-spacing-heading-md: normal;
  --text-font-family-heading-sm: var(--sans-serif-font-family);
  --text-font-weight-heading-sm: 700;
  --text-font-size-heading-sm: 1rem;
  --text-line-height-heading-sm: normal;
  --text-letter-spacing-heading-sm: normal;
  --text-font-family-paragraph-md: var(--sans-serif-font-family);
  --text-font-weight-paragraph-md: 700;
  --text-font-size-paragraph-md: 1rem;
  --text-line-height-paragraph-md: 1.2em;
  --text-letter-spacing-paragraph-md: normal;
  --text-font-family-paragraph-sm: var(--sans-serif-font-family);
  --text-font-weight-paragraph-sm: 700;
  --text-font-size-paragraph-sm: 0.875rem;
  --text-line-height-paragraph-sm: 1.2em;
  --text-letter-spacing-paragraph-sm: normal;
  --text-font-family-caption-md: var(--sans-serif-font-family);
  --text-font-weight-caption-md: 700;
  --text-font-size-caption-md: 0.625rem;
  --text-line-height-caption-md: normal;
  --text-letter-spacing-caption-md: normal;
}

h1 {
  font-family: var(--text-font-family-heading-xl);
  font-weight: var(--text-font-weight-heading-xl);
  font-size: var(--text-font-size-heading-xl);
  line-height: var(--text-line-height-heading-xl);
  letter-spacing: var(--text-letter-spacing-heading-xl);
  margin-top: 0rem;
  margin-bottom: 0rem;
}

h2 {
  font-family: var(--text-font-family-heading-lg);
  font-weight: var(--text-font-weight-heading-lg);
  font-size: var(--text-font-size-heading-lg);
  line-height: var(--text-line-height-heading-lg);
  letter-spacing: var(--text-letter-spacing-heading-lg);
  margin-top: 0rem;
  margin-bottom: 0rem;
}

h3 {
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
  margin-top: 0rem;
  margin-bottom: 0rem;
}

h4 {
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
  margin-top: 0rem;
  margin-bottom: 0rem;
}

h5 {
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
  margin-top: 0rem;
  margin-bottom: 0rem;
}

h6 {
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
  margin-top: 0rem;
  margin-bottom: 0rem;
}

p,
.u-paragraph {
  font-family: var(--text-font-family-paragraph-md);
  font-weight: var(--text-font-weight-paragraph-md);
  font-size: var(--text-font-size-paragraph-md);
  line-height: var(--text-line-height-paragraph-md);
  letter-spacing: var(--text-letter-spacing-paragraph-md);
  margin-top: 0rem;
  margin-bottom: 0rem;
}

h1:empty,
h1:first-child,
h2:empty,
h2:first-child,
h3:empty,
h3:first-child,
h4:empty,
h4:first-child,
h5:empty,
h5:first-child,
h6:empty,
h6:first-child,
p:empty,
p:first-child,
.u-paragraph:empty,
.u-paragraph:first-child {
  margin-top: 0rem;
}

h1:empty,
h1:last-child,
h2:empty,
h2:last-child,
h3:empty,
h3:last-child,
h4:empty,
h4:last-child,
h5:empty,
h5:last-child,
h6:empty,
h6:last-child,
p:empty,
p:last-child,
.u-paragraph:empty,
.u-paragraph:last-child {
  margin-bottom: 0rem;
}

p:empty,
.u-paragraph:empty {
  margin-bottom: var(--text-line-height-paragraph-md);
}

a {
  color: inherit;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
a:active, a:focus {
  background-color: transparent !important;
  outline: none !important;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, p a, .u-paragraph a {
  text-decoration: underline;
}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover, p a:hover, .u-paragraph a:hover {
  text-decoration: none;
}

* {
  -webkit-tap-highlight-color: transparent;
}

:root {
  --outer-width: 600px;
  --nav-height: 5.375rem;
  --search-height: 4rem;
  --dock-padding: 5.5rem;
}

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  outline: none;
}

html,
body {
  font-size: 16px;
  color: var(--text-900);
  background-color: var(--surface-200);
  height: 100%;
}

.o-body {
  background-image: linear-gradient(rgba(0, 0, 0, 0.66), rgba(0, 0, 0, 0.66)), url("/img/bg.webp");
  background-size: cover;
  background-position: center;
}
.o-body--disable-animation * {
  transition: none !important;
}
.o-body--disable-interaction * {
  pointer-events: none !important;
}
.o-body__outer {
  max-width: var(--outer-width);
  height: 100%;
  margin: 0 auto;
  overflow: hidden;
  transform: translate(0, 0);
  background-color: var(--surface-200);
}
.o-body__inner {
  height: 100%;
  overflow: auto;
}
.o-body__header {
  position: fixed;
  top: 0;
  z-index: 2;
  width: 100%;
}
.o-body__main {
  padding-top: calc(var(--nav-height) + var(--search-height));
  padding-bottom: var(--dock-padding);
  min-height: 100%;
}
.o-body__aside {
  position: fixed;
  bottom: 0;
  z-index: 1;
  width: 100%;
  height: calc(100% - var(--nav-height));
  overflow: auto;
}

.o-aside {
  background-color: var(--surface-200);
}
.o-aside--right, .o-aside--left, .o-aside--top, .o-aside--bottom {
  transition: 0.4s transform;
}
.o-aside--front {
  transition: 0.2s opacity;
}
.o-aside--right {
  transform: translateX(100%);
}
.o-aside--right.o-aside--visible {
  transform: translateX(0%);
}
.o-aside--left {
  transform: translateX(-100%);
}
.o-aside--left.o-aside--visible {
  transform: translateX(0%);
}
.o-aside--top {
  transform: translateY(-100%);
}
.o-aside--top.o-aside--visible {
  transform: translateY(0%);
}
.o-aside--bottom {
  transform: translateY(100%);
}
.o-aside--bottom.o-aside--visible {
  transform: translateY(0%);
}
.o-aside--front {
  opacity: 0;
  pointer-events: none;
}
.o-aside--front.o-aside--visible {
  opacity: 1;
  pointer-events: auto;
}
.o-aside--supplier, .o-aside--search {
  padding-bottom: var(--dock-padding);
}
.o-aside--search {
  height: calc(100% - (var(--nav-height) + var(--search-height)));
}

.o-dialog {
  position: fixed;
  top: 50%;
  left: 50%;
  width: calc(100% - 2rem);
  max-width: calc(var(--outer-width) - 2rem);
  max-height: 50%;
  transform: translate(-50%, -50%);
  padding: 1.5rem;
  background-color: var(--surface-100);
  border: none;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  opacity: 0;
  pointer-events: none;
  transition: 0.2s opacity;
}
.o-dialog--visible {
  opacity: 1;
  pointer-events: auto;
}
.o-dialog::backdrop {
  background: transparent;
}
.o-dialog--visible.o-dialog::backdrop {
  background: rgba(26, 26, 26, 0.6);
}
.o-dialog__title {
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
}
.o-dialog__message {
  color: var(--text-700);
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
}
.o-dialog__bar {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
}
.o-dialog__button {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 0.75rem;
  height: 2.25rem;
  background-color: var(--primary-action-500);
  color: var(--brand-chartreuse);
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
  cursor: pointer;
}
.o-dialog__button--cancel {
  background-color: var(--surface-400);
  color: var(--primary-action-500);
}

.o-form {
  --input-height: 4rem;
}
.o-form__fieldset {
  all: unset;
  box-sizing: border-box;
  display: block;
  width: 100%;
  padding: 3rem 1rem 1.5rem 1rem;
}
.o-form__fieldset--consent {
  padding-top: 0;
  padding-bottom: 3rem;
}
.o-form__legend {
  all: unset;
  box-sizing: border-box;
  display: block;
  width: 100%;
  margin-bottom: 0.75rem;
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
}
.o-form__hint {
  margin-bottom: 0.75rem;
  color: var(--text-500);
  font-family: var(--text-font-family-paragraph-md);
  font-weight: var(--text-font-weight-paragraph-md);
  font-size: var(--text-font-size-paragraph-md);
  line-height: var(--text-line-height-paragraph-md);
  letter-spacing: var(--text-letter-spacing-paragraph-md);
}
.o-form__hint--before {
  margin-bottom: 3rem;
  color: var(--text-900);
}
.o-form__hint svg {
  width: 0.75rem;
  height: 0.75rem;
}
.o-form__hint svg.yl-close-xs {
  color: var(--accent-error-400);
}
.o-form__hint svg.yl-checkmark-xs {
  color: var(--accent-success-500);
}
.o-form__hint svg:last-child {
  display: none;
}
.o-form__hint[data-re1] span[data-re1] svg:first-child {
  display: none;
}
.o-form__hint[data-re1] span[data-re1] svg:last-child {
  display: inline;
}
.o-form__hint[data-re2] span[data-re2] svg:first-child {
  display: none;
}
.o-form__hint[data-re2] span[data-re2] svg:last-child {
  display: inline;
}
.o-form__hint[data-re3] span[data-re3] svg:first-child {
  display: none;
}
.o-form__hint[data-re3] span[data-re3] svg:last-child {
  display: inline;
}
.o-form__field {
  margin-bottom: 1.5rem;
  display: flex;
}
.o-form__field:last-child {
  margin-bottom: 0;
}
.o-form__input--text, .o-form__input--email, .o-form__input--tel, .o-form__input--password, .o-form__textarea, .o-form__select {
  all: unset;
  box-sizing: border-box;
  display: block;
  width: 100%;
  padding: 0 1rem;
  border-bottom: 0.25rem solid transparent;
  background-color: var(--surface-300);
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
  line-height: var(--input-height);
  transition: 0.2s background-color, 0.2s border-bottom-color;
}
.o-form__input--text ::placeholder, .o-form__input--email ::placeholder, .o-form__input--tel ::placeholder, .o-form__input--password ::placeholder, .o-form__textarea ::placeholder, .o-form__select ::placeholder {
  color: var(--text-500);
}
.o-form__input--text:user-invalid, .o-form__input--email:user-invalid, .o-form__input--tel:user-invalid, .o-form__input--password:user-invalid, .o-form__textarea:user-invalid, .o-form__select:user-invalid {
  border-bottom-color: var(--accent-error-400);
}
.o-form__input--text:focus, .o-form__input--email:focus, .o-form__input--tel:focus, .o-form__input--password:focus, .o-form__textarea:focus, .o-form__select:focus {
  background-color: var(--surface-100);
  border-bottom-color: var(--brand-chartreuse);
}
.o-form__input--1\/2, .o-form__textarea--1\/2, .o-form__select--1\/2 {
  display: inline-block;
  width: 50%;
}
.o-form__input--1\/4, .o-form__textarea--1\/4, .o-form__select--1\/4 {
  display: inline-block;
  width: 25%;
}
.o-form__input--3\/4, .o-form__textarea--3\/4, .o-form__select--3\/4 {
  display: inline-block;
  width: 75%;
}
.o-form__input--text, .o-form__input--email, .o-form__input--tel, .o-form__input--password, .o-form__select {
  height: var(--input-height);
}
.o-form__textarea {
  height: calc(4 * var(--input-height));
  white-space: pre-wrap;
}
.o-form__label {
  display: flex;
  align-items: center;
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
}
.o-form__label a {
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
}
.o-form__label a:hover {
  text-decoration: none;
}
.o-form__input--checkbox {
  appearance: none;
  flex-shrink: 0;
  width: 1.5rem;
  height: 1.5rem;
  margin: 0 1rem;
  background-color: var(--surface-500);
  position: relative;
}
.o-form__input--checkbox::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: var(--primary-action-500);
  background-image: url('data:image/svg+xml,%3Csvg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath stroke="%23DFFF00" stroke-width="1.5" stroke-linejoin="round" d="M3 12L9 18L21 6" /%3E%3C/svg%3E');
  visibility: hidden;
}
.o-form__input--checkbox:checked::before {
  visibility: visible;
}
.o-form__input--checkbox:disabled::before {
  opacity: 0.25;
}

.c-dock {
  position: fixed;
  bottom: 1rem;
  left: 50%;
  transform: translate(-50%, 0);
  width: 6.875rem;
  height: 3.5rem;
  border-radius: 2.5rem;
  padding: 0 1rem;
  background-color: var(--brand-chartreuse);
  box-shadow: 0 2px 8px 0 rgba(26, 26, 26, 0.25);
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
  cursor: pointer;
  z-index: 1;
  transition: 0.4s transform, 0.4s width;
}
.c-dock--hidden {
  transform: translate(-50%, calc(100% + 2rem));
  pointer-events: none;
}
.c-dock--disabled {
  pointer-events: none;
}
.c-dock--expanded {
  width: 12rem;
}
.c-dock__title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.c-dock__title svg {
  width: 2rem;
  height: 2rem;
}
.c-dock__count {
  min-width: 2rem;
  height: 2rem;
  border-radius: 1rem;
  padding: 0 0.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-100);
  background-color: var(--primary-action-500);
}
.c-dock__countdown {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0;
  transition: 0.4s opacity;
}
.c-dock--expanded .c-dock__countdown {
  opacity: 1;
}

.c-nav {
  height: var(--nav-height);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background-color: var(--brand-chartreuse);
}
.c-nav__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.c-nav__row--top {
  margin-top: 1.125rem;
  padding: 0 1.5rem;
}
.c-nav__row--bottom {
  margin-bottom: 0.5rem;
  padding: 0 1rem;
}
.c-nav__logo {
  display: block;
  height: 1.5rem;
  cursor: pointer;
}
.c-nav__tray {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}
.c-nav__button {
  width: 1.5rem;
  height: 1.5rem;
  cursor: pointer;
}
.c-nav__button svg {
  width: 100%;
  height: 100%;
}
.c-nav__datepicker {
  width: 100%;
}

.c-datepicker {
  position: relative;
}
.c-datepicker__list {
  position: absolute;
  top: calc(100% + 0.5rem);
  width: 100%;
  box-shadow: 0 8px 8px 0 rgba(26, 26, 26, 0.25);
  border-radius: 0 0 0.5rem 0.5rem;
  overflow: hidden;
  z-index: 1;
  opacity: 0;
  pointer-events: none;
  transition: 0.2s opacity;
}
.c-datepicker--open .c-datepicker__list {
  opacity: 1;
  pointer-events: auto;
}
.c-datepicker__item {
  width: 100%;
  height: 1.75rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0 0.5rem;
  color: var(--text-500);
  background-color: var(--surface-200);
}
.c-datepicker__item--active {
  color: var(--text-900);
}
.c-datepicker__item:hover {
  background-color: var(--surface-500);
}
.c-datepicker__item svg {
  width: 1.5rem;
  height: 1.5rem;
}
.c-datepicker__list .c-datepicker__item {
  height: 2.25rem;
}
.c-datepicker--enabled .c-datepicker__item {
  cursor: pointer;
}
.c-datepicker__pick {
  border-radius: 0.5rem;
  opacity: 1;
  pointer-events: auto;
  transition: 0.2s opacity;
}
.c-datepicker__pick--hidden {
  opacity: 0;
  pointer-events: none;
}
.c-datepicker__pick:hover {
  background-color: var(--surface-200);
}
.c-datepicker__control {
  position: absolute;
  width: 1.5rem;
  height: 1.5rem;
  right: 0.5rem;
  opacity: 0;
  transition: 0.2s opacity;
}
.c-datepicker__control svg {
  width: 100%;
  height: 100%;
}
.c-datepicker--enabled .c-datepicker__control {
  opacity: 1;
}
.c-datepicker--open .c-datepicker__control {
  transform: rotate(180deg);
}

.c-account {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.c-account__track {
  display: flex;
  height: 100%;
  transition: 0.4s transform;
}
.c-account__track[data-current=signin] {
  transform: translateX(calc(-0 * 100%));
}
.c-account__track[data-current=recover] {
  transform: translateX(calc(-1 * 100%));
}
.c-account__track[data-current=reinit] {
  transform: translateX(calc(-2 * 100%));
}
.c-account__track[data-current=reset] {
  transform: translateX(calc(-3 * 100%));
}
.c-account__track[data-current=redone] {
  transform: translateX(calc(-4 * 100%));
}
.c-account__track[data-current=signup] {
  transform: translateX(calc(-1 * 100%));
}
.c-account__track[data-current=confirm] {
  transform: translateX(calc(-2 * 100%));
}
.c-account__track[data-current=done] {
  transform: translateX(calc(-3 * 100%));
}
.c-account__track[data-current=profile] {
  transform: translateX(calc(-0 * 100%));
}
.c-account__track[data-current=info] {
  transform: translateX(calc(-1 * 100%));
}
.c-account__track[data-current=change] {
  transform: translateX(calc(-1 * 100%));
}
.c-account__track[data-current=history] {
  transform: translateX(calc(-1 * 100%));
}
.c-account__track[data-current=event] {
  transform: translateX(calc(-2 * 100%));
}
.c-account__track[data-current=delete] {
  transform: translateX(calc(-1 * 100%));
}
.c-account__track[data-current=delconfirm] {
  transform: translateX(calc(-2 * 100%));
}
.c-account__track[data-current=deldone] {
  transform: translateX(calc(-0 * 100%));
}
.c-account__page {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  pointer-events: none;
}
.c-account__page--profile {
  background-color: var(--surface-100);
}
.c-account__track[data-current=signin] .c-account__page[data-page=signin] {
  pointer-events: auto;
}
.c-account__track[data-current=recover] .c-account__page[data-page=recover] {
  pointer-events: auto;
}
.c-account__track[data-current=reinit] .c-account__page[data-page=reinit] {
  pointer-events: auto;
}
.c-account__track[data-current=reset] .c-account__page[data-page=reset] {
  pointer-events: auto;
}
.c-account__track[data-current=redone] .c-account__page[data-page=redone] {
  pointer-events: auto;
}
.c-account__track[data-current=signup] .c-account__page[data-page=signup] {
  pointer-events: auto;
}
.c-account__track[data-current=confirm] .c-account__page[data-page=confirm] {
  pointer-events: auto;
}
.c-account__track[data-current=done] .c-account__page[data-page=done] {
  pointer-events: auto;
}
.c-account__track[data-current=profile] .c-account__page[data-page=profile] {
  pointer-events: auto;
}
.c-account__track[data-current=info] .c-account__page[data-page=info] {
  pointer-events: auto;
}
.c-account__track[data-current=change] .c-account__page[data-page=change] {
  pointer-events: auto;
}
.c-account__track[data-current=history] .c-account__page[data-page=history] {
  pointer-events: auto;
}
.c-account__track[data-current=event] .c-account__page[data-page=event] {
  pointer-events: auto;
}
.c-account__track[data-current=delete] .c-account__page[data-page=delete] {
  pointer-events: auto;
}
.c-account__track[data-current=delconfirm] .c-account__page[data-page=delconfirm] {
  pointer-events: auto;
}
.c-account__track[data-current=deldone] .c-account__page[data-page=deldone] {
  pointer-events: auto;
}
.c-account__header {
  flex-shrink: 0;
  height: 4rem;
  padding: 0 3.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--surface-100);
  color: var(--primary-action-500);
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
  position: relative;
}
.c-account__control {
  position: absolute;
  width: 1.5rem;
  height: 1.5rem;
  cursor: pointer;
}
.c-account__control--back {
  left: 1rem;
}
.c-account__control--close {
  right: 1rem;
}
.c-account__control svg {
  width: 100%;
  height: 100%;
}
.c-account__main {
  flex: 1;
  overflow: auto;
}
.c-account__section {
  padding: 0rem 1rem 1.5rem 1rem;
}
.c-account__section:first-child {
  padding-top: 3rem;
}
.c-account__message {
  font-family: var(--text-font-family-paragraph-md);
  font-weight: var(--text-font-weight-paragraph-md);
  font-size: var(--text-font-size-paragraph-md);
  line-height: var(--text-line-height-paragraph-md);
  letter-spacing: var(--text-letter-spacing-paragraph-md);
}
.c-account__footer {
  flex-shrink: 0;
  padding: 1.875rem 1rem;
  background-color: var(--surface-100);
  box-shadow: 0 0 16px 0 rgba(26, 26, 26, 0.08);
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.c-account__prompt, .c-account__nudge {
  text-align: left;
  color: var(--text-500);
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
}
.c-account__prompt {
  margin-top: 1rem;
}
.c-account__prompt span {
  display: inline-block;
  text-decoration: underline;
  cursor: pointer;
}
.c-account__button {
  width: 100%;
  height: 3.5rem;
  background-color: var(--brand-chartreuse);
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s;
}
.c-account__button--disabled {
  background-color: var(--surface-300);
  color: var(--text-300);
  pointer-events: none;
}
.c-account__button--muted {
  background-color: var(--surface-400);
  color: var(--primary-action-500);
}
.c-account__button--accented {
  background-color: var(--surface-400);
  color: var(--accent-error-400);
}
.c-account__button--waiting {
  background-color: var(--surface-300);
  color: var(--text-300);
  pointer-events: none;
  position: relative;
  overflow: hidden;
}
.c-account__button--waiting::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5), transparent);
  animation: shimmer 2s infinite;
}
@keyframes shimmer {
  0% {
    left: -100%;
  }
  100% {
    left: 100%;
  }
}

.c-menu {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.c-menu__header {
  flex-shrink: 0;
  height: 4rem;
  padding: 0 3.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--surface-100);
  color: var(--primary-action-500);
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
  position: relative;
}
.c-menu__control {
  position: absolute;
  width: 1.5rem;
  height: 1.5rem;
  cursor: pointer;
}
.c-menu__control--close {
  right: 1rem;
}
.c-menu__control svg {
  width: 100%;
  height: 100%;
}
.c-menu__main {
  flex: 1;
  overflow: auto;
  padding: 1.5rem 1rem;
  background-color: var(--surface-100);
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.c-menu__footer {
  padding: 1.875rem 1.5rem;
}

.c-accordion {
  background-color: var(--surface-300);
}
.c-accordion__head {
  height: 4rem;
  padding: 0 1.5rem;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.c-accordion__body {
  padding: 1rem 1.5rem;
}
.c-accordion__body p {
  font-weight: 400;
}
.c-accordion__body .o-form__label {
  margin-left: -1rem;
  font-family: var(--text-font-family-paragraph-md);
  font-weight: var(--text-font-weight-paragraph-md);
  font-size: var(--text-font-size-paragraph-md);
  line-height: var(--text-line-height-paragraph-md);
  letter-spacing: var(--text-letter-spacing-paragraph-md);
  font-weight: 400;
}

.c-search {
  position: fixed;
  top: var(--nav-height);
  width: 100%;
  z-index: 1;
  height: var(--search-height);
  display: flex;
  align-items: center;
  box-shadow: 0 0 16px 0 rgba(26, 26, 26, 0.08);
}
.c-search__input {
  all: unset;
  box-sizing: border-box;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 3.5rem;
  border-bottom: 0.25rem solid transparent;
  background-color: var(--surface-300);
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
  line-height: var(--search-height);
  transition: 0.2s background-color, 0.2s border-bottom-color;
}
.c-search__input ::placeholder {
  color: var(--text-500);
}
.c-search__input:focus, .c-search__input:not(:placeholder-shown) {
  background-color: var(--surface-100);
  border-bottom-color: var(--brand-chartreuse);
}
.c-search__control {
  position: absolute;
  width: 1.5rem;
  height: 1.5rem;
  transition: 0.2s opacity;
}
.c-search__control--search {
  left: 1rem;
}
.c-search__control--close {
  right: 1rem;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
}
.c-search__control svg {
  width: 100%;
  height: 100%;
}
.c-search__input:not(:placeholder-shown) ~ .c-search__control--close {
  opacity: 1;
  pointer-events: auto;
}

.c-list {
  display: flex;
  flex-direction: column;
  overflow: auto;
  opacity: 0;
  pointer-events: none;
  transition: 0.4s opacity;
}
.c-list--visible {
  opacity: 1;
  pointer-events: auto;
}
.c-list--suppliers {
  gap: 2.5rem;
}
.c-list--search {
  padding-top: 1.5rem;
  gap: 0.5rem;
}
.c-list--orders {
  gap: 1.5rem;
}
.c-list--order-bins {
  gap: 0.25rem;
}
.c-list--order-fees, .c-list--order-discounts {
  gap: 1rem;
}
.c-list__empty {
  text-align: center;
}
.c-list--search .c-list__empty {
  padding: 0 1rem;
}
.c-list--basket .c-list__empty {
  padding: 1rem 1rem;
}

.c-item {
  flex-shrink: 0;
  overflow: hidden;
}
.c-item--supplier {
  --header-height: 4.275rem;
  --footer-height: 3.5rem;
}
.c-item--supplier .c-item__slider {
  width: 100%;
  aspect-ratio: 16/9;
}
.c-item--supplier .c-item__slider--collapsed {
  aspect-ratio: 3/1;
}
.c-item--supplier .c-item__slider--expanded {
  aspect-ratio: 1/1;
}
.c-item--supplier .c-item__figure {
  width: 100%;
  height: 18rem;
  position: relative;
}
.c-item--supplier .c-item__slider .c-item__figure {
  height: 100%;
}
.c-item--supplier .c-item__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
}
.c-item--supplier .c-item__banner {
  width: 80%;
  margin-top: calc(-1 * var(--header-height));
  margin-left: auto;
  position: relative;
  transform: translateZ(0);
}
.c-item--supplier .c-item__header {
  height: var(--header-height);
  background-color: var(--brand-chartreuse);
  font-family: var(--text-font-family-heading-lg);
  font-weight: var(--text-font-weight-heading-lg);
  font-size: var(--text-font-size-heading-lg);
  line-height: var(--text-line-height-heading-lg);
  letter-spacing: var(--text-letter-spacing-heading-lg);
  display: flex;
  align-items: center;
  padding: 0 1rem;
}
.c-item--supplier .c-item__footer {
  height: var(--footer-height);
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0 0.5rem 0.5rem 0.5rem;
}
.c-item--supplier .c-item__footer--badges {
  height: calc(var(--footer-height) + 0.5rem);
  padding-top: 0.5rem;
  background-color: var(--brand-white);
  overflow: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.c-item--supplier .c-item__footer--badges::-webkit-scrollbar {
  display: none;
}
.c-item--supplier .c-item__footer--address {
  padding: 0 1rem 0.5rem 1rem;
  background-color: var(--brand-chartreuse);
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
}
.c-item--supplier .c-item__badge {
  height: 100%;
  flex-shrink: 0;
}
.c-item--basket {
  padding: 0.5rem 1rem 1rem 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.c-item--basket .c-item__main {
  display: flex;
  align-items: flex-end;
  position: relative;
  gap: 0.5rem;
}
.c-item--basket .c-item__control {
  position: absolute;
  width: 1.5rem;
  height: 1.5rem;
  color: var(--text-500);
  cursor: pointer;
}
.c-item--basket .c-item__control--remove {
  top: 0;
  right: 0;
}
.c-item--basket .c-item__control svg {
  width: 100%;
  height: 100%;
}
.c-item--basket .c-item__badge {
  flex-shrink: 0;
  width: 4rem;
  height: 4rem;
}
.c-item--basket .c-item__info {
  flex: 1;
}
.c-item--basket .c-item__title {
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
}
.c-item--basket .c-item__caption {
  color: var(--text-500);
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
}
.c-item--basket .c-item__price {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 0.25rem;
}
.c-item--basket .c-item__price span:first-child {
  color: var(--text-500);
  font-family: var(--text-font-family-caption-md);
  font-weight: var(--text-font-weight-caption-md);
  font-size: var(--text-font-size-caption-md);
  line-height: var(--text-line-height-caption-md);
  letter-spacing: var(--text-letter-spacing-caption-md);
}
.c-item--basket .c-item__price span:last-child {
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
}
.c-item--basket .c-item__field {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.c-item--basket .c-item__input {
  width: 4rem;
  height: 2rem;
  border-radius: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--brand-chartreuse);
  background-color: var(--primary-action-500);
  cursor: pointer;
  transition: 0.2s color, 0.2s background-color;
}
.c-item--basket .c-item__input--disabled {
  color: var(--text-300);
  background-color: var(--surface-500);
  pointer-events: none;
}
.c-item--basket .c-item__input svg {
  width: 1.5rem;
  height: 1.5rem;
}
.c-item--basket .c-item__quantity {
  width: 6rem;
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 0.25rem;
}
.c-item--basket .c-item__quantity--invalid {
  color: var(--accent-error-400);
}
.c-item--basket .c-item__quantity span:first-child {
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
}
.c-item--basket .c-item__quantity span:last-child {
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
}
.c-item--basket .c-item__remain {
  margin-top: 1rem;
  text-align: right;
  color: var(--accent-error-400);
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
}
.c-item--order {
  padding: 0 1rem;
  height: 4rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  background-color: var(--surface-100);
  cursor: pointer;
}
.c-item--order .c-item__main {
  flex: 1;
}
.c-item--order .c-item__title {
  display: flex;
  gap: 0.5rem;
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
}
.c-item--order .c-item__title svg {
  width: 1.05rem;
  height: 1.05rem;
}
.c-item--order .c-item__caption {
  display: flex;
  gap: 0.5rem;
  color: var(--text-500);
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
}
.c-item--order .c-item__caption svg {
  width: 1.05rem;
  height: 1.05rem;
}
.c-item--order .c-item__footer {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.c-item--order .c-item__price {
  display: flex;
  align-items: baseline;
  gap: 0.25rem;
}
.c-item--order .c-item__price span:first-child {
  color: var(--text-500);
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
}
.c-item--order .c-item__price span:last-child {
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
}
.c-item--order .c-item__control {
  display: flex;
  color: var(--text-500);
}
.c-item--order .c-item__control svg {
  width: 1.05rem;
  height: 1.05rem;
}
.c-item--order-bin {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.c-item--order-bin .c-item__badge {
  flex-shrink: 0;
}
.c-item--order-bin .c-item__main {
  flex: 1;
}
.c-item--order-bin .c-item__title {
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
}
.c-item--order-bin .c-item__caption {
  color: var(--text-500);
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
}
.c-item--order-bin .c-item__footer {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.c-item--order-bin .c-item__price {
  display: flex;
  align-items: baseline;
  gap: 0.25rem;
}
.c-item--order-bin .c-item__price span:first-child {
  color: var(--text-500);
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
}
.c-item--order-bin .c-item__price span:last-child {
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
}
.c-item--order-bin .c-item__quantity {
  display: flex;
  align-items: baseline;
  gap: 0.25rem;
  color: var(--text-500);
}
.c-item--order-bin .c-item__quantity span {
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
}
.c-item--order-fee, .c-item--order-discount {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--text-500);
}
.c-item--order-fee .c-item__label, .c-item--order-discount .c-item__label {
  font-family: var(--text-font-family-paragraph-md);
  font-weight: var(--text-font-weight-paragraph-md);
  font-size: var(--text-font-size-paragraph-md);
  line-height: var(--text-line-height-paragraph-md);
  letter-spacing: var(--text-letter-spacing-paragraph-md);
}
.c-item--order-fee .c-item__price, .c-item--order-discount .c-item__price {
  display: flex;
  align-items: baseline;
  gap: 0.25rem;
}
.c-item--order-fee .c-item__price span:first-child, .c-item--order-discount .c-item__price span:first-child {
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
}
.c-item--order-fee .c-item__price span:last-child, .c-item--order-discount .c-item__price span:last-child {
  font-family: var(--text-font-family-paragraph-md);
  font-weight: var(--text-font-weight-paragraph-md);
  font-size: var(--text-font-size-paragraph-md);
  line-height: var(--text-line-height-paragraph-md);
  letter-spacing: var(--text-letter-spacing-paragraph-md);
}
.c-item--search-product, .c-item--search-supplier {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0 0.75rem;
  background-color: var(--surface-100);
}
.c-item--search-product .c-item__badge, .c-item--search-supplier .c-item__badge {
  flex-shrink: 0;
}
.c-item--search-product .c-item__figure, .c-item--search-supplier .c-item__figure {
  flex-shrink: 0;
  aspect-ratio: 1/1;
  height: 4rem;
  position: relative;
}
.c-item--search-product .c-item__image, .c-item--search-supplier .c-item__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.c-item--search-product .c-item__main, .c-item--search-supplier .c-item__main {
  flex: 1;
}
.c-item--search-product .c-item__title, .c-item--search-supplier .c-item__title {
  font-family: var(--text-font-family-paragraph-md);
  font-weight: var(--text-font-weight-paragraph-md);
  font-size: var(--text-font-size-paragraph-md);
  line-height: var(--text-line-height-paragraph-md);
  letter-spacing: var(--text-letter-spacing-paragraph-md);
}
.c-item--search-product .c-item__caption, .c-item--search-supplier .c-item__caption {
  color: var(--text-500);
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
}

.c-slider {
  --track-gap: 0;
  --slide-width: 100%;
  transition: 0.4s height, 0.4s aspect-ratio;
}
.c-slider__track {
  padding: 0 calc((100% - var(--slide-width)) / 2);
  overflow-x: auto;
  height: 100%;
  display: flex;
  gap: var(--track-gap);
  scroll-snap-type: x mandatory;
  transition: 0.4s padding, 0.4s gap;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.c-slider__track::-webkit-scrollbar {
  display: none;
}
.c-slider__slide {
  width: 100%;
  height: 100%;
  flex-shrink: 0;
  scroll-snap-align: center;
  transition: 0.4s width;
}

.c-badge {
  width: 4rem;
  height: 4rem;
  position: relative;
}
.c-badge__symbol {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  background-color: var(--surface-100);
}
.c-badge__symbol[src*=svg] {
  object-fit: contain;
  border-radius: 0;
  background-color: transparent;
}
.c-badge__chip {
  position: absolute;
  bottom: 0.25rem;
  right: 0.25rem;
  width: 1rem;
  height: 1rem;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.c-badge__chip svg {
  display: none;
  width: 0.75rem;
  height: 0.75rem;
}
.c-badge--sm {
  width: 3rem;
  height: 3rem;
}
.c-badge--sm .c-badge__chip {
  bottom: 0.125rem;
  right: 0.125rem;
  width: 0.75rem;
  height: 0.75rem;
}
.c-badge--sm .c-badge__chip svg {
  display: none;
  width: 0.5rem;
  height: 0.5rem;
}
.c-badge[data-available=green] .c-badge__chip {
  background-color: var(--accent-success-500);
}
.c-badge[data-available=green] .c-badge__chip svg:first-child {
  display: block;
}
.c-badge[data-available=orange] .c-badge__chip {
  background-color: var(--accent-warning-500);
}
.c-badge[data-available=orange] .c-badge__chip svg:first-child {
  display: block;
}
.c-badge[data-available=red] .c-badge__chip {
  background-color: var(--accent-error-400);
}
.c-badge[data-available=red] .c-badge__chip svg:last-child {
  display: block;
}
.c-badge[data-available=gray] .c-badge__chip {
  background-color: var(--surface-500);
}
.c-badge[data-available=gray] .c-badge__chip svg:last-child {
  display: block;
}

.c-sheet {
  min-height: 100%;
}
.c-sheet__text {
  padding: 1rem;
  display: none;
}
.c-sheet__text p {
  font-family: var(--text-font-family-paragraph-md);
  font-weight: var(--text-font-weight-paragraph-md);
  font-size: var(--text-font-size-paragraph-md);
  line-height: var(--text-line-height-paragraph-md);
  letter-spacing: var(--text-letter-spacing-paragraph-md);
}
.c-sheet__slider {
  --track-gap: 0.5rem;
  --slide-width: 60%;
}
.c-sheet__slider--expanded {
  --track-gap: 1rem;
  --slide-width: 100%;
}
.c-sheet__control {
  position: absolute;
  width: 1.875rem;
  height: 1.875rem;
  cursor: pointer;
  transform: translateZ(0);
}
.c-sheet__control--close {
  top: 1rem;
  right: 1rem;
}
.c-sheet__control svg {
  width: 100%;
  height: 100%;
}

.c-card__header {
  padding: 1rem 0 0.5rem 0;
  transition: 0.4s padding;
}
.c-card__title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
  transition: 0.4s all;
}
.c-card__banner {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0.5rem;
  background-color: var(--brand-chartreuse);
  transition: 0.4s padding;
}
.c-card__banner:empty {
  display: none;
}
.c-card__strip {
  display: flex;
  gap: 0.25rem;
  padding: 0.25rem;
  border-radius: 0.25rem;
  background-color: var(--surface-100);
  font-family: var(--text-font-family-paragraph-md);
  font-weight: var(--text-font-weight-paragraph-md);
  font-size: var(--text-font-size-paragraph-md);
  line-height: var(--text-line-height-paragraph-md);
  letter-spacing: var(--text-letter-spacing-paragraph-md);
}
.c-card__cue {
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
  border-radius: 0.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--accent-cyan);
  font-size: 0.75rem;
}
.c-card__main {
  background-color: var(--surface-100);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: relative;
  cursor: pointer;
}
.c-card__highlight {
  position: absolute;
  top: 8rem;
  bottom: 0;
  width: calc(100% - 1rem);
  background-color: var(--brand-chartreuse);
  opacity: 0;
  transition: 0.4s width, 0.4s opacity;
}
.c-card__symbol {
  position: relative;
  margin-top: 0.5rem;
  width: 10rem;
  height: 10rem;
  object-fit: cover;
  border-radius: 50%;
  box-shadow: 0 2px 8px 0 rgba(26, 26, 26, 0.25);
  background-color: var(--surface-100);
  transition: 0.4s margin, 0.4s width, 0.4s height;
}
.c-card__symbol[src*=svg] {
  object-fit: contain;
  border-radius: 0;
  box-shadow: none;
  background-color: transparent;
}
.c-card__caption {
  position: absolute;
  top: 1rem;
  left: 1rem;
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
  display: none;
}
.c-card__caption span:first-child {
  color: var(--text-700);
}
.c-card__caption span:last-child {
  color: var(--text-500);
}
.c-card__text {
  position: relative;
  padding: 0 2rem 1rem 2rem;
  display: none;
  transform: translateZ(0);
}
.c-card__text h1, .c-card__text h2, .c-card__text h3, .c-card__text h4, .c-card__text h5, .c-card__text h6 {
  text-align: center;
}
.c-card__text p {
  font-family: var(--text-font-family-paragraph-md);
  font-weight: var(--text-font-weight-paragraph-md);
  font-size: var(--text-font-size-paragraph-md);
  line-height: var(--text-line-height-paragraph-md);
  letter-spacing: var(--text-letter-spacing-paragraph-md);
}
.c-card__tags {
  display: flex;
  gap: 0.5rem;
  margin-top: 0.5rem;
}
.c-card__tag {
  padding: 0.25rem 0.5rem;
  border-radius: 0.5rem;
  background-color: var(--surface-200);
}
.c-card__info {
  position: relative;
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 0.5rem 1rem;
  transition: 0.4s padding;
  transform: translateZ(0);
}
.c-card__measure {
  display: inline-flex;
  align-items: baseline;
  gap: 0.25rem;
}
.c-card__measure span:first-child {
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
  transition: 0.4s all;
}
.c-card__measure span:last-child {
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
  transition: 0.4s all;
}
.c-card__price {
  display: inline-flex;
  align-items: baseline;
  gap: 0.25rem;
}
.c-card__price span:first-child {
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
  transition: 0.4s all;
}
.c-card__price span:last-child {
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
  transition: 0.4s all;
}
.c-card__footer {
  padding: 0 0.5rem 0.5rem 0.5rem;
  transition: 0.4s padding;
}
.c-card__note {
  padding: 0.25rem 0;
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
.c-card__note span {
  color: var(--text-500);
  font-family: var(--text-font-family-caption-md);
  font-weight: var(--text-font-weight-caption-md);
  font-size: var(--text-font-size-caption-md);
  line-height: var(--text-line-height-caption-md);
  letter-spacing: var(--text-letter-spacing-caption-md);
  display: none;
}
.c-card__chip {
  width: 1rem;
  height: 1rem;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.c-card__chip svg {
  display: none;
  width: 0.75rem;
  height: 0.75rem;
}
.c-card__button {
  height: 2.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
  cursor: pointer;
  transition: 0.4s height, 0.4s all;
}
.c-card__button svg {
  width: 1.5rem;
  height: 1.5rem;
}
.c-card__button span:last-child {
  display: none;
}
.c-card--expanded .c-card__header {
  padding: 1rem 1rem 0.5rem 1rem;
}
.c-card--expanded .c-card__title {
  font-family: var(--text-font-family-heading-xl);
  font-weight: var(--text-font-weight-heading-xl);
  font-size: var(--text-font-size-heading-xl);
  line-height: var(--text-line-height-heading-xl);
  letter-spacing: var(--text-letter-spacing-heading-xl);
}
.c-card--expanded .c-card__banner {
  padding: 0.5rem 1rem;
}
.c-card--expanded .c-card__highlight {
  width: calc(100% - 2rem);
  opacity: 1;
}
.c-card--expanded .c-card__symbol {
  margin-top: 1rem;
  margin-bottom: 1rem;
  width: 16rem;
  height: 16rem;
}
.c-card--expanded .c-card__symbol[src*=svg] {
  margin-top: -1rem;
  margin-bottom: -1.75rem;
}
.c-card--expanded .c-card__info {
  padding: 0rem 2rem 1rem 2rem;
}
.c-card--expanded .c-card__measure span:first-child {
  font-family: var(--text-font-family-heading-xl);
  font-weight: var(--text-font-weight-heading-xl);
  font-size: var(--text-font-size-heading-xl);
  line-height: var(--text-line-height-heading-xl);
  letter-spacing: var(--text-letter-spacing-heading-xl);
}
.c-card--expanded .c-card__measure span:last-child {
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
}
.c-card--expanded .c-card__price span:first-child {
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
}
.c-card--expanded .c-card__price span:last-child {
  font-family: var(--text-font-family-heading-xl);
  font-weight: var(--text-font-weight-heading-xl);
  font-size: var(--text-font-size-heading-xl);
  line-height: var(--text-line-height-heading-xl);
  letter-spacing: var(--text-letter-spacing-heading-xl);
}
.c-card--expanded .c-card__footer {
  padding: 0 1rem 1rem 1rem;
}
.c-card--expanded .c-card__button {
  height: 3.5rem;
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
}
.c-card[data-available=green] .c-card__note span:nth-child(2) {
  display: inline;
}
.c-card[data-available=green] .c-card__chip {
  background-color: var(--accent-success-500);
}
.c-card[data-available=green] .c-card__chip svg:first-child {
  display: block;
}
.c-card[data-available=green] .c-card__button {
  background-color: var(--accent-success-500);
}
.c-card[data-available=orange] .c-card__note span:nth-child(3) {
  display: inline;
}
.c-card[data-available=orange] .c-card__chip {
  background-color: var(--accent-warning-500);
}
.c-card[data-available=orange] .c-card__chip svg:first-child {
  display: block;
}
.c-card[data-available=orange] .c-card__button {
  background-color: var(--accent-warning-500);
}
.c-card[data-available=red] .c-card__note span:nth-child(4) {
  display: inline;
}
.c-card[data-available=red] .c-card__chip {
  background-color: var(--accent-error-400);
}
.c-card[data-available=red] .c-card__chip svg:last-child {
  display: block;
}
.c-card[data-available=red] .c-card__button {
  color: var(--text-300);
  background-color: var(--surface-300);
  pointer-events: none;
}
.c-card[data-available=gray] .c-card__note span:nth-child(5) {
  display: inline;
}
.c-card[data-available=gray] .c-card__chip {
  background-color: var(--surface-500);
}
.c-card[data-available=gray] .c-card__chip svg:last-child {
  display: block;
}
.c-card[data-available=gray] .c-card__button {
  color: var(--text-300);
  background-color: var(--surface-300);
  pointer-events: none;
}
.c-card[data-available=green][data-basket] .c-card__button, .c-card[data-available=orange][data-basket] .c-card__button {
  opacity: 0.5;
  pointer-events: none;
  transform: translateZ(0);
}
.c-card[data-available=green][data-basket] .c-card__button span, .c-card[data-available=orange][data-basket] .c-card__button span {
  display: none;
}
.c-card[data-available=green][data-basket] .c-card__button span:last-child, .c-card[data-available=orange][data-basket] .c-card__button span:last-child {
  display: block;
}
.c-card[data-preorder=before] .c-card__footer {
  display: none;
}

.c-checkout {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.c-checkout__track {
  display: flex;
  height: 100%;
  transition: 0.4s transform;
}
.c-checkout__track[data-current=basket] {
  transform: translateX(calc(-0 * 100%));
}
.c-checkout__track[data-current=info] {
  transform: translateX(calc(-1 * 100%));
}
.c-checkout__track[data-current=overview] {
  transform: translateX(calc(-2 * 100%));
}
.c-checkout__track[data-current=payment] {
  transform: translateX(calc(-3 * 100%));
}
.c-checkout__track[data-current=done] {
  transform: translateX(calc(-0 * 100%));
}
.c-checkout__page {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  pointer-events: none;
}
.c-checkout__track[data-current=basket] .c-checkout__page[data-page=basket] {
  pointer-events: auto;
}
.c-checkout__track[data-current=info] .c-checkout__page[data-page=info] {
  pointer-events: auto;
}
.c-checkout__track[data-current=overview] .c-checkout__page[data-page=overview] {
  pointer-events: auto;
}
.c-checkout__track[data-current=payment] .c-checkout__page[data-page=payment] {
  pointer-events: auto;
}
.c-checkout__track[data-current=done] .c-checkout__page[data-page=done] {
  pointer-events: auto;
}
.c-checkout__header {
  flex-shrink: 0;
  height: 4rem;
  padding: 0 3.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--surface-100);
  color: var(--primary-action-500);
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
  position: relative;
}
.c-checkout__control {
  position: absolute;
  width: 1.5rem;
  height: 1.5rem;
  cursor: pointer;
}
.c-checkout__control--back {
  left: 1rem;
}
.c-checkout__control--close {
  right: 1rem;
}
.c-checkout__control svg {
  width: 100%;
  height: 100%;
}
.c-checkout__main {
  flex: 1;
  overflow: auto;
}
.c-checkout__list {
  height: 100%;
  gap: 0.5rem;
  padding: 0.5rem 0;
}
.c-checkout__item {
  background-color: var(--surface-100);
}
.c-checkout__footer {
  flex-shrink: 0;
  padding: 1.875rem 1rem;
  background-color: var(--surface-100);
  box-shadow: 0 0 16px 0 rgba(26, 26, 26, 0.08);
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.c-checkout__total {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.c-checkout__label {
  color: var(--text-500);
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
}
.c-checkout__price {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
}
.c-checkout__price span:first-child {
  color: var(--text-500);
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
}
.c-checkout__price span:last-child {
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
}
.c-checkout__disclaimer {
  text-align: right;
  color: var(--text-500);
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
}
.c-checkout__disclaimer svg {
  width: 0.75rem;
  height: 0.75rem;
  color: var(--accent-success-500);
}
.c-checkout__button {
  width: 100%;
  height: 3.5rem;
  background-color: var(--brand-chartreuse);
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s;
}
.c-checkout__button--disabled {
  background-color: var(--surface-300);
  color: var(--text-300);
  pointer-events: none;
}
.c-checkout__button--muted {
  background-color: var(--surface-400);
  color: var(--primary-action-500);
}
.c-checkout__button--accented {
  background-color: var(--surface-400);
  color: var(--accent-error-400);
}
.c-checkout__button--waiting {
  background-color: var(--surface-300);
  color: var(--text-300);
  pointer-events: none;
  position: relative;
  overflow: hidden;
}
.c-checkout__button--waiting::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5), transparent);
  animation: shimmer 2s infinite;
}
@keyframes shimmer {
  0% {
    left: -100%;
  }
  100% {
    left: 100%;
  }
}

.c-order {
  padding: 3rem 2rem;
}
.c-order__lead {
  margin-bottom: 1.5rem;
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
}
.c-order__title {
  margin-top: 1.75rem;
  margin-bottom: 0.25rem;
  color: var(--text-500);
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
}
.c-order__text {
  overflow-wrap: break-word;
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
}
.c-order__list {
  margin-bottom: 1.5rem;
}
.c-order__total {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.c-order__label {
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
}
.c-order__price {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
}
.c-order__price span:first-child {
  font-family: var(--text-font-family-heading-sm);
  font-weight: var(--text-font-weight-heading-sm);
  font-size: var(--text-font-size-heading-sm);
  line-height: var(--text-line-height-heading-sm);
  letter-spacing: var(--text-letter-spacing-heading-sm);
}
.c-order__price span:last-child {
  font-family: var(--text-font-family-heading-md);
  font-weight: var(--text-font-weight-heading-md);
  font-size: var(--text-font-size-heading-md);
  line-height: var(--text-line-height-heading-md);
  letter-spacing: var(--text-letter-spacing-heading-md);
}

.c-receipt {
  padding: 3rem 2rem;
}
.c-receipt__message {
  font-family: var(--text-font-family-paragraph-md);
  font-weight: var(--text-font-weight-paragraph-md);
  font-size: var(--text-font-size-paragraph-md);
  line-height: var(--text-line-height-paragraph-md);
  letter-spacing: var(--text-letter-spacing-paragraph-md);
}
.c-receipt__reference {
  margin-top: 0.75rem;
  font-family: var(--text-font-family-paragraph-sm);
  font-weight: var(--text-font-weight-paragraph-sm);
  font-size: var(--text-font-size-paragraph-sm);
  line-height: var(--text-line-height-paragraph-sm);
  letter-spacing: var(--text-letter-spacing-paragraph-sm);
}

.c-env {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.c-env__item {
  display: block;
  padding: 0rem 0.25rem;
  border-radius: 0.5rem;
  border: 1.5px solid currentColor;
}
.c-env__item svg {
  width: 1em;
  height: 1em;
  vertical-align: middle;
}

@media (max-width: 820px) {
  :root {
    --outer-width: 820px;
  }
}
@media (min-width: 1920px) {
  .u-laptop,
  .u-laptop-tablet-phone,
  .u-tablet,
  .u-tablet-phone,
  .u-phone {
    display: none;
  }
}
@media (min-width: 1440px) and (max-width: 1919px) {
  .u-desktop,
  .u-tablet-phone,
  .u-tablet,
  .u-phone {
    display: none;
  }
}
@media (min-width: 400px) and (max-width: 1439px) {
  .u-desktop,
  .u-desktop-laptop,
  .u-laptop,
  .u-phone {
    display: none;
  }
}
@media (max-width: 399px) {
  :root {
    --text-font-size-heading-lg: 1.3125rem;
  }
  .u-desktop,
  .u-desktop-laptop,
  .u-desktop-laptop-tablet,
  .u-laptop,
  .u-tablet {
    display: none;
  }
  .c-item--supplier .c-item__figure {
    height: 12.5rem;
  }
}

/*# sourceMappingURL=site.bundle.css.map */