@7shifts/sous-chef 3.41.0 → 3.42.0

package/dist/index.css

@@ -1,3 +1,24 @@
+:root {
+  --font-family-brand: "Proxima Nova", sans-serif;
+  --font-family-body: "Proxima Nova", sans-serif;
+  --font-size-100: 0.75rem;
+  --font-size-200: 0.875rem;
+  --font-size-300: 1rem;
+  --font-size-400: 1.25rem;
+  --font-size-500: 1.5rem;
+  --font-size-600: 1.75rem;
+  --font-size-700: 2.5rem;
+  --font-line-height-100: 1rem;
+  --font-line-height-200: 1.125rem;
+  --font-line-height-300: 1.25rem;
+  --font-line-height-400: 1.5rem;
+  --font-line-height-500: 1.75rem;
+  --font-line-height-600: 2rem;
+  --font-line-height-700: 2.75rem;
+  --p-font-weight-light: 300;
+  --p-font-weight-normal: 400;
+  --p-font-weight-bold: 600;
+}
 :root {
   --color-white: #fff;
   --color-white-rgb: 255, 255, 255;
@@ -144,22 +165,23 @@
   display: inline-flex;
 }
 ._3s_-x {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-100);
+  line-height: var(--font-line-height-100);
+  font-weight: var(--p-font-weight-normal);
   color: var(--color-grey-500);
-  font-family: "Proxima Nova", sans-serif;
-  font-weight: 400;
-  font-size: 12px;
-  line-height: 16px;
 }
 
 ._29W-o {
-  line-height: normal;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
+  font-weight: var(--p-font-weight-bold);
   padding: 0;
   width: auto;
   float: none;
   color: var(--color-grey-500);
-  font-family: "Proxima Nova", sans-serif;
-  font-weight: 600;
-  font-size: 14px;
   min-height: 16px;
 }
 
@@ -188,24 +210,25 @@ Just for future references:
 }
 
 ._LbMlH {
-  line-height: normal;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
+  font-weight: var(--p-font-weight-bold);
   padding: 0;
   width: auto;
   float: none;
   color: var(--color-grey-500);
-  font-family: "Proxima Nova", sans-serif;
-  font-weight: 600;
-  font-size: 14px;
   min-height: 16px;
   margin-left: 8px;
 }
 
 ._15FwS {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-100);
+  line-height: var(--font-line-height-100);
+  font-weight: var(--p-font-weight-normal);
   color: var(--color-grey-500);
-  font-family: "Proxima Nova", sans-serif;
-  font-weight: 400;
-  font-size: 12px;
-  line-height: 16px;
   margin-left: 48px;
   display: block;
 }
@@ -334,8 +357,10 @@ Just for future references:
   text-align: left;
 }
 ._1lo14 {
-  font-family: "Proxima Nova", sans-serif;
-  font-size: 14px;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   position: fixed;
   padding: 12px;
   box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.3);
@@ -358,7 +383,11 @@ Just for future references:
   color: var(--color-grey-500);
 }
 ._2rZ80 {
-  font-weight: 600;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
+  font-weight: var(--p-font-weight-bold);
 }
 
 ._2ZZTv {
@@ -390,12 +419,13 @@ Just for future references:
   color: var(--color-grey-500);
 }
 ._YjZTi {
-  font-family: "Proxima Nova", sans-serif;
-  font-weight: 600;
-  font-size: 14px;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
+  font-weight: var(--p-font-weight-bold);
   text-align: center;
-  line-height: 20px;
-  padding: 8px 12px;
+  padding: 9px 12px;
   border-radius: 4px;
   border-width: 1px;
   min-width: 38px;
@@ -770,9 +800,11 @@ Just for future references:
   border: 1px solid var(--color-grey-200);
 }
 ._31UYJ {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-100);
+  line-height: var(--font-line-height-100);
+  font-weight: var(--p-font-weight-normal);
   display: flex;
-  line-height: 14px;
-  font-size: 12px;
   flex-direction: column;
   flex-grow: 1;
   align-self: center;
@@ -792,12 +824,14 @@ Just for future references:
   color: var(--color-grey-500);
 }
 ._38KEH._38KEH {
-  font-family: "Proxima Nova", sans-serif;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   background: var(--color-grey-500);
   color: var(--color-white);
   border-radius: 4px;
   min-height: auto;
-  font-size: 14px;
 }
 ._38KEH._1qUTA {
   background-color: var(--color-radish-400);
@@ -806,17 +840,24 @@ Just for future references:
 ._iEk2C {
   padding-left: 20px;
 }
+
+@media only screen and (max-width: 480px) {
+  .Toastify__toast-container--bottom-center {
+    padding: 1em;
+  }
+}
 ._1vpCK {
   text-align: left;
 }
 ._dJWps {
-  line-height: 20px;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-100);
+  line-height: var(--font-line-height-100);
+  font-weight: var(--p-font-weight-normal);
+  font-weight: var(--p-font-weight-bold);
   padding: 0 16px 8px 16px;
   background-color: unset;
   color: var(--color-grey-500);
-  font-size: 12px;
-  font-weight: 600;
-  font-family: "Proxima Nova", sans-serif;
   border: 0;
 }
 ._14AEw {
@@ -881,10 +922,12 @@ Just for future references:
   table-layout: fixed;
 }
 ._1YYyL {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   border: 1px solid var(--color-grey-200);
   border-radius: 8px;
-  font-family: "Proxima Nova", sans-serif;
-  font-size: 14px;
 }
 ._1YYyL tr:first-of-type > td:first-of-type {
   border-top-left-radius: 8px;
@@ -905,8 +948,11 @@ Just for future references:
   border-bottom-right-radius: 0;
 }
 ._ASPHe {
-  font-weight: 600;
-  font-size: 14px;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
+  font-weight: var(--p-font-weight-bold);
 }
 ._ASPHe tr td {
   background: var(--color-grey-100);
@@ -928,7 +974,6 @@ Just for future references:
 }
 ._1ahC- {
   margin-top: 20px;
-  font-family: "Proxima Nova", sans-serif;
 }
 ._OLWH6 {
   width: 100%;
@@ -1021,15 +1066,19 @@ Just for future references:
 }
 
 ._iZe2g {
-  font-weight: 600;
-  font-size: 14px;
-  line-height: 16px;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
+  font-weight: var(--p-font-weight-bold);
   color: var(--color-grey-500);
 }
 
 ._2KsRB {
-  font-size: 14px;
-  line-height: 16px;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   flex-grow: 1;
   color: var(--color-grey-500);
 }
@@ -1107,12 +1156,13 @@ Just for future references:
   min-height: 38px;
 }
 ._1eCfd {
-  font-size: 12px;
-  line-height: 12px;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-100);
+  line-height: var(--font-line-height-100);
+  font-weight: var(--p-font-weight-normal);
   color: var(--color-grey-500);
 }
 ._XcD7g {
-  font-family: "Proxima Nova", sans-serif;
   position: absolute;
   list-style: none;
   box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
@@ -1137,14 +1187,15 @@ Just for future references:
   box-shadow: 0 0 8px var(--color-eggplant-300);
 }
 ._3gsXT {
-  line-height: normal;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
+  font-weight: var(--p-font-weight-bold);
   padding: 0;
   width: auto;
   float: none;
   color: var(--color-grey-500);
-  font-family: "Proxima Nova", sans-serif;
-  font-weight: 600;
-  font-size: 14px;
   min-height: 16px;
 }
 
@@ -1154,24 +1205,27 @@ Just for future references:
   text-overflow: ellipsis;
 }
 ._1sq2y {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-100);
+  line-height: var(--font-line-height-100);
+  font-weight: var(--p-font-weight-normal);
   color: var(--color-grey-500);
-  font-family: "Proxima Nova", sans-serif;
-  font-weight: 400;
-  font-size: 12px;
-  line-height: 16px;
 }
 ._2EaHy {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-100);
+  line-height: var(--font-line-height-100);
+  font-weight: var(--p-font-weight-normal);
   color: var(--color-radish-400);
-  font-family: "Proxima Nova", sans-serif;
-  font-weight: 400;
-  font-size: 12px;
 }
 ._3BVGA {
-  padding: 7px;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   line-height: 22px;
+  padding: 7px;
   border-radius: 4px;
-  font-size: 14px;
-  font-family: "Proxima Nova", sans-serif;
   color: var(--color-grey-500);
   box-shadow: none;
   border: 1px solid var(--color-grey-200);
@@ -1220,18 +1274,18 @@ Just for future references:
 }
 
 ._KE6FS {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   position: absolute;
-  line-height: 22px;
   padding: 8px;
   color: var(--color-grey-500);
   min-width: 8px;
   pointer-events: none;
-  font-size: 14px;
-  font-family: "Proxima Nova", sans-serif;
   box-sizing: content-box;
   display: flex;
   align-items: center;
-  height: 22px;
   top: 0;
   bottom: 0;
   margin-top: auto;
@@ -1245,18 +1299,18 @@ Just for future references:
 }
 
 ._1Zl92 {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   position: absolute;
-  line-height: 22px;
   padding: 8px;
   color: var(--color-grey-500);
   min-width: 8px;
   pointer-events: none;
-  font-size: 14px;
-  font-family: "Proxima Nova", sans-serif;
   box-sizing: content-box;
   display: flex;
   align-items: center;
-  height: 22px;
   top: 0;
   bottom: 0;
   margin-top: auto;
@@ -1269,7 +1323,6 @@ Just for future references:
   color: var(--color-grey-400);
 }
 ._2aZGZ {
-  font-family: "Proxima Nova", sans-serif;
   list-style: none;
   margin: -20px;
   padding: 0;
@@ -1300,10 +1353,12 @@ Just for future references:
   color: var(--color-grey-400);
 }
 ._3zhrP {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   color: var(--color-grey-400);
   padding: 12px;
-  font-size: 14px;
-  line-height: 20px;
   display: flex;
   white-space: nowrap;
   gap: 8px;
@@ -1327,59 +1382,66 @@ Just for future references:
   outline: none;
 }
 h1._32amZ {
-  font-size: 1.75rem;
-  line-height: 2rem;
-  font-weight: 600;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-600);
+  line-height: var(--font-line-height-600);
+  font-weight: var(--p-font-weight-bold);
 }
 
 h2._32amZ {
-  font-size: 1.5rem;
-  line-height: 1.75rem;
-  font-weight: 600;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-500);
+  line-height: var(--font-line-height-500);
+  font-weight: var(--p-font-weight-bold);
 }
 
 h3._32amZ {
-  font-size: 1.25rem;
-  line-height: 1.5rem;
-  font-weight: 600;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-400);
+  line-height: var(--font-line-height-400);
+  font-weight: var(--p-font-weight-bold);
 }
 
 h4._32amZ {
-  font-size: 1.25rem;
-  line-height: 1.5rem;
-  font-weight: 400;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-400);
+  line-height: var(--font-line-height-400);
+  font-weight: var(--p-font-weight-normal);
   color: var(--color-grey-400);
 }
 
 h5._32amZ {
-  font-size: 1rem;
-  line-height: 1.25rem;
-  font-weight: 400;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-300);
+  line-height: var(--font-line-height-300);
+  font-weight: var(--p-font-weight-normal);
   color: var(--color-grey-400);
 }
 
 ._32amZ {
-  font-family: "Proxima Nova", sans-serif;
   color: var(--color-grey-500);
   margin: 0;
 }
 ._ayJRy {
-  font-size: 0.875rem;
-  line-height: 1.125rem;
-  font-weight: 400;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
 }
 ._3g1gi {
-  font-size: 0.75rem;
-  line-height: 1rem;
-  font-weight: 400;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-100);
+  line-height: var(--font-line-height-100);
+  font-weight: var(--p-font-weight-normal);
 }
 ._20Phg {
-  font-size: 2.5rem;
-  line-height: 2.75rem;
-  font-weight: 600;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-700);
+  line-height: var(--font-line-height-700);
+  font-weight: var(--p-font-weight-bold);
 }
 ._A0AyZ {
-  font-weight: 600;
+  font-weight: var(--p-font-weight-bold);
 }
 ._3jayQ {
   font-style: italic;
@@ -1475,15 +1537,16 @@ h5._32amZ {
   text-transform: uppercase;
 }
 ._12zfd {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   display: flex;
   gap: 8px;
   border-radius: 4px;
   text-decoration: none;
   color: var(--color-grey-500);
   padding: 8px;
-  font-family: "Proxima Nova", sans-serif;
-  font-size: 14px;
-  line-height: 16px;
   align-items: center;
   border: 1px solid transparent;
 }
@@ -1507,8 +1570,11 @@ h5._32amZ {
   max-width: 1000px;
 }
 ._EtQ8V {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   color: var(--color-white);
-  font-size: 14px;
   padding: 16px;
   text-align: center;
 }
@@ -1527,14 +1593,16 @@ h5._32amZ {
   height: 48px;
 }
 ._2u-Hw {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-100);
+  line-height: var(--font-line-height-100);
+  font-weight: var(--p-font-weight-normal);
   top: 50%;
   left: 50%;
   width: 100%;
   text-align: center;
   position: absolute;
   transform: translate(-50%, -50%);
-  font-size: 12px;
-  font-weight: 400;
   color: var(--color-grey-500);
 }
 ._ORvUI {
@@ -1560,7 +1628,7 @@ h5._32amZ {
   display: flex;
   justify-content: space-around;
   color: var(--color-grey-500);
-  font-family: "Proxima Nova", sans-serif;
+  font-family: var(--font-family-brand);
 }
 ._WwXRR {
   background: var(--color-grey-100);
@@ -1759,11 +1827,11 @@ h5._32amZ {
   opacity: 0;
 }
 ._2iRIU {
-  font-size: 24px;
-  line-height: 28px;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-500);
+  line-height: var(--font-line-height-500);
+  font-weight: var(--p-font-weight-bold);
   color: var(--color-grey-500);
-  font-weight: 600;
-  font-family: "Proxima Nova", sans-serif;
   padding: 0;
 }
 ._1rw24 {
@@ -1775,10 +1843,11 @@ h5._32amZ {
 }
 
 ._3UWdF {
-  font-size: 20px;
-  line-height: 24px;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-400);
+  line-height: var(--font-line-height-400);
+  font-weight: var(--p-font-weight-normal);
   color: var(--color-grey-400);
-  font-family: "Proxima Nova", sans-serif;
 }
 /**
  * This is for adding a shadow when the body is scrollable.
@@ -1786,10 +1855,11 @@ h5._32amZ {
  * There is a cleaner solution using background-attachment (https://lea.verou.me/2012/04/background-attachment-local/) but I had some issues in Chrome using that approach
  */
 ._vu6lH {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   overflow: auto;
-  font-family: "Proxima Nova", sans-serif;
-  font-size: 14px;
-  line-height: 16px;
   position: relative;
   padding: 0 8px 0 8px;
 }
@@ -1829,7 +1899,7 @@ h5._32amZ {
 }
 ._31ArE {
   --rdp-cell-size: 37px;
-  --rdp-caption-font-size: 18px;
+  --rdp-caption-font-size: var(--font-size-300);
   --rdp-accent-color: var(--color-tangerine-200);
   --rdp-background-color: var(--color-grey-100);
   --rdp-accent-color-dark: var(--color-tangerine-400);
@@ -1857,14 +1927,16 @@ h5._32amZ {
 }
 
 ._3YRyk {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   vertical-align: middle;
   text-align: center;
   height: 100%;
   height: var(--rdp-cell-size);
   padding: 0;
   color: var(--color-grey-400);
-  font-size: 14px;
-  font-weight: 400;
   background: none;
   border: none;
 }
@@ -1906,7 +1978,7 @@ h5._32amZ {
 }
 ._14V7C {
   --rdp-cell-size: 37px;
-  --rdp-caption-font-size: 18px;
+  --rdp-caption-font-size: var(--font-size-300);
   --rdp-accent-color: var(--color-tangerine-200);
   --rdp-background-color: var(--color-grey-100);
   --rdp-accent-color-dark: var(--color-tangerine-400);
@@ -1934,14 +2006,16 @@ h5._32amZ {
 }
 
 ._2AdsD {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   vertical-align: middle;
   text-align: center;
   height: 100%;
   height: var(--rdp-cell-size);
   padding: 0;
   color: var(--color-grey-400);
-  font-size: 14px;
-  font-weight: 400;
   background: none;
   border: none;
 }
@@ -2142,14 +2216,16 @@ input:disabled + ._2W10t::after {
   height: 100%;
 }
 ._1-1WW input {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   border: 1px solid transparent;
   display: flex;
   justify-content: flex-end;
   background: transparent;
   padding: 16px;
   width: 100%;
-  font-size: 14px;
-  font-family: "Proxima Nova", sans-serif;
   border-radius: 0;
 }
 ._1-1WW input:focus {
@@ -2456,8 +2532,11 @@ input:disabled + ._2W10t::after {
   max-width: 667px;
 }
 ._1b3C0 {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   color: var(--color-grey-500);
-  font-size: 12px;
   text-align: center;
 }
 ._3q5OJ {
@@ -2495,10 +2574,12 @@ input:disabled + ._2W10t::after {
   width: 336px;
 }
 ._2UNAw {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   width: 200px;
   border-radius: 0px;
-  font-family: "Proxima Nova", sans-serif;
-  font-size: 14px;
   color: var(--color-grey-500);
   padding-left: 13px;
   height: 38px;
@@ -2550,16 +2631,17 @@ input:disabled + ._2W10t::after {
   display: flex;
 }
 ._9hSoW {
-  font-family: "Proxima Nova", sans-serif;
-  font-weight: 600;
-  font-size: 14px;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
+  font-weight: var(--p-font-weight-bold);
   position: relative;
   background-color: var(--color-grey-100);
   color: var(--color-grey-500);
   border-style: solid;
   border-color: var(--color-grey-200);
-  line-height: 20px;
-  padding: 8px 12px;
+  padding: 9px 12px;
   min-width: 38px;
   height: 38px;
   cursor: pointer;
@@ -2643,18 +2725,19 @@ input:disabled + ._2W10t::after {
 ._3Sc6g {
   margin-bottom: 12px;
   color: var(--color-grey-500);
-  font-family: "Proxima Nova", sans-serif;
 }
 ._39X-5 {
-  line-height: 24px;
-  font-size: 20px;
-  font-weight: 600;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-400);
+  line-height: var(--font-line-height-400);
+  font-weight: var(--p-font-weight-bold);
   margin: 0;
 }
 ._pwBR_ {
-  line-height: 16px;
-  font-size: 14px;
-  font-weight: 400;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   margin: 0;
 }
 ._PFp2d {
@@ -2678,9 +2761,10 @@ input:disabled + ._2W10t::after {
   background-color: var(--color-white);
 }
 ._eyfGn textarea {
-  line-height: 22px;
-  font-size: 14px;
-  font-family: "Proxima Nova", sans-serif;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   color: var(--color-grey-500);
   margin: 0;
   border: none;
@@ -2725,12 +2809,16 @@ input:disabled + ._2W10t::after {
   cursor: pointer;
 }
 ._W4HpY {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
+  font-weight: var(--p-font-weight-bold);
+  color: var(--color-grey-500);
   display: flex;
   align-items: center;
   justify-content: center;
   background-color: var(--color-white);
-  font-size: 14px;
-  font-weight: 600;
   padding: 8px;
   border: 1px solid var(--color-grey-200);
   border-radius: 25px;
@@ -2738,7 +2826,6 @@ input:disabled + ._2W10t::after {
   min-width: 60px;
   text-align: center;
   vertical-align: middle;
-  color: var(--color-grey-500);
   -webkit-user-select: none;
      -moz-user-select: none;
           user-select: none;
@@ -2775,14 +2862,15 @@ input:focus-visible + ._W4HpY {
   outline: none;
 }
 ._3QyeH {
-  line-height: normal;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
+  font-weight: var(--p-font-weight-bold);
   padding: 0;
   width: auto;
   float: none;
   color: var(--color-grey-500);
-  font-family: "Proxima Nova", sans-serif;
-  font-weight: 600;
-  font-size: 14px;
   min-height: 16px;
 }
 
@@ -2793,25 +2881,27 @@ input:focus-visible + ._W4HpY {
 }
 
 ._thT22 {
-  line-height: normal;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
+  font-weight: var(--p-font-weight-bold);
   padding: 0;
   width: auto;
   float: none;
   color: var(--color-grey-500);
-  font-family: "Proxima Nova", sans-serif;
-  font-weight: 600;
-  font-size: 14px;
   min-height: 16px;
 }
 ._3hIRY {
-  line-height: normal;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
+  font-weight: var(--p-font-weight-bold);
   padding: 0;
   width: auto;
   float: none;
   color: var(--color-grey-500);
-  font-family: "Proxima Nova", sans-serif;
-  font-weight: 600;
-  font-size: 14px;
   min-height: 16px;
 }
 
@@ -2822,11 +2912,11 @@ input:focus-visible + ._W4HpY {
 }
 
 ._2RJol {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-100);
+  line-height: var(--font-line-height-100);
+  font-weight: var(--p-font-weight-normal);
   color: var(--color-grey-500);
-  font-family: "Proxima Nova", sans-serif;
-  font-weight: 400;
-  font-size: 12px;
-  line-height: 16px;
 }
 
 ._1md_9 {
@@ -2874,25 +2964,26 @@ input:checked ~ ._3mCob {
   pointer-events: none;
 }
 ._kl23S {
-  line-height: normal;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
+  font-weight: var(--p-font-weight-bold);
   padding: 0;
   width: auto;
   float: none;
   color: var(--color-grey-500);
-  font-family: "Proxima Nova", sans-serif;
-  font-weight: 600;
-  font-size: 14px;
   min-height: 16px;
 }
 ._2-e0g {
   color: var(--color-grey-300);
 }
 ._2CvoH {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-100);
+  line-height: var(--font-line-height-100);
+  font-weight: var(--p-font-weight-normal);
   color: var(--color-grey-500);
-  font-family: "Proxima Nova", sans-serif;
-  font-weight: 400;
-  font-size: 12px;
-  line-height: 16px;
 }
 ._2l2PZ {
   color: var(--color-grey-300);
@@ -2961,11 +3052,13 @@ input:disabled + ._1aaPx::after {
   top: 4px;
 }
 ._2XkkE {
-  padding: 7px;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   line-height: 22px;
+  padding: 7px;
   border-radius: 4px;
-  font-size: 14px;
-  font-family: "Proxima Nova", sans-serif;
   color: var(--color-grey-500);
   box-shadow: none;
   border: 1px solid var(--color-grey-200);
@@ -3014,17 +3107,18 @@ input:disabled + ._1aaPx::after {
 }
 ._1XvvK {
   color: var(--color-grey-200);
-  font-family: "Proxima Nova", sans-serif;
+  font-family: var(--font-family-brand);
 }
 
 ._1cNVk {
   color: var(--color-grey-400);
-  font-family: "Proxima Nova", sans-serif;
+  font-family: var(--font-family-brand);
 }
 ._12jq3 {
-  font-family: "Proxima Nova", sans-serif;
-  font-weight: 16px;
-  font-size: 14px;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   color: var(--color-grey-400);
   display: flex;
   flex-direction: column;
@@ -3032,11 +3126,13 @@ input:disabled + ._1aaPx::after {
   padding: 8px 12px;
 }
 ._10EFd, ._33Mhr {
-  padding: 7px;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   line-height: 22px;
+  padding: 7px;
   border-radius: 4px;
-  font-size: 14px;
-  font-family: "Proxima Nova", sans-serif;
   color: var(--color-grey-500);
   box-shadow: none;
   border: 1px solid var(--color-grey-200);
@@ -3077,11 +3173,13 @@ input:disabled + ._1aaPx::after {
   width: 100%;
 }
 ._vgwnU, ._LZvMX input, ._LZvMX {
-  padding: 7px;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   line-height: 22px;
+  padding: 7px;
   border-radius: 4px;
-  font-size: 14px;
-  font-family: "Proxima Nova", sans-serif;
   color: var(--color-grey-500);
   box-shadow: none;
   border: 1px solid var(--color-grey-200);
@@ -3145,7 +3243,7 @@ input:disabled + ._1aaPx::after {
 }
 ._9qjsN {
   --rdp-cell-size: 37px;
-  --rdp-caption-font-size: 18px;
+  --rdp-caption-font-size: var(--font-size-300);
   --rdp-accent-color: var(--color-tangerine-200);
   --rdp-background-color: var(--color-grey-100);
   --rdp-accent-color-dark: var(--color-tangerine-400);
@@ -3173,14 +3271,16 @@ input:disabled + ._1aaPx::after {
 }
 
 ._2x1hd {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   vertical-align: middle;
   text-align: center;
   height: 100%;
   height: var(--rdp-cell-size);
   padding: 0;
   color: var(--color-grey-400);
-  font-size: 14px;
-  font-weight: 400;
   background: none;
   border: none;
 }
@@ -3239,11 +3339,13 @@ input:disabled + ._1aaPx::after {
   color: var(--color-grey-200);
 }
 ._pPDKc, ._rSyiE input, ._rSyiE {
-  padding: 7px;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   line-height: 22px;
+  padding: 7px;
   border-radius: 4px;
-  font-size: 14px;
-  font-family: "Proxima Nova", sans-serif;
   color: var(--color-grey-500);
   box-shadow: none;
   border: 1px solid var(--color-grey-200);
@@ -3306,15 +3408,17 @@ input:disabled + ._1aaPx::after {
   border-top-right-radius: 4px;
 }
 ._2K8Ob {
-  background-color: white;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
+  background-color: var(--color-white);
   position: absolute;
   height: 36px;
   margin-top: 1px;
   align-items: center;
   display: flex;
   pointer-events: none;
-  font-size: 14px;
-  font-family: "Proxima Nova", sans-serif;
   color: var(--color-grey-500);
 }
 ._1uJbR {
@@ -3322,7 +3426,7 @@ input:disabled + ._1aaPx::after {
   display: flex;
 }
 ._Fc99X {
-  font-size: 12pt;
+  font-size: var(--font-size-200);
 }
 
 input._1zowl {
@@ -3365,11 +3469,11 @@ input._1zowl {
   background-color: var(--color-grey-100);
 }
 ._IHf11 {
-  font-size: 12pt;
+  font-size: var(--font-size-200);
   height: 33px;
 }
 ._1KMRs {
-  font-size: 12pt;
+  font-size: var(--font-size-200);
 }
 @charset "UTF-8";
 ._M2doN {
@@ -4368,17 +4472,18 @@ input._1zowl {
   background-image: url(./flags/zw.svg);
 }
 ._1QLaK {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-100);
+  line-height: var(--font-line-height-100);
+  font-weight: var(--p-font-weight-normal);
   display: inline-flex;
   background-color: var(--color-tangerine-400);
   height: 20px;
   min-width: 20px;
   color: var(--color-white);
   text-align: center;
-  line-height: 20px;
   border-radius: 20px;
-  font-size: 12px;
   box-sizing: border-box;
-  font-weight: normal;
   padding: 0 6px;
   align-items: center;
   border: 1px solid var(--color-white);
@@ -4403,7 +4508,6 @@ input._1zowl {
   justify-content: center;
   align-items: center;
   text-align: center;
-  font-family: "Proxima Nova", sans-serif;
   color: var(--color-white);
   border-radius: 50%;
   width: 20px;
@@ -4424,36 +4528,48 @@ input._1zowl {
      object-fit: cover;
 }
 ._o5x6S {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   width: 20px;
   height: 20px;
-  font-size: 14px;
 }
 ._o5x6S ._NN8-D {
   margin-left: 18px;
   margin-top: 10px;
 }
 ._VxW5y {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-400);
+  line-height: var(--font-line-height-400);
+  font-weight: var(--p-font-weight-normal);
   width: 30px;
   height: 30px;
-  font-size: 20px;
 }
 ._VxW5y ._NN8-D {
   margin-left: 20px;
   margin-top: 15px;
 }
 ._ec7jQ {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-500);
+  line-height: var(--font-line-height-500);
+  font-weight: var(--p-font-weight-bold);
   width: 40px;
   height: 40px;
-  font-size: 24px;
 }
 ._ec7jQ ._NN8-D {
   margin-left: 23px;
   margin-top: 18px;
 }
 ._3VS00 {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-600);
+  line-height: var(--font-line-height-600);
+  font-weight: var(--p-font-weight-bold);
   width: 80px;
   height: 80px;
-  font-size: 24px;
 }
 ._3VS00 ._NN8-D {
   margin-left: 55px;
@@ -4469,11 +4585,13 @@ input._1zowl {
   padding-top: 25%;
 }
 ._3e7Of {
-  font-size: 12px;
-  font-weight: 600;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-100);
+  line-height: var(--font-line-height-100);
+  font-weight: var(--p-font-weight-normal);
+  font-weight: var(--p-font-weight-bold);
   border-radius: 2px;
   padding: 2px 8px;
-  line-height: 16px;
   display: inline-block;
   text-align: center;
   text-transform: uppercase;
@@ -4503,11 +4621,13 @@ input._1zowl {
   color: var(--color-radish-600);
 }
 ._1vA9B {
-  font-size: 14px;
-  font-weight: 600;
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
+  font-weight: var(--p-font-weight-bold);
   border-radius: 25px;
-  padding: 0 12px 0 12px;
-  line-height: 28px;
+  padding: 5px 12px;
   min-width: 40px;
   max-width: -moz-fit-content;
   max-width: fit-content;
@@ -4561,8 +4681,11 @@ input._1zowl {
   max-width: 667px;
 }
 ._1o2PF {
+  font-family: var(--font-family-brand);
+  font-size: var(--font-size-200);
+  line-height: var(--font-line-height-200);
+  font-weight: var(--p-font-weight-normal);
   color: var(--color-grey-500);
-  font-size: 14px;
 }
 ._mfMlg {
   display: flex;