/**
---------------------------------------弹窗购买部分CSS:Start-----------------------------------------------
 */
.open-commodity, .open-query {
    padding: 50px;
}

.commodity-di .general, .draft_status {
    font-size: 14px;
    color: #7c7674;
}

.commodity_name {
    text-align: center;
    font-weight: bold;
    font-size: 1.5rem;
    padding-bottom: 15px;
    border-bottom: 1px dashed #ff7c7c3b;
    margin-bottom: 20px;
    color: #7a7878;
}

.layui-layer[type=page] {
    background: linear-gradient(#ffffffed, #ffe7f4) !important;
    border-radius: 20px !important;
}

.layui-layer {
    box-shadow: rgb(253 173 204 / 35%) 0px 7px 29px 0px !important;
    background: -moz-linear-gradient(top, #ffdede 0%, #ffffff 100%) !important;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffdede), color-stop(100%, #ffffff)) !important;
    background: -webkit-linear-gradient(top, #ffdede 0%, #ffffff 100%) !important;
    background: -o-linear-gradient(top, #ffdede 0%, #ffffff 100%) !important;
    background: -ms-linear-gradient(top, #ffdede 0%, #ffffff 100%) !important;
    background: linear-gradient(to bottom, #ffdede 0%, #ffffff 100%) !important;
}

.layui-layer-hui{
    font-weight: bold !important;
    color: #6793e8 !important;
    border-radius: 20px !important;
}

.layui-layer-content{
    border-radius: 20px !important;
}

.share_url {
    color: #8e8eefbd;
    cursor: pointer;
    font-size: 14px;
}

.description {
    font-size: 14px;
    color: grey;
}

.description p {
    font-size: 14px !important;
    margin-bottom: 0 !important;
}

.seckill_end_time {
    color: #4caf50 !important;
}

.seckill_start_time {
    color: orangered !important;
}

.commodity-di .price {
    color: green;
    font-weight: bold;
    font-size: 14px !important;
}

.commodity-di .price_tips {
    color: #6772e5;
}

.delivery_way_hand {
    color: white;
    background: #ff000066;
    padding: 2px 4px;
    border-radius: 5px;
    font-size: 12px;
}

.delivery_way_auto {
    color: white;
    background: #00800078;
    padding: 2px 4px;
    border-radius: 5px;
    font-size: 12px;
}

.layui-layer-page input[type=text], .commodity-di input[type=number], .commodity-di input[type=password], .commodity-di input[type=email] {
    display: inline-block !important;
    width: 240px;
    height: 28px;
    background: rgba(255, 255, 255) !important;
    border-radius: 5px !important;
    padding-left: 6px !important;
    border: none;
}

.layui-layer-page textarea {
    background: rgba(255, 255, 255, .5);
    border-radius: 10px;
}

.layui-layer-page textarea:focus {
    outline: none;
}

.layui-layer-page input::placeholder {
    color: #6c6a6a !important;
}

.layui-layer-page input:focus {
    outline: none;
}


.purchase_num {
    width: 80px !important;
}

.card_count {
    color: #0fb183;
}

.card_count_general {
    color: #a5620f !important;
}

.card_count_immediately {
    color: #f16868 !important;
}


.card_count_unknown {
    color: #35b98e !important;
}

.card_count_empty {
    color: #d1d2d6 !important;
}

.purchase_count {
    display: none;
    color: #26fbdd;
}

.captcha-input {
    width: 120px !important;
}

.commodity-di .captcha {
    position: relative;
    top: -2px;
    cursor: pointer;
}

.trade_amount {
    font-weight: bold;
    color: #e72451;
}

.qq-service {
    color: #2aa2e3;
    padding: 0 4px 0 0;
    font-size: 12px;
    margin: 0 4px 0 0;
    border-radius: 5px;
}

.web-service {
    color: #ff8484;
    padding: 0 4px 0 4px;
    margin: 0;
    font-size: 12px;
    border-radius: 5px;
}

.pay-content {
    border-top: 1px dashed #ff7c7c3b;
    margin-top: 20px;
    padding-top: 10px;
}

.pay-content label {
    font-size: 16px;
    color: #bba0a3;
}

.pay-button {
    position: relative;
    margin: 0 4px 8px 0;
    background-color: rgba(70, 166, 255, 0.42);
    font-size: 14px;
    border-radius: 10px;
    border: 1px solid transparent;
    display: inline-block;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    padding: 2px 5px;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    -webkit-box-shadow: 0 1px 4px 0 #ff99e899;
    box-shadow: 0 1px 4px 0 #ff99e899;
    color: grey;
}

.pay-button:hover {
    color: white;
    background-color: rgba(227, 165, 165, 0.53);
}


.pay-button img {
    height: 22px;
    border-radius: 6px;
}

.pay_list {
    padding-top: 10px;
}

.draft_status {
    display: none;
}

.draft_status button[type=button] {
    border-radius: 5px;
    background-color: #f3b0b09e;
    color: white;
    cursor: pointer;
    padding: 1px 5px 1px 5px;
    border: none;
}

.draft_status button[type=button]:focus {
    outline: none;
}

.draft_status button[type=button]:disabled {
    background-color: rgba(239, 239, 239, 0.3);
    color: grey;
}

.draft_premium {
    color: red;
}

.draft_status table {
    margin: 10px 0 5px 0;
}

.draft_status .draftCard label {
    font-size: 14px;
    color: grey;
}


.need-login {
    margin-top: 10px;
    font-size: 14px;
    color: #ed8181;
    font-weight: bold;
}

.need-login a {
    color: #526ccb;
}

/* 设置滚动条的样式 */
::-webkit-scrollbar {
    width: 5px;
}

/* 滚动槽 */
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(246, 193, 193, 0.3);
    border-radius: 10px;
}

/* 滚动条滑块 */
::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: rgba(245, 196, 196, 0.1);
    -webkit-box-shadow: inset 0 0 6px rgba(236, 186, 186, 0.5);
}

::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(255, 0, 0, 0.2);
}

.lot {
    font-size: 12px;
    list-style-type: none;
    padding: 0;
    color: #0fb183;
}

.open-query .search-query {
    border: none;
    font-size: 14px;
    color: white;
    background: #e9b4ed;
    padding: 2px 10px;
    border-radius: 5px;
}

.open-query .search-value {
    width: 280px;
}

.open-query .search-query:focus {
    outline: none;
}

.open-query .search-page {
    border-bottom: 1px dashed #ff7c7c3b;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.open-query .hr-top {
    border-bottom: 1px dashed #ff7c7c3b;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.open-query .getCard {
    cursor: pointer;
    color: white;
    background: #f1b4ca;
    padding: 1px 5px;
    font-size: 14px;
    border-radius: 5px;
}

.open-query .card-textarea {
    border: 1px solid #f3c0c066;
    width: 100%;
    padding: 10px;
    font-size: 14px;
}

@media screen and (max-width: 768px) {
    .open-commodity, .open-query {
        padding: 20px;
    }

    .layui-layer[type=page] {
        border-radius: 0 !important;
    }

    .dream-commodity-layer > .layui-layer-title {
        height: 58px;
        line-height: 58px;
        padding-right: 76px;
    }

    .dream-commodity-layer > .layui-layer-setwin {
        position: fixed !important;
        top: calc(env(safe-area-inset-top, 0px) + 8px) !important;
        right: calc(env(safe-area-inset-right, 0px) + 10px) !important;
        width: 48px;
        height: 48px;
        z-index: 2147480000;
    }

    .dream-commodity-layer > .layui-layer-setwin .layui-layer-close {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 48px;
        height: 48px;
        margin: 0;
        border: 2px solid #f08eb6;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.96) !important;
        box-shadow: 0 6px 18px rgba(183, 54, 110, 0.25);
        color: transparent;
        cursor: pointer;
        opacity: 1;
        -webkit-tap-highlight-color: transparent;
    }

    .dream-commodity-layer > .layui-layer-setwin .layui-layer-close::before {
        content: "\00d7";
        color: #c94f83;
        font-family: Arial, sans-serif;
        font-size: 34px;
        font-weight: 400;
        line-height: 1;
        transform: translateY(-1px);
    }

    .dream-commodity-layer > .layui-layer-setwin .layui-layer-close:hover,
    .dream-commodity-layer > .layui-layer-setwin .layui-layer-close:focus-visible {
        border-color: #cf4f86;
        box-shadow: 0 7px 20px rgba(183, 54, 110, 0.34);
        outline: 3px solid rgba(240, 142, 182, 0.24);
        outline-offset: 2px;
        opacity: 1;
    }

    .dream-commodity-layer > .layui-layer-setwin .layui-layer-close:active {
        transform: scale(0.96);
    }
}


/**
---------------------------------------弹窗购买部分CSS:End-----------------------------------------------
 */

.race-click {
    margin-right: 8px;
    padding: 1px 8px;
    text-align: center;
    box-shadow: 0 1px 4px 0 rgb(0 0 0 / 20%);
    border-radius: 10px;
    cursor: pointer;
    display: inline-block;
    user-select: none;
    transition: all .3s ease;
}

.race-click.checked {
    border: 1px solid #03a9f4;
}

.category-list table tr th:nth-child(4), .category-list table tr td:nth-child(4) {
    position: relative;
    right: 0;
    width: 60px;
    text-align: center;
}

.category-list table tr th:nth-child(3), .category-list table tr td:nth-child(3) {
    position: relative;
    right: 50px;
    width: 80px;
    text-align: center;
}

.category-list table tr th:nth-child(2), .category-list table tr td:nth-child(2) {
    position: relative;
    right: 80px;
    width: 80px;
    text-align: center;
    margin: 0 20px;
}

@media screen and (max-width: 768px) {
    .category-list table tr th:nth-child(2), .category-list table tr td:nth-child(2) {
        right: 0;
    }

    .category-list table tr th:nth-child(3), .category-list table tr td:nth-child(3) {
        right: 0;
    }
}

.category-list table .head {
}

.category-list table .item {
    border-bottom: 1px solid #efefef;
}

.category-list table .item:nth-last-child(1) {
    border-bottom: none;
}


.category-list table .head th {
    padding: 10px 0;
    font-weight: bold !important;
    font-size: 14px;
}

.category-list table .item td {
    padding: 10px 0;
    font-size: 14px;
    font-weight: bolder;
}

.category-list table .head th:nth-child(1) {
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
}

.category-list table .head th:nth-child(4) {
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
}

.category-list table .item td:nth-child(1) {
    font-weight: bolder;
}

.category-list table .item td:nth-child(2) {
    color: #fe00dc;
    padding-right: 2px;
}

.category-list table .item td:nth-child(3) {
    color: #2ec25d;
    padding-right: 5px;
}

.category-list table .item td:nth-child(4) a {
    border-radius: 10px;
    border: 1px solid transparent;
    display: inline-block;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    padding: 2px 5px;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    -webkit-box-shadow: 0 1px 4px 0 #ff99e899;
    box-shadow: 0 1px 4px 0 #ff99e899;
    color: grey;
}

p {
    font-size: 14px;
}

/* Dream responsive shop navigation */
.dream-page-container {
    width: 100%;
}

.dream-shop-main {
    min-width: 0;
}

.dream-category-sidebar {
    display: none;
}

.dream-category-browser {
    color: #7a8aa8;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.dream-category-heading {
    margin: 3px 0 14px;
    color: #263653;
    font-size: 19px;
    font-weight: 800;
    line-height: 1.3;
}

.dream-category-tree,
.dream-category-children {
    margin: 0;
    padding: 0;
    list-style: none;
}

.dream-category-item + .dream-category-item {
    margin-top: 5px;
}

.dream-category-children {
    display: none;
    margin: 5px 0 2px 18px;
    padding-left: 10px;
    border-left: 1px solid rgba(71, 114, 255, .16);
}

.dream-category-item.is-expanded > .dream-category-children {
    display: block;
}

.dream-category-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 32px;
    align-items: center;
    gap: 4px;
}

.dream-category-row:not(.has-children) {
    grid-template-columns: minmax(0, 1fr);
}

.dream-category-link,
.dream-category-child-toggle {
    border: 0;
    color: inherit;
    background: transparent;
    font: inherit;
    cursor: pointer;
}

.dream-category-link {
    position: relative;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: 42px;
    padding: 7px 9px;
    border: 1px solid transparent;
    border-radius: 8px;
    color: #435574;
    text-align: left;
    transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.dream-category-link:hover,
.dream-category-link:focus-visible {
    border-color: rgba(71, 114, 255, .18);
    background: rgba(244, 248, 255, .95);
    outline: none;
}

.dream-category-link.is-current {
    border-color: rgba(71, 114, 255, .24);
    color: #244fcf;
    background: rgba(232, 240, 255, .94);
    box-shadow: inset 3px 0 0 #4772ff;
}

.dream-category-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    overflow: hidden;
    border-radius: 6px;
    color: #6581b4;
    background: rgba(97, 131, 196, .10);
    font-size: 14px;
}

.dream-category-icon img {
    display: block;
    width: 20px;
    height: 20px;
    object-fit: cover;
}

.dream-category-name {
    min-width: 0;
    overflow-wrap: anywhere;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
}

.dream-category-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 25px;
    height: 22px;
    padding: 0 7px;
    border-radius: 999px;
    color: #5c74a0;
    background: rgba(91, 119, 170, .10);
    font-size: 12px;
    font-weight: 800;
}

.dream-category-child-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    color: #7184a6;
}

.dream-category-child-toggle:hover,
.dream-category-child-toggle:focus-visible {
    color: #3159ce;
    background: rgba(71, 114, 255, .10);
    outline: none;
}

.dream-category-child-toggle .fa {
    transition: transform .18s ease;
}

.dream-category-item.is-expanded > .dream-category-row .dream-category-child-toggle .fa {
    transform: rotate(180deg);
}

.dream-category-empty {
    margin: 0;
    padding: 16px 8px;
    color: #8290aa;
    font-size: 13px;
    text-align: center;
}

.dream-announcement-toggle {
    display: none;
}

.dream-nav-links .dream-trx-energy-link {
    display: inline-flex !important;
}

.dream-nav-links .dream-trx-token-icon {
    display: block;
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    border-radius: 50%;
}

.dream-mobile-nav,
.dream-category-sheet,
.dream-category-overlay {
    display: none;
}

@media (min-width: 1360px) {
    .dream-topbar .dream-navbar-container {
        position: relative;
        left: 20px;
        width: calc(100% - 204px);
        max-width: 1140px;
        margin-right: 12px;
        margin-left: auto;
    }

    .dream-page-container {
        display: grid;
        grid-template-columns: 200px minmax(0, 1110px);
        grid-template-areas:
            ". announcement"
            "sidebar shop";
        align-items: start;
        column-gap: 20px;
        width: calc(100% - 24px);
        max-width: 1360px;
    }

    .dream-announcement {
        grid-area: announcement;
    }

    .dream-shop-layout {
        display: contents;
    }

    .dream-category-sidebar {
        grid-area: sidebar;
        position: sticky;
        top: 16px;
        display: block;
        max-height: calc(100vh - 32px);
        padding: 18px 14px;
        overflow-y: auto;
        border: 1px solid rgba(255, 255, 255, .72);
        border-radius: 8px;
        background: rgba(255, 255, 255, .90);
        box-shadow: 0 12px 30px rgba(31, 42, 78, .10);
        scrollbar-width: thin;
    }

    .dream-shop-main {
        grid-area: shop;
    }

    .frontend-category-toggle,
    .frontend-category-panel {
        display: none !important;
    }
}

@media (min-width: 1440px) {
    .dream-topbar .dream-navbar-container {
        left: 23px;
        width: 1140px;
        max-width: 1140px;
        margin-right: calc((100vw - 1400px) / 2);
    }

    .dream-page-container {
        grid-template-columns: 236px minmax(0, 1110px);
        column-gap: 24px;
        max-width: 1400px;
    }
}

@media (max-width: 767.98px), (max-width: 932px) and (max-height: 500px) and (orientation: landscape) {
    body {
        padding-bottom: calc(68px + env(safe-area-inset-bottom));
    }

    .dream-nav-links .dream-trx-energy-link {
        display: inline-flex !important;
    }

    .dream-nav-links .nav-link[href="/"],
    .dream-nav-links .mobile-user-entry-btn,
    .dream-nav-links .nav-link[href="/user/index/query"] {
        display: none !important;
    }

    .dream-topbar .navbar-brand,
    .frontend-category-toggle,
    .frontend-category-panel {
        display: none !important;
    }

    body.dream-category-sheet-open {
        position: fixed;
        right: 0;
        left: 0;
        width: 100%;
        overflow: hidden;
    }

    .dream-announcement .card-block {
        padding-bottom: 12px;
    }

    .dream-announcement-body.is-collapsed {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .dream-announcement-body.is-collapsed > * {
        display: inline;
        margin: 0;
    }

    .dream-announcement-body.is-collapsed > *::after {
        content: " ";
    }

    .dream-announcement-toggle {
        align-items: center;
        gap: 5px;
        min-height: 32px;
        margin: 8px 0 0 auto;
        padding: 4px 8px;
        border: 0;
        color: #3159ce;
        background: transparent;
        font-size: 13px;
        font-weight: 800;
        cursor: pointer;
    }

    .dream-announcement-toggle.is-visible {
        display: flex;
    }

    .dream-announcement-toggle:focus-visible {
        outline: 2px solid rgba(71, 114, 255, .45);
        outline-offset: 2px;
    }

    .dream-mobile-nav {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1050;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        height: calc(60px + env(safe-area-inset-bottom));
        padding: 4px 4px env(safe-area-inset-bottom);
        border-top: 1px solid rgba(86, 105, 145, .16);
        background: rgba(255, 255, 255, .97);
        box-shadow: 0 -8px 22px rgba(42, 58, 91, .12);
        backdrop-filter: blur(14px);
    }

    .dream-mobile-nav-item {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        gap: 2px;
        min-width: 0;
        min-height: 52px;
        padding: 3px 2px;
        border: 0;
        color: #687793;
        background: transparent;
        font-size: 11px;
        font-weight: 700;
        line-height: 1.15;
        text-align: center;
        text-decoration: none;
        cursor: pointer;
        white-space: nowrap;
    }

    .dream-mobile-nav-item .fa {
        font-size: 19px;
        line-height: 1;
    }

    .dream-mobile-nav-item:hover,
    .dream-mobile-nav-item:focus-visible {
        color: #3159ce;
        text-decoration: none;
        outline: none;
    }

    .dream-mobile-nav-item.is-current,
    .dream-mobile-nav-item[aria-current="page"] {
        color: #3159ce;
    }

    .dream-mobile-nav-item.is-current .fa,
    .dream-mobile-nav-item[aria-current="page"] .fa {
        transform: translateY(-1px);
    }

    .dream-mobile-nav-item.dream-mobile-nav-order {
        position: relative;
        min-height: 48px;
        margin: 2px 3px;
        padding-top: 4px;
        padding-bottom: 3px;
        border-radius: 13px;
        color: #fff;
        background: linear-gradient(135deg, #ffc83d 0%, #ffad20 52%, #ff8b18 100%);
        box-shadow: 0 7px 16px rgba(255, 160, 24, .25), inset 0 1px 0 rgba(255, 255, 255, .32);
    }

    .dream-mobile-nav-item.dream-mobile-nav-order:hover,
    .dream-mobile-nav-item.dream-mobile-nav-order:focus-visible {
        color: #fff;
        box-shadow: 0 8px 18px rgba(255, 160, 24, .32), 0 0 0 2px rgba(255, 184, 55, .22);
    }

    .dream-mobile-nav-item.dream-mobile-nav-order .fa {
        color: #fff;
        font-size: 17px;
    }

    .dream-category-overlay {
        position: fixed;
        inset: 0;
        z-index: 1140;
        display: block;
        visibility: hidden;
        opacity: 0;
        background: rgba(25, 33, 51, .46);
        pointer-events: none;
        transition: opacity .2s ease, visibility .2s ease;
    }

    .dream-category-overlay.is-open {
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
    }

    .dream-category-sheet {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1150;
        display: flex;
        visibility: hidden;
        flex-direction: column;
        max-height: 82vh;
        border-radius: 18px 18px 0 0;
        background: #fff;
        box-shadow: 0 -18px 48px rgba(24, 36, 64, .24);
        opacity: 0;
        transform: translateY(102%);
        pointer-events: none;
        transition: transform .22s ease, opacity .18s ease, visibility .22s ease;
    }

    .dream-category-sheet.is-open {
        visibility: visible;
        opacity: 1;
        transform: translateY(0);
        pointer-events: auto;
    }

    .dream-category-sheet-handle {
        width: 38px;
        height: 4px;
        margin: 8px auto 2px;
        border-radius: 999px;
        background: #d5dbe7;
    }

    .dream-category-sheet-header {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 14px;
        padding: 10px 18px 12px;
        border-bottom: 1px solid rgba(91, 111, 152, .12);
    }

    .dream-category-sheet-header .dream-category-heading {
        margin-bottom: 0;
    }

    .dream-category-sheet-close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        width: 40px;
        height: 40px;
        border: 0;
        border-radius: 50%;
        color: #5c6d8b;
        background: #f2f5fa;
        cursor: pointer;
    }

    .dream-category-sheet-close:hover,
    .dream-category-sheet-close:focus-visible {
        color: #3159ce;
        background: #e9effc;
        outline: none;
    }

    .dream-category-sheet-content {
        min-height: 0;
        padding: 10px 14px calc(18px + env(safe-area-inset-bottom));
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    .dream-category-sheet .dream-category-link {
        min-height: 46px;
    }
}

@media (max-width: 932px) and (max-height: 500px) and (orientation: landscape) {
    .dream-category-sheet {
        max-height: 90vh;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dream-category-link,
    .dream-category-child-toggle .fa,
    .dream-mobile-nav-item,
    .dream-category-overlay,
    .dream-category-sheet {
        scroll-behavior: auto;
        transition: none !important;
    }
}
