@charset "UTF-8";
.view {
  background: var(--color-theme-background);
}

.toast.toast-center {
  top: 94%;
}

.notification-subtitle {
  margin-bottom: 4px;
}

.swiper-pagination-bullet {
  background-color: #fff;
}

.md,
.ios {
  --f7-dialog-width: 540px;
  --f7-dialog-font-size: 21px;
  --f7-dialog-title-font-size: 24px;
  --f7-dialog-button-font-size: 24px;
  --f7-dialog-button-height: 60px;
}
.md .dialog-buttons,
.ios .dialog-buttons {
  height: unset;
}
.md .dialog .dialog-inner .dialog-title,
.ios .dialog .dialog-inner .dialog-title {
  font-size: 24px;
  padding: 8px 0 16px 0;
}

:root {
  --f7-button-border-radius: 0px;
  --f7-button-raised-box-shadow:
      0 1px 3px rgba(255, 255, 255, 0.12),
      0 1px 2px rgba(255, 255, 255, 0.24);
  --f7-segmented-strong-padding: 0px;
  --f7-dialog-button-text-color: #000;
  --f7-button-text-transform: capitalize;
  --f7-segmented-strong-between-buttons: 0px;
  --f7-segmented-strong-button-text-color: #fff;
  --f7-notification-padding: 0px 16px 10px 16px;
}

:root {
  --f7-theme-color: #ffa400;
  --color-theme-color: #ffffff;
  --color-theme-color-light: #cccccc;
  --color-theme-color-highlight: #ffa400;
  --color-theme-background: #000000;
  --color-theme-cart-top-frame: #404040;
  --color-theme-cart-button-background: #ffb30f;
  --color-theme-top-line-color: #f0f0f0;
  --color-theme-box-shadow-color: rgba(0, 0, 0, 0.3);
  --color-theme-catalog-line-color: #606060;
  --color-theme-catalog-icon-color: #ffffff;
  --color-theme-menu-color: #cccccc;
  --color-theme-menu-border: #202020;
  --color-theme-menu-background: #2c2c2c;
  --color-theme-top-menu-color: #cccccc;
  --color-theme-top-menu-border: rgba(255, 255, 255, 0.2);
  --color-theme-top-menu-background: rgba(255, 255, 255, 0.2);
  --color-theme-top-menu-border-radius: 1.3vw;
  --color-theme-top-menu-active-color: #ffa400;
  --color-theme-top-menu-active-border: rgba(255, 164, 0, 0.8);
  --color-theme-top-menu-active-background: rgba(255, 255, 255, 0.2);
  --color-theme-multi-language-color: #333;
  --color-theme-multi-language-active-bg: #aaa;
  --color-theme-multi-language-background: rgba(255, 255, 255, 0.35);
  --color-theme-load-error-color: #c08080;
  --color-theme-load-error-link-color: #c0c0c0;
  --color-theme-sub-class-background-color: #333333;
  --color-theme-sub-class-background-border: #222222;
  --color-theme-order-page-bottom-mark-color: #dddddd;
  --color-theme-order-page-frame-border-color: rgba(255, 255, 255, 0.8);
}

.title #mLanguages {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 100;
  position: absolute;
  pointer-events: none;
}
.title .multi-language {
  z-index: 100;
  position: absolute;
  pointer-events: auto;
  display: flex;
  padding: 0.6vw;
  align-items: center;
  border-radius: 1.2vw;
  background-color: var(--color-theme-multi-language-background);
  right: calc(var(--title-margin-h) * 1);
  bottom: calc(var(--title-robot-height) * 0.2);
}
.title .multi-language .switcher {
  border: none;
  cursor: pointer;
  box-shadow: none;
  height: 2vw;
  background: 0 0;
  border-radius: 1vw;
  outline: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--f7-font-family);
  padding: 0 2vw;
  height: calc(var(--title-robot-height) * 0.6);
}
.title .multi-language .switcher.active {
  color: var(--color-theme-multi-language-color);
  background-color: var(--color-theme-multi-language-active-bg);
}
.title .multi-language .switcher.active span.language-icon {
  filter: unset;
}
.title .multi-language .switcher span.language-icon {
  width: 3vw;
  height: 3vw;
  filter: brightness(0.4);
}
.title .multi-language .switcher span.language-name {
  cursor: pointer;
  margin-left: 1vw;
  font-size: calc(var(--f7-font-size) * 2);
}
.title .multi-language .flag-en {
  background-image: url(../../base/locales/flags/en-us.svg);
}
.title .multi-language .flag-zh {
  background-image: url(../../base/locales/flags/zh-cn.svg);
}
.title .multi-language .flag-af {
  background-image: url(../../base/locales/flags/af.svg);
}
.title .multi-language .flag-am {
  background-image: url(../../base/locales/flags/am.svg);
}
.title .multi-language .flag-ar {
  background-image: url(../../base/locales/flags/ar.svg);
}
.title .multi-language .flag-az {
  background-image: url(../../base/locales/flags/az.svg);
}
.title .multi-language .flag-bg {
  background-image: url(../../base/locales/flags/bg.svg);
}
.title .multi-language .flag-bn {
  background-image: url(../../base/locales/flags/bn.svg);
}
.title .multi-language .flag-bs {
  background-image: url(../../base/locales/flags/bs.svg);
}
.title .multi-language .flag-ca {
  background-image: url(../../base/locales/flags/ca.svg);
}
.title .multi-language .flag-cs {
  background-image: url(../../base/locales/flags/cs.svg);
}
.title .multi-language .flag-cy {
  background-image: url(../../base/locales/flags/cy.svg);
}
.title .multi-language .flag-da {
  background-image: url(../../base/locales/flags/da.svg);
}
.title .multi-language .flag-de {
  background-image: url(../../base/locales/flags/de.svg);
}
.title .multi-language .flag-el {
  background-image: url(../../base/locales/flags/el.svg);
}
.title .multi-language .flag-eo {
  background-image: url(../../base/locales/flags/eo.svg);
}
.title .multi-language .flag-es {
  background-image: url(../../base/locales/flags/es.svg);
}
.title .multi-language .flag-et {
  background-image: url(../../base/locales/flags/et.svg);
}
.title .multi-language .flag-fa {
  background-image: url(../../base/locales/flags/fa.svg);
}
.title .multi-language .flag-fi {
  background-image: url(../../base/locales/flags/fi.svg);
}
.title .multi-language .flag-fr {
  background-image: url(../../base/locales/flags/fr.svg);
}
.title .multi-language .flag-ga {
  background-image: url(../../base/locales/flags/ga.svg);
}
.title .multi-language .flag-gu {
  background-image: url(../../base/locales/flags/gu.svg);
}
.title .multi-language .flag-ha {
  background-image: url(../../base/locales/flags/ha.svg);
}
.title .multi-language .flag-he {
  background-image: url(../../base/locales/flags/he.svg);
}
.title .multi-language .flag-hi {
  background-image: url(../../base/locales/flags/hi.svg);
}
.title .multi-language .flag-hr {
  background-image: url(../../base/locales/flags/hr.svg);
}
.title .multi-language .flag-ht {
  background-image: url(../../base/locales/flags/ht.svg);
}
.title .multi-language .flag-hu {
  background-image: url(../../base/locales/flags/hu.svg);
}
.title .multi-language .flag-hy {
  background-image: url(../../base/locales/flags/hy.svg);
}
.title .multi-language .flag-id {
  background-image: url(../../base/locales/flags/id.svg);
}
.title .multi-language .flag-ig {
  background-image: url(../../base/locales/flags/ig.svg);
}
.title .multi-language .flag-is {
  background-image: url(../../base/locales/flags/is.svg);
}
.title .multi-language .flag-it {
  background-image: url(../../base/locales/flags/it.svg);
}
.title .multi-language .flag-ja {
  background-image: url(../../base/locales/flags/ja.svg);
}
.title .multi-language .flag-kk {
  background-image: url(../../base/locales/flags/kk.svg);
}
.title .multi-language .flag-km {
  background-image: url(../../base/locales/flags/km.svg);
}
.title .multi-language .flag-ko {
  background-image: url(../../base/locales/flags/ko.svg);
}
.title .multi-language .flag-ku {
  background-image: url(../../base/locales/flags/ku.svg);
}
.title .multi-language .flag-lb {
  background-image: url(../../base/locales/flags/lb.svg);
}
.title .multi-language .flag-lo {
  background-image: url(../../base/locales/flags/lo.svg);
}
.title .multi-language .flag-lt {
  background-image: url(../../base/locales/flags/lt.svg);
}
.title .multi-language .flag-lv {
  background-image: url(../../base/locales/flags/lv.svg);
}
.title .multi-language .flag-mg {
  background-image: url(../../base/locales/flags/mg.svg);
}
.title .multi-language .flag-mi {
  background-image: url(../../base/locales/flags/mi.svg);
}
.title .multi-language .flag-mk {
  background-image: url(../../base/locales/flags/mk.svg);
}
.title .multi-language .flag-ml {
  background-image: url(../../base/locales/flags/ml.svg);
}
.title .multi-language .flag-mn {
  background-image: url(../../base/locales/flags/mn.svg);
}
.title .multi-language .flag-mr {
  background-image: url(../../base/locales/flags/mr.svg);
}
.title .multi-language .flag-ms {
  background-image: url(../../base/locales/flags/ms.svg);
}
.title .multi-language .flag-mt {
  background-image: url(../../base/locales/flags/mt.svg);
}
.title .multi-language .flag-ne {
  background-image: url(../../base/locales/flags/ne.svg);
}
.title .multi-language .flag-nl {
  background-image: url(../../base/locales/flags/nl.svg);
}
.title .multi-language .flag-no {
  background-image: url(../../base/locales/flags/no.svg);
}
.title .multi-language .flag-pa {
  background-image: url(../../base/locales/flags/pa.svg);
}
.title .multi-language .flag-pl {
  background-image: url(../../base/locales/flags/pl.svg);
}
.title .multi-language .flag-ps {
  background-image: url(../../base/locales/flags/ps.svg);
}
.title .multi-language .flag-pt {
  background-image: url(../../base/locales/flags/pt.svg);
}
.title .multi-language .flag-ro {
  background-image: url(../../base/locales/flags/ro.svg);
}
.title .multi-language .flag-ru {
  background-image: url(../../base/locales/flags/ru.svg);
}
.title .multi-language .flag-si {
  background-image: url(../../base/locales/flags/si.svg);
}
.title .multi-language .flag-sk {
  background-image: url(../../base/locales/flags/sk.svg);
}
.title .multi-language .flag-sl {
  background-image: url(../../base/locales/flags/sl.svg);
}
.title .multi-language .flag-sm {
  background-image: url(../../base/locales/flags/sm.svg);
}
.title .multi-language .flag-sq {
  background-image: url(../../base/locales/flags/sq.svg);
}
.title .multi-language .flag-sr {
  background-image: url(../../base/locales/flags/sr.svg);
}
.title .multi-language .flag-su {
  background-image: url(../../base/locales/flags/su.svg);
}
.title .multi-language .flag-sv {
  background-image: url(../../base/locales/flags/sv.svg);
}
.title .multi-language .flag-sw {
  background-image: url(../../base/locales/flags/sw.svg);
}
.title .multi-language .flag-ta {
  background-image: url(../../base/locales/flags/ta.svg);
}
.title .multi-language .flag-te {
  background-image: url(../../base/locales/flags/te.svg);
}
.title .multi-language .flag-th {
  background-image: url(../../base/locales/flags/th.svg);
}
.title .multi-language .flag-tl {
  background-image: url(../../base/locales/flags/tl.svg);
}
.title .multi-language .flag-tr {
  background-image: url(../../base/locales/flags/tr.svg);
}
.title .multi-language .flag-uk {
  background-image: url(../../base/locales/flags/uk.svg);
}
.title .multi-language .flag-ur {
  background-image: url(../../base/locales/flags/ur.svg);
}
.title .multi-language .flag-vi {
  background-image: url(../../base/locales/flags/vi.svg);
}
.title .multi-language .flag-zu {
  background-image: url(../../base/locales/flags/zu.svg);
}
.title .multi-language .flag-hmn {
  background-image: url(../../base/locales/flags/hmn.svg);
}
.title .multi-language .flag-de-at {
  background-image: url(../../base/locales/flags/de-at.svg);
}
.title .multi-language .flag-en-gb {
  background-image: url(../../base/locales/flags/en-gb.svg);
}
.title .multi-language .flag-en-us {
  background-image: url(../../base/locales/flags/en-us.svg);
}
.title .multi-language .flag-es-mx {
  background-image: url(../../base/locales/flags/es-mx.svg);
}
.title .multi-language .flag-es-pu {
  background-image: url(../../base/locales/flags/es-pu.svg);
}
.title .multi-language .flag-pt-br {
  background-image: url(../../base/locales/flags/pt-br.svg);
}
.title .multi-language .flag-zh-cn {
  background-image: url(../../base/locales/flags/zh-cn.svg);
}
.title .multi-language .flag-zh-tw {
  background-image: url(../../base/locales/flags/zh-tw.svg);
}

.rtl .title .multi-language {
  left: calc(var(--title-margin-h) * 1);
  right: unset;
}
.rtl .title .multi-language .switcher span.language-name {
  margin-left: 0;
  margin-right: 1vw;
}

.title {
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  position: absolute;
  pointer-events: none;
  height: var(--title-height);
}
.title .btm {
  bottom: 0;
  height: 0.125rem;
  position: absolute;
  left: var(--title-margin-h);
  right: var(--title-margin-h);
  background-color: var(--color-theme-top-line-color);
}
.title .btm .version {
  top: 8px;
  right: 8px;
  color: var(--color-theme-cart-top-frame);
  position: absolute;
}
.title .logo {
  left: var(--title-margin-h);
  bottom: var(--title-logo-bottom);
  height: var(--title-logo-height);
  width: calc(50vw - var(--title-margin-h));
  pointer-events: all;
  position: absolute;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: top left;
  background-image: url("../../configs/images/EntryModule/logo.png");
}
.title .robot {
  right: var(--title-margin-h);
  bottom: var(--title-robot-bottom);
  height: var(--title-robot-height);
  width: calc(50vw - var(--title-margin-h));
  position: absolute;
  background-size: cover;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: top right;
  background-image: url("../../configs/images/EntryModule/robot-icon.png");
}

.rtl .title .btm .version {
  left: 8px;
  right: unset;
}
.rtl .title .logo {
  left: unset;
  right: var(--title-margin-h);
  background-position: top right;
}
.rtl .title .robot {
  left: var(--title-margin-h);
  right: unset;
  background-position: top left;
}

@media screen and (max-aspect-ratio: 5/10) and (max-width: 240px) {
  :root {
    --title-height: 20vw;
    --title-margin-h: 10vw;
    --title-logo-bottom: 1.0vw;
    --title-logo-height: 12.0vw;
    --title-robot-bottom: 0;
    --title-robot-height: 12.5vw;
  }
}
@media screen and (max-aspect-ratio: 5/10) and (min-width: 240px) {
  :root {
    --title-height: 16vw;
    --title-margin-h: 8vw;
    --title-logo-bottom: 1.0vw;
    --title-logo-height: 10.0vw;
    --title-robot-bottom: 0;
    --title-robot-height: 10.0vw;
  }
}
@media screen and (min-aspect-ratio: 5/10) and (max-aspect-ratio: 10/10) and (max-width: 600px) {
  :root {
    --title-height: 16vw;
    --title-margin-h: 6vw;
    --title-logo-bottom: 1.0vw;
    --title-logo-height: 10.0vw;
    --title-robot-bottom: 0;
    --title-robot-height: 10.0vw;
  }
}
@media screen and (min-aspect-ratio: 5/10) and (max-aspect-ratio: 10/10) and (min-width: 600px) {
  :root {
    --title-height: 14vw;
    --title-margin-h: 6vw;
    --title-logo-bottom: 1.0vw;
    --title-logo-height: 8.0vw;
    --title-robot-bottom: 0;
    --title-robot-height: 7.5vw;
  }
}
@media screen and (min-aspect-ratio: 10/10) and (max-aspect-ratio: 18/10) and (max-height: 600px) {
  :root {
    --title-height: 16vh;
    --title-margin-h: 6vh;
    --title-logo-bottom: 1.0vh;
    --title-logo-height: 10.0vh;
    --title-robot-bottom: 0;
    --title-robot-height: 10.0vh;
  }
}
@media screen and (min-aspect-ratio: 10/10) and (max-aspect-ratio: 18/10) and (min-height: 600px) {
  :root {
    --title-height: 12vh;
    --title-margin-h: 6vh;
    --title-logo-bottom: 1.0vh;
    --title-logo-height: 8.0vh;
    --title-robot-bottom: 0;
    --title-robot-height: 7.5vh;
  }
}
@media screen and (min-aspect-ratio: 18/10) and (max-aspect-ratio: 1000/10) and (max-height: 240px) {
  :root {
    --title-height: 20vh;
    --title-margin-h: 10vh;
    --title-logo-bottom: 1.0vh;
    --title-logo-height: 12.0vh;
    --title-robot-bottom: 0;
    --title-robot-height: 12.5vh;
  }
}
@media screen and (min-aspect-ratio: 18/10) and (max-aspect-ratio: 1000/10) and (min-height: 240px) {
  :root {
    --title-height: 16vh;
    --title-margin-h: 8vh;
    --title-logo-bottom: 1.0vh;
    --title-logo-height: 10.0vh;
    --title-robot-bottom: 0;
    --title-robot-height: 10.0vh;
  }
}
.page-404.page-content .block-strong {
  background-color: var(--color-theme-background);
}

.page-home.page-content .title {
  position: relative;
  height: var(--title-height);
}
.page-home.page-content .content {
  position: relative;
  height: calc(100vh - var(--title-height));
}
.page-home.page-content .content .entry-title {
  color: var(--color-theme-color);
  text-align: center;
  left: 0;
  right: 0;
  position: absolute;
  line-height: var(--home-page-enter-height);
  font-size: calc(var(--home-page-enter-height) / 3);
  top: calc(50vh - (var(--title-height) - var(--home-page-image-size)) / 2 - var(--home-page-enter-height) * 0.75);
}
.page-home.page-content .content .entry-image {
  position: absolute;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url("../../configs/images/EntryModule/coffee.png");
  left: calc(50vw - var(--home-page-image-size) / 2);
  right: calc(50vw - var(--home-page-image-size) / 2);
  margin-left: -1000px;
  filter: drop-shadow(1000px 0 var(--color-theme-catalog-icon-color));
  width: var(--home-page-image-size);
  height: var(--home-page-image-size);
  top: calc(50vh - (var(--title-height) + var(--home-page-image-size)) / 2 - var(--home-page-enter-height) * 0.75);
}
.page-home.page-content .content .device-imei-scanner {
  left: 0;
  right: 0;
  bottom: 15vw;
  z-index: 100;
  position: absolute;
  display: none;
}
.page-home.page-content .content .device-imei-scanner .scanner-title {
  text-align: center;
  color: var(--color-theme-color-light);
  font-size: calc(var(--home-page-enter-height) / 5);
}
.page-home.page-content .content .device-imei-scanner .coffee-coupon {
  margin-top: calc(var(--app-font-size) * 2);
  margin-bottom: calc(var(--app-font-size) * 2);
}
.page-home.page-content .content .device-imei-scanner .coffee-coupon button {
  font-weight: normal;
  color: var(--color-theme-color-light);
  border: 1px var(--color-theme-color) solid;
  width: 72%;
  margin: 0 auto;
  height: calc(var(--app-font-size) * 2.5);
  line-height: calc(var(--app-font-size) * 2.5);
  border-radius: calc(var(--app-font-size) * 0.25);
  font-size: calc(var(--home-page-enter-height) / 5);
}
.page-home.page-content .content .device-imei-scanner .coffee-coupon button i {
  font-size: calc(var(--app-font-size) * 1.6);
  margin-right: calc(var(--app-font-size) * 0.5);
}
.page-home.page-content .content .device-imei-scanner .coffee-coupon button .imei {
  color: var(--color-theme-color-highlight);
  font-weight: 600;
}
.page-home.page-content .login-page {
  left: 0;
  right: 0;
  bottom: calc(var(--home-page-loading-height) * 3);
  position: absolute;
  text-align: center;
  font-size: var(--home-page-loading-height);
}
.page-home.page-content .login-page > div {
  color: var(--color-theme-color-light);
  line-height: calc(var(--home-page-loading-height) * 2);
}
.page-home.page-content .login-page .not-login {
  color: var(--color-theme-color-highlight);
  text-decoration: underline;
}

.rtl .page-home.page-content .content .entry-image {
  margin-left: unset;
  margin-right: 1000px;
}

@media screen and (max-aspect-ratio: 5/10) {
  :root {
    --home-page-image-size: 42vw;
    --home-page-enter-height: 15vw;
    --home-page-loading-height: 3vw;
  }
}
@media screen and (min-aspect-ratio: 5/10) and (max-aspect-ratio: 10/10) {
  :root {
    --home-page-image-size: 30vw;
    --home-page-enter-height: 12vw;
    --home-page-loading-height: 2.4vw;
  }
}
@media screen and (min-aspect-ratio: 10/10) and (max-aspect-ratio: 16/10) {
  :root {
    --home-page-image-size: 30vh;
    --home-page-enter-height: 12vh;
    --home-page-loading-height: 2.4vh;
  }
}
@media screen and (min-aspect-ratio: 16/10) and (max-aspect-ratio: 1000/10) {
  :root {
    --home-page-image-size: 30vh;
    --home-page-enter-height: 12vh;
    --home-page-loading-height: 2.4vh;
  }
}
.page-coffee-config {
  --swiper-image-width: 28vw;
}
.page-coffee-config.page-content {
  background-color: var(--color-theme-background);
}
.page-coffee-config.page-content .title {
  position: relative;
  height: var(--title-height);
}
.page-coffee-config.page-content .content {
  color: var(--color-theme-color);
  overflow: hidden;
  position: relative;
  display: flex;
  flex-flow: column;
  height: calc(100vh - var(--title-height));
}
.page-coffee-config.page-content .content .loading {
  color: var(--color-theme-color-light);
  text-align: center;
  font-size: var(--app-font-size);
  padding-top: var(--app-font-size);
  line-height: calc(100vh - var(--title-height) - var(--app-font-size));
}
.page-coffee-config.page-content .content .load-failed {
  color: var(--color-theme-load-error-color);
  text-align: center;
  font-size: var(--app-font-size);
  padding-top: var(--app-font-size);
  line-height: calc(100vh - var(--title-height) - var(--app-font-size));
}
.page-coffee-config.page-content .content .load-failed span.link {
  color: var(--color-theme-load-error-link-color);
  text-decoration: underline;
}
.page-coffee-config.page-content .content .coffee-info {
  width: calc(100vw - var(--content-margin-h) * 2);
  padding: var(--content-margin-h) var(--content-margin-h) 0;
}
.page-coffee-config.page-content .content .coffee-info .image {
  float: left;
  width: var(--coffee-info-image);
  height: var(--coffee-info-image);
  border-radius: calc(var(--coffee-info-image) / 30);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  margin: var(--app-font-size) calc(var(--coffee-info-margin) * 1.5) 0 var(--coffee-info-margin);
}
.page-coffee-config.page-content .content .coffee-info .shop-content {
  color: var(--color-theme-color);
  float: left;
  width: calc(100vw - var(--content-margin-h) * 2 - var(--coffee-info-image) - var(--coffee-info-margin) * 3.5);
}
.page-coffee-config.page-content .content .coffee-info .shop-content .name {
  font-weight: 400;
  line-height: 1.6;
  font-size: calc(var(--app-font-size) * 1.35);
  margin: calc(var(--coffee-info-margin) * 0.5) 0 calc(var(--app-font-size) * 0.5);
}
.page-coffee-config.page-content .content .coffee-info .shop-content .name .amount {
  color: var(--color-theme-color);
  display: inline;
}
.page-coffee-config.page-content .content .coffee-info .shop-content .name .amount > i {
  margin: 0 1vw;
  font-size: 3vw;
}
.page-coffee-config.page-content .content .coffee-info .shop-content .info {
  color: var(--color-theme-color-light);
  line-height: 1.5;
  margin: calc(var(--app-font-size) * 0.5) 0;
  font-size: calc(var(--app-font-size) * 0.8);
}
.page-coffee-config.page-content .content .coffee-info .shop-content .info.hidden {
  display: none;
}
.page-coffee-config.page-content .content .coffee-info .shop-content .price {
  color: var(--color-theme-color-highlight);
  line-height: 1.5;
  font-size: calc(var(--app-font-size) * 1.5);
}
.page-coffee-config.page-content .content .coffee-info .shop-content .price .source-price {
  color: #808080;
  text-decoration: line-through;
  font-size: calc(var(--app-font-size) * 1.35);
  margin-left: calc(var(--app-font-size) * 0.4);
}
.page-coffee-config.page-content .content .coffee-info .shop-content .description {
  line-height: 1.5;
  font-size: calc(var(--app-font-size) * 0.8);
  margin-top: calc(var(--app-font-size) * 0.5);
}
.page-coffee-config.page-content .content .coffee-info.no-description {
  padding-top: calc(var(--content-margin-h) * 1.5);
}
.page-coffee-config.page-content .content .coffee-info.no-description .image {
  float: none;
  margin: var(--app-font-size) auto;
  width: calc(var(--coffee-info-image) * 1.25);
  height: calc(var(--coffee-info-image) * 1.25);
}
.page-coffee-config.page-content .content .coffee-info.no-description .shop-content {
  width: calc(100vw - var(--content-margin-h) * 2);
}
.page-coffee-config.page-content .content .coffee-info.no-description .shop-content .description {
  display: none;
}
.page-coffee-config.page-content .content .coffee-info.no-description .shop-content .name {
  text-align: center;
  font-size: calc(var(--app-font-size) * 1.5);
}
.page-coffee-config.page-content .content .coffee-info.no-description .shop-content .price {
  text-align: center;
  font-size: calc(var(--app-font-size) * 1.35);
}
.page-coffee-config.page-content .content .coffee-info.no-description .shop-content .price .amount {
  color: var(--color-theme-color);
  margin-left: 2vw;
}
.page-coffee-config.page-content .content .coffee-info.no-description .shop-content .price .amount > i {
  font-size: 3vw;
}
.page-coffee-config.page-content .content .directly-order {
  width: 100%;
  height: 50vh;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--app-font-size);
}
.page-coffee-config.page-content .content .directly-order .child-item {
  color: var(--color-theme-color-light);
}
.page-coffee-config.page-content .content .directly-order .child-item .icon-container {
  text-align: center;
  margin: var(--app-font-size) auto;
}
.page-coffee-config.page-content .content .directly-order .child-item .icon-container .preloader {
  width: calc(var(--f7-preloader-size) * 3);
  height: calc(var(--f7-preloader-size) * 3);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode {
  position: relative;
  width: calc(100vw - var(--content-margin-h) * 4);
  padding: var(--content-margin-h) calc(var(--content-margin-h) * 2) 0;
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .none .none-title.title-pay {
  color: red;
  padding-left: 0;
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .freya .freya-img {
  filter: brightness(160%);
  width: calc(var(--app-font-size) * 2.5 * 3.8);
  background-image: url("../../base/images/freya.png");
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .paypal .paypal-img {
  filter: brightness(160%);
  width: calc(var(--app-font-size) * 2.5 * 3.8);
  background-image: url("../../base/images/paypal.svg");
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .squareup .square-up-img {
  width: calc(var(--app-font-size) * 7.5 * 1);
  background-image: url("../../base/images/squareup.svg");
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .stripe .stripe-img {
  width: calc(var(--app-font-size) * 2.5 * 1);
  background-image: url("../../base/images/stripe.svg");
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .stripe .stripe-pos-img {
  width: calc(var(--app-font-size) * 2.5 * 1);
  background-image: url("../../base/images/stripe.svg");
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .stripe .stripe-pos-m2-img {
  width: calc(var(--app-font-size) * 2.5 * 1);
  background-image: url("../../base/images/stripe.svg");
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .salispay .salispay-img {
  filter: brightness(200%);
  width: calc(var(--app-font-size) * 7.5 * 1);
  background-image: url("../../base/images/salispay.svg");
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .salispay .salispay-pos-img {
  filter: brightness(200%);
  width: calc(var(--app-font-size) * 7.5 * 1);
  background-image: url("../../base/images/salispay.svg");
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .wechat .wechat-img {
  width: calc(var(--app-font-size) * 2.5 * 1);
  background-image: url("../../base/images/wechat.png");
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .thawani .thawani-img {
  width: calc(var(--app-font-size) * 2.5 * 1);
  background-image: url("../../base/images/thawani.svg");
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .payment-title {
  width: 100%;
  height: calc(var(--app-font-size) * 2.5);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .payment-title .img-pay {
  float: left;
  height: calc(var(--app-font-size) * 2.5);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: left center;
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .payment-title .title-pay {
  float: left;
  font-size: calc(var(--app-font-size) * 1.2);
  line-height: calc(var(--app-font-size) * 2.5);
  padding-left: calc(var(--app-font-size) * 0.8);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail {
  color: var(--color-theme-color-light);
  margin: calc(var(--app-font-size) * 0.8) 0;
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit {
  font-size: calc(var(--app-font-size) * 1);
  line-height: calc(var(--app-font-size) * 2.4);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .order-id {
  color: #808080;
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit.coupon {
  line-height: calc(var(--app-font-size) * 3);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .order-price {
  color: var(--color-theme-color-highlight);
  vertical-align: sub;
  font-size: calc(var(--app-font-size) * 1.8);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .order-price.freya {
  color: #6772e5;
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .order-price.paypal {
  color: #00a8ea;
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .order-price.squareup {
  color: #ffffff;
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .order-price.stripe {
  color: #6772e5;
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .order-price.stripepos {
  color: #6772e5;
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .order-price.salispay {
  color: #e000ff;
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .order-price.salispaypos {
  color: #e000ff;
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .order-price.wechatpay {
  color: #22ac38;
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .order-price.thawanipay {
  color: #6fbf49;
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .order-price .source-price {
  color: #808080;
  text-decoration: line-through;
  font-size: calc(var(--app-font-size) * 1.35);
  margin-left: calc(var(--app-font-size) * 0.8);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .coupon-code {
  color: #fff;
  margin-left: 10px;
  border-radius: 6px;
  background-color: #02bc77;
  padding: 6px 10px 6px 12px;
  font-size: calc(var(--app-font-size) * 1.25);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .coupon-code > i {
  margin: 20px 8px;
  font-size: calc(var(--app-font-size) * 1.25);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .coupon-code .info {
  font-size: calc(var(--app-font-size) * 1);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .coupon-code .info .value {
  font-size: calc(var(--app-font-size) * 1.25);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .order-tax-info {
  font-size: calc(var(--app-font-size) * 1);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .coffee-coupon {
  margin-top: calc(var(--app-font-size) * 6);
  margin-bottom: calc(var(--app-font-size) * 0.5);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .coffee-coupon.cancel {
  margin-top: calc(var(--app-font-size) * 2);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .coffee-coupon.cancel .button.cancel-button {
  color: var(--color-theme-color-light);
  margin: 0 auto;
  width: calc(var(--coffee-bottom-width) * 2 + var(--coffee-bottom-margin) + var(--f7-grid-gap));
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .coffee-coupon button {
  font-weight: normal;
  border: 1px var(--color-theme-color) solid;
  width: var(--coffee-bottom-width);
  height: calc(var(--app-font-size) * 2.2);
  line-height: calc(var(--app-font-size) * 2.2);
  font-size: calc(var(--app-font-size) * 0.9);
  border-radius: calc(var(--app-font-size) * 0.25);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .coffee-coupon button i {
  font-size: calc(var(--app-font-size) * 1.2);
  margin-right: calc(var(--app-font-size) * 0.3);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .coffee-coupon button.cancel-button {
  color: var(--color-theme-color);
  margin-left: calc(var(--coffee-bottom-margin) * 0.5);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .coffee-coupon button.coupon-button {
  color: var(--color-theme-color);
  float: right;
  margin-right: calc(var(--coffee-bottom-margin) * 0.5);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .return-button {
  color: var(--color-theme-color-light);
  position: absolute;
  border: 1px var(--color-theme-color-light) solid;
  top: calc(var(--app-font-size) * 5);
  right: calc(var(--content-margin-h) * 2);
  width: calc(var(--app-font-size) * 6.4);
  height: calc(var(--app-font-size) * 2.4);
  font-size: calc(var(--app-font-size) * 0.8);
  border-radius: calc(var(--app-font-size) * 0.2);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .qr-code-image {
  width: calc(var(--order-pay-image-size) * 2);
  height: var(--order-pay-image-size);
  margin: calc(var(--app-font-size) * 3) auto 0;
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .qr-code-image.pos {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url("../../base/images/pos.png");
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .qr-code-image .qr-code-src {
  margin: 0 auto;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  height: var(--order-pay-image-size);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .qr-code-image .qr-code-src.text > div {
  line-height: 1.8;
  text-align: center;
  display: table-cell;
  vertical-align: middle;
  width: calc(var(--order-pay-image-size) * 2);
  height: var(--order-pay-image-size);
  font-size: calc(var(--app-font-size) * 0.75);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .qr-code-image .qr-code-src.text > div > p {
  color: var(--color-theme-color-light);
  width: 100%;
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .qr-code-image .qr-code-src.text > div > p > span.link {
  color: var(--color-theme-color-highlight);
  text-decoration: underline;
  margin: 0 calc(var(--app-font-size) * 0.2);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .confirm-button {
  width: 50%;
  color: var(--color-theme-color-highlight);
  font-size: calc(var(--app-font-size) * 0.9);
  border: 1px var(--color-theme-color-highlight) solid;
  margin: var(--app-font-size) auto 0;
  border-radius: calc(var(--app-font-size) * 0.25);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .confirm-button > i {
  font-size: calc(var(--app-font-size) * 1.5);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .confirm-button > span {
  margin-left: calc(var(--app-font-size) * 0.5);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .pay-description {
  color: #808080;
  text-align: center;
  font-size: calc(var(--app-font-size) * 0.75);
  padding-top: calc(var(--app-font-size) * 1.8);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .pay-minimum-amount {
  color: var(--color-theme-color-highlight);
  text-align: center;
  height: 0;
  line-height: 1.6;
  font-size: calc(var(--app-font-size) * 0.75);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .pay-minimum-amount .amount {
  padding-top: calc(var(--app-font-size) * 1.2);
  margin-bottom: calc(var(--app-font-size) * -1.8);
}
.page-coffee-config.page-content .content .coffee-pay-qrcode .confirm-description {
  color: var(--color-theme-color-highlight);
  text-align: center;
  font-size: calc(var(--app-font-size) * 1);
  margin: 0 calc(var(--content-margin-h) * 2);
  padding-top: calc(var(--app-font-size) * 3);
}
.page-coffee-config.page-content .content .coffee-proc-frame {
  left: 0;
  right: 0;
  position: absolute;
  border-radius: calc(var(--app-font-size) * 0.5);
  border: calc(var(--app-font-size) * 0.15) solid var(--color-theme-order-page-frame-border-color);
  margin: 0 calc(50vw - var(--home-page-image-size) * 1.15);
  padding: calc(var(--home-page-image-size) * 0.2) calc(var(--home-page-image-size) * 0.15) calc(var(--home-page-image-size) * 0.1) calc(var(--home-page-image-size) * 0.15);
  top: calc((100vh - var(--title-height) - var(--home-page-image-size) * 1.5 - var(--app-font-size) * 4) * 0.5);
}
.page-coffee-config.page-content .content .coffee-proc-frame .entry-title {
  color: var(--color-theme-color);
  text-align: center;
  font-size: var(--app-font-size);
  margin-top: calc(var(--app-font-size) * 1.2);
  line-height: calc(var(--app-font-size) * 1.8);
}
.page-coffee-config.page-content .content .coffee-proc-frame .coffee-proc-step2,
.page-coffee-config.page-content .content .coffee-proc-frame .coffee-proc-step6 {
  height: var(--home-page-image-size);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  margin-left: -2000px;
  filter: drop-shadow(1000px 0 var(--color-theme-catalog-icon-color));
}
.page-coffee-config.page-content .content .coffee-proc-frame .coffee-proc-step6 {
  background-image: url("../../configs/images/EntryModule/screen.png");
}
.page-coffee-config.page-content .content .coffee-proc-frame .coffee-proc-step2 {
  background-image: url("../../configs/images/EntryModule/receipt.png");
}
.page-coffee-config.page-content .content .coffee-proc-frame .coffee-proc-step2-text,
.page-coffee-config.page-content .content .coffee-proc-frame .coffee-proc-step6-text {
  color: var(--color-theme-color);
  text-align: center;
  font-size: calc(var(--app-font-size) * 1.5);
  line-height: calc(var(--app-font-size) * 1.8);
  margin-bottom: calc(var(--app-font-size) * 1.2);
}
.page-coffee-config.page-content .content .coffee-proc-frame .triangle {
  top: 0;
  left: calc(var(--home-page-image-size) * 0.95);
  position: absolute;
  width: 0;
  height: 0;
  border-top: calc(var(--home-page-image-size) * 0.1) solid var(--color-theme-order-page-bottom-mark-color);
  border-left: calc(var(--home-page-image-size) * 0.2) solid transparent;
  border-right: calc(var(--home-page-image-size) * 0.2) solid transparent;
}
.page-coffee-config.page-content .content .coffee-proc-frame .triangle.lv1 {
  top: calc(var(--home-page-image-size) * 2.5);
}
.page-coffee-config.page-content .content .coffee-proc-frame .triangle.lv2 {
  top: calc(var(--home-page-image-size) * 2.75);
}
.page-coffee-config.page-content .content .coffee-proc-frame .triangle.lv3 {
  top: calc(var(--home-page-image-size) * 3);
}
.page-coffee-config.page-content .content .coffee-option-frame {
  left: 0;
  right: 0;
  position: absolute;
  margin: 0 calc(50vw - var(--home-page-image-size) * 1.35);
  padding: calc(var(--home-page-image-size) * 0.2) calc(var(--home-page-image-size) * 0.1);
  top: calc((100vh - var(--title-height) - var(--home-page-image-size) * 3.5 - var(--app-font-size) * 4) * 0.5);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-step {
  height: calc(var(--home-page-image-size) * 0.75);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  margin-left: -2000px;
  filter: drop-shadow(1000px 0 var(--color-theme-catalog-icon-color));
  background-image: url("../../configs/images/EntryModule/receipt.png");
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-opt-title {
  font-size: calc(var(--app-font-size) * 1.25);
  text-align: center;
  margin-top: calc(var(--app-font-size) * 1);
  margin-bottom: calc(var(--app-font-size) * 3);
}
.page-coffee-config.page-content .content .coffee-option-frame .option-tips {
  text-align: center;
  line-height: 150%;
  color: var(--color-theme-color-light);
  font-size: calc(var(--app-font-size) * 0.8);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option {
  position: relative;
  text-align: center;
  height: calc(var(--app-font-size) * 5);
  border-radius: calc(var(--app-font-size) * 0.5);
  margin: 0 calc(var(--home-page-image-size) * 0.25) calc(var(--home-page-image-size) * 0.25);
  border: calc(var(--app-font-size) * 0.1) solid var(--color-theme-order-page-frame-border-color);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .left {
  width: 20%;
  float: left;
  text-align: center;
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .left i {
  font-size: calc(var(--app-font-size) * 2);
  line-height: calc(var(--app-font-size) * 5);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .right {
  float: left;
  display: flex;
  flex-flow: column;
  justify-content: space-evenly;
  width: calc(80% - var(--home-page-image-size) * 0.12 - var(--app-font-size) * 0.1);
  height: calc(var(--app-font-size) * 5 - var(--home-page-image-size) * 0.06);
  padding: calc(var(--home-page-image-size) * 0.03) calc(var(--home-page-image-size) * 0.06);
  border-left: calc(var(--app-font-size) * 0.1) solid var(--color-theme-color);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .right > div {
  display: flex;
  justify-content: center;
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .right .s-title {
  font-size: calc(var(--app-font-size) * 1.1);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .right .s-content {
  overflow: hidden;
  display: -webkit-box;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  color: var(--color-theme-color-light);
  font-size: calc(var(--app-font-size) * 0.7);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .right .s-message {
  display: none;
  flex-direction: column;
  font-size: calc(var(--app-font-size) * 0.7);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .right .s-message .item-input {
  text-align: left;
  border-bottom: calc(var(--app-font-size) * 0.1) solid var(--color-theme-order-page-frame-border-color);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .right .s-message .item-input input {
  width: 70%;
  text-align: center;
  padding: 0 6% 0 2%;
  font-size: calc(var(--app-font-size) * 1.5);
  line-height: calc(var(--app-font-size) * 2.4);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .right .s-message .item-input input::placeholder {
  font-size: calc(var(--app-font-size) * 1);
  line-height: calc(var(--app-font-size) * 2.4);
  padding-bottom: calc(var(--app-font-size) * 0.25);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .right .s-message .item-input .item-region {
  width: 30%;
  float: left;
  text-align: center;
  font-size: calc(var(--app-font-size) * 1.5);
  line-height: calc(var(--app-font-size) * 2.4);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .right .s-message .coffee-message {
  margin-top: calc(var(--app-font-size) * 0.8);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .right .s-message .coffee-message button {
  font-weight: normal;
  border: 1px var(--color-theme-color) solid;
  width: 90%;
  height: calc(var(--app-font-size) * 2.2);
  line-height: calc(var(--app-font-size) * 2.2);
  font-size: calc(var(--app-font-size) * 0.9);
  border-radius: calc(var(--app-font-size) * 0.25);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .right .s-message .coffee-message button i {
  font-size: calc(var(--app-font-size) * 1.2);
  margin-right: calc(var(--app-font-size) * 0.3);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .right .s-message .coffee-message button.cancel-button {
  color: var(--color-theme-color);
  margin-left: calc(var(--app-font-size) * 0.2);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .right .s-message .coffee-message button.send-button {
  float: right;
  color: var(--color-theme-color);
  margin-right: calc(var(--app-font-size) * 0.2);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .right .s-message .coffee-message button.send-button > i.if-not-md {
  margin-right: calc(var(--app-font-size) * 0.5);
}
.page-coffee-config.page-content .content .coffee-option-frame .coffee-proc-option .top-cover {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  position: absolute;
  color: rgba(255, 255, 255, 0.001);
}
.page-coffee-config.page-content .content .coffee-option-frame.input-mode .option-tips {
  display: none;
}
.page-coffee-config.page-content .content .coffee-option-frame.input-mode .coffee-proc-option {
  margin-bottom: calc(var(--home-page-image-size) * 0.125);
}
.page-coffee-config.page-content .content .coffee-option-frame.input-mode .coffee-proc-option .top-cover {
  display: none;
}
.page-coffee-config.page-content .content .coffee-option-frame.input-mode .coffee-proc-option.option-1, .page-coffee-config.page-content .content .coffee-option-frame.input-mode .coffee-proc-option.option-3 {
  opacity: 0.4;
  transform: scale(0.9);
  height: calc(var(--app-font-size) * 3);
}
.page-coffee-config.page-content .content .coffee-option-frame.input-mode .coffee-proc-option.option-1 .left i, .page-coffee-config.page-content .content .coffee-option-frame.input-mode .coffee-proc-option.option-3 .left i {
  line-height: calc(var(--app-font-size) * 3);
}
.page-coffee-config.page-content .content .coffee-option-frame.input-mode .coffee-proc-option.option-1 .right, .page-coffee-config.page-content .content .coffee-option-frame.input-mode .coffee-proc-option.option-3 .right {
  height: calc(var(--app-font-size) * 3 - var(--home-page-image-size) * 0.06);
}
.page-coffee-config.page-content .content .coffee-option-frame.input-mode .coffee-proc-option.option-1 .right .s-content, .page-coffee-config.page-content .content .coffee-option-frame.input-mode .coffee-proc-option.option-3 .right .s-content {
  display: none;
}
.page-coffee-config.page-content .content .coffee-option-frame.input-mode .coffee-proc-option.option-2 {
  height: calc(var(--app-font-size) * 12);
}
.page-coffee-config.page-content .content .coffee-option-frame.input-mode .coffee-proc-option.option-2 .left i {
  line-height: calc(var(--app-font-size) * 12);
}
.page-coffee-config.page-content .content .coffee-option-frame.input-mode .coffee-proc-option.option-2 .right {
  height: calc(var(--app-font-size) * 12 - var(--home-page-image-size) * 0.06);
}
.page-coffee-config.page-content .content .coffee-option-frame.input-mode .coffee-proc-option.option-2 .right .s-message {
  display: flex;
}
.page-coffee-config.page-content .content .coffee-app-download {
  position: relative;
  width: calc(100vw - var(--content-margin-h) * 4);
  padding: calc(var(--content-margin-h) * 0.4) calc(var(--content-margin-h) * 2) 0;
}
.page-coffee-config.page-content .content .coffee-app-download .alert-warning {
  color: var(--color-theme-color-highlight);
  padding: 2.25vw 0;
  margin: 0 auto;
  width: calc(var(--coffee-bottom-width) * 2 + var(--coffee-bottom-margin) + var(--f7-grid-gap));
}
.page-coffee-config.page-content .content .coffee-app-download .alert-warning > div {
  font-size: calc(var(--app-font-size) * 0.8);
  margin-bottom: 1vw;
}
.page-coffee-config.page-content .content .swiper-container {
  width: calc(100vw - var(--content-margin-h) * 2);
  margin: 0 var(--content-margin-h);
  max-height: 50vw;
}
.page-coffee-config.page-content .content .swiper-container .swiper-wrapper {
  padding-top: calc(var(--swiper-image-width) * 0.25);
  padding-bottom: calc(var(--swiper-image-width) * 0.25);
}
.page-coffee-config.page-content .content .swiper-container .swiper-wrapper .swiper-slide {
  width: 50vw;
  text-align: center;
}
.page-coffee-config.page-content .content .swiper-container .swiper-wrapper .swiper-slide .item-image {
  float: left;
  width: calc(var(--swiper-image-width) * 0.8);
  margin-left: calc(var(--swiper-image-width) * 0.1);
  margin-right: calc(var(--swiper-image-width) * 0.05);
}
.page-coffee-config.page-content .content .swiper-container .swiper-wrapper .swiper-slide .item-image .image {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  width: calc(var(--swiper-image-width) * 0.75);
  height: calc(var(--swiper-image-width) * 0.75);
  border-radius: calc(var(--swiper-image-width) / 20);
}
.page-coffee-config.page-content .content .swiper-container .swiper-wrapper .swiper-slide .item-content {
  float: left;
  text-align: left;
}
.page-coffee-config.page-content .content .swiper-container .swiper-wrapper .swiper-slide .item-content .item-name {
  font-size: 2.5vw;
  font-weight: 600;
  margin-left: 0.35vw;
  margin-bottom: 1vw;
  width: calc(45vw - var(--swiper-image-width) * 0.8);
}
.page-coffee-config.page-content .content .swiper-container .swiper-wrapper .swiper-slide .item-content .item-info {
  color: var(--color-theme-color-light);
  font-size: 1.6vw;
  margin-bottom: 1vw;
  width: calc(45vw - var(--swiper-image-width) * 0.8);
}
.page-coffee-config.page-content .content .swiper-container .swiper-wrapper .swiper-slide .item-content .item-info.hidden {
  display: none;
}
.page-coffee-config.page-content .content .swiper-container .swiper-wrapper .swiper-slide .item-content .item-price {
  color: var(--color-theme-color-highlight);
  font-weight: 600;
  margin-bottom: 1vw;
  font-size: 2.4vw;
  width: calc(45vw - var(--swiper-image-width) * 0.8);
}
.page-coffee-config.page-content .content .swiper-container .swiper-wrapper .swiper-slide .item-content .item-price .source-price {
  color: #808080;
  text-decoration: line-through;
  margin-left: calc(var(--app-font-size) * 0.4);
  font-size: 2vw;
}
.page-coffee-config.page-content .content .swiper-container .swiper-wrapper .swiper-slide .item-content .item-button {
  color: var(--color-theme-color-light);
  font-size: 1.8vw;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 8;
  width: calc(45vw - var(--swiper-image-width) * 0.8);
}

.rtl .page-coffee-config.page-content .content .coffee-info .image {
  float: right;
}
.rtl .page-coffee-config.page-content .content .coffee-info .shop-content {
  float: right;
}
.rtl .page-coffee-config.page-content .content .coffee-info .shop-content .price .amount {
  margin-left: unset;
  margin-right: 2vw;
}
.rtl .page-coffee-config.page-content .content .coffee-info.no-description .shop-content .price .amount {
  margin-left: unset;
  margin-right: 2vw;
}
.rtl .page-coffee-config.page-content .content .coffee-pay-qrcode .none .none-title.title-pay {
  padding-left: unset;
  padding-right: 0;
}
.rtl .page-coffee-config.page-content .content .coffee-pay-qrcode .payment-title .img-pay {
  float: right;
  background-position: right center;
}
.rtl .page-coffee-config.page-content .content .coffee-pay-qrcode .payment-title .title-pay {
  float: right;
  padding-left: unset;
  padding-right: calc(var(--app-font-size) * 0.8);
}
.rtl .page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .order-price .source-price {
  margin-left: unset;
  margin-right: calc(var(--app-font-size) * 0.8);
}
.rtl .page-coffee-config.page-content .content .coffee-pay-qrcode .order-detail .order-tit .coupon-code {
  margin-left: unset;
  margin-right: 10px;
  padding: 6px 12px 6px 10px;
}
.rtl .page-coffee-config.page-content .content .coffee-pay-qrcode .coffee-coupon button span {
  margin-left: unset;
  margin-right: 4px;
}
.rtl .page-coffee-config.page-content .content .coffee-pay-qrcode .coffee-coupon button i {
  margin-left: calc(var(--app-font-size) * 0.3);
  margin-right: unset;
}
.rtl .page-coffee-config.page-content .content .coffee-pay-qrcode .coffee-coupon button.cancel-button {
  margin-left: unset;
  margin-right: calc(var(--coffee-bottom-margin) * 0.5);
}
.rtl .page-coffee-config.page-content .content .coffee-pay-qrcode .coffee-coupon button.cancel-button > i {
  transform: rotate(180deg);
}
.rtl .page-coffee-config.page-content .content .coffee-pay-qrcode .coffee-coupon button.coupon-button {
  float: left;
  margin-left: calc(var(--coffee-bottom-margin) * 0.5);
  margin-right: unset;
}
.rtl .page-coffee-config.page-content .content .coffee-pay-qrcode .return-button {
  left: calc(var(--content-margin-h) * 2);
  right: unset;
}
.rtl .page-coffee-config.page-content .content .coffee-pay-qrcode .confirm-button > span {
  margin-left: unset;
  margin-right: calc(var(--app-font-size) * 0.5);
}
.rtl .page-coffee-config.page-content .content .coffee-proc-frame .triangle {
  left: unset;
  right: calc(var(--home-page-image-size) * 0.95);
}
.rtl .page-coffee-config.page-content .content .swiper-container .swiper-wrapper .swiper-slide .item-image {
  float: right;
  margin-left: calc(var(--swiper-image-width) * 0.05);
  margin-right: calc(var(--swiper-image-width) * 0.1);
}
.rtl .page-coffee-config.page-content .content .swiper-container .swiper-wrapper .swiper-slide .item-content {
  float: right;
  text-align: right;
}
.rtl .page-coffee-config.page-content .content .swiper-container .swiper-wrapper .swiper-slide .item-content .item-name {
  margin-left: unset;
  margin-right: 0.35vw;
}
.rtl .page-coffee-config.page-content .content .swiper-container .swiper-wrapper .swiper-slide .item-content .item-price .source-price {
  margin-left: unset;
  margin-right: calc(var(--app-font-size) * 0.4);
}

.receipt {
  top: 0;
  width: 600px;
  left: -60000px;
  z-index: -10000;
  position: absolute;
  padding: 0 40px;
  background-color: #fff;
  font-family: "Archivo-Bold";
}
.receipt .screen-line {
  height: 16px;
}
.receipt .screen-line.p8 {
  height: 8px;
}
.receipt .screen-logo {
  height: 80px;
}
.receipt .screen-logo .logo {
  width: 100%;
  height: 80px;
  margin-top: 24px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  filter: grayscale(100%) brightness(0%);
}
.receipt .screen-rect {
  color: #fff;
  font-size: 32px;
  text-align: center;
  letter-spacing: 6px;
  padding: 10px;
  margin-top: 0px;
  background-color: #000;
}
.receipt .screen-text {
  color: #000;
  font-size: 36px;
  text-align: center;
  margin-top: 10px;
}
.receipt .top-area {
  overflow: hidden;
}
.receipt .top-area .left-area {
  float: left;
  width: 280px;
  height: 320px;
  text-align: center;
}
.receipt .top-area .left-area .screen-number {
  color: #000;
  font-size: 100px;
  padding-top: 40px;
  line-height: 150px;
  letter-spacing: 8px;
}
.receipt .top-area .left-area .screen-number-tips {
  font-size: 36px;
}
.receipt .top-area .one-line-qrcode,
.receipt .top-area .menu-list-qrcode {
  float: left;
  width: 320px;
  height: 320px;
}
.receipt .top-area .one-line-qrcode .qr-code-src,
.receipt .top-area .menu-list-qrcode .qr-code-src {
  width: 320px;
  height: 320px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}
.receipt .top-area .one-line-qrcode {
  float: unset;
  width: 280px;
  height: 280px;
  margin: 0 auto;
}
.receipt .top-area .one-line-qrcode .qr-code-src {
  width: 280px;
  height: 280px;
}
.receipt .screen-tips {
  color: #000;
  font-size: 18px;
  text-align: left;
  letter-spacing: 1px;
  margin: -12px 0 12px 0;
}
.receipt .screen-address {
  color: #000;
  font-size: 24px;
  text-align: center;
  letter-spacing: 1px;
  margin: -12px 0 12px 0;
}
.receipt .menu-list-rect {
  color: #fff;
  font-size: 24px;
  text-align: center;
  letter-spacing: 6px;
  padding: 4px;
  background-color: #000;
}
.receipt .menu-list-time {
  color: #000;
  font-size: 28px;
  text-align: right;
  letter-spacing: 2px;
  padding: 4px;
  margin-top: 30px;
  border-bottom: 3px #000 solid;
}
.receipt .menu-list-title {
  color: #000;
  letter-spacing: 2px;
  padding: 8px 4px;
  border-bottom: 3px #000 solid;
}
.receipt .menu-list-title .tab1,
.receipt .menu-list-title .tab2 {
  float: left;
  width: 120px;
  font-size: 26px;
  text-align: left;
  line-height: 32px;
}
.receipt .menu-list-title .tab2 {
  width: 240px;
}
.receipt .menu-list-title .tab3 {
  float: right;
  font-size: 32px;
  text-align: right;
  line-height: 32px;
}
.receipt .menu-list-content {
  color: #000;
  text-align: right;
  letter-spacing: 2px;
  margin: 10px 0 0 0;
  padding: 0 4px 8px 4px;
  overflow: hidden;
}
.receipt .menu-list-content:nth-last-child(1) {
  padding-bottom: 20px;
}
.receipt .menu-list-content .tab1,
.receipt .menu-list-content .tab2 {
  float: left;
  width: 120px;
  font-size: 26px;
  text-align: left;
  line-height: 32px;
}
.receipt .menu-list-content .tab2 {
  width: 240px;
}
.receipt .menu-list-content .tab3 {
  font-size: 32px;
  text-align: right;
  line-height: 32px;
}
.receipt .menu-list-sub-content {
  color: #333;
  height: 18px;
  letter-spacing: 2px;
  padding: 8px 4px;
}
.receipt .menu-list-sub-content .tab1,
.receipt .menu-list-sub-content .tab2 {
  float: left;
  width: 120px;
  font-size: 21px;
  text-align: left;
  line-height: 24px;
}
.receipt .menu-list-sub-content .tab2 {
  width: 312px;
}
.receipt .menu-list-sub-content .tab3 {
  float: left;
  width: 160px;
  font-size: 24px;
  text-align: right;
  line-height: 24px;
}
.receipt .menu-list-total {
  color: #000;
  margin-top: 12px;
  margin-bottom: 32px;
  letter-spacing: 2px;
  padding: 8px 4px;
  position: relative;
}
.receipt .menu-list-total .tab1 {
  float: left;
  font-size: 26px;
  text-align: left;
  line-height: 32px;
  padding-right: 16px;
  background-color: #fff;
}
.receipt .menu-list-total .tab3 {
  float: right;
  font-size: 32px;
  text-align: right;
  line-height: 32px;
  padding-left: 16px;
  background-color: #fff;
}
.receipt .menu-list-total .tab2 {
  top: 0;
  left: 10px;
  right: 10px;
  z-index: -1;
  height: 22px;
  position: absolute;
  border-bottom: 2px #000 dashed;
}
.receipt .menu-list-payment {
  color: #000;
  padding: 8px 4px;
  position: relative;
  letter-spacing: 2px;
}
.receipt .menu-list-payment .tab1 {
  float: left;
  font-size: 24px;
  text-align: left;
  line-height: 32px;
  background-color: #fff;
}
.receipt .menu-list-payment .tab3 {
  font-size: 32px;
  text-align: right;
  line-height: 32px;
  background-color: #fff;
}
.receipt .menu-list-payment .tab3.small {
  font-size: 28px;
  line-height: 60px;
  letter-spacing: 0;
}
.receipt .menu-list-dashed {
  height: 1px;
  margin: 16px 0 24px;
  border-bottom: 2px #000 dashed;
}
.receipt .itemtax-list-title,
.receipt .itemtax-list-content {
  color: #000;
  letter-spacing: 2px;
  border-bottom: 2px #000 solid;
}
.receipt .itemtax-list-title .tab1,
.receipt .itemtax-list-title .tab2,
.receipt .itemtax-list-title .tab3,
.receipt .itemtax-list-content .tab1,
.receipt .itemtax-list-content .tab2,
.receipt .itemtax-list-content .tab3 {
  float: left;
  width: 100px;
  font-size: 24px;
  text-align: left;
  line-height: 32px;
}
.receipt .itemtax-list-title .tab2,
.receipt .itemtax-list-content .tab2 {
  width: 180px;
}
.receipt .itemtax-list-title .tab3,
.receipt .itemtax-list-content .tab3 {
  width: 160px;
}
.receipt .itemtax-list-title .tab4,
.receipt .itemtax-list-content .tab4 {
  font-size: 24px;
  text-align: right;
  line-height: 32px;
}
.receipt .itemtax-list-title {
  padding: 24px 4px 8px;
}
.receipt .itemtax-list-content {
  padding: 8px 4px 8px;
}
.receipt .itemtax-list-content.last {
  margin-bottom: 24px;
}
.receipt .contact-line {
  color: #000;
  padding: 4px;
  font-size: 28px;
  text-align: center;
}
.receipt .contact-line-email {
  color: #000;
  font-size: 28px;
  text-align: center;
  font-style: italic;
  font-family: var(--f7-font-family);
  padding-top: 2px;
  padding-bottom: 6px;
}
.receipt .contact-line-email > span {
  padding: 1px 0;
  border-bottom: 1px solid #000;
}
.receipt .contact-line-email.normal {
  font-style: normal;
}
.receipt .contact-line-email.normal > span {
  border-bottom: unset;
}
.receipt .contact-line-mobile {
  color: #000;
  font-size: 50px;
  text-align: center;
  font-style: italic;
  font-family: "SairaCondensed-Regular";
  padding-top: 2px;
  margin-bottom: 0px;
  padding-bottom: 20px;
  border-bottom: 2px #000 solid;
}
.receipt .contact-line-mobile.normal {
  line-height: 32px;
  font-size: 32px;
  font-style: normal;
  padding-bottom: 16px;
}
.receipt .contact-line-mobile.normal .whatsapp {
  width: 32px;
  height: 32px;
  margin-right: 8px;
  display: inline-block;
  vertical-align: middle;
  background-size: cover;
  background-image: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="50" height="50" viewBox="0 0 50 50"><path d="M 25 2 C 12.318 2 2 12.318 2 25 C 2 28.96 3.0228906 32.853062 4.9628906 36.289062 L 2.0371094 46.730469 C 1.9411094 47.073469 2.03325 47.440312 2.28125 47.695312 C 2.47225 47.892313 2.733 48 3 48 C 3.08 48 3.1612344 47.989703 3.2402344 47.970703 L 14.136719 45.271484 C 17.463719 47.057484 21.21 48 25 48 C 37.682 48 48 37.682 48 25 C 48 12.318 37.682 2 25 2 z M 16.642578 14 C 17.036578 14 17.428437 14.005484 17.773438 14.021484 C 18.136437 14.039484 18.624516 13.883484 19.103516 15.021484 C 19.595516 16.189484 20.775875 19.058563 20.921875 19.351562 C 21.069875 19.643563 21.168656 19.984047 20.972656 20.373047 C 20.776656 20.762047 20.678813 21.006656 20.382812 21.347656 C 20.086813 21.688656 19.762094 22.107141 19.496094 22.369141 C 19.200094 22.660141 18.892328 22.974594 19.236328 23.558594 C 19.580328 24.142594 20.765484 26.051656 22.521484 27.597656 C 24.776484 29.583656 26.679531 30.200188 27.269531 30.492188 C 27.859531 30.784188 28.204828 30.734703 28.548828 30.345703 C 28.892828 29.955703 30.024969 28.643547 30.417969 28.060547 C 30.810969 27.477547 31.204094 27.572578 31.746094 27.767578 C 32.288094 27.961578 35.19125 29.372062 35.78125 29.664062 C 36.37125 29.956063 36.766062 30.102703 36.914062 30.345703 C 37.062062 30.587703 37.062312 31.754234 36.570312 33.115234 C 36.078313 34.477234 33.717984 35.721672 32.583984 35.888672 C 31.565984 36.037672 30.277281 36.10025 28.863281 35.65625 C 28.006281 35.38625 26.907047 35.028734 25.498047 34.427734 C 19.575047 31.901734 15.706156 26.012047 15.410156 25.623047 C 15.115156 25.234047 13 22.46275 13 19.59375 C 13 16.72475 14.524406 15.314469 15.066406 14.730469 C 15.608406 14.146469 16.248578 14 16.642578 14 z"></path></svg>');
}
.receipt#receipt-euro .screen-text, .receipt#receipt-normal .screen-text, .receipt#receipt-romania .screen-text {
  font-size: 48px;
  margin-bottom: 30px;
}
.receipt#receipt-euro .menu-list-time, .receipt#receipt-normal .menu-list-time, .receipt#receipt-romania .menu-list-time {
  margin-top: 0px;
}
.receipt#receipt-euro .screen-address, .receipt#receipt-normal .screen-address, .receipt#receipt-romania .screen-address {
  font-size: 24px;
  text-align: left;
  margin-top: -6px;
}
.receipt#receipt-euro .screen-address .left, .receipt#receipt-normal .screen-address .left, .receipt#receipt-romania .screen-address .left {
  float: left;
}
.receipt#receipt-euro .screen-address .left:nth-child(1), .receipt#receipt-normal .screen-address .left:nth-child(1), .receipt#receipt-romania .screen-address .left:nth-child(1) {
  margin-right: 6px;
}
.receipt#receipt-euro .screen-address .right, .receipt#receipt-normal .screen-address .right, .receipt#receipt-romania .screen-address .right {
  float: right;
}
.receipt#receipt-euro .screen-address .bold, .receipt#receipt-euro .screen-address.bold, .receipt#receipt-normal .screen-address .bold, .receipt#receipt-normal .screen-address.bold, .receipt#receipt-romania .screen-address .bold, .receipt#receipt-romania .screen-address.bold {
  font-weight: 600;
}
.receipt#receipt-euro .screen-address .center, .receipt#receipt-euro .screen-address.center, .receipt#receipt-normal .screen-address .center, .receipt#receipt-normal .screen-address.center, .receipt#receipt-romania .screen-address .center, .receipt#receipt-romania .screen-address.center {
  text-align: center;
}
.receipt#receipt-euro .screen-address .big, .receipt#receipt-euro .screen-address.big, .receipt#receipt-normal .screen-address .big, .receipt#receipt-normal .screen-address.big, .receipt#receipt-romania .screen-address .big, .receipt#receipt-romania .screen-address.big {
  font-size: 28px;
}
.receipt#receipt-euro .screen-address .small, .receipt#receipt-normal .screen-address .small, .receipt#receipt-romania .screen-address .small {
  font-size: 20px;
}
.receipt#receipt-euro .screen-address::after, .receipt#receipt-normal .screen-address::after, .receipt#receipt-romania .screen-address::after {
  clear: both;
  content: "";
  display: block;
}
.receipt#receipt-euro .menu-list-title, .receipt#receipt-normal .menu-list-title, .receipt#receipt-romania .menu-list-title {
  border-top: 2px #000 solid;
  border-bottom: 2px #000 solid;
}
.receipt#receipt-euro .menu-list-title .tab1, .receipt#receipt-normal .menu-list-title .tab1, .receipt#receipt-romania .menu-list-title .tab1 {
  width: 80px;
}
.receipt#receipt-euro .menu-list-title .tab2, .receipt#receipt-normal .menu-list-title .tab2, .receipt#receipt-romania .menu-list-title .tab2 {
  width: 350px;
}
.receipt#receipt-euro .menu-list-title .tab3, .receipt#receipt-normal .menu-list-title .tab3, .receipt#receipt-romania .menu-list-title .tab3 {
  width: 162px;
  font-size: 26px;
  text-align: right;
  white-space: nowrap;
}
.receipt#receipt-euro .menu-list-content .tab1, .receipt#receipt-normal .menu-list-content .tab1, .receipt#receipt-romania .menu-list-content .tab1 {
  width: 80px;
}
.receipt#receipt-euro .menu-list-content .tab2, .receipt#receipt-normal .menu-list-content .tab2, .receipt#receipt-romania .menu-list-content .tab2 {
  width: 350px;
  font-size: 24px;
}
.receipt#receipt-euro .menu-list-content .tab3, .receipt#receipt-normal .menu-list-content .tab3, .receipt#receipt-romania .menu-list-content .tab3 {
  float: left;
  width: 162px;
  font-size: 26px;
  text-align: right;
  white-space: nowrap;
}
.receipt#receipt-euro .menu-list-sub-content .tab1, .receipt#receipt-normal .menu-list-sub-content .tab1, .receipt#receipt-romania .menu-list-sub-content .tab1 {
  width: 80px;
}
.receipt#receipt-euro .menu-list-sub-content .tab2, .receipt#receipt-normal .menu-list-sub-content .tab2, .receipt#receipt-romania .menu-list-sub-content .tab2 {
  width: 350px;
}
.receipt#receipt-euro .menu-list-sub-content .tab3, .receipt#receipt-normal .menu-list-sub-content .tab3, .receipt#receipt-romania .menu-list-sub-content .tab3 {
  width: 162px;
  float: left;
  white-space: nowrap;
}
.receipt#receipt-euro .menu-list-total .tab1,
.receipt#receipt-euro .menu-list-payment .tab1, .receipt#receipt-normal .menu-list-total .tab1,
.receipt#receipt-normal .menu-list-payment .tab1, .receipt#receipt-romania .menu-list-total .tab1,
.receipt#receipt-romania .menu-list-payment .tab1 {
  font-size: 24px;
}
.receipt#receipt-euro .menu-list-total .tab2,
.receipt#receipt-euro .menu-list-payment .tab2, .receipt#receipt-normal .menu-list-total .tab2,
.receipt#receipt-normal .menu-list-payment .tab2, .receipt#receipt-romania .menu-list-total .tab2,
.receipt#receipt-romania .menu-list-payment .tab2 {
  font-size: 28px;
}
.receipt#receipt-euro .menu-list-total.draw-line,
.receipt#receipt-euro .menu-list-payment.draw-line, .receipt#receipt-normal .menu-list-total.draw-line,
.receipt#receipt-normal .menu-list-payment.draw-line, .receipt#receipt-romania .menu-list-total.draw-line,
.receipt#receipt-romania .menu-list-payment.draw-line {
  padding-top: 24px;
  border-top: 2px #000 solid;
}
.receipt#receipt-euro .menu-list-total, .receipt#receipt-normal .menu-list-total, .receipt#receipt-romania .menu-list-total {
  margin-top: 26px;
}
.receipt#receipt-euro .menu-list-payment.first .tab3, .receipt#receipt-normal .menu-list-payment.first .tab3, .receipt#receipt-romania .menu-list-payment.first .tab3 {
  font-size: 40px;
}

.rtl .receipt .top-area .left-area {
  float: right;
}
.rtl .receipt .top-area .menu-list-qrcode {
  float: right;
}
.rtl .receipt .menu-list-time {
  text-align: left;
}
.rtl .receipt .menu-list-title .tab3 {
  text-align: left;
}
.rtl .receipt .menu-list-title .tab1, .rtl .receipt .menu-list-title .tab2 {
  float: right;
  text-align: right;
}
.rtl .receipt .menu-list-content {
  text-align: left;
}
.rtl .receipt .menu-list-content .tab3 {
  text-align: left;
}
.rtl .receipt .menu-list-content .tab1, .rtl .receipt .menu-list-content .tab2 {
  float: right;
  text-align: right;
}
.rtl .receipt .menu-list-sub-content .tab3 {
  float: right;
  text-align: left;
}
.rtl .receipt .menu-list-sub-content .tab1, .rtl .receipt .menu-list-sub-content .tab2 {
  float: right;
  text-align: right;
}
.rtl .receipt .menu-list-total .tab3 {
  float: left;
  text-align: left;
  padding-left: 0;
  padding-right: 16px;
}
.rtl .receipt .menu-list-total .tab1 {
  float: right;
  text-align: right;
  padding-left: 16px;
  padding-right: 0;
}
.rtl .receipt .menu-list-payment .tab3 {
  text-align: left;
}
.rtl .receipt .menu-list-payment .tab1 {
  float: right;
  text-align: right;
}

.use-coupon-code-helper .sheet-modal-inner, .upload-coffee-art-image .sheet-modal-inner,
.use-employee-code-helper .sheet-modal-inner, .upload-coffee-art-image .sheet-modal-inner {
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
}
.use-coupon-code-helper .sheet-modal-inner .swipe-handler, .upload-coffee-art-image .sheet-modal-inner .swipe-handler,
.use-employee-code-helper .sheet-modal-inner .swipe-handler, .upload-coffee-art-image .sheet-modal-inner .swipe-handler {
  top: 0;
  left: 0;
  z-index: 10;
  width: 100%;
  height: 28px;
  cursor: pointer;
  background: #fff;
  position: absolute;
}
.use-coupon-code-helper .sheet-modal-inner .swipe-handler:after, .upload-coffee-art-image .sheet-modal-inner .swipe-handler:after,
.use-employee-code-helper .sheet-modal-inner .swipe-handler:after, .upload-coffee-art-image .sheet-modal-inner .swipe-handler:after {
  content: "";
  top: 50%;
  left: 50%;
  width: 60px;
  height: 10px;
  background: #666;
  position: absolute;
  margin-top: -3px;
  margin-left: -30px;
  border-radius: 5px;
}
.use-coupon-code-helper .sheet-modal-inner .page-content, .upload-coffee-art-image .sheet-modal-inner .page-content,
.use-employee-code-helper .sheet-modal-inner .page-content, .upload-coffee-art-image .sheet-modal-inner .page-content {
  text-align: center;
  padding: 0 20vw 6vw 20vw;
}
.use-coupon-code-helper .sheet-modal-inner .page-content .block-title-large, .upload-coffee-art-image .sheet-modal-inner .page-content .block-title-large,
.use-employee-code-helper .sheet-modal-inner .page-content .block-title-large, .upload-coffee-art-image .sheet-modal-inner .page-content .block-title-large {
  margin-top: 48px;
}
.use-coupon-code-helper .sheet-modal-inner .page-content .center-image-region .qr-code-src, .upload-coffee-art-image .sheet-modal-inner .page-content .center-image-region .qr-code-src,
.use-employee-code-helper .sheet-modal-inner .page-content .center-image-region .qr-code-src, .upload-coffee-art-image .sheet-modal-inner .page-content .center-image-region .qr-code-src {
  width: 30vw;
  height: 30vw;
  margin: 1vw 15vw 5vw;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}
.use-coupon-code-helper .sheet-modal-inner .page-content .center-image-region .help-image-region, .upload-coffee-art-image .sheet-modal-inner .page-content .center-image-region .help-image-region,
.use-employee-code-helper .sheet-modal-inner .page-content .center-image-region .help-image-region, .upload-coffee-art-image .sheet-modal-inner .page-content .center-image-region .help-image-region {
  width: 60vw;
  height: 30vw;
  margin: 1vw 0 5vw;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}
.use-coupon-code-helper .sheet-modal-inner .page-content .center-image-region.m .help-image-region, .upload-coffee-art-image .sheet-modal-inner .page-content .center-image-region.m .help-image-region,
.use-employee-code-helper .sheet-modal-inner .page-content .center-image-region.m .help-image-region, .upload-coffee-art-image .sheet-modal-inner .page-content .center-image-region.m .help-image-region {
  margin-bottom: 0;
}
.use-coupon-code-helper .sheet-modal-inner .page-content .help-info-description, .upload-coffee-art-image .sheet-modal-inner .page-content .help-info-description,
.use-employee-code-helper .sheet-modal-inner .page-content .help-info-description, .upload-coffee-art-image .sheet-modal-inner .page-content .help-info-description {
  padding-top: 1rem;
  padding-bottom: 1rem;
  font-size: calc(var(--app-font-size) * 0.8);
}
.use-coupon-code-helper .sheet-modal-inner .page-content .help-info-description.t, .upload-coffee-art-image .sheet-modal-inner .page-content .help-info-description.t,
.use-employee-code-helper .sheet-modal-inner .page-content .help-info-description.t, .upload-coffee-art-image .sheet-modal-inner .page-content .help-info-description.t {
  padding-top: 0;
}
.use-coupon-code-helper .sheet-modal-inner .page-content .help-info-description.m, .upload-coffee-art-image .sheet-modal-inner .page-content .help-info-description.m,
.use-employee-code-helper .sheet-modal-inner .page-content .help-info-description.m, .upload-coffee-art-image .sheet-modal-inner .page-content .help-info-description.m {
  padding-bottom: 0;
}
.use-coupon-code-helper .sheet-modal-inner .page-content .help-info-description p, .upload-coffee-art-image .sheet-modal-inner .page-content .help-info-description p,
.use-employee-code-helper .sheet-modal-inner .page-content .help-info-description p, .upload-coffee-art-image .sheet-modal-inner .page-content .help-info-description p {
  margin: 0.5rem 0;
}
.use-coupon-code-helper .sheet-modal-inner .page-content .bottom-finish-exit-button button, .upload-coffee-art-image .sheet-modal-inner .page-content .bottom-finish-exit-button button,
.use-employee-code-helper .sheet-modal-inner .page-content .bottom-finish-exit-button button, .upload-coffee-art-image .sheet-modal-inner .page-content .bottom-finish-exit-button button {
  font-size: 2.6vw;
}

@media screen and (max-aspect-ratio: 10/10) {
  :root {
    --content-margin-h: 5vw;
    --coffee-info-image: 30vw;
    --coffee-info-margin: 3.6vw;
    --coffee-bottom-width: 30vw;
    --coffee-bottom-margin: 6vw;
    --order-pay-image-size: 30vw;
    --upload-image-count: 5;
    --upload-image-margin: calc(var(--app-font-size) * 0.4);
    --upload-image-size: calc((100vw - (var(--content-margin-h) + var(--coffee-info-margin) -
        var(--upload-image-margin)) * 2) / var(--upload-image-count) - var(--upload-image-margin) * 2);
  }
}
@media screen and (max-aspect-ratio: 10/10) and (max-width: 1200px) {
  :root {
    --upload-image-count: 6;
    --upload-image-margin: calc(var(--app-font-size) * 0.36);
  }
}
@media screen and (max-aspect-ratio: 10/10) and (min-width: 1600px) {
  :root {
    --upload-image-count: 7;
    --upload-image-margin: calc(var(--app-font-size) * 0.32);
  }
}
@media screen and (max-aspect-ratio: 10/10) and (min-width: 2000px) {
  :root {
    --upload-image-count: 8;
    --upload-image-margin: calc(var(--app-font-size) * 0.28);
  }
}
@media screen and (max-aspect-ratio: 10/10) and (min-width: 2500px) {
  :root {
    --upload-image-count: 9;
    --upload-image-margin: calc(var(--app-font-size) * 0.25);
  }
}
@media screen and (min-aspect-ratio: 10/10) {
  :root {
    --content-margin-h: 5vh;
    --coffee-info-image: 30vh;
    --coffee-info-margin: 3.6vh;
    --coffee-bottom-width: 30vh;
    --coffee-bottom-margin: 6vh;
    --order-pay-image-size: 30vh;
    --upload-image-count: 5;
    --upload-image-margin: calc(var(--app-font-size) * 0.4);
    --upload-image-size: calc((100vh - (var(--content-margin-h) + var(--coffee-info-margin) -
        var(--upload-image-margin)) * 2) / var(--upload-image-count) - var(--upload-image-margin) * 2);
  }
}
.page-coffee-select-v2 {
  --radius-size: 3vw;
  --sub-menu-size: 36vw;
  --f7-font-size-p: 1.3vw;
  --f7-badge-size: 3vw;
  --f7-badge-font-size: 2vw;
  --content-cart-height: 12vw;
  --content-left-size: 15vw;
  --content-right-size: 85vw;
  --content-left-menu-size: 19vw;
}
.page-coffee-select-v2.page-content {
  overflow-x: hidden;
  background-color: var(--color-theme-background);
}
.page-coffee-select-v2.page-content .title {
  position: relative;
  height: var(--title-height);
}
.page-coffee-select-v2.page-content .content {
  position: relative;
  height: calc(100vh - var(--title-height) - var(--content-cart-height));
}
.page-coffee-select-v2.page-content .content.horizontal {
  padding: 0;
}
.page-coffee-select-v2.page-content .content .loading {
  color: var(--color-theme-color-light);
  text-align: center;
  font-size: var(--app-font-size);
  padding-top: var(--app-font-size);
  line-height: calc(100vh - var(--title-height) - var(--app-font-size));
}
.page-coffee-select-v2.page-content .content .load-failed {
  color: var(--color-theme-load-error-color);
  text-align: center;
  font-size: var(--app-font-size);
  padding-top: var(--app-font-size);
  line-height: calc(100vh - var(--title-height) - var(--app-font-size));
}
.page-coffee-select-v2.page-content .content .load-failed span.link {
  color: var(--color-theme-load-error-link-color);
  text-decoration: underline;
}
.page-coffee-select-v2.page-content .content .menu-content {
  top: 0;
  left: 0;
  z-index: 100;
  position: absolute;
  color: var(--color-theme-color);
  overflow-x: hidden;
  width: calc(var(--content-left-menu-size) * 1.06);
  height: calc(100vh - var(--title-height) - var(--content-cart-height));
}
.page-coffee-select-v2.page-content .content .menu-content.full {
  display: none;
}
.page-coffee-select-v2.page-content .content .menu-content > div {
  display: flex;
  text-align: center;
  align-items: center;
  justify-content: center;
  background-color: var(--color-theme-menu-background);
  color: var(--color-theme-color-light);
  position: relative;
  border-right: 2px solid var(--color-theme-menu-border);
  border-bottom: 2px solid var(--color-theme-menu-border);
  font-size: calc(var(--f7-font-size-p) * 2);
  width: calc(var(--content-left-menu-size) * 0.8);
  height: calc(var(--content-left-menu-size) * 0.4);
  padding: calc(var(--content-left-menu-size) * 0.1);
}
.page-coffee-select-v2.page-content .content .menu-content > div > span {
  z-index: 100;
}
.page-coffee-select-v2.page-content .content .menu-content > div.last-item {
  border-bottom: none;
}
.page-coffee-select-v2.page-content .content .menu-content > div.first-item {
  height: calc(var(--radius-size) + 2px);
}
.page-coffee-select-v2.page-content .content .menu-content > div.back-item {
  top: 0;
  left: 0;
  padding: 0;
  position: absolute;
  background-color: var(--color-theme-menu-background);
  width: calc(var(--content-left-menu-size) * 1);
  height: calc(100vh - var(--title-height) - var(--content-cart-height) - 2px);
}
.page-coffee-select-v2.page-content .content .menu-content > div .prev, .page-coffee-select-v2.page-content .content .menu-content > div .next {
  display: none;
  position: absolute;
  width: calc(var(--radius-size) + 2px);
  height: calc(var(--radius-size) + 2px);
}
.page-coffee-select-v2.page-content .content .menu-content > div .prev {
  background-color: var(--color-theme-background);
}
.page-coffee-select-v2.page-content .content .menu-content > div .next {
  background-color: var(--color-theme-menu-background);
  border-right: 2px solid var(--color-theme-menu-border);
}
.page-coffee-select-v2.page-content .content .menu-content > div.last .prev, .page-coffee-select-v2.page-content .content .menu-content > div.last .next {
  right: -2px;
  bottom: -2px;
  display: block;
}
.page-coffee-select-v2.page-content .content .menu-content > div.last .next {
  border-radius: 0 0 100% 0;
  border-bottom: 2px solid var(--color-theme-menu-border);
}
.page-coffee-select-v2.page-content .content .menu-content > div.active {
  color: var(--color-theme-color);
  font-weight: bold;
  background-color: var(--color-theme-background);
  border-right: 2px solid var(--color-theme-background);
}
.page-coffee-select-v2.page-content .content .menu-content > div.active + div .prev, .page-coffee-select-v2.page-content .content .menu-content > div.active + div .next {
  top: -2px;
  right: -2px;
  display: block;
}
.page-coffee-select-v2.page-content .content .menu-content > div.active + div .next {
  border-radius: 0 100% 0 0;
  border-top: 2px solid var(--color-theme-menu-border);
}
.page-coffee-select-v2.page-content .content .swiper-content {
  height: 100%;
  position: relative;
}
.page-coffee-select-v2.page-content .content .swiper-content.full {
  --content-left-size: 0;
  --content-right-size: 100vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab {
  height: 100%;
  top: 0;
  left: -10000px;
  position: absolute;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2 {
  top: 0;
  left: calc(var(--content-left-menu-size) * 1.1);
  right: 0;
  z-index: 100;
  background: var(--color-theme-background);
  position: absolute;
  display: flex;
  overflow-x: scroll;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.nav-wrap {
  flex-wrap: wrap;
  left: var(--content-margin-h);
  right: var(--content-margin-h);
  padding-top: calc(var(--swiper-image-width) * 0.15);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2::-webkit-scrollbar {
  width: 0 !important;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2:nth-child(1) .sub-menu-button {
  margin-top: calc(var(--f7-font-size-p) * 2.6);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2:nth-last-child(1) {
  background: linear-gradient(var(--color-theme-background) 0%, var(--color-theme-background) 65%, transparent 100%);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv2 {
  top: calc(var(--f7-font-size-p) * 6.4 + 4px);
  padding-left: 2vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv3 {
  top: calc(var(--f7-font-size-p) * 11 + 8px);
  padding-left: 4vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv4 {
  top: calc(var(--f7-font-size-p) * 15.6 + 12px);
  padding-left: 6vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv5 {
  top: calc(var(--f7-font-size-p) * 20.2 + 16px);
  padding-left: 8vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv6 {
  top: calc(var(--f7-font-size-p) * 24.8 + 20px);
  padding-left: 10vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv7 {
  top: calc(var(--f7-font-size-p) * 29.4 + 24px);
  padding-left: 12vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv8 {
  top: calc(var(--f7-font-size-p) * 34 + 28px);
  padding-left: 14vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv9 {
  top: calc(var(--f7-font-size-p) * 38.6 + 32px);
  padding-left: 16vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv10 {
  top: calc(var(--f7-font-size-p) * 43.2 + 36px);
  padding-left: 18vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv11 {
  top: calc(var(--f7-font-size-p) * 47.8 + 40px);
  padding-left: 20vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv12 {
  top: calc(var(--f7-font-size-p) * 52.4 + 44px);
  padding-left: 22vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv13 {
  top: calc(var(--f7-font-size-p) * 57 + 48px);
  padding-left: 24vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv14 {
  top: calc(var(--f7-font-size-p) * 61.6 + 52px);
  padding-left: 26vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv15 {
  top: calc(var(--f7-font-size-p) * 66.2 + 56px);
  padding-left: 28vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv16 {
  top: calc(var(--f7-font-size-p) * 70.8 + 60px);
  padding-left: 30vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv17 {
  top: calc(var(--f7-font-size-p) * 75.4 + 64px);
  padding-left: 32vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv18 {
  top: calc(var(--f7-font-size-p) * 80 + 68px);
  padding-left: 34vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv19 {
  top: calc(var(--f7-font-size-p) * 84.6 + 72px);
  padding-left: 36vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv20 {
  top: calc(var(--f7-font-size-p) * 89.2 + 76px);
  padding-left: 38vw;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2 + div .swiper-wrapper .swiper-slide:nth-child(1) {
  margin-top: calc(var(--content-margin-h) * 2.6);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2 .sub-menu-button {
  float: left;
  width: unset;
  color: var(--color-theme-top-menu-color);
  font-weight: normal;
  flex: 0 0 auto;
  height: calc(var(--f7-font-size-p) * 2);
  font-size: calc(var(--f7-font-size-p) * 1.6);
  border-radius: calc(var(--color-theme-top-menu-border-radius) * 1.5);
  background-color: var(--color-theme-top-menu-background);
  border: 2px solid var(--color-theme-top-menu-border);
  margin: calc(var(--f7-font-size-p) * 0.8) calc(var(--f7-font-size-p) * 1);
  padding: calc(var(--f7-font-size-p) * 1.5) calc(var(--f7-font-size-p) * 4);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2 .sub-menu-button.active {
  font-weight: bold;
  border: 2px solid var(--color-theme-top-menu-active-border);
  color: var(--color-theme-top-menu-active-color);
  background-color: var(--color-theme-top-menu-active-background);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2 .menu-mark {
  display: flex;
  align-items: center;
  color: var(--color-theme-color);
  margin: calc(var(--swiper-image-width) * 0.06) 0;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2 .menu-mark > .f7-icons {
  font-size: calc(var(--swiper-image-width) * 0.15);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2 .menu-item {
  display: flex;
  align-items: center;
  font-size: calc(var(--swiper-image-width) * 0.11);
  color: var(--color-theme-color);
  background-color: var(--color-theme-top-menu-background);
  padding: calc(var(--swiper-image-width) * 0.12);
  border-radius: calc(var(--swiper-image-width) * 0.04);
  margin: calc(var(--swiper-image-width) * 0.06) calc(var(--swiper-image-width) * 0.05);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2 .menu-item.link {
  color: var(--color-theme-color-highlight);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2 .menu-item.link > span {
  text-decoration: underline;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2 .menu-item > .f7-icons {
  font-size: calc(var(--swiper-image-width) * 0.15);
  margin-right: calc(var(--swiper-image-width) * 0.05);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab.swiper-active {
  top: unset;
  left: unset;
  position: relative;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-button {
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
  position: absolute;
  pointer-events: none;
  height: calc(var(--content-cart-height) * 1.4);
  padding-top: calc(var(--content-cart-height) * 0.6);
  background: linear-gradient(transparent, var(--color-theme-background) 30%, var(--color-theme-background));
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-button .coffee-bottom {
  margin-top: calc(var(--content-cart-height) * 0.4);
  margin-bottom: calc(var(--content-cart-height) * 0.4);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-button .coffee-bottom button {
  font-weight: normal;
  pointer-events: auto;
  border: 1px var(--color-theme-color) solid;
  width: var(--coffee-bottom-width);
  height: calc(var(--app-font-size) * 2.25);
  line-height: calc(var(--app-font-size) * 2.25);
  font-size: calc(var(--app-font-size) * 1.1);
  border-radius: calc(var(--app-font-size) * 0.25);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-button .coffee-bottom button i {
  font-size: calc(var(--app-font-size) * 1.25);
  margin-right: calc(var(--app-font-size) * 0.3);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-button .coffee-bottom button.cancel-button {
  color: var(--color-theme-color);
  margin-left: calc(var(--coffee-bottom-margin) * 0.5);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-button .coffee-bottom button.bottom-button {
  color: var(--color-theme-color);
  float: right;
  margin-right: calc(var(--coffee-bottom-margin) * 0.5);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container {
  width: var(--content-right-size);
  height: 100%;
  margin-left: var(--content-left-size);
  margin-right: auto;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide {
  text-align: center;
  width: calc(var(--content-right-size) - var(--content-margin-h) * 2);
  height: calc(var(--swiper-column-width) * 1.3);
  padding: 0 var(--content-margin-h) 0 var(--content-margin-h);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1) {
  margin-top: calc(var(--f7-font-size-p) * 4);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv1 {
  margin-top: calc(var(--f7-font-size-p) * 8.4 + 4px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv2 {
  margin-top: calc(var(--f7-font-size-p) * 13 + 8px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv3 {
  margin-top: calc(var(--f7-font-size-p) * 17.6 + 12px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv4 {
  margin-top: calc(var(--f7-font-size-p) * 22.2 + 16px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv5 {
  margin-top: calc(var(--f7-font-size-p) * 26.8 + 20px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv6 {
  margin-top: calc(var(--f7-font-size-p) * 31.4 + 24px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv7 {
  margin-top: calc(var(--f7-font-size-p) * 36 + 28px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv8 {
  margin-top: calc(var(--f7-font-size-p) * 40.6 + 32px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv9 {
  margin-top: calc(var(--f7-font-size-p) * 45.2 + 36px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv10 {
  margin-top: calc(var(--f7-font-size-p) * 49.8 + 40px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv11 {
  margin-top: calc(var(--f7-font-size-p) * 54.4 + 44px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv12 {
  margin-top: calc(var(--f7-font-size-p) * 59 + 48px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv13 {
  margin-top: calc(var(--f7-font-size-p) * 63.6 + 52px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv14 {
  margin-top: calc(var(--f7-font-size-p) * 68.2 + 56px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv15 {
  margin-top: calc(var(--f7-font-size-p) * 72.8 + 60px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv16 {
  margin-top: calc(var(--f7-font-size-p) * 77.4 + 64px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv17 {
  margin-top: calc(var(--f7-font-size-p) * 82 + 68px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv18 {
  margin-top: calc(var(--f7-font-size-p) * 86.6 + 72px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv19 {
  margin-top: calc(var(--f7-font-size-p) * 91.2 + 76px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-child(1).lv20 {
  margin-top: calc(var(--f7-font-size-p) * 95.8 + 80px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide:nth-last-child(1) {
  margin-bottom: calc(var(--content-margin-h) * 0.8);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content {
  float: left;
  width: var(--swiper-column-width);
  height: calc(var(--swiper-column-width) * 1.25);
  margin-right: var(--swiper-column-margin);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content:nth-last-child(1) {
  margin-right: 0;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop {
  width: 100%;
  height: 100%;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop.sold-out {
  pointer-events: none;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop.sold-out.event-item {
  pointer-events: auto;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop.sold-out .item .image {
  filter: brightness(0.4);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop.sold-out .item .image.default-image {
  filter: drop-shadow(1000px 0 var(--color-theme-catalog-icon-color)) brightness(0.3);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop.sold-out .item .overlay {
  display: block;
  filter: brightness(0.8);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop .item {
  position: relative;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop .item .image {
  width: var(--swiper-image-width);
  height: var(--swiper-image-width);
  margin: 0 calc((var(--swiper-column-width) - var(--swiper-image-width)) / 2);
  border-radius: calc((var(--swiper-column-width) - var(--swiper-image-width)) / 4);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop .item .image.default-image {
  filter: drop-shadow(1000px 0 var(--color-theme-catalog-icon-color));
  margin-left: calc((var(--swiper-column-width) - var(--swiper-image-width)) / 2 - 1000px);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop .item .overlay {
  display: none;
  position: absolute;
  width: calc(var(--swiper-image-width) * 0.56);
  height: calc(var(--swiper-image-width) * 0.56);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url("../../base/images/soldout.png");
  top: calc(var(--swiper-image-width) * 0.22);
  left: calc(var(--swiper-column-width) * 0.5 - var(--swiper-image-width) * 0.28);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop .item .shop-content {
  color: var(--color-theme-color);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop .item .shop-content .name {
  font-weight: 400;
  display: flex;
  overflow: hidden;
  align-items: center;
  justify-content: center;
  height: calc(var(--swiper-image-width) * 0.28);
  font-size: calc(var(--swiper-image-width) * 0.095);
  margin-top: calc(var(--swiper-image-width) * 0.0625);
  margin-top: calc(var(--swiper-image-width) * 0.03);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop .item .shop-content .name.size8 {
  font-size: calc(var(--swiper-image-width) * 0.08);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop .item .shop-content .name.size7 {
  font-size: calc(var(--swiper-image-width) * 0.07);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop .item .shop-content .name.size6 {
  font-size: calc(var(--swiper-image-width) * 0.06);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop .item .shop-content .name.size5 {
  font-size: calc(var(--swiper-image-width) * 0.05);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop .item .shop-content .price {
  font-weight: 600;
  color: var(--color-theme-color-highlight);
  font-size: calc(var(--swiper-image-width) * 0.11);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop .item .shop-content .price .source-price {
  color: #808080;
  text-decoration: line-through;
  margin-left: calc(var(--app-font-size) * 0.4);
  font-size: calc(var(--swiper-image-width) * 0.1);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide.horizontal {
  padding: 0;
  width: calc(var(--swiper-column-width) * 1);
  height: calc(100vw - var(--content-margin-h) * 2);
  margin-top: var(--content-margin-h);
  margin-bottom: var(--content-margin-h);
  margin-right: var(--swiper-column-margin);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide.horizontal:nth-child(1) {
  margin-top: var(--content-margin-h);
  margin-left: calc(var(--content-margin-h) * 1.2);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide.horizontal:nth-last-child(1) {
  margin-bottom: var(--content-margin-h);
  margin-right: calc(var(--content-margin-h) * 1.2);
}
.page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide.horizontal .item-content {
  width: var(--swiper-column-width);
  height: calc(var(--swiper-column-width) * 1.25);
}
.page-coffee-select-v2.page-content .content .swiper-top-hidden-area-t,
.page-coffee-select-v2.page-content .content .swiper-top-hidden-area-b {
  left: 0;
  right: 0;
  z-index: 1000;
  position: absolute;
  pointer-events: none;
  height: calc(var(--content-margin-h) * 2.4);
}
.page-coffee-select-v2.page-content .content .swiper-top-hidden-area-t.horizontal,
.page-coffee-select-v2.page-content .content .swiper-top-hidden-area-b.horizontal {
  height: auto;
  width: calc(var(--content-margin-h) * 2.4);
}
.page-coffee-select-v2.page-content .content .swiper-top-hidden-area-t {
  top: 0;
  background: linear-gradient(var(--color-theme-background), transparent);
  right: calc(100vw - 2px - var(--content-left-menu-size));
}
.page-coffee-select-v2.page-content .content .swiper-top-hidden-area-t.horizontal {
  right: auto;
  bottom: 0;
  background: linear-gradient(to right, var(--color-theme-background), transparent);
}
.page-coffee-select-v2.page-content .content .swiper-top-hidden-area-b {
  bottom: -40px;
  background: linear-gradient(transparent, var(--color-theme-background));
}
.page-coffee-select-v2.page-content .content .swiper-top-hidden-area-b.horizontal {
  left: auto;
  top: 0;
  background: linear-gradient(to left, var(--color-theme-background), transparent);
}
.page-coffee-select-v2.page-content .content .menu-select {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1200;
  position: absolute;
  background-color: var(--color-theme-background);
  /* TODO: 此处需要优化多个的布局, 目前只支持2、3和4个的布局 */
}
.page-coffee-select-v2.page-content .content .menu-select .c-2.r-1 {
  height: 50vw;
  margin-left: 8vw;
}
.page-coffee-select-v2.page-content .content .menu-select .c-2.r-1:nth-child(1) {
  margin-top: calc(50vh - 25vw - (var(--title-height) + var(--content-cart-height)) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .c-2.r-2 {
  height: 45vw;
  margin-left: 8vw;
}
.page-coffee-select-v2.page-content .content .menu-select .c-2.r-2:nth-child(1) {
  margin-top: calc(50vh - 45vw - (var(--title-height) + var(--content-cart-height)) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .c-2.r-3 {
  height: 42vw;
  margin-left: 8vw;
}
.page-coffee-select-v2.page-content .content .menu-select .c-2.r-3:nth-child(1) {
  margin-top: calc(50vh - 63vw - (var(--title-height) + var(--content-cart-height)) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .c-3.r-1 {
  height: 50vw;
  margin-left: 8vw;
}
.page-coffee-select-v2.page-content .content .menu-select .c-3.r-1:nth-child(1) {
  margin-top: calc(50vh - 25vw - (var(--title-height) + var(--content-cart-height)) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .c-3.r-2 {
  height: 45vw;
  margin-left: 8vw;
}
.page-coffee-select-v2.page-content .content .menu-select .c-3.r-2:nth-child(1) {
  margin-top: calc(50vh - 45vw - (var(--title-height) + var(--content-cart-height)) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .c-3.r-3 {
  height: 42vw;
  margin-left: 8vw;
}
.page-coffee-select-v2.page-content .content .menu-select .c-3.r-3:nth-child(1) {
  margin-top: calc(50vh - 63vw - (var(--title-height) + var(--content-cart-height)) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .c-3.r-4 {
  height: 35vw;
  margin-left: 8vw;
}
.page-coffee-select-v2.page-content .content .menu-select .c-3.r-4:nth-child(1) {
  margin-top: calc(50vh - 70vw - (var(--title-height) + var(--content-cart-height)) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .c-4.r-4 {
  height: 35vw;
  margin-left: 6vw;
}
.page-coffee-select-v2.page-content .content .menu-select .c-4.r-4:nth-child(1) {
  margin-top: calc(50vh - 70vw - (var(--title-height) + var(--content-cart-height)) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .c-4.r-5 {
  height: 30vw;
  margin-left: 6vw;
}
.page-coffee-select-v2.page-content .content .menu-select .c-4.r-5:nth-child(1) {
  margin-top: calc(50vh - 75vw - (var(--title-height) + var(--content-cart-height)) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .c-4.r-6 {
  height: 25vw;
  margin-left: 6vw;
}
.page-coffee-select-v2.page-content .content .menu-select .c-4.r-6:nth-child(1) {
  margin-top: calc(50vh - 75vw - (var(--title-height) + var(--content-cart-height)) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .c:nth-child(1) .line-1 {
  top: 20%;
  background: linear-gradient(to bottom, transparent, var(--color-theme-catalog-line-color));
}
.page-coffee-select-v2.page-content .content .menu-select .c:nth-last-child(1) .line-2 {
  display: none;
}
.page-coffee-select-v2.page-content .content .menu-select .c:nth-last-child(1) .line-1 {
  bottom: 20%;
  background: linear-gradient(to bottom, var(--color-theme-catalog-line-color), transparent);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class {
  float: left;
  height: 100%;
  position: relative;
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-2 {
  width: 42vw;
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-2 .coffee-item {
  width: 42vw;
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-2 .coffee-item .coffee-item-frame {
  width: 29.4vw;
  height: 29.4vw;
  margin-top: calc(var(--sub-menu-size) * 0.1);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-2 .coffee-item .coffee-item-frame .coffee-item-img {
  width: 29.4vw;
  height: 29.4vw;
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-2.ri-1 .coffee-item {
  margin-top: calc((20.6vw - var(--sub-menu-size) * 0.15) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-2.ri-2 .coffee-item {
  margin-top: calc((15.6vw - var(--sub-menu-size) * 0.15) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-2.ri-3 .coffee-item {
  margin-top: calc((12.6vw - var(--sub-menu-size) * 0.15) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-3 {
  width: 28vw;
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-3 .coffee-item {
  width: 28vw;
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-3 .coffee-item .coffee-item-frame {
  width: 19.6vw;
  height: 19.6vw;
  margin-top: calc(var(--sub-menu-size) * 0.1);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-3 .coffee-item .coffee-item-frame .coffee-item-img {
  width: 19.6vw;
  height: 19.6vw;
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-3.ri-1 .coffee-item {
  margin-top: calc((30.4vw - var(--sub-menu-size) * 0.15) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-3.ri-2 .coffee-item {
  margin-top: calc((25.4vw - var(--sub-menu-size) * 0.15) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-3.ri-3 .coffee-item {
  margin-top: calc((22.4vw - var(--sub-menu-size) * 0.15) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-3.ri-4 .coffee-item {
  margin-top: calc((15.4vw - var(--sub-menu-size) * 0.15) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-4 {
  width: 22vw;
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-4 .coffee-item {
  width: 22vw;
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-4 .coffee-item .coffee-item-frame {
  width: 17.6vw;
  height: 17.6vw;
  margin-top: calc(var(--sub-menu-size) * 0.1);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-4.ri-4 .coffee-item {
  margin-top: calc((17.4vw - var(--sub-menu-size) * 0.15) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-4.ri-5 .coffee-item {
  margin-top: calc((12.4vw - var(--sub-menu-size) * 0.15) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-4.ri-6 .coffee-item {
  margin-top: calc((9.16vw - var(--sub-menu-size) * 0.15) / 2);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-4.ri-6 .coffee-item .coffee-item-frame {
  width: 15.84vw;
  height: 15.84vw;
  margin-top: calc(var(--sub-menu-size) * 0.1);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.ci-4.ri-6 .coffee-item .coffee-item-name {
  font-size: calc(var(--sub-menu-size) * 0.065);
  height: calc(var(--sub-menu-size) * 0.18);
  margin-top: calc(var(--sub-menu-size) * 0.04);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class .coffee-item {
  margin: 0 auto;
  box-shadow: 0 2px 4px var(--color-theme-box-shadow-color);
  border-radius: calc(var(--app-font-size) * 0.5);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class .coffee-item .coffee-item-frame {
  margin: 0 auto;
  overflow: hidden;
  position: relative;
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class .coffee-item .coffee-item-frame .overlay {
  display: none;
  position: absolute;
  top: 20%;
  left: 20%;
  right: 20%;
  bottom: 20%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url("../../base/images/soldout.png");
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class .coffee-item .coffee-item-frame .coffee-item-img {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  border-radius: calc(var(--app-font-size) * 0.5);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class .coffee-item .coffee-item-frame .coffee-item-img.default-image {
  margin-left: -1000px;
  filter: drop-shadow(1000px 0 var(--color-theme-catalog-icon-color));
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class .coffee-item .coffee-item-frame.sold-out .overlay {
  display: block;
  filter: brightness(0.8);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class .coffee-item .coffee-item-frame.sold-out .coffee-item-img {
  filter: brightness(0.3);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class .coffee-item .coffee-item-frame.sold-out .coffee-item-img.default-image {
  filter: drop-shadow(1000px 0 var(--color-theme-catalog-icon-color)) brightness(0.3);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class .coffee-item .coffee-item-name {
  color: var(--color-theme-color);
  overflow: hidden;
  text-align: center;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  font-size: calc(var(--sub-menu-size) * 0.072);
  height: calc(var(--sub-menu-size) * 0.2);
  padding: 0 calc(var(--sub-menu-size) * 0.05);
  margin-top: calc(var(--sub-menu-size) * 0.05);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class .line-1 {
  top: 0;
  right: 0;
  bottom: 0;
  width: 2px;
  position: absolute;
  background: var(--color-theme-catalog-line-color);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class .line-2 {
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  position: absolute;
  background: var(--color-theme-catalog-line-color);
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.last-01 .line-1 {
  display: none;
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class.left-01 .line-1 {
  display: block;
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class:nth-child(1) .line-2 {
  left: 10%;
  background: linear-gradient(to right, transparent, var(--color-theme-catalog-line-color));
}
.page-coffee-select-v2.page-content .content .menu-select .coffee-class:nth-last-child(1) .line-2 {
  right: 10%;
  background: linear-gradient(to right, var(--color-theme-catalog-line-color), transparent);
}
.page-coffee-select-v2.page-content .content .hot-iced-select {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1200;
  position: absolute;
  background-color: var(--color-theme-background);
  /* TODO: 此处需要优化多个的布局, 目前只支持2个子选项 */
}
.page-coffee-select-v2.page-content .content .hot-iced-select .amount-1 {
  margin-top: calc(50vh - 30px - var(--sub-menu-size) * 0.35 - var(--f7-font-size-p) * 8 - (var(--title-height) + var(--content-cart-height)) / 2);
}
.page-coffee-select-v2.page-content .content .hot-iced-select .amount-2,
.page-coffee-select-v2.page-content .content .hot-iced-select .amount-4 {
  margin-top: calc(50vh - 30px - var(--sub-menu-size) * 1 - var(--f7-font-size-p) * 8 - (var(--title-height) + var(--content-cart-height)) / 2);
}
.page-coffee-select-v2.page-content .content .hot-iced-select .amount-3,
.page-coffee-select-v2.page-content .content .hot-iced-select .amount-5,
.page-coffee-select-v2.page-content .content .hot-iced-select .amount-6 {
  margin-top: calc(50vh - 30px - var(--sub-menu-size) * 1.35 - var(--f7-font-size-p) * 8 - (var(--title-height) + var(--content-cart-height)) / 2);
}
.page-coffee-select-v2.page-content .content .hot-iced-select .coffee-button {
  margin-top: calc(var(--app-font-size) * 4);
  margin-bottom: calc(var(--app-font-size) * 0.5);
}
.page-coffee-select-v2.page-content .content .hot-iced-select .coffee-button button {
  font-weight: normal;
  border: 1px var(--color-theme-color) solid;
  width: var(--coffee-bottom-width);
  height: calc(var(--app-font-size) * 2.2);
  line-height: calc(var(--app-font-size) * 2.2);
  font-size: calc(var(--app-font-size) * 0.9);
  border-radius: calc(var(--app-font-size) * 0.25);
}
.page-coffee-select-v2.page-content .content .hot-iced-select .coffee-button button i {
  font-size: calc(var(--app-font-size) * 1.2);
  margin-right: calc(var(--app-font-size) * 0.3);
}
.page-coffee-select-v2.page-content .content .hot-iced-select .coffee-button button.cancel-button {
  color: var(--color-theme-color);
  margin-left: calc(var(--coffee-bottom-margin) * 0.5);
}
.page-coffee-select-v2.page-content .content .hot-iced-select .coffee-button button.select-button {
  color: var(--color-theme-color);
  float: right;
  margin-right: calc(var(--coffee-bottom-margin) * 0.5);
}
.page-coffee-select-v2.page-content .content .hot-iced-select .coffee-button button.select-button > i.if-not-md {
  margin-right: calc(var(--app-font-size) * 0.5);
}
.page-coffee-select-v2.page-content .content .hot-iced-select .coffee-sub-class {
  width: 100%;
  height: var(--sub-menu-size);
}
.page-coffee-select-v2.page-content .content .hot-iced-select .coffee-sub-class .coffee-item {
  margin: 0 auto;
  width: calc(var(--sub-menu-size) * 0.9);
  height: calc(var(--sub-menu-size) * 0.9);
  border: 4px solid var(--color-theme-sub-class-background-border);
  background-color: var(--color-theme-sub-class-background-color);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  border-radius: calc(var(--app-font-size) * 0.5);
}
.page-coffee-select-v2.page-content .content .hot-iced-select .coffee-sub-class .coffee-item .coffee-item-frame {
  opacity: 0.9;
  margin: 0 auto;
  position: relative;
  width: calc(var(--sub-menu-size) * 0.56);
  height: calc(var(--sub-menu-size) * 0.56);
  margin-top: calc(var(--sub-menu-size) * 0.1);
}
.page-coffee-select-v2.page-content .content .hot-iced-select .coffee-sub-class .coffee-item .coffee-item-frame .overlay {
  display: none;
  position: absolute;
  top: 20%;
  left: 20%;
  right: 20%;
  bottom: 20%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url("../../base/images/soldout.png");
}
.page-coffee-select-v2.page-content .content .hot-iced-select .coffee-sub-class .coffee-item .coffee-item-frame .coffee-item-img {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  width: calc(var(--sub-menu-size) * 0.56);
  height: calc(var(--sub-menu-size) * 0.56);
}
.page-coffee-select-v2.page-content .content .hot-iced-select .coffee-sub-class .coffee-item .coffee-item-frame .coffee-item-img.default-image {
  margin-left: -1000px;
  filter: drop-shadow(1000px 0 var(--color-theme-catalog-icon-color));
}
.page-coffee-select-v2.page-content .content .hot-iced-select .coffee-sub-class .coffee-item .coffee-item-frame.sold-out .overlay {
  display: block;
  filter: brightness(0.8);
}
.page-coffee-select-v2.page-content .content .hot-iced-select .coffee-sub-class .coffee-item .coffee-item-frame.sold-out .coffee-item-img {
  filter: brightness(0.3);
}
.page-coffee-select-v2.page-content .content .hot-iced-select .coffee-sub-class .coffee-item .coffee-item-frame.sold-out .coffee-item-img.default-image {
  filter: drop-shadow(1000px 0 var(--color-theme-catalog-icon-color)) brightness(0.3);
}
.page-coffee-select-v2.page-content .content .hot-iced-select .coffee-sub-class .coffee-item .coffee-item-name {
  color: var(--color-theme-color);
  text-align: center;
  text-decoration: underline;
  font-size: calc(var(--sub-menu-size) * 0.08);
  line-height: calc(var(--sub-menu-size) * 0.2);
}
.page-coffee-select-v2.page-content .cart-popup {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1200;
  position: fixed;
  pointer-events: none;
}
.page-coffee-select-v2.page-content .cart-popup > div {
  pointer-events: auto;
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal {
  opacity: 0.98;
  border-top-left-radius: 3vw;
  border-top-right-radius: 3vw;
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner {
  border-top: #eee 6px solid;
  border-top-left-radius: 3vw;
  border-top-right-radius: 3vw;
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .swipe-icon {
  top: 0;
  left: 0;
  z-index: 10;
  width: 100%;
  height: 40px;
  cursor: pointer;
  background: #fff;
  position: absolute;
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .swipe-icon:after {
  content: "";
  top: 50%;
  left: 50%;
  width: 60px;
  height: 10px;
  background: #666;
  position: absolute;
  margin-top: -3px;
  margin-left: -30px;
  border-radius: 5px;
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content {
  max-height: 70vh;
  text-align: center;
  padding: 8vw 6vw calc(var(--content-cart-height) * 1.5) 6vw;
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .top-control {
  color: #000;
  height: 5vw;
  top: 0;
  left: 6vw;
  right: 6vw;
  z-index: 1000;
  position: fixed;
  background-color: #fff;
  margin-top: calc(var(--content-cart-height) * 0.35);
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .top-control .select-item {
  float: left;
  font-size: 3vw;
  line-height: 4.5vw;
  font-weight: 700;
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .top-control .clear-cart-item {
  float: right;
  line-height: 4.5vw;
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .top-control .clear-cart-item .content {
  font-size: 2.5vw;
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .top-control .clear-cart-item .f7-icons {
  font-size: 3vw;
  margin-right: 1vw;
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul {
  padding: 0;
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout {
  width: 43vw;
  float: left;
  position: relative;
  margin-top: calc(var(--swiper-image-width) * 0.2);
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout:nth-child(2n+1) {
  margin-right: 2vw;
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout .item-image {
  float: left;
  width: calc(var(--swiper-image-width) * 0.8);
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout .item-image .image {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  width: calc(var(--swiper-image-width) * 0.75);
  height: calc(var(--swiper-image-width) * 0.75);
  border-radius: calc((var(--swiper-column-width) - var(--swiper-image-width)) / 4);
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout .item-content {
  float: left;
  text-align: left;
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout .item-content .item-name {
  font-size: 2.5vw;
  font-weight: 600;
  margin-left: 0.3vw;
  margin-bottom: 1vw;
  width: calc(42.7vw - var(--swiper-image-width) * 0.8);
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout .item-content .item-info {
  color: #808080;
  font-size: 1.8vw;
  margin-left: 0.3vw;
  margin-bottom: 1vw;
  width: calc(42.7vw - var(--swiper-image-width) * 0.8);
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout .item-content .item-price {
  color: var(--color-theme-color-highlight);
  font-weight: 600;
  margin-bottom: 1vw;
  font-size: calc(var(--swiper-image-width) * 0.11);
  width: calc(43vw - var(--swiper-image-width) * 0.8);
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout .item-content .item-price .source-price {
  color: #808080;
  text-decoration: line-through;
  margin-left: calc(var(--app-font-size) * 0.4);
  font-size: calc(var(--swiper-image-width) * 0.1);
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout .item-content .item-button {
  color: #404040;
  font-size: 3vw;
  text-align: right;
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout .item-content .item-button > i {
  margin: 2vw;
  font-size: 3vw;
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout .item-content .item-button .item-amount {
  margin: 0 -1.6vw;
}
.page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout .swipeout-delete {
  font-size: 2.5vw;
  padding-left: 5vw;
  padding-right: 5vw;
}
.page-coffee-select-v2.page-content .cart-frame {
  color: var(--color-theme-color);
  background-color: var(--color-theme-background);
  border-top: var(--color-theme-cart-top-frame) 8px solid;
  border-top-left-radius: 4vw;
  border-top-right-radius: 4vw;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2000;
  position: fixed;
  height: var(--content-cart-height);
}
.page-coffee-select-v2.page-content .cart-frame .cart-item-count {
  float: left;
  position: relative;
}
.page-coffee-select-v2.page-content .cart-frame .cart-item-count .badge {
  top: 6vw;
  left: 14vw;
  position: absolute;
  background-color: #ff3b30;
}
.page-coffee-select-v2.page-content .cart-frame .cart-item-count .paper-bag {
  top: -3vw;
  left: 5vw;
  width: 11vw;
  height: 11vw;
  position: absolute;
  opacity: 0.85;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url("../../base/images/cart.png");
}
.page-coffee-select-v2.page-content .cart-frame .cart-item-price {
  float: left;
  height: 100%;
  position: relative;
  margin-left: calc(var(--content-left-menu-size) * 1);
}
.page-coffee-select-v2.page-content .cart-frame .cart-item-price .total-price {
  float: left;
  font-size: 2.5vw;
  margin-top: calc(var(--content-cart-height) * 0.48);
}
.page-coffee-select-v2.page-content .cart-frame .cart-item-price .price-amount {
  float: left;
  font-size: 4vw;
  margin-top: calc(var(--content-cart-height) * 0.35);
  margin-left: calc(var(--content-cart-height) * 0.1);
}
.page-coffee-select-v2.page-content .cart-frame .cart-item-price .price-amount .source-price {
  color: #808080;
  text-decoration: line-through;
  margin-left: calc(var(--app-font-size) * 0.4);
  font-size: calc(var(--swiper-image-width) * 0.1);
}
.page-coffee-select-v2.page-content .cart-frame .cart-item-price .item-cart-folder {
  float: left;
  font-size: 2.5vw;
  margin-top: calc(var(--content-cart-height) * 0.5);
  margin-left: calc(var(--content-cart-height) * 0.25);
}
.page-coffee-select-v2.page-content .cart-frame .cart-item-button {
  color: var(--color-theme-color);
  position: absolute;
  text-align: center;
  opacity: 0.85;
  font-weight: 700;
  background-color: var(--color-theme-cart-button-background);
  top: calc(var(--content-cart-height) * 0.2);
  right: calc(var(--content-cart-height) * 0.3);
  width: calc(var(--content-cart-height) * 2.8);
  height: calc(var(--content-cart-height) * 0.6);
  font-size: calc(var(--content-cart-height) * 0.32);
  line-height: calc(var(--content-cart-height) * 0.6);
  border-radius: calc(var(--content-cart-height) * 0.05);
}
.page-coffee-select-v2.page-content .cart-frame .cart-item-button.disabled {
  background-color: #808080;
}
.page-coffee-select-v2.page-content .float-image {
  z-index: 12000;
  position: absolute;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  width: var(--swiper-image-width);
  height: var(--swiper-image-width);
  border-radius: calc((var(--swiper-column-width) - var(--swiper-image-width)) / 4);
}
.page-coffee-select-v2.page-content .morph-image {
  z-index: 10000;
  position: absolute;
  background-color: transparent;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  width: var(--swiper-image-width);
  height: var(--swiper-image-width);
  border-radius: calc((var(--swiper-column-width) - var(--swiper-image-width)) / 4);
}
.page-coffee-select-v2.page-content .popup-fab-sheet {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2000;
  overflow: hidden;
  position: absolute;
  background-color: rgba(0, 0, 0, 0.5);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel {
  top: 50%;
  left: 50%;
  position: absolute;
  transform: translate(-50%, -50%);
  background: #fff8f0;
  border-radius: 1vw;
  overflow: hidden;
  box-shadow: 0 3px 30px rgba(0, 0, 0, 0.4);
  width: calc(100vw - var(--content-margin-h) * 3);
  max-height: calc(100vh - var(--title-height) * 3);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll {
  position: relative;
  overflow-y: scroll;
  max-height: calc(100vh - var(--title-height) * 3);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll::-webkit-scrollbar {
  width: 0 !important;
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info {
  width: calc(100vw - var(--content-margin-h) * 4);
  padding: calc(var(--content-margin-h) * 0.5) calc(var(--content-margin-h) * 0.5) 0;
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info .image {
  float: left;
  width: var(--coffee-info-image);
  height: var(--coffee-info-image);
  border-radius: calc(var(--coffee-info-image) / 30);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  margin: var(--coffee-info-margin) calc(var(--coffee-info-margin) * 1.5) 0 var(--coffee-info-margin);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info .shop-content {
  color: var(--f7-text-color);
  float: left;
  width: calc(100vw - var(--content-margin-h) * 4.5 - var(--coffee-info-image) - var(--coffee-info-margin) * 2.5);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info .shop-content .name {
  font-weight: 400;
  line-height: 1.5;
  font-size: calc(var(--app-font-size) * 1.35);
  margin: calc(var(--coffee-info-margin) * 0.8) 0 calc(var(--app-font-size) * 0.5);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info .shop-content .price {
  color: var(--color-theme-color-highlight);
  line-height: 1.5;
  font-size: calc(var(--app-font-size) * 1.5);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info .shop-content .price .amount {
  color: #fff;
  margin-left: 2vw;
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info .shop-content .price .amount > i {
  font-size: 3vw;
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info .shop-content .price .source-price {
  color: #808080;
  text-decoration: line-through;
  margin-left: calc(var(--app-font-size) * 0.4);
  font-size: calc(var(--swiper-image-width) * 0.1);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info .shop-content .description {
  line-height: 1.5;
  font-size: calc(var(--app-font-size) * 0.8);
  margin-top: calc(var(--app-font-size) * 0.5);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info.no-description {
  padding-top: calc(var(--content-margin-h) * 0.5);
  margin-bottom: calc(var(--coffee-info-margin) * -0.4 + var(--coffee-info-margin) * -0.4);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info.no-description .image {
  float: none;
  margin: var(--app-font-size) auto;
  width: calc(var(--coffee-info-image) * 1.25);
  height: calc(var(--coffee-info-image) * 1.25);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info.no-description .shop-content {
  width: calc(100vw - var(--content-margin-h) * 4);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info.no-description .shop-content .description {
  display: none;
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info.no-description .shop-content .name {
  text-align: center;
  font-size: calc(var(--app-font-size) * 1.5);
  margin-top: calc(var(--coffee-info-margin) * 0.4);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info.no-description .shop-content .price {
  text-align: center;
  font-size: calc(var(--app-font-size) * 1.35);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config {
  width: calc(100vw - var(--content-margin-h) * 4 - var(--coffee-info-margin) * 2);
  margin: calc(var(--content-margin-h) * 0.5) calc(var(--content-margin-h) * 0.5) 0;
  padding: calc(var(--coffee-info-margin) * 0.5) var(--coffee-info-margin) calc(var(--app-font-size) * 7);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .button {
  color: #333;
  line-height: 1;
  font-size: var(--app-font-size);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .button .f7-icons {
  display: none;
  font-size: calc(var(--app-font-size) * 1.65);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .button span {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  white-space: break-spaces;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .button.button-active .f7-icons {
  display: inline-block;
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .button.button-disabled {
  opacity: 0.5;
  pointer-events: none;
  text-decoration: line-through;
  background-image: repeating-linear-gradient(135deg, rgba(0, 0, 0, 0.075) 0, rgba(0, 0, 0, 0.075) 4px, transparent 4px, transparent 8px);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .tab-title {
  margin: calc(var(--app-font-size) * 0.6) 0;
  font-size: var(--app-font-size);
  margin-top: calc(var(--app-font-size) * 1.8);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .tab-title > span {
  display: inline-block;
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .tab-title:nth-child(1) {
  margin-top: calc(var(--app-font-size) * 0.6);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config > div:not(:nth-child(1)) .tab-title {
  margin-top: calc(var(--app-font-size) * 1.5);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .segmented-strong .segmented-highlight {
  border-radius: 0;
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .latte-art-config {
  overflow-x: hidden;
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .latte-art-config p {
  margin-top: 0;
  margin-bottom: 0;
  margin-left: calc(var(--upload-image-margin) * -1);
  margin-right: calc(var(--upload-image-margin) * -1);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .latte-art-config p.art-title {
  margin-left: 0;
  margin-right: 0;
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .latte-art-config button {
  z-index: 0;
  transition: 0.2s;
  background-color: #333;
  border: none;
  position: relative;
  filter: brightness(0.4);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  width: var(--upload-image-size);
  height: var(--upload-image-size);
  border-radius: calc(var(--upload-image-size) * 0.05);
  margin: calc(var(--app-font-size) * 0.6) var(--upload-image-margin) calc(var(--app-font-size) * 0.6);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .latte-art-config button.plugs {
  background-color: transparent;
  background-image: url("../../configs/images/EntryModule/plus.png");
  width: calc(var(--upload-image-size) - var(--upload-image-margin));
  height: calc(var(--upload-image-size) - var(--upload-image-margin));
  margin: calc(var(--upload-image-margin) * 0.5 + var(--app-font-size) * 0.6) var(--upload-image-margin);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .latte-art-config button.button-active {
  z-index: 200;
  filter: brightness(1);
  /* #ffa400 */
  border: calc(var(--coffee-info-margin) * 0.1) solid #111;
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .latte-art-config button.button-active .f7-icons {
  top: 0;
  right: 0;
  position: absolute;
  color: #fff;
  font-size: calc(var(--app-font-size) * 1.8);
  text-shadow: 0 0 calc(var(--app-font-size) * 0.4) #000;
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .latte-art-config button.button-active.plugs {
  filter: brightness(1) invert(1);
  border: calc(var(--coffee-info-margin) * 0.1) solid #111;
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .latte-art-config button.button-active.plugs.disabled {
  filter: brightness(0.6) invert(1);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-config .latte-art-config .segmented-highlight {
  z-index: 100;
  background-color: rgba(255, 255, 255, 0.25);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-operation {
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 100;
  position: fixed;
  pointer-events: none;
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-operation .bg {
  width: 100%;
  height: calc(var(--app-font-size) * 3);
  background: linear-gradient(to top, #fff8f0, transparent);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-operation .row {
  background: #fff8f0;
  pointer-events: auto;
  padding-top: calc(var(--app-font-size) * 1);
  padding-bottom: calc(var(--app-font-size) * 2);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-operation button {
  border: 1px #fff solid;
  text-transform: unset;
  width: calc(var(--coffee-bottom-width) + 2vw);
  height: calc(var(--app-font-size) * 3);
  font-size: calc(var(--app-font-size) * 1.15);
  border-radius: calc(var(--app-font-size) * 0.25);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-operation button i {
  font-size: calc(var(--app-font-size) * 1.5);
  margin-right: calc(var(--app-font-size) * 0.5);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-operation button .preloader {
  width: calc(var(--app-font-size) * 1.5);
  height: calc(var(--app-font-size) * 1.5);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-operation button.pay-button {
  color: var(--color-theme-color);
  float: right;
  font-weight: 600;
  margin-right: calc(var(--coffee-bottom-margin) * 0.5);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-operation button.back-button {
  color: #000;
  background-color: #fff !important;
  margin-left: calc(var(--coffee-bottom-margin) * 0.5);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-operation button.active-state {
  background-color: var(--f7-button-bg-color);
}
.page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-operation button.button-disabled {
  opacity: 0.5;
  pointer-events: none;
  text-decoration: line-through;
  background-image: repeating-linear-gradient(135deg, rgba(0, 0, 0, 0.075) 0, rgba(0, 0, 0, 0.075) 4px, transparent 4px, transparent 8px);
}

.rtl .page-coffee-select-v2.page-content .content .menu-content {
  left: unset;
  right: 0;
}
.rtl .page-coffee-select-v2.page-content .content .menu-content > div {
  border-left: 2px solid var(--color-theme-menu-border);
  border-right: unset;
}
.rtl .page-coffee-select-v2.page-content .content .menu-content > div.back-item {
  left: unset;
  right: 0;
}
.rtl .page-coffee-select-v2.page-content .content .menu-content > div .next {
  border-left: 2px solid var(--color-theme-menu-border);
  border-right: unset;
}
.rtl .page-coffee-select-v2.page-content .content .menu-content > div.last .prev, .rtl .page-coffee-select-v2.page-content .content .menu-content > div.last .next {
  left: -2px;
  right: unset;
}
.rtl .page-coffee-select-v2.page-content .content .menu-content > div.last .next {
  border-radius: 0 0 0 100%;
}
.rtl .page-coffee-select-v2.page-content .content .menu-content > div.active {
  border-left: 2px solid var(--color-theme-background);
  border-right: unset;
}
.rtl .page-coffee-select-v2.page-content .content .menu-content > div.active + div .prev, .rtl .page-coffee-select-v2.page-content .content .menu-content > div.active + div .next {
  left: -2px;
  right: unset;
}
.rtl .page-coffee-select-v2.page-content .content .menu-content > div.active + div .next {
  border-radius: 100% 0 0 0;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2 {
  left: 0;
  right: calc(var(--content-left-menu-size) * 1.1);
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv2 {
  padding-left: unset;
  padding-right: 2vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv3 {
  padding-left: unset;
  padding-right: 4vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv4 {
  padding-left: unset;
  padding-right: 6vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv5 {
  padding-left: unset;
  padding-right: 8vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv6 {
  padding-left: unset;
  padding-right: 10vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv7 {
  padding-left: unset;
  padding-right: 12vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv8 {
  padding-left: unset;
  padding-right: 14vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv9 {
  padding-left: unset;
  padding-right: 16vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv10 {
  padding-left: unset;
  padding-right: 18vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv11 {
  padding-left: unset;
  padding-right: 20vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv12 {
  padding-left: unset;
  padding-right: 22vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv13 {
  padding-left: unset;
  padding-right: 24vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv14 {
  padding-left: unset;
  padding-right: 26vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv15 {
  padding-left: unset;
  padding-right: 28vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv16 {
  padding-left: unset;
  padding-right: 30vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv17 {
  padding-left: unset;
  padding-right: 32vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv18 {
  padding-left: unset;
  padding-right: 34vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv19 {
  padding-left: unset;
  padding-right: 36vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2.lv20 {
  padding-left: unset;
  padding-right: 38vw;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2 .sub-menu-button {
  float: right;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .top-menu-lv2 .menu-item > .f7-icons {
  margin-left: calc(var(--swiper-image-width) * 0.05);
  margin-right: unset;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab.swiper-active {
  top: unset;
  left: unset;
  position: relative;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-button .coffee-bottom button i {
  margin-left: calc(var(--app-font-size) * 0.3);
  margin-right: unset;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-button .coffee-bottom button.cancel-button {
  margin-left: unset;
  margin-right: calc(var(--coffee-bottom-margin) * 0.5);
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-button .coffee-bottom button.bottom-button {
  float: left;
  margin-left: calc(var(--coffee-bottom-margin) * 0.5);
  margin-right: unset;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container {
  margin-left: auto;
  margin-right: var(--content-left-size);
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content {
  float: right;
  margin-left: var(--swiper-column-margin);
  margin-right: unset;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content:nth-last-child(1) {
  margin-left: 0;
  margin-right: unset;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop .item .image.default-image {
  margin-left: unset;
  margin-right: calc((var(--swiper-column-width) - var(--swiper-image-width)) / 2 - 1000px);
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide .item-content .item-shop .item .overlay {
  left: 0;
  right: calc(var(--swiper-column-width) * 0.5 - var(--swiper-image-width) * 0.25);
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide.horizontal {
  margin-left: var(--swiper-column-margin);
  margin-right: unset;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide.horizontal:nth-child(1) {
  margin-left: unset;
  margin-right: calc(var(--content-margin-h) * 1.2);
}
.rtl .page-coffee-select-v2.page-content .content .swiper-content .swiper-tab .swiper-container .swiper-wrapper .swiper-slide.horizontal:nth-last-child(1) {
  margin-left: calc(var(--content-margin-h) * 1.2);
  margin-right: unset;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-top-hidden-area-t {
  left: calc(100vw - 2px - var(--content-left-menu-size));
  right: 0;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-top-hidden-area-t.horizontal {
  left: auto;
  right: unset;
}
.rtl .page-coffee-select-v2.page-content .content .swiper-top-hidden-area-b.horizontal {
  left: unset;
  right: auto;
}
.rtl .page-coffee-select-v2.page-content .content .menu-select .c-2.r-1 {
  margin-left: unset;
  margin-right: 8vw;
}
.rtl .page-coffee-select-v2.page-content .content .menu-select .c-2.r-2 {
  margin-left: unset;
  margin-right: 8vw;
}
.rtl .page-coffee-select-v2.page-content .content .menu-select .c-2.r-3 {
  margin-left: unset;
  margin-right: 8vw;
}
.rtl .page-coffee-select-v2.page-content .content .menu-select .c-3.r-1 {
  margin-left: unset;
  margin-right: 8vw;
}
.rtl .page-coffee-select-v2.page-content .content .menu-select .c-3.r-2 {
  margin-left: unset;
  margin-right: 8vw;
}
.rtl .page-coffee-select-v2.page-content .content .menu-select .c-3.r-3 {
  margin-left: unset;
  margin-right: 8vw;
}
.rtl .page-coffee-select-v2.page-content .content .menu-select .c-3.r-4 {
  margin-left: unset;
  margin-right: 8vw;
}
.rtl .page-coffee-select-v2.page-content .content .menu-select .c-4.r-4 {
  margin-left: unset;
  margin-right: 6vw;
}
.rtl .page-coffee-select-v2.page-content .content .menu-select .c-4.r-5 {
  margin-left: unset;
  margin-right: 6vw;
}
.rtl .page-coffee-select-v2.page-content .content .menu-select .c-4.r-6 {
  margin-left: unset;
  margin-right: 6vw;
}
.rtl .page-coffee-select-v2.page-content .content .menu-select .coffee-class {
  float: right;
}
.rtl .page-coffee-select-v2.page-content .content .menu-select .coffee-class:nth-child(1) .line-2 {
  left: 0;
  right: 10%;
  background: linear-gradient(to left, transparent, var(--color-theme-catalog-line-color));
}
.rtl .page-coffee-select-v2.page-content .content .menu-select .coffee-class:nth-last-child(1) .line-2 {
  left: 10%;
  right: 0;
  background: linear-gradient(to left, var(--color-theme-catalog-line-color), transparent);
}
.rtl .page-coffee-select-v2.page-content .content .menu-select .coffee-class .coffee-item .coffee-item-frame .coffee-item-img.default-image {
  margin-left: unset;
  margin-right: 1000px;
}
.rtl .page-coffee-select-v2.page-content .content .menu-select .coffee-class .line-1 {
  left: 0;
  right: unset;
}
.rtl .page-coffee-select-v2.page-content .content .hot-iced-select .coffee-button button i {
  margin-left: calc(var(--app-font-size) * 0.3);
  margin-right: unset;
}
.rtl .page-coffee-select-v2.page-content .content .hot-iced-select .coffee-button button span {
  margin-left: 0;
  margin-right: 4px;
}
.rtl .page-coffee-select-v2.page-content .content .hot-iced-select .coffee-button button.cancel-button {
  float: right;
  margin-left: unset;
  margin-right: calc(var(--coffee-bottom-margin) * 0.5);
}
.rtl .page-coffee-select-v2.page-content .content .hot-iced-select .coffee-button button.cancel-button > i {
  transform: rotate(180deg);
}
.rtl .page-coffee-select-v2.page-content .content .hot-iced-select .coffee-button button.select-button {
  float: left;
  margin-left: calc(var(--coffee-bottom-margin) * 0.5);
  margin-right: unset;
}
.rtl .page-coffee-select-v2.page-content .content .hot-iced-select .coffee-button button.select-button > i.if-not-md {
  margin-left: calc(var(--app-font-size) * 0.5);
  margin-right: unset;
}
.rtl .page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .swipe-icon {
  left: unset;
  right: 0;
}
.rtl .page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .swipe-icon:after {
  left: unset;
  right: 50%;
  margin-left: unset;
  margin-right: -30px;
}
.rtl .page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .top-control .select-item {
  float: right;
}
.rtl .page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .top-control .clear-cart-item {
  float: left;
}
.rtl .page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .top-control .clear-cart-item .f7-icons {
  margin-left: 1vw;
  margin-right: unset;
}
.rtl .page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout {
  float: right;
}
.rtl .page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout:nth-child(2n+1) {
  margin-left: 2vw;
  margin-right: unset;
}
.rtl .page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout .item-image {
  float: right;
}
.rtl .page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout .item-content {
  float: right;
  text-align: right;
}
.rtl .page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout .item-content .item-name {
  margin-left: unset;
  margin-right: 0.3vw;
}
.rtl .page-coffee-select-v2.page-content .cart-popup .sheet-modal .sheet-modal-inner .page-content .cart-item-list ul.cart-item-ul li.swipeout .item-content .item-button {
  text-align: left;
}
.rtl .page-coffee-select-v2.page-content .cart-frame .cart-item-count {
  float: right;
}
.rtl .page-coffee-select-v2.page-content .cart-frame .cart-item-count .badge {
  left: unset;
  right: 14vw;
}
.rtl .page-coffee-select-v2.page-content .cart-frame .cart-item-count .paper-bag {
  left: unset;
  right: 5vw;
}
.rtl .page-coffee-select-v2.page-content .cart-frame .cart-item-price {
  float: right;
  margin-left: unset;
  margin-right: calc(var(--content-left-menu-size) * 1);
}
.rtl .page-coffee-select-v2.page-content .cart-frame .cart-item-price .total-price {
  float: right;
}
.rtl .page-coffee-select-v2.page-content .cart-frame .cart-item-price .price-amount {
  float: right;
  margin-left: unset;
  margin-right: calc(var(--content-cart-height) * 0.1);
}
.rtl .page-coffee-select-v2.page-content .cart-frame .cart-item-price .item-cart-folder {
  float: right;
  margin-left: unset;
  margin-right: calc(var(--content-cart-height) * 0.25);
}
.rtl .page-coffee-select-v2.page-content .cart-frame .cart-item-button {
  left: calc(var(--content-cart-height) * 0.3);
  right: unset;
}
.rtl .page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info .image {
  float: right;
  margin: var(--coffee-info-margin) var(--coffee-info-margin) 0 calc(var(--coffee-info-margin) * 1.5);
}
.rtl .page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info .shop-content {
  float: right;
}
.rtl .page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-info .shop-content .price .amount {
  margin-right: 2vw;
}
.rtl .page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-operation button i {
  margin-left: calc(var(--app-font-size) * 0.5);
  margin-right: unset;
}
.rtl .page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-operation button span {
  margin-left: unset;
  margin-right: 4px;
}
.rtl .page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-operation button.pay-button {
  float: left;
  margin-right: unset;
  margin-left: calc(var(--coffee-bottom-margin) * 0.5);
}
.rtl .page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-operation button.back-button {
  margin-left: unset;
  margin-right: calc(var(--coffee-bottom-margin) * 0.5);
}
.rtl .page-coffee-select-v2.page-content .popup-fab-sheet .coffee-config-panel .coffee-config-scroll .coffee-operation button.back-button > i {
  transform: rotate(180deg);
}

@media screen and (max-aspect-ratio: 10/10) {
  .page-coffee-select-v2 {
    --content-margin-h: 5vw;
    --swiper-bullet-size: 1.5vw;
    --swiper-column-count: 8;
    --swiper-column-margin: 0.5vw;
    --swiper-image-width: calc(var(--swiper-column-width) * 0.825);
    --swiper-column-width: calc((var(--content-right-size) - var(--content-margin-h) * 2 -
        var(--swiper-column-margin) * (var(--swiper-column-count) - 1)) / var(--swiper-column-count));
  }
  .page-coffee-select-v2 .content .swiper-content.full {
    --content-right-size: 100vw;
    --swiper-image-width: calc(var(--swiper-column-width) * 0.825);
    --swiper-column-width: calc((var(--content-right-size) - var(--content-margin-h) * 2 -
        var(--swiper-column-margin) * (var(--swiper-column-count) - 1)) / var(--swiper-column-count));
  }
}
@media screen and (max-aspect-ratio: 10/10) and (max-width: 1200px) {
  .page-coffee-select-v2 {
    --swiper-column-count: 3;
    --swiper-column-margin: 1.5vw;
  }
}
@media screen and (max-aspect-ratio: 10/10) and (min-width: 1200px) {
  .page-coffee-select-v2 {
    --swiper-column-count: 4;
    --swiper-column-margin: 1.2vw;
  }
}
@media screen and (max-aspect-ratio: 10/10) and (min-width: 1600px) {
  .page-coffee-select-v2 {
    --swiper-column-count: 5;
    --swiper-column-margin: 1.0vw;
  }
}
@media screen and (max-aspect-ratio: 10/10) and (min-width: 2000px) {
  .page-coffee-select-v2 {
    --swiper-column-count: 6;
    --swiper-column-margin: 0.85vw;
  }
}
@media screen and (max-aspect-ratio: 10/10) and (min-width: 2500px) {
  .page-coffee-select-v2 {
    --swiper-column-count: 7;
    --swiper-column-margin: 0.70vw;
  }
}
@media screen and (min-aspect-ratio: 10/10) {
  .page-coffee-select-v2 {
    --content-margin-h: 5vh;
    --swiper-bullet-size: 1.5vh;
    --swiper-column-count: 8;
    --swiper-column-margin: 0.5vh;
    --swiper-image-width: calc(var(--swiper-column-width) * 0.85);
    --swiper-column-width: calc((var(--content-right-size) - var(--content-margin-h) * 2 - var(--title-height)) / var(--swiper-column-count) / 1.25);
  }
  .page-coffee-select-v2 .content .swiper-content.full {
    --content-right-size: 100vw;
    --swiper-image-width: calc(var(--swiper-column-width) * 0.85);
    --swiper-column-width: calc((var(--content-right-size) - var(--content-margin-h) * 2 - var(--title-height)) / var(--swiper-column-count) / 1.25);
  }
}
@media screen and (min-aspect-ratio: 10/10) and (max-height: 600px) {
  .page-coffee-select-v2 {
    --swiper-column-count: 2;
    --swiper-column-margin: 1.8vh;
  }
}
@media screen and (min-aspect-ratio: 10/10) and (min-height: 600px) {
  .page-coffee-select-v2 {
    --swiper-column-count: 3;
    --swiper-column-margin: 1.5vh;
  }
}
@media screen and (min-aspect-ratio: 10/10) and (min-height: 1200px) {
  .page-coffee-select-v2 {
    --swiper-column-count: 4;
    --swiper-column-margin: 1.2vh;
  }
}
@media screen and (min-aspect-ratio: 10/10) and (min-height: 1600px) {
  .page-coffee-select-v2 {
    --swiper-column-count: 5;
    --swiper-column-margin: 1.0vh;
  }
}
@media screen and (min-aspect-ratio: 10/10) and (min-height: 2000px) {
  .page-coffee-select-v2 {
    --swiper-column-count: 6;
    --swiper-column-margin: 0.85vh;
  }
}
@media screen and (min-aspect-ratio: 10/10) and (min-height: 2500px) {
  .page-coffee-select-v2 {
    --swiper-column-count: 7;
    --swiper-column-margin: 0.70vh;
  }
}
.fl {
  float: left;
}

.fr {
  float: right;
}

.rtl .fr {
  float: left;
}

.rtl .fl {
  float: right;
}

.rtl .aurora .segmented-strong-aurora .segmented-highlight,
.rtl .ios .segmented-strong-ios .segmented-highlight,
.rtl .md .segmented-strong-md .segmented-highlight,
.rtl .segmented-strong .segmented-highlight {
  transform: translateX(calc((var(--f7-segmented-highlight-num) - 1 - var(--f7-segmented-highlight-active)) * 100% + (var(--f7-segmented-highlight-num) - 1 - var(--f7-segmented-highlight-active)) * var(--f7-segmented-highlight-between)));
}

#__vconsole {
  display: none;
}

#appdownload {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1050;
  position: absolute;
  pointer-events: none;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
#appdownload .exclusive {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 50;
  position: absolute;
  pointer-events: auto;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}

#maintenance {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 100;
  display: none;
  text-align: center;
  position: fixed;
  background-color: var(--color-theme-background);
}
#maintenance > i {
  color: #cc0000;
  margin: 0 auto;
  font-size: calc(var(--app-font-size) * 6);
  margin-top: calc((100vh - var(--title-height) - var(--app-font-size) * 10) / 2);
}
#maintenance #error-code {
  left: 0;
  right: 0;
  bottom: calc(var(--app-font-size) * 2.4);
  color: #606060;
  position: absolute;
  padding: 0 var(--content-margin-h);
  font-size: calc(var(--app-font-size) * 1.2);
  line-height: calc(var(--app-font-size) * 2);
}
#maintenance #error-message {
  color: var(--color-theme-color);
  padding: 0 var(--content-margin-h);
  font-size: calc(var(--app-font-size) * 1.5);
  margin-top: calc(var(--app-font-size) * 1.6);
  line-height: calc(var(--app-font-size) * 2.5);
}

.ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.toast-container > .toast-msg {
  font-size: var(--app-font-size);
  background-color: rgba(255, 87, 51, 0.6);
  line-height: calc(var(--app-font-size) * 1.5);
}

.clearfix::after {
  clear: both;
  content: "";
  display: block;
}

.popup.code-popup .page-content .list-group {
  overflow: hidden;
}

.terms_link {
  color: var(--f7-theme-color);
  text-decoration: underline;
}

@media screen and (max-aspect-ratio: 10/10) {
  :root {
    --app-font-size: 2.4vw;
    --f7-button-height: 6vw;
    --f7-preloader-modal-preloader-size: 6vw;
  }
}
@media screen and (min-aspect-ratio: 10/10) {
  :root {
    --app-font-size: 2.4vh;
    --f7-button-height: 6vh;
    --f7-preloader-modal-preloader-size: 6vh;
  }
}
/* ================ */
/* = 打印字体数据 = */
/* ================ */
@font-face {
  font-family: "Archivo-Bold";
  src: url(../../base/fonts/Archivo-Bold.woff);
}
@font-face {
  font-family: "Archivo-Regular";
  src: url(../../base/fonts/Archivo-Regular.woff);
}
@font-face {
  font-family: "SairaCondensed-Regular";
  src: url(../../base/fonts/SairaCondensed-Regular.woff);
}
/* ================ */
/* = 主题字体数据 = */
/* ================ */
@font-face {
  font-style: normal;
  font-weight: normal;
  size-adjust: 125%;
  font-display: swap;
  font-family: "Bellfort";
  src: url(../../base/fonts/Bellfort.woff);
}
@font-face {
  font-style: normal;
  font-weight: normal;
  size-adjust: 125%;
  font-display: swap;
  font-family: "Bellfort-Light";
  src: url(../../base/fonts/Bellfort-Light.woff);
}