/* Config Service Theme */
:root {
  /* 後援用（若 API 沒回來則使用 CSS 內建預設值） */
  --head-background-color: #fafafa;
  --icon-color: #737373;
  --tab-text-color: #404040;
  --tab-current-color: #d62872;
  --search-border-color: #d62872;
  --momo-logo-color: #ea27c2;
  --ask-num-color:#dd2222;
}

/* main-header */
#mainMomoHeader.main-header{background-color:var(--head-background-color,#fafafa) !important;}
.main-header .btn-options{background-image:initial;-webkit-mask:url("/ecm/img/cmm/mobile/head/icon_options_gray_24.svg") no-repeat center center;-webkit-mask-size:24px 24px;mask:url("/ecm/img/cmm/mobile/head/icon_options_gray_24.svg") no-repeat center center;mask-size:24px 24px;background-color:var(--icon-color,#737373);}
.main-header .btn-momo-logo{background-image:initial;-webkit-mask:url("/ecm/img/cmm/mobile/head/logo_square_32.svg?t=20240925001") no-repeat center center;-webkit-mask-size:27px 27px;mask:url("/ecm/img/cmm/mobile/head/logo_square_32.svg?t=20240925001") no-repeat center center;mask-size:27px 27px;background-color:var(--momo-logo-color,#ea27c2);}
.main-header .btn-history{background-image:initial;-webkit-mask:url("/ecm/img/cmm/mobile/head/icon_history_gray_24.svg") no-repeat center center;-webkit-mask-size:24px 24px;mask:url("/ecm/img/cmm/mobile/head/icon_history_gray_24.svg") no-repeat center center;mask-size:24px 24px;background-color:var(--icon-color,#737373);}
.main-header .btn-ask{background-image: none;}
.main-header .btn-ask::after{content:"";display:block;width:34px;height:34px;background-image:initial;-webkit-mask:url("/ecm/img/cmm/mobile/head/icon_ask_gray_24.svg") no-repeat center center;-webkit-mask-size:24px 24px;mask:url("/ecm/img/cmm/mobile/head/icon_ask_gray_24.svg") no-repeat center center;mask-size:24px 24px;background-color:var(--icon-color,#737373);}
.main-header .btn-ask .count-circle {z-index: 2;}
.main-header .btn-ask .count-text {color:var(--ask-num-color, #dd2222);border-color: var(--ask-num-color, #dd2222);}
#mainMomoHeader .form-label-search{border:1px solid var(--search-border-color,#d62872) !important;}

/* classificationBox */
#momoHeader .classificationBox,#momoHeader .classificationBox .sortBtnArea,#momoHeader .classificationBox .openClassBtn{background-color:var(--head-background-color,#fafafa);}
#momoHeader .classificationBox.up .sortBtnArea,#momoHeader .classificationBox.up .openClassBtn{background-color:#fafafa;}
#momoHeader .classificationBox.up .openClassBtn::before{background-color:#737373;}
#momoHeader .sortBtnArea ul li a{color:var(--tab-text-color,#404040);}
#momoHeader .sortBtnArea ul li.selected a{color:var(--tab-current-color,#d62872);border-color:var(--tab-current-color,#d62872);}
#momoHeader .classificationBox .openClassBtn::before{background-image:initial;-webkit-mask:url("/ecm/img/cmm/mobile/main/downArrow.svg") no-repeat center center;-webkit-mask-size:24px 24px;mask:url("/ecm/img/cmm/mobile/main/downArrow.svg") no-repeat center center;mask-size:24px 24px;background-color:var(--icon-color,#737373);}

@supports not (-webkit-mask: url("")) {
  .main-header .btn-options{background:url("/ecm/img/cmm/mobile/head/icon_options_gray_24.svg") no-repeat center center / 24px 24px;}
  .main-header .btn-momo-logo{background:url("/ecm/img/cmm/mobile/head/logo_square_32.svg?t=20240925001") no-repeat center center / 27px 27px;}
  .main-header .btn-history{background:url("/ecm/img/cmm/mobile/head/icon_history_gray_24.svg") no-repeat center center / 24px 24px;}
  .main-header .btn-ask::after{background:url("/ecm/img/cmm/mobile/head/icon_ask_gray_24.svg") no-repeat center center / 24px 24px;}
  #momoHeader .classificationBox .openClassBtn::before{background:url("/ecm/img/cmm/mobile/main/downArrow.svg") no-repeat center center / 24px 24px;}
}
@supports not (mask: url("")) {
  .main-header .btn-options{background:url("/ecm/img/cmm/mobile/head/icon_options_gray_24.svg") no-repeat center center / 24px 24px;}
  .main-header .btn-momo-logo{background:url("/ecm/img/cmm/mobile/head/logo_square_32.svg?t=20240925001") no-repeat center center / 27px 27px;}
  .main-header .btn-history{background:url("/ecm/img/cmm/mobile/head/icon_history_gray_24.svg") no-repeat center center / 24px 24px;}
  .main-header .btn-ask::after{background:url("/ecm/img/cmm/mobile/head/icon_ask_gray_24.svg") no-repeat center center / 24px 24px;}
  #momoHeader .classificationBox .openClassBtn::before{background:url("/ecm/img/cmm/mobile/main/downArrow.svg") no-repeat center center / 24px 24px;}
}