
@charset "UTF-8";
/* mart4fun */
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 100%;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/notosans/v36/o-0bIpQlx3QUlC5A4PNB6Ryti20_6n1iPHjc5aPdu3mhPy1Fig.woff2) format('woff2');
}

:root {
  /* ====== 设计变量 ====== */
  /* 字体 */
  --font-family-base: system-ui,-apple-system,BlinkMacSystemFont,segoe ui,Roboto,Helvetica,Arial,PingFang SC,Microsoft Yahei,Hiragino Sans GB,Heiti SC,sans-serif;
  --font-family: 'Noto Sans', var(--font-family-base);

  /* 主题色 */
  --color-primary: #FF6F36;
  --color-action-primary: #CB4A16;
  --color-primary-variant: #FFE4DC;

  /* 功能色 */
  --color-action: #4B69FF;
  --color-text-button: #8599FF;
  --color-action-variant: #DCE6FF;
  --color-success: #26CF76;
  --color-success-variant: #E6F9EF;
  --color-warning: #FFCD2A;
  --color-warning-variant: #FFF4E1;
  --color-error: #FA3333;
  --color-error-variant: #FFDFDF;

  /* 中性色 */
  --color-neutral-1: #FFFFFF;
  --color-neutral-2: #EAEAF8;
  --color-neutral-3: #BFC0D4;
  --color-neutral-4: #6B6C7F;
  --color-secondary-neutral-1: #FFFFFF;
  --color-secondary-neutral-2: #BFC0D4;
  --color-secondary-neutral-3: #2E333E;

  /* 填充色 */
  --color-fill-bg-1: #111519;
  --color-fill-bg-2: #08090B;

  --color-fill-container-1: #484A5C;
  --color-fill-container-2: #2E333E;
  --color-fill-container-3: #242730;
  --color-fill-secondary-container-1: #484A5C;
  --color-fill-secondary-container-2: #242730;
  --color-fill-secondary-container-3: #111519;

  /* 反色 */
  --color-reverse: #1F232A;

  /* 装饰色 */
  --color-white: #FFFFFF;
  --color-black: #000000;
  --color-gray-10: #EAEAF8;
  --color-gray-30: #BFC0D4;
  --color-gray-50: #6B6C7F;

  /* Other */
  --other-black-60: rgba(0, 1, 18, .6);
  --other-black-90: rgba(0, 1, 18, .9);

  /* red */
  --color-red-10: #FFDFDF;
  --color-red-50: #FA3333;
  --color-red-60: #E62626;

  /* yellow */
  --color-yellow-10: #FFF4E1;
  --color-yellow-50: #FFCD2A;
  --color-yellow-60: #FB9701;

  /* blue */
  --color-blue-10: #DCE6FF;
  --color-blue-30: #8599FF;
  --color-blue-50: #4B69FF;
  --color-blue-60: #305FE1;

  /* ====== 位置变量 ====== */

  /* 通用 */
  --font-size-primary: 16px;
  --font-size-primary-xs: 1.3rem;

  --border-radius-primary: 4px;
  --border-radius-primary-xs: 0.4rem;
  --border-radius-secondary: 8px;
  --border-radius-secondary-xs: 0.8rem;

  --border-color-primary: var(--color-neutral-3);
  --border-color-hover-primary: var(--color-neutral-2);

  --bg-nav: #111519;
  --bg-footer: var(--color-fill-bg-2);
  --bg-body: var(--color-fill-bg-1);
  --bg-body-detail: var(--color-fill-bg-1);
  --bg-body-home: var(--color-fill-bg-1);

  --bg-dialog: var(--color-fill-container-1);
  --color-dialog: var(--color-neutral-1);
  --border-radius-dialog: var(--border-radius-secondary);
  --border-radius-dialog-xs: var(--border-radius-secondary-xs);
  --border-radius-dialog-button: var(--border-radius-secondary);
  --border-radius-dialog-button-xs: var(--border-radius-secondary-xs);
  --bg-dialog-button-primary: var(--color-neutral-2);
  --color-dialog-button-primary: var(--color-fill-bg-1);
  --color-dialog-button-secondary: var(--color-neutral-2);
  --bg-toast: var(--color-fill-container-1);
  --color-toast: var(--color-neutral-1);
  --border-radius-toast: var(--border-radius-secondary);
  --border-radius-toast-xs: var(--border-radius-secondary-xs);
  --bg-image-placeholder: var(--color-fill-container-1);

  /* text */
  --font-weight-title: 800;
  --color-text-primary: var(--color-neutral-1);
  --color-text-secondary: var(--color-neutral-2);
  --color-text-tip: var(--color-neutral-3);
  --color-text-error: var(--color-error);

  --color-link: var(--color-action);

  --bg-loading: url(https://img-cdn-sg.payermax.com/jm-site/brand/Dadagold/loading.svg);

  /* nav */
  --bg-login-button: linear-gradient(90deg, #FFA742 0%, var(--color-primary) 100%);
  --border-radius-login-button: var(--border-radius-primary);
  --border-radius-login-button-xs: var(--border-radius-primary-xs);

  --bg-tab-selected: var(--color-action);
  --bg-tab-hover: var(--color-fill-container-2);

  /* search */
  --bg-search-bar: transparent;
  --border-color-search-bar: var(--color-neutral-4);
  --border-width-search-bar: 1px;
  --border-width-search-bar-xs: 0.1rem;
  --border-radius-search-bar: var(--border-radius-primary);
  --border-radius-search-bar-xs: var(--border-radius-primary-xs);
  --color-search-bar-button: var(--color-neutral-1);
  --color-search-bar-dashed: var(--color-neutral-4);
  --color-search-bar-input: var(--color-neutral-1);
  --color-search-bar-input-placeholder: var(--color-neutral-3);

  --bg-search-dialog: var(--color-fill-container-1);
  --bg-search-dialog-search-bar: var(--color-fill-container-1);
  --bg-search-dialog-mask: var(--other-black-90);
  --color-search-dialog: var(--color-neutral-1);
  --border-radius-search-dialog: var(--border-radius-primary);
  --border-radius-search-dialog-xs: var(--border-radius-primary-xs);

  --bg-search-history-item: rgba(255, 255, 255, 0.05);
  --color-search-history-item: rgba(255, 255, 255, 0.7);
  --border-radius-search-history-item: 13px;
  --border-radius-search-history-item-xs: 1.3rem;

  --color-search-loading-text: var(--color-neutral-1);
  --color-search-empty-text: rgba(255, 255, 255, 0.7);

  --color-search-result-title: rgba(255, 255, 255, 0.7);
  --color-search-result-item-text: var(--color-neutral-1);
  --border-radius-search-result-item-image: var(--border-radius-secondary);
  --border-radius-search-result-item-image-xs: var(--border-radius-secondary-xs);

  /* logged-in */
  --bg-logged-in-popup: var(--color-fill-container-1);
  --border-radius-logged-in-popup: var(--border-radius-secondary);
  --border-radius-logged-in-popup-xs: var(--border-radius-secondary-xs);
  --border-radius-logged-in-popup-action: var(--border-radius-primary);
  --border-radius-logged-in-popup-action-xs: var(--border-radius-primary-xs);
  --color-logged-in-popup-action: var(--color-neutral-1);
  /* --bg-logged-in-popup-action-hover: ; */
  --bg-logged-in-popup-action-selected: var(--bg-tab-selected);
  --display-logged-in-popup-component: none;

  /* country select dialog */
  --bg-country-select-dialog: var(--color-fill-container-1);
  --border-radius-country-select-dialog: var(--border-radius-secondary);
  --border-radius-country-select-dialog-xs: var(--border-radius-secondary-xs);

  /* chat */
  --fixed-bottom-chat-icon: 64px;
  --fixed-right-chat-icon: 24px;
  --fixed-bottom-chat-icon-xs: 6.4rem;
  --fixed-right-chat-icon-xs: 2.4rem;
  --bgi-chat-icon: url(https://img-cdn-sg.payermax.com/jm-site/brand/Dadagold/chat-icon.png);
  --bg-chat-unread-count: #F44444;
  --color-chat-unread-count: var(--color-white);
  --border-color-chat-unread-count: var(--color-white);

  /* ====== personal center start ======  */
  --bg-user-container-nav: transparent;
  --bg-user-container-nav-item: transparent;
  --bg-user-container-nav-item-selected: var(--bg-tab-selected);
  --bg-user-container-nav-item-hover: var(--bg-tab-hover);
  --color-user-container-nav-item: var(--color-neutral-1);
  --border-radius-user-container-nav-item: var(--border-radius-primary);

  --bg-user-container-content: transparent;

  /* my profile */
  --color-my-profile-label: var(--color-neutral-3);
  --color-my-profile-value: var(--color-neutral-1);
  --color-my-profile-title: var(--color-neutral-1);
  --padding-my-profile-form: 24px;
  --bg-my-profile-form: var(--color-fill-container-3);
  --bg-my-profile-input: var(--color-neutral-1);
  --color-my-profile-input: var(--color-fill-bg-1);
  --border-width-my-profile-input: 1px;
  --border-color-my-profile-input: var(--color-neutral-3);
  --border-radius-my-profile-input: var(--border-radius-primary);

  --color-my-profile-button: var(--color-neutral-1);
  --bg-my-profile-button: var(--color-action);
  --border-radius-my-profile-button: var(--border-radius-secondary);

  --bg-my-profile-nickname-dialog: var(--color-fill-container-1);
  --border-radius-my-profile-nickname-dialog: var(--border-radius-secondary);
  --border-radius-my-profile-nickname-dialog-xs: var(--border-radius-secondary-xs);

  --bg-my-profile-nickname-dialog-input: var(--color-white);
  --border-radius-my-profile-nickname-dialog-input: var(--border-radius-secondary);
  --border-radius-my-profile-nickname-dialog-input-xs: var(--border-radius-secondary-xs);
  --color-my-profile-nickname-dialog-input: var(--color-fill-bg-1);
  --color-my-profile-nickname-dialog-input-placeholder: var(--color-neutral-3);
  --border-color-my-profile-nickname-dialog-input: var(--color-neutral-3);

  --border-radius-my-profile-nickname-dialog-button: var(--border-radius-secondary);
  --border-radius-my-profile-nickname-dialog-button-xs: var(--border-radius-secondary-xs);
  --bg-my-profile-nickname-dialog-button: var(--color-action);
  --color-my-profile-nickname-dialog-button: var(--color-neutral-1);

  --bg-my-profile-gender-dialog: var(--color-fill-container-1);
  --border-radius-my-profile-gender-dialog: var(--border-radius-secondary);
  --border-radius-my-profile-gender-dialog-xs: var(--border-radius-secondary-xs);

  /* my coupon */
  --bg-my-coupon-tab-content: transparent;
  --bg-my-coupon-sub-type: var(--color-fill-container-1);
  --color-my-coupon-sub-type: var(--color-neutral-3);
  --bg-my-coupon-sub-type-active: var(--color-action);
  --color-my-coupon-sub-type-active: var(--color-neutral-1);
  --border-radius-my-coupon-sub-type-active: var(--border-radius-primary);
  --border-radius-my-coupon-sub-type-active-xs: var(--border-radius-primary-xs);

  /* redeem voucher */
  --bg-redeem-voucher-input: var(--color-neutral-1);
  --color-redeem-voucher-input: var(--color-fill-bg-1);
  --color-redeem-voucher-input-placeholder: var(--color-neutral-3);
  --border-width-redeem-voucher-input: 1px;
  --border-width-redeem-voucher-input-xs: 0.1rem;
  --border-color-redeem-voucher-input: var(--color-neutral-3);
  --border-radius-redeem-voucher-input: var(--border-radius-secondary);
  --border-radius-redeem-voucher-input-xs: var(--border-radius-secondary-xs);

  --bg-redeem-voucher-button: linear-gradient(90deg, var(--color-primary) 0%, #FF9D42 100%);
  --border-color-redeem-voucher-button: transparent;
  --color-redeem-voucher-button: var(--color-neutral-1);
  --border-radius-redeem-voucher-button: var(--border-radius-secondary);
  --border-radius-redeem-voucher-button-xs: var(--border-radius-primary-xs);
  --color-redeem-voucher-rule: var(--color-neutral-3);
  --bg-redeem-voucher-rule-dotted: var(--color-neutral-3);

    /* order list */
    --bg-my-order-item: var(--color-fill-container-3);
    --border-radius-my-order-item: var(--border-radius-primary);
    --border-radius-my-order-item-xs: var(--border-radius-primary-xs);
    --color-my-order-item-neutral-1: var(--color-neutral-1);
    --color-my-order-item-neutral-2: var(--color-neutral-3);
    --color-my-order-item-neutral-3: var(--color-neutral-4);
    --border-radius-my-order-item-icon: var(--border-radius-primary);
    --border-radius-my-order-item-icon-xs: var(--border-radius-primary-xs);

  /* ====== personal center end ======  */

  /* ====== home page start ====== */
  --bg-image-home: unset;

  /* banner / carousel */
  --width-carousel-indicator-circle: 6px;
  --border-radius-carousel-indicator-circle: 50%;
  --bg-carousel-indicator-circle: #333333;
  --bg-carousel-indicator-circle-active: var(--color-primary);

  --bg-carousel-titlebar: linear-gradient(180deg, var(--color-fill-container-1) 0%, var(--color-fill-container-3) 100%);

  --margin-top-carousel-titlebar-content: 1rem;
  --color-carousel-titlebar-title: var(--color-neutral-1);
  --color-carousel-titlebar-subtitle: var(--color-neutral-3);
  --color-carousel-titlebar-button: var(--color-neutral-1);

  --border-radius-carousel-titlebar-button: var(--border-radius-primary);
  --border-radius-carousel-titlebar-button-xs: var(--border-radius-primary-xs);
  --bg-carousel-titlebar-button: var(--color-action);

  /* marqueue */
  --bg-home-marqueue: var(--color-fill-container-3);
  --color-home-marqueue: var(--color-primary);
  --border-radius-home-marqueue: var(--border-radius-primary);
  --border-radius-home-marqueue-xs: var(--border-radius-primary-xs);

  /* recommend */
  --color-recommend-button: var(--color-black);
  --bg-recommend-button: var(--color-white);
  --border-radius-recommend-button: var(--border-radius-secondary);
  --border-radius-recommend-button-xs: var(--border-radius-secondary-xs);

  /* section / application */
  --bg-application: var(--color-fill-container-2);
  --border-radius-application: var(--border-radius-primary);
  --border-radius-application-xs: var(--border-radius-primary-xs);

  --border-radius-application-img: var(--border-radius-primary);
  --border-radius-application-img-xs: var(--border-radius-primary-xs);
  --border-width-application-img: 6px;
  --border-width-application-img-xs: 0.3rem;
  --border-color-application-img: var(--color-neutral-4);
  --color-app-intro-desc-h: #FFFFFF;

  --color-application-name: var(--color-neutral-1);

  --border-radius-application-button: var(--border-radius-primary);
  --border-radius-application-button-xs: var(--border-radius-primary-xs);
  --bg-application-button: var(--color-fill-container-1);
  --color-application-button: var(--color-neutral-1);

  /* contact us */
  --bg-contact-us-dialog: var(--color-fill-container-1);
  --border-radius-contact-us-dialog: var(--border-radius-secondary);
  --border-radius-contact-us-dialog-xs: var(--border-radius-secondary-xs);
  --text-align-contact-us: left;
  /* ====== home page end ====== */

  /* ====== detail page start ======  */
  /* page intro */
  --bg-page-intro: var(--bg-body-detail);
  --padding-page-intro: 0 48px 0 0;
  --padding-page-intro-xs: 0 0 1.2rem;
  --padding-page-intro-rtl: 0 0 0 48px;
  --padding-page-intro-xs-rtl: 0 0 1.2rem;

  --bg-page-intro-text: var(--bg-body-detail);
  --padding-page-intro-text: 12px;
  --padding-page-intro-text-xs: 1.2rem 1.2rem 1.6rem;

  --border-radius-page-intro-banner: 0;

  --border-radius-page-intro-app-logo: var(--border-radius-primary);
  --border-radius-page-intro-app-logo-xs: var(--border-radius-primary-xs);
  --border-width-page-intro-app-logo: 3px;
  --border-width-page-intro-app-logo-xs: 0.15rem;
  --border-color-page-intro-app-logo: var(--bg-body-detail);

  --border-radius-merchant-info-locale-select: var(--border-radius-primary);
  --border-radius-merchant-info-locale-select-xs: var(--border-radius-primary-xs);
  --padding-merchant-info-locale-select: 4px;
  --padding-merchant-info-locale-select-xs: 0.2rem;
  --bg-merchant-info-locale-select: var(--color-fill-container-3);
  --color-merchant-info-locale-select-country: var(--color-action);

  --bg-page-intro-activity-info: #B9A278;
  --color-page-intro-activity-info: var(--bg-body-detail);

  /* component */
  --bg-detail-component: transparent;
  --margin-top-detail-component: 0;
  --margin-top-detail-component-xs: 0;
  --padding-detail-component: 0 12px 24px;
  --padding-detail-component-xs: 0 0.4rem 1.6rem;
  --width-detail-step-slash: 24px;
  --width-detail-step-slash-xs: 2.4rem;
  --height-detail-step-slash: 24px;
  --height-detail-step-slash-xs: 2.4rem;
  --bgi-detail-step-slash: url(https://img-cdn-sg.payermax.com/jm-site/brand/Dadagold/dadagold_step_bg.png);
  --color-detail-step: var(--color-neutral-1);
  --padding-detail-step:  0 7px;
  --padding-detail-step-xs: 0 0.7rem;
  --color-detail-step-title: var(--color-neutral-1);

  /* tabs */
  --bg-detail-tabs: transparent;
  --width-detail-tabs: auto;
  --border-bottom-detail-tabs: 1px solid var(--color-secondary-neutral-3);
  --margin-detail-tabs: 0 0 12px;
  --margin-detail-tabs-xs: 0 0 1.2rem;
  --padding-detail-tabs: 0 12px;
  --padding-detail-tabs-xs: 0 1.2rem;
  --color-detail-tabs-item: var(--color-neutral-3);
  --padding-detail-tabs-item: 0 12px;
  --padding-detail-tabs-item-xs: 0 1.2rem;
  --color-detail-tabs-item-active: var(--color-text-button);
  --bg-detail-tabs-item-active: transparent;
  --border-bottom-detail-tabs-item-active: 1px solid var(--color-text-button);
  --min-width-detail-tabs-item: auto;
  --display-detail-tabs-item-pseudo-element: none;
  --flex-detail-tabs-item-xs: none;

  /* goods item */
  --bg-detail-goods: var(--color-fill-secondary-container-1);
  --border-radius-detail-goods: var(--border-radius-primary);
  --border-radius-detail-goods-xs: var(--border-radius-primary-xs);
  --border-radius-detail-secondary-goods: var(--border-radius-primary);
  --border-radius-detail-secondary-goods-xs: var(--border-radius-primary-xs);
  --border-width-detail-goods: 2px;
  --border-width-detail-goods-xs: 0.2rem;
  --border-width-detail-goods-action: 2px;
  --border-width-detail-goods-action-xs: 0.2rem;
  --padding-detail-goods: 10px;
  --padding-detail-goods-xs: 1rem;
  --padding-detail-goods-group: 0;
  --padding-detail-goods-group-xs: 0 1rem;
  --bg-detail-goods-icon: #1F1F1F;
  --border-radius-detail-goods-icon: 4.5px;
  --border-radius-detail-goods-icon-xs: 0.45rem;
  --border-color-detail-goods: var(--color-secondary-neutral-3);
  --border-color-detail-goods-action: linear-gradient(90deg, var(--color-primary) 0%, var(--color-action) 100%);
  --bg-detail-goods-tag: linear-gradient(90deg, #FFA742 0%, var(--color-primary) 100%);
  --bgi-detail-goods-discount-tag-icon: url(https://img-cdn-sg.payermax.com/jm-site/brand/Dadagold/discount-tag-icon.png);
  --bgi-detail-featured-goods-discount-tag-icon: url(https://img-cdn-sg.payermax.com/jm-site/brand/Dadagold/featured-discount-tag-icon.png);
  --bg-detail-big-img-goods-tag: var(--color-primary);
  --color-detail-big-img-goods-tag: var(--color-white);
  --color-detail-goods-discount: var(--color-primary);
  --color-detail-goods-tag: var(--color-neutral-1);
  --border-radius-detail-goods-tag: var(--border-radius-primary);
  --border-radius-detail-goods-tag-xs: var(--border-radius-primary-xs);
  --bg-detail-goods-mark: var(--color-action);
  --bg-detail-goods-mark-hook: var(--color-neutral-1);
  --color-detail-goods-name: var(--color-neutral-1);
  --color-detail-goods-desc: var(--color-neutral-1);
  --bg-detail-goods-tips-dialog: var(--color-fill-container-1);
  --border-radius-detail-goods-tips-dialog: var(--border-radius-secondary);
  --border-radius-detail-goods-tips-dialog-xs: var(--border-radius-secondary-xs);
  --color-detail-goods-style-title: var(--color-white);
  --color-detail-goods-style-title-promo: var(--color-white);
  --bgi-detail-goods-style-promo-icon: url(https://img-cdn-sg.payermax.com/jm-site/brand/Dadagold/goods-display-style-promo.png);
  --bg-detail-goods-countdown: var(--color-white);
  --bg-detail-goods-countdown-lock: var(--color-white);
  --color-detail-goods-countdown: var(--color-black);
  --bgi-detail-goods-countdown-clock-icon: url(https://img-cdn-sg.payermax.com/jm-site/brand/Dadagold/icon-clock.png);
  --bgi-detail-goods-countdown-lock-icon: url(https://img-cdn-sg.payermax.com/jm-site/brand/Dadagold/icon-lock.png);
  --color-detail-goods-preheat-desc: var(--color-yellow-60);
  --bg-detail-goods-progress: var(--color-fill-container-3);
  --bg-detail-goods-progress-soldout: var(--color-neutral-4);
  --color-detail-goods-progress: var(--color-white);
  --bg-detail-goods-progress-inner: var(--color-primary);

  /* payment item */
  --bg-detail-payment: var(--color-fill-secondary-container-1);
  --border-radius-detail-payment: var(--border-radius-primary);
  --border-radius-detail-payment-xs: var(--border-radius-primary-xs);
  --border-width-detail-payment: 2px;
  --border-width-detail-payment-xs: 0.2rem;
  --border-width-detail-payment-action: 2px;
  --border-width-detail-payment-action-xs: 0.2rem;
  --padding-detail-payment: 10px;
  --padding-detail-payment-xs: 0;
  --border-color-detail-payment: var(--color-secondary-neutral-3);
  --border-color-detail-payment-action: linear-gradient(90deg, var(--color-primary) 0%, var(--color-action) 100%);;
  --bg-detail-payment-icon: var(--color-gray-10);
  --bg-detail-payment-tag: linear-gradient(90deg, #FFA742 0%, var(--color-primary) 100%);
  --color-detail-payment-tag: var(--color-neutral-1);
  --border-radius-detail-payment-tag: var(--border-radius-secondary);
  --border-radius-detail-payment-tag-xs: var(--border-radius-secondary-xs);
  --bg-detail-payment-mark: var(--color-action);
  --bg-detail-payment-mark-hook:  var(--color-neutral-1);
  --color-detail-payment-name: var(--color-neutral-1);
  --color-detail-payment-amount: var(--color-neutral-1);
  --color-detail-payment-amount-origin: var(--color-secondary-neutral-2);
  --bg-detail-payment-tips-dialog: var(--color-fill-container-1);
  --border-radius-detail-payment-tips-dialog: var(--border-radius-secondary);
  --border-radius-detail-payment-tips-dialog-xs: var(--border-radius-secondary-xs);

  /* user form */
  --bg-detail-user-form-input: var(--color-neutral-1);
  --border-radius-detail-user-form-item: var(--border-radius-primary);
  --border-radius-detail-user-form-item-xs: var(--border-radius-primary-xs);
  --color-detail-user-form-subtitle: var(--color-neutral-1);
  --color-detail-user-form-input: var(--color-fill-bg-1);
  --color-detail-user-form-placeholder: var(--color-neutral-3);
  --color-detail-user-form-desc: var(--color-neutral-3);
  --border-color-detail-user-form-input: var(--color-neutral-3);
  --border-color-detail-user-form-input-focus: var(--color-action);
  --border-color-detail-user-form-input-error: var(--color-error);
  --bg-detail-user-form-input-error: var(--bg-detail-user-form-input);
  --bg-detail-user-id-tips-dialog: var(--color-fill-container-1);
  --border-radius-detail-user-id-tips-dialog: var(--border-radius-secondary);
  --border-radius-detail-user-id-tips-dialog-xs: var(--border-radius-secondary-xs);
  /* empty select */
  --bg-image-empty-select-url: url(//img-cdn-sg.payermax.com/jm-site/brand/Mart4fun/no-search-result-common-qian.svg);

  /* order confirm dialog */
  --bg-detail-order-confirm-dialog: var(--color-fill-container-1);
  --border-radius-detail-order-confirm-dialog: var(--border-radius-secondary);
  --border-radius-detail-order-confirm-dialog-xs: var(--border-radius-secondary-xs);
  --bg-detail-order-confirm-dialog-goods-box: var(--color-fill-container-2);
  --border-radius-detail-order-confirm-dialog-goods-box: var(--border-radius-secondary);
  --border-radius-detail-order-confirm-dialog-goods-box-xs: var(--border-radius-secondary-xs);

  /* bottom acctions */
  --bg-bottom-actions: var(--color-fill-container-2);
  --bg-bottom-actions-buy-button: linear-gradient(90deg, #FFA742 0%, var(--color-primary) 100%);
  --border-radius-bottom-actions-buy-button: var(--border-radius-primary);
  --border-radius-bottom-actions-buy-button-xs: var(--border-radius-primary-xs);
  --border-color-bottom-actions-buy-button: transparent;
  --color-bottom-actions-buy-button: var(--color-neutral-1);

  --color-bottom-actions-amount-label: var(--color-neutral-3);
  --color-bottom-actions-amount-value: var(--color-neutral-1);
  --color-bottom-actions-amount-origin: var(--color-primary);
  --color-bottom-actions-discount-percent: #FFF4BA;
  --padding-top-bottom-actions-discount-percent: 10px;
  --padding-top-bottom-actions-discount-percent-xs: 1.3rem;
  --bgi-bottom-actions-discount: url(https://img-cdn-sg.payermax.com/jm-site/brand/Dadagold/dadagold_discount.png);
  --bgi-bottom-action-coupon-empty: url(https://img-cdn-sg.payermax.com/jm-site/brand/Dadagold/dadgold-detail-coupon-empty.png);
  --bg-bottom-actions-amount-dialog: var(--color-fill-container-1);
  --border-radius-bottom-actions-amount-dialog: var(--border-radius-secondary);
  --border-radius-bottom-actions-amount-dialog-xs: var(--border-radius-secondary-xs);

  /* confirm-payment-dialog */
  --bg-detail-confirm-payment-dialog: var(--color-fill-container-1);
  --color-detail-confirm-payment-dialog: var(--color-neutral-3);
  --border-radius-detail-confirm-payment-dialog: var(--border-radius-secondary);
  --border-radius-detail-confirm-payment-dialog-xs: var(--border-radius-secondary-xs);
  /* calc-dialog */
  --color-calc-value-discount: var(--color-primary);


  /* detail footer part */
  --bg-detail-footer-part: var(--bg-body-detail);
  --color-detail-footer-part-goods-title: var(--color-neutral-1);
  --color-detail-footer-part-section-title: var(--color-neutral-1);
  --color-detail-footer-part-section-content: var(--color-neutral-3);
  --bg-detail-footer-part-section-item: var(--color-fill-container-3);
  --padding-detail-footer-part-section-item: var(--border-radius-primary);
  --padding-detail-footer-part-section-item-xs: var(--border-radius-primary-xs);

  /* ====== detail page end ======  */

  /* ====== result page start ======  */
  --bg-result-main: var(--color-fill-container-2);
  --bg-result-order-detail: var(--color-fill-container-3);
  --display-result-contact-us: none;
  /* ====== result page end ======  */

  /* footer */
  --flex-direction-footer: column;
  --align-item-footer: flex-start;
  --align-item-footer-xs: flex-start;

  --color-footer-section-title: var(--color-neutral-1);
  --font-size-footer-section-title: 14px;
  --font-size-footer-section-title-xs: 0.7rem;

  --padding-footer-locale-select: 8px 12px;
  --padding-footer-locale-select-xs: 0.4rem 0.6rem;
  --border-color-footer-locale-select: var(--color-neutral-4);
  --border-radius-footer-locale-select: var(--border-radius-secondary);
  --border-radius-footer-locale-select-xs: var(--border-radius-secondary-xs);
  --color-text-footer-locale-select: var(--color-neutral-3);

  --border-color-footer-locale-select-icon: transparent;
  --width-footer-locale-select-icon: 20px;
  --width-footer-locale-select-icon-xs: 2rem;

  --margin-footer-copyright: 48px;
  --margin-footer-copyright-xs: 1.2rem;
  --text-align-footer-copyright-xs: left;
  --color-footer-email-text: var(--color-yellow-50);
  --color-footer-help-center-text: var(--color-primary);

  /* promote code */
  --apply-primary-btn-color: var(--color-primary);
  --apply-primary-btn-radius: 8px;
  --apply-primary-btn-radius-xs: .8rem;
  --bg-promo-code-form-input: var(--color-neutral-1);
  --promo-code-form-input-color: var(--color-black);
  --promo-code-enter-border-radius-xs: 2.2rem;
  --promo-code-enter-border-radius:22px;
}
