:root {
  --background: #fadcc7;
  --text-color: #542707;
  --black: #0a0a0a;
  --black-bis: #121212;
  --black-ter: #242424;
  --white: #fffefe;
  --primary-color: #fadcc7;
  --primary-color-light: white;
  --primary-color-dark: #f09351;
  --primary-gradiend-light: #fce8d9;
  --primary-gradiend-dark: #f8d0b4;
  --secondary-color: #f6d5f7;
  --secondary-color-light: white;
  --secondary-color-dark: #e895eb;
  --light-shadow: rgba(255, 255, 255, 0.5);
  --dark-shadow: rgba(240, 147, 81, 0.5);
  /*	--fa-primary-color: $text-color;
	--fa-secondary-color: $main-dark-pc;
	--fa-primary-opacity: 0.80;
	--fa-secondary-opacity: 0.80;*/
  --danger-color: #fbd5d5;
  --warning-color: #fbf3d5;
  --info-color: #d5f1fb; }

/*$breakpoint argument choices:
- phone
- tab-port
- tab-land
- desk
- big-desktop
*/
html {
  overflow-y: auto; }

.steps {
  list-style-type: none !important; }

@media screen and (max-width: 768px) {
  .mt-2-mobile {
    margin-top: .5rem !important; } }

.control.has-icons-left .icon, .control.has-icons-right .icon {
  z-index: 5; }

.neomorph {
  box-shadow: -8px -8px 16px var(--light-shadow), 8px 8px 16px var(--dark-shadow); }
  .neomorphSmall {
    box-shadow: -6px -6px 12px var(--light-shadow), 6px 6px 12px var(--dark-shadow); }
  .neomorphXSmall {
    box-shadow: -3px -3px 6px var(--light-shadow), 3px 3px 6px var(--dark-shadow); }
  .neomorphXXSmall {
    box-shadow: -2px -2px 4px var(--light-shadow), 2px 2px 4px var(--dark-shadow); }
  .neomorphBottom {
    filter: drop-shadow(8px 8px 14px var(--primary-color-dark)); }
  .neomorphInset {
    box-shadow: inset 8px 8px 16px var(--dark-shadow), inset -8px -8px 16px var(--light-shadow); }
    .neomorphInsetSmall {
      box-shadow: inset 6px 6px 12px var(--dark-shadow), inset -6px -6px 12px var(--light-shadow); }
    .neomorphInsetXSmall {
      box-shadow: inset 3px 3px 6px var(--dark-shadow), inset -3px -3px 6px var(--light-shadow); }
    .neomorphInsetXXSmall {
      box-shadow: inset 2px 2px 4px var(--dark-shadow), inset -2px -2px 4px var(--light-shadow); }

.neoBtn {
  background: linear-gradient(145deg, var(--primary-gradiend-light), var(--primary-gradiend-dark));
  box-shadow: -3px -3px 6px var(--light-shadow), 3px 3px 6px var(--dark-shadow);
  border: none !important;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden; }
  .neoBtn:focus {
    box-shadow: -3px -3px 6px var(--light-shadow), 3px 3px 6px var(--dark-shadow) !important;
    border: none !important; }
  .neoBtnInsetPlain {
    background: linear-gradient(145deg, var(--primary-gradiend-dark), var(--primary-gradiend-light));
    box-shadow: inset 3px 3px 6px var(--dark-shadow), inset -3px -3px 6px var(--light-shadow);
    border: none !important; }
    .neoBtnInsetPlain:focus {
      box-shadow: inset 3px 3px 6px var(--dark-shadow), inset -3px -3px 6px var(--light-shadow) !important;
      border: none !important; }
  .neoBtnSmall {
    background: linear-gradient(145deg, var(--primary-gradiend-light), var(--primary-gradiend-dark));
    box-shadow: -2px -2px 4px var(--light-shadow), 2px 2px 4px var(--dark-shadow);
    border: none !important; }
    .neoBtnSmall:focus {
      box-shadow: -2px -2px 4px var(--light-shadow), 2px 2px 4px var(--dark-shadow);
      border: none !important; }
      .neoBtnSmall:focus:not(:active) {
        box-shadow: -2px -2px 4px var(--light-shadow), 2px 2px 4px var(--dark-shadow); }
    .neoBtnSmallInsetPlain {
      background: linear-gradient(145deg, var(--primary-gradiend-dark), var(--primary-gradiend-light));
      box-shadow: inset 3px 3px 6px var(--dark-shadow), inset -3px -3px 6px var(--light-shadow);
      border: none !important; }
      .neoBtnSmallInsetPlain:focus {
        box-shadow: inset 3px 3px 6px var(--dark-shadow), inset -3px -3px 6px var(--light-shadow) !important;
        border: none !important; }
    .neoBtnSmallXInsetPlain {
      background: linear-gradient(145deg, var(--primary-gradiend-dark), var(--primary-gradiend-light));
      box-shadow: inset 2px 2px 4px var(--dark-shadow), inset -2px -2px 4px var(--light-shadow);
      border: none !important; }
      .neoBtnSmallXInsetPlain:focus {
        box-shadow: inset 2px 2px 4px var(--dark-shadow), inset -2px -2px 4px var(--light-shadow) !important;
        border: none !important; }
    .neoBtnSmallPlain {
      box-shadow: -3px -3px 6px var(--light-shadow), 3px 3px 6px var(--dark-shadow);
      border: none !important; }
      .neoBtnSmallPlain:focus {
        box-shadow: -3px -3px 6px var(--light-shadow), 3px 3px 6px var(--dark-shadow) !important;
        border: none !important; }

.neoFile {
  box-shadow: 0px 0px 0px var(--light-shadow), 0px 0px 0px var(--dark-shadow) !important;
  transition: all .2s linear;
  -webkit-backface-visibility: hidden !important;
  backface-visibility: hidden !important; }
  @media screen and (max-width: 768px) {
    .neoFile {
      box-shadow: -3px -3px 6px var(--light-shadow), 3px 3px 6px var(--dark-shadow) !important;
      background: var(--primary-color) !important; } }
  .neoFile:hover {
    box-shadow: -3px -3px 6px var(--light-shadow), 3px 3px 6px var(--dark-shadow) !important; }
  .neoFile.isSelected {
    background: linear-gradient(145deg, var(--primary-gradiend-dark), var(--primary-gradiend-light));
    box-shadow: inset 3px 3px 6px var(--dark-shadow), inset -3px -3px 6px var(--light-shadow) !important; }
  .neoFile.is-active, .neoFile.active {
    box-shadow: inset 3px 3px 6px var(--dark-shadow), inset -3px -3px 6px var(--light-shadow) !important;
    color: var(--black) !important; }

.neoInput {
  box-shadow: inset 2px 2px 4px var(--dark-shadow), inset -2px -2px 4px var(--light-shadow) !important;
  background: linear-gradient(145deg, var(--primary-gradiend-dark), var(--primary-gradiend-light));
  border: none !important; }
  .neoInput:focus {
    border: none !important; }

.neoSelect > select {
  box-shadow: inset 2px 2px 4px var(--dark-shadow), inset -2px -2px 4px var(--light-shadow) !important;
  background: linear-gradient(145deg, var(--primary-gradiend-dark), var(--primary-gradiend-light)) !important;
  border: none !important; }
  .neoSelect > select:focus {
    border: none !important; }

html {
  scrollbar-width: thin; }

*, ::after, ::before {
  scrollbar-width: inherit; }

::-webkit-scrollbar {
  width: 8px; }

::-webkit-scrollbar-button {
  width: 8px;
  height: 5px; }

::-webkit-scrollbar-track {
  background: transparent;
  border: thin solid transparent;
  box-shadow: none;
  border-radius: 10px; }

::-webkit-scrollbar-thumb {
  border: thin solid transparent;
  border-radius: 10px;
  background: var(--primary-color); }

body {
  background-image: url("/images/background.jpg");
  background-size: cover;
  min-height: 100vh; }

.loading {
  height: 100vh;
  justify-content: center;
  flex-direction: column; }

.drinkCartList {
  display: flex;
  flex-direction: column; }

.drinkCartItem {
  display: grid;
  grid-template-areas: "drinkName drinkQuantity drinkCross drinkPrice";
  grid-template-columns: 1fr minmax(100px, 20%) 5% 10%;
  grid-template-rows: 100%;
  grid-gap: 5px;
  align-items: center; }
  .drinkCartItem:not(:last-child) {
    margin-bottom: 1rem; }

.drinkCartPItem {
  display: grid;
  grid-template-areas: "drinkName drinkQuantity drinkCross drinkPrice";
  grid-template-columns: 1fr 10% 5% 10%;
  grid-template-rows: 100%;
  grid-gap: 5px;
  align-items: center; }
  .drinkCartPItem:not(:last-child) {
    margin-bottom: 1rem; }

.drinkCartName {
  grid-area: drinkName; }

.drinkCartCross {
  grid-area: drinkCross; }

.drinkCartQuantity {
  grid-area: drinkQuantity; }

.drinkCartPrice {
  grid-area: drinkPrice;
  white-space: nowrap; }

.column > .box > .title {
  padding: 10%; }