@media print {
  @page {
      size: 1200px 1680px;
  }
}

:root {
  font: var(--zenchef-font-sans_paragraph_l_regular);
}
@media screen {
  :root {
    background: rgb(var(--zenchef-rgb-Oat));
  }
}
@media print {
  :root {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;

    /* Override Zenchef Ink colors to use black/gray ink. */
    --zenchef-rgb-Ink50: 245, 245, 245;
    --zenchef-rgb-Ink100: 240, 240, 240;
    --zenchef-rgb-Ink200: 220, 230, 230;
    --zenchef-rgb-Ink300: 210, 210, 210;
    --zenchef-rgb-Ink400: 180, 180, 180;
    --zenchef-rgb-Ink500: 110, 110, 110;
    --zenchef-rgb-Ink600: 80, 80, 80;
    --zenchef-rgb-Ink700: 60, 60, 60;
    --zenchef-rgb-Ink800: 30, 30, 30;
    --zenchef-rgb-Ink900: 0, 0, 0;

    /* Override Zenchef Charcoal colors to use black/gray ink. */
    --zenchef-rgb-Charcoal50: 247, 247, 247;
    --zenchef-rgb-Charcoal100: 239, 239, 239;
    --zenchef-rgb-Charcoal200: 218, 218, 218;
    --zenchef-rgb-Charcoal300: 201, 201, 201;
    --zenchef-rgb-Charcoal400: 167, 167, 167;
    --zenchef-rgb-Charcoal500: 98, 98, 98;
    --zenchef-rgb-Charcoal600: 76, 76, 76;
    --zenchef-rgb-Charcoal700: 37, 37, 37;
    --zenchef-rgb-Charcoal800: 23, 23, 23;
    --zenchef-rgb-Charcoal900: 9, 9, 9;
  }
}

.layoutHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;

  border-bottom: 1px solid rgb(var(--zenchef-rgb-BlueTape));
  color: rgb(var(--zenchef-rgb-BlueTape));
  padding: 8px;
  margin-bottom: 16px;
}
@media (min-width: 768px) {
  .layoutHeader {
    margin-bottom: 40px;
  }
}
.layoutHeader__left,
.layoutHeader__right {
  flex: 1 1 0;

  display: flex;
  align-items: center;
}
.layoutHeader__left {
  justify-content: flex-start;
}
.layoutHeader__right {
  justify-content: flex-end;
}
.layoutHeader__center {
  flex: 0 0 auto;
}

.logo {
  height: 32px;
}
.btnGoToZenchef {
  display: flex;
  align-items: center;
  gap: 4px;
}
@media print {
  .btnGoToZenchef {
    display: none !important;
  }
}
.btnGoToZenchef .externalLinkIcon {
  height: 16px;
  width: 16px;
}

.layoutBody {
  margin: 0 auto;
  max-width: 1184px;
}
@media screen {
  .layoutBody {
    padding: 0 16px;
    padding-bottom: 16px;
  }
}
@media screen and (min-width: 768px) {
  .layoutBody {
    padding-bottom: 40px;
  }
}

/* Basic links */
:where(:any-link) {
  color: rgb(var(--zenchef-rgb-Blue700));
}
:where(:any-link:hover) {
  color: rgb(var(--zenchef-rgb-Blue900));
}

/* Basic headings */
h1:not([class]) {
  font: var(--zenchef-font-sans_display_s);
}
h2:not([class]) {
  font: var(--zenchef-font-sans_title_xl);
  letter-spacing: var(--zenchef-letterSpacing-sans_title_xl);
}
h3:not([class]) {
  font: var(--zenchef-font-sans_title_l);
}
h4:not([class]) {
  font: var(--zenchef-font-sans_title_m);
}
h5:not([class]) {
  font: var(--zenchef-font-sans_title_s);
}
h6:not([class]) {
  font: var(--zenchef-font-sans_title_xs);
  letter-spacing: var(--zenchef-letterSpacing-sans_title_xs);
  text-transform: var(--zenchef-textTransform-sans_title_xs);
}
