.list-block .item-media {
    flex-shrink: 1;
    display: -webkit-box;
}
.page, .page-group {
    background: #efefef;
}

.content{
    width: 19rem;
    left: 50%;
    transform: translateX(-50%);
}
.popup.popup-document{
    transform: translate(-50%, 100%);
}
.popup-document{
    width: 19rem;
    left: 50%;
    transform: translate(-50%, 100%);
}
.popup-document.modal-in{
    animation: slideUpAbout 0.3s;
    transform: translate(-50%, 0);
}
@@keyframes slideUpAbout {
    from {
      transform: translate(-50%, 0);
      /* 初始状态：水平居中但在底部 */
    }
  
    to {
      transform: translate(-50%, 0);
      /* 最终状态：水平居中且滑到底部可见 */
    }
  }

#login .item-input input {
    font-size: .9rem;
    border-radius: 3px;
    border: solid 1px #0894ec;
    text-indent: .5rem;
    padding: .25rem;
    width: 100%;
    height: 2rem;
}

#login .button {
    height: 1.8rem;
    line-height: 1.8rem;
    width: 100%
}

#login .row {
    margin: 15px 0;
    margin-right: 4%;
}

.panel-overlay {
    background: #000;
    opacity: .3;
}

h4 {
    margin: 0;
}

.list-block .item-media + .item-inner {
    margin-left: 0;
}
p.button-box {
    width: 18.4rem;
    margin: .3rem;
    margin-top: 1rem;
}
.card {
    box-shadow: none;
    font-size: .75rem;
    border-radius: .3rem;
    padding: .3rem;
}
.list-block {
    background: #fff;
    padding: .3rem 0;
    font-size: 0.75rem;
    border: solid 1px #fff;
    border-radius: .3rem;
    margin: .3rem;
}
    .list-block .item-title.box-title {
        width: 100%;
        font-weight: bold;
        font-size: 1rem;
    }
    .list-block ul:before, .list-block ul:after {
        height: 0;
    }

.content-block-title {
    text-transform: capitalize;
}
.buttons-tab .button.active {
    color: #FF5F53;
    border-color: #FF5F53;
}
#orderconfirm .item-input input, .orderconfirm .item-input input {
    font-size: .75rem;
    border-radius: 3px;
    border: solid 1px #ccc;
    padding: .25rem;
    width: 100%;
    height: 1.6rem;
}

.popup-result .messagetxt {
    font-size: .75rem;
    padding: 0 .75rem;
    margin: 10px 0 0
}

.popup-result .card-content-inner {
    padding: .4rem .3rem 0;
}

    .popup-result .card-content-inner span {
        font-weight: bold;
    }

    .popup-result .card-content-inner:first-child {
        padding-top: 1rem;
    }

    .popup-result .card-content-inner:last-child {
        padding-bottom: 1rem;
    }

#order .item-title {
    width: 50%;
    text-align: left;
}

.popup-agreement .close-popup, .popup-contract .close-popup {
    border-radius: .5rem;
    border: solid 1px #0894ec;
    padding: 5px 10px;
}

.tab-item .icon.icon-nav-home {
    width: 1.45rem;
    height: 1.45rem;
    background-image: url(/images/home.svg);
}

.tab-item .icon.icon-nav-loan {
    width: 1.45rem;
    height: 1.45rem;
    background-image: url(/images/loan.svg);
}

.tab-item .icon.icon-nav-order {
    width: 1.45rem;
    height: 1.45rem;
    background-image: url(/images/order.svg);
}

.tab-item .icon.icon-nav-zamloan {
    width: 1.45rem;
    height: 1.45rem;
    background-image: url(/images/zamloan.svg);
}

.tab-item .icon.icon-nav-coupon {
    width: 1.45rem;
    height: 1.45rem;
    background-image: url(/images/coupon.png);
}

.tab-item .icon.icon-nav-mine {
    width: 1.45rem;
    height: 1.45rem;
    background-image: url(/images/mine.svg);
}

.tab-item.active .icon.icon-nav-home {
    background-image: url(/images/home-s.svg);
}

.tab-item.active .icon.icon-nav-loan {
    background-image: url(/images/loan-s.svg);
}

.tab-item.active .icon.icon-nav-order {
    background-image: url(/images/order-s.svg);
}

.tab-item.active .icon.icon-nav-zamloan {
    background-image: url(/images/zamloan-s.svg);
}

.tab-item.active .icon.icon-nav-coupon {
    background-image: url(/images/coupon-s.png);
}

.tab-item.active .icon.icon-nav-mine {
    background-image: url(/images/mine-s.svg);
}
.list-block .item-link .item-inner{
    background-image: url(/images/mine/right.svg);
}
.bar-nav ~ .content {
    top: 2.8rem;
}
.bar-tab~.content{
    bottom: 0;
}
.bar.bar-tab{
    background: #fff;
    height: 3rem;
}
.bar.bar-tab .tab-item{
    height: 3rem;
}
.bar-tab{
    left: 50%;
    transform: translateX(-50%);
    width: 19rem;
}
.bar-nav {
    height: 2.8rem;
    line-height: 2.8rem;
    background: #FF5F53;
    left: 50%;
    transform: translateX(-50%);
    width: 19rem;
    display: flex;
    align-items: center;
  
}
.bar-nav .back-btn{
    cursor: pointer;
    display: flex;
    z-index: 1000;
    align-items: center;
 }
 .bar-nav .customer-service-btn{
    cursor: pointer;
    display: flex;
    align-items: center;
    position: absolute;
    right: .5rem;
 }

.modal {
    width: 17rem;
    left: 50%;
    transform: translateX(-50%) !important;
    margin-left: 0;
}
.modal.toast {
    margin-left: 0 !important;
}
.modal-content .list-block{
   text-align: left;
}
.modal-content .item-title{
    margin-left: .5rem;
}
h1.title {
    line-height: 2.8rem;
    color: #fff;
    font-size: 1rem;
}

.button.button-fill {
    border-radius: .3rem;
    background: #FF5F53;
}

.bar-tab .tab-item.active, .bar-tab .tab-item:active {
    color: #FF5F53;
}

.bar .button-link {
    font-size: 1.2rem;
    line-height: 3rem;
    height: 3rem;
    color: #fff;
}

.bar .button-nav.pull-left {
    padding: 0 1rem 0 .5rem;
}
.button.button-fill.active, .button.button-fill:active{
    background-color: #FF5F53;
}
label.label-checkbox input[type=checkbox]:checked + .item-media i.icon-form-checkbox, label.label-checkbox input[type=radio]:checked + .item-media i.icon-form-checkbox {
    border: none;
    background-color: #FF5F53;
}
.item-link:active{
    background-color: #F2F3F5 !important;
}
.label-checkbox:active{
    background-color: #F2F3F5 !important;
}
/* 自定义toast */
.toast-container {
    position: fixed;
    left: 50%;
    top: 30%;
    transform: translateX(-50%);
    z-index: 99999;
    display: flex;
    width: 12rem;
    flex-direction: column;
    align-items: center;
    pointer-events: none;
  }
  .toast-container .toast-new {
    min-width: 120px;
    max-width: 80vw;
    background: rgba(51, 51, 51, 0.95);
    color: #fff;
    border-radius: 8px;
    padding: 1rem;
    gap: 8px;
    text-align: center;
    margin-top: 0.5rem;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    font-size: 0.72rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    animation: toast-in 0.3s;
    pointer-events: auto;
  }
  .toast-container .toast-icon {
    width: 1.5rem;
    height: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  @keyframes toast-in {
    from {
      opacity: 0;
      transform: translateY(30px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  .button-big{
    height: 2.5rem;
    line-height: 2.5rem;
    border-radius: 24px;
  }

  /* 通知栏 */
  .card-footer-birthday {
    padding: .3rem;
    display: flex;
    align-items: center;
    gap: 8px;
    background-color: #FEF3E6;
}

.card-footer-birthday img {
    width: .85rem;
    height: .85rem;
}

.card-footer-birthday .Treat {
    color: #1D2129;
    font-size: .75rem;
    font-weight: 700;
}

.card-footer-birthday .reward {
    color: #D35A21;
    font-size: .75rem;
    font-weight: 400;
}

.card-footer .row{
    width: 100%;
    margin-left: 0;
}
.card-footer .row .col-100{
    width: 100%;
    margin-left: 0;
}
.shareBtn-box .row{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.shareBtn-box .row .col-50{
    width: 100%;
    flex: 1;
    margin-left: 0;
}
.share-btn:active{
    color: #fff !important;
}
.share-btn{
    padding: .3rem;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 5px;
    width: 100%;
}
.share-btn img{
    width: 1rem;
}
.share-btn span{
   font-size: .75rem;
}
.share-whsapp {
    background: #0DC142;
    border-radius: .3rem;
}
.share-fb {
    background: #1877f2;
    border-radius: .3rem;
}