/* Detail page visual patch.
 * Loaded after the compiled uni-app component styles so the detail page can
 * use the reference layout without changing its data or order API.
 */
html body.sgc-detail-active {
    background: #eef4f8 !important;
}

body.sgc-detail-active .detail,
body.sgc-detail-active .detail .container,
body.sgc-detail-active .detail .container .xiangqing {
    min-height: 100vh !important;
    background: #eef4f8 !important;
    color: #17324d !important;
}

body.sgc-detail-active .detail .container {
    padding-bottom: calc(78px + env(safe-area-inset-bottom, 0px)) !important;
}

body.sgc-detail-active .detail .container > .u-navbar {
    min-height: 46px !important;
    border-bottom: 1px solid #e8eef3 !important;
    background: #fff !important;
    box-shadow: none !important;
}

body.sgc-detail-active .detail .container > .u-navbar * {
    color: #17324d !important;
}

body.sgc-detail-active .xiangqing {
    padding: 10px 0 18px !important;
}

body.sgc-detail-active .xiangqing .topBox {
    display: flex !important;
    width: auto !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 18px !important;
    margin: 0 12px 10px !important;
    padding: 15px 14px 13px !important;
    border: 1px solid #e7edf3 !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: 0 3px 12px rgba(36, 74, 102, .07) !important;
}

body.sgc-detail-active .xiangqing .topBox .topBox_item {
    min-width: 0 !important;
}

body.sgc-detail-active .xiangqing .topBox .topBox_item:first-child {
    margin-right: 0 !important;
}

body.sgc-detail-active .xiangqing .topBox .topBox_item1 {
    color: #17324d !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
}

body.sgc-detail-active .xiangqing .topBox .topBox_item2,
body.sgc-detail-active .xiangqing .topBox .topBox_item4 {
    margin-top: 3px !important;
    color: #73849a !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
}

body.sgc-detail-active .xiangqing .topBox .topBox_item3 {
    color: #17324d !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    text-align: right !important;
}

body.sgc-detail-active .xiangqing .main {
    margin: 0 12px !important;
}

body.sgc-detail-active .xiangqing .main .tabBox {
    width: auto !important;
    margin-bottom: 10px !important;
}

body.sgc-detail-active .xiangqing .main .tabBox .tabs,
body.sgc-detail-active .xiangqing .main .tabBox .u-tabs,
body.sgc-detail-active .xiangqing .main .tabBox .u-tabs-scorll-flex {
    min-height: 0 !important;
    padding: 6px !important;
    border: 1px solid #e7edf3 !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: none !important;
}

body.sgc-detail-active .xiangqing .main .tabBox .u-tab-item {
    display: flex !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 40px !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 5px !important;
    border-radius: 8px !important;
    color: #6e7f91 !important;
    font-size: 13px !important;
    line-height: 1.2 !important;
}

body.sgc-detail-active .xiangqing .main .tabBox .u-tab-item.u-tab-item-active,
body.sgc-detail-active .xiangqing .main .tabBox .u-tab-item[aria-selected="true"] {
    background: #5d87ed !important;
    color: #fff !important;
    font-weight: 600 !important;
}

body.sgc-detail-active .xiangqing .main .bottomBox_item_list {
    width: auto !important;
    min-height: 0 !important;
    height: auto !important;
}

body.sgc-detail-active .xiangqing .main .bottomBox_item_list .bottomBox_item {
    width: 100% !important;
    margin: 0 0 10px !important;
    box-sizing: border-box !important;
}

body.sgc-detail-active .xiangqing .main .bottomBox_item_list .bottomBox_item .imgBg {
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 13px !important;
    box-sizing: border-box !important;
    border: 1px solid #e7edf3 !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 2px 9px rgba(36, 74, 102, .06) !important;
}

body.sgc-detail-active .xiangqing .main .bottomBox_item_list .bottomBox_item .imgBg .imgBg1 {
    display: none !important;
    visibility: hidden !important;
}

body.sgc-detail-active .xiangqing .main .bottomBox_item_list .bottomBox_item .titleItem {
    position: relative !important;
    display: flex !important;
    height: 44px !important;
    align-items: center !important;
    justify-content: space-between !important;
    color: #17324d !important;
    font-size: 13px !important;
    font-weight: 600 !important;
}

body.sgc-detail-active .xiangqing .main .bottomBox_item_list .bottomBox_item .titleItem .status-btn {
    display: inline-flex !important;
    height: 26px !important;
    min-width: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 9px !important;
    border-width: 1px !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    line-height: 1 !important;
}

body.sgc-detail-active .xiangqing .main .bottomBox_item_list .bottomBox_item .bodyItem {
    display: flex !important;
    min-height: 66px !important;
    align-items: stretch !important;
    margin: 0 !important;
    padding: 8px !important;
    border: 1px solid #edf1f5 !important;
    border-radius: 8px !important;
    background: #f8fafc !important;
}

body.sgc-detail-active .xiangqing .main .bottomBox_item_list .bottomBox_item .bodyItem .bodyItemImg {
    width: 58px !important;
    min-width: 58px !important;
    max-width: 58px !important;
    height: 58px !important;
    border-radius: 6px !important;
    object-fit: cover !important;
}

body.sgc-detail-active .xiangqing .main .bottomBox_item_list .bottomBox_item .bodyItem .bodyItem_right {
    width: auto !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
    justify-content: space-between !important;
    padding: 3px 8px !important;
}

body.sgc-detail-active .xiangqing .main .bottomBox_item_list .bottomBox_item .bodyItem_right_top {
    overflow: hidden !important;
    color: #304a63 !important;
    font-size: 12px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

body.sgc-detail-active .xiangqing .main .bottomBox_item_list .bottomBox_item .bodyItem_right_bottom {
    display: flex !important;
    align-items: baseline !important;
    justify-content: space-between !important;
    color: #17324d !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

body.sgc-detail-active .xiangqing .main .bottomBox_item_list .bottomBox_item .good-num {
    color: #8b9aac !important;
    font-size: 11px !important;
    font-weight: 400 !important;
}

body.sgc-detail-active .xiangqing .main .bottomBox_item_list .bottomBox_item .footItem {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px 12px !important;
    padding: 10px 0 8px !important;
}

body.sgc-detail-active .xiangqing .main .bottomBox_item_list .bottomBox_item .footItem .tex {
    display: flex !important;
    min-width: 0 !important;
    align-items: baseline !important;
    justify-content: space-between !important;
    gap: 5px !important;
    color: #718298 !important;
    font-size: 11px !important;
    line-height: 1.4 !important;
}

body.sgc-detail-active .xiangqing .main .bottomBox_item_list .bottomBox_item .footItem .tex uni-text:last-child {
    overflow: hidden !important;
    color: #304a63 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

body.sgc-detail-active .xiangqing .main .bottomBox_item_list .bottomBox_item .grab-time {
    padding: 0 0 10px !important;
    color: #98a6b5 !important;
    font-size: 10px !important;
    line-height: 1.35 !important;
}

body.sgc-detail-active .xiangqing .main .noRecord {
    display: grid !important;
    width: 100% !important;
    height: auto !important;
    min-height: 132px !important;
    margin: 0 !important;
    padding: 24px 12px !important;
    box-sizing: border-box !important;
    border: 1px solid #e7edf3 !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: #8b9aac !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
    text-align: center !important;
    place-items: center !important;
}

body.sgc-detail-active .xiangqing .main .noRecord::before {
    display: block !important;
    width: 34px !important;
    height: 34px !important;
    margin: 0 auto 8px !important;
    border: 1px solid #dbe5ee !important;
    border-radius: 50% !important;
    background: radial-gradient(circle at 50% 42%, #dbe5ee 0 2px, transparent 3px),
        linear-gradient(#dbe5ee, #dbe5ee) 50% 22px / 14px 1px no-repeat !important;
    content: '' !important;
    opacity: .9 !important;
}

body.sgc-detail-active .xiangqing .main .u-tab-item[data-record-active="true"] {
    background: linear-gradient(135deg, #6f95ed 0%, #4f7ff1 100%) !important;
    color: #fff !important;
    font-weight: 600 !important;
    box-shadow: 0 4px 10px rgba(79, 127, 241, .2) !important;
}

body.sgc-detail-active .xiangqing .main .u-tab-item[data-record-active="false"] {
    background: transparent !important;
    color: #6e7f91 !important;
    font-weight: 500 !important;
}

body.sgc-detail-active .xiangqing .main .total,
body.sgc-detail-active .xiangqing .main .pagination {
    color: #8b9aac !important;
    font-size: 11px !important;
}

body.sgc-detail-active .xiangqing .main .pagination {
    padding: 8px 0 !important;
}

@media (max-width: 360px) {
    body.sgc-detail-active .xiangqing .topBox,
    body.sgc-detail-active .xiangqing .main {
        margin-right: 9px !important;
        margin-left: 9px !important;
    }

    body.sgc-detail-active .xiangqing .main .bottomBox_item_list .bottomBox_item .imgBg {
        padding-right: 10px !important;
        padding-left: 10px !important;
    }
}