/*
 * 十香订单查询页精准样式
 * 页面 body 使用 toka-query-body，
 * 不再触发原来的 dark-green-front。
 */

body.toka-query-body {
    --acg-primary: #246bfe;
    --acg-secondary: #4f83ff;
    --acg-danger: #246bfe;
    --acg-text-strong: #172b4d;
    --acg-text-muted: #657892;
    --acg-card-bg: #ffffff;
    --acg-border: rgba(77, 139, 245, .20);

    min-height: 100vh;

    color: #172b4d;
    color-scheme: light;

    background-color: #f4f8ff;

    background-image:
        radial-gradient(
            circle at 14% 18%,
            rgba(102, 169, 255, .14),
            transparent 35%
        ),
        radial-gradient(
            circle at 87% 82%,
            rgba(76, 188, 255, .10),
            transparent 33%
        ),
        linear-gradient(
            145deg,
            #f8fbff 0%,
            #edf5ff 54%,
            #f8fbff 100%
        );

    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

body.toka-query-body
.navbar-acg {
    padding: 10px 0;

    border-bottom:
        1px solid rgba(63, 107, 166, .10);

    background:
        rgba(255, 255, 255, .95);

    box-shadow:
        0 8px 26px rgba(48, 91, 151, .06);

    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

body.toka-query-body
.navbar-acg .container {
    max-width: 1110px;
}

body.toka-query-body
.navbar-acg .brand-logo {
    width: 24px;
    height: 24px;

    border: 0;
    border-radius: 0;

    background: transparent;

    box-shadow: none;

    filter: none;
    -webkit-filter: none;
}

body.toka-query-body
.navbar-acg .navbar-brand span {
    color: #172b4d !important;
}

body.toka-query-body
.navbar-acg .nav-link {
    color: #657892;
}

body.toka-query-body
.navbar-acg .nav-link:hover,
body.toka-query-body
.navbar-acg .nav-link.active {
    color: #246bfe;
}

body.toka-query-body
.navbar-acg .nav-icon {
    color: #246bfe;
}

body.toka-query-body
.search-input .input-group-text {
    color: #657892;

    border:
        1px solid rgba(77, 139, 245, .28);

    border-right: 0;

    background: #ffffff;

    box-shadow: none;
}

body.toka-query-body
.search-input .form-control {
    color: #172b4d;

    border:
        1px solid rgba(77, 139, 245, .28);

    border-left: 0;

    background: #ffffff;

    box-shadow: none;
}

body.toka-query-body
.search-input .form-control::placeholder {
    color: #91a2ba;
}

body.toka-query-body
.search-input .form-control:focus {
    border-color:
        rgba(77, 139, 245, .48) !important;

    border-left:
        0 !important;

    background: #ffffff;

    box-shadow: none;
}

body.toka-query-body
.user-login-box .btn-outline-secondary {
    color: #246bfe;

    border:
        1px solid rgba(77, 139, 245, .30);

    background: #ffffff;

    box-shadow: none;
}

body.toka-query-body
.user-login-box .btn-outline-secondary:hover {
    color: #165bea;

    border-color:
        rgba(36, 107, 254, .48);

    background: #edf5ff;
}

body.toka-query-body
.user-login-box .btn-primary {
    color: #ffffff;

    border:
        1px solid transparent;

    background:
        linear-gradient(
            135deg,
            #4f83ff,
            #246bfe
        );

    box-shadow:
        0 7px 16px rgba(36, 107, 254, .18);
}

body.toka-query-body
.toka-query-page {
    max-width: 1110px;
    padding-top: 22px !important;
}

body.toka-query-body
.panel.toka-query-panel {
    position: relative;

    overflow: hidden;

    border:
        1px solid rgba(77, 139, 245, .20);

    border-radius: 18px;

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .98),
            rgba(247, 251, 255, .96)
        );

    box-shadow:
        0 18px 46px rgba(39, 83, 145, .11);

    backdrop-filter: none;
    -webkit-backdrop-filter: none;

    clip-path: none;
}

body.toka-query-body
.panel.toka-query-panel::after {
    display: none;
    content: none;
}

body.toka-query-body
.panel-header.toka-query-panel-header {
    min-height: 58px;
    margin: 0;
    padding: 14px 16px;

    color: #172b4d;

    border-bottom:
        1px solid rgba(77, 112, 160, .13);

    background:
        rgba(255, 255, 255, .58);

    box-shadow: none;
}

body.toka-query-body
.toka-query-panel-header .icon {
    width: 34px;
    height: 34px;

    border-radius: 10px;

    background: #edf5ff;
}

body.toka-query-body
.toka-query-panel-header .panel-title {
    color: #172b4d;
    font-weight: 700;
}

body.toka-query-body
.panel-body.toka-query-panel-body {
    padding: 20px 16px;

    color: #172b4d;

    background:
        rgba(255, 255, 255, .70);
}

body.toka-query-body
.toka-query-input {
    height: 48px;
    padding: 12px 16px;

    color: #172b4d;

    border:
        1px solid rgba(77, 139, 245, .30);

    border-radius: 10px;

    background: #ffffff;

    box-shadow:
        inset 0 1px 2px rgba(42, 78, 126, .04);

    transform: none;
}

body.toka-query-body
.toka-query-input::placeholder {
    color: #91a2ba;
}

body.toka-query-body
.toka-query-input:focus {
    color: #172b4d;

    border-color:
        rgba(36, 107, 254, .64);

    background: #ffffff;

    box-shadow:
        0 0 0 3px rgba(36, 107, 254, .10);

    transform: none;
}

body.toka-query-body
.toka-query-button {
    height: 48px;
    padding: 12px 22px;

    color: #ffffff;

    border: 1px solid transparent;
    border-radius: 10px;

    background:
        linear-gradient(
            135deg,
            #4f83ff,
            #246bfe
        );

    box-shadow:
        0 9px 21px rgba(36, 107, 254, .21);

    transform: none;
}

body.toka-query-body
.toka-query-button:hover {
    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #3f77f5,
            #165bea
        );

    box-shadow:
        0 11px 25px rgba(36, 107, 254, .27);

    transform: none;
}

body.toka-query-body
.order-results,
body.toka-query-body
.no-results,
body.toka-query-body
.loading-state {
    margin-top: 16px;
}

body.toka-query-body
.order-item {
    color: #172b4d;

    border:
        1px solid rgba(77, 139, 245, .16);

    background:
        rgba(255, 255, 255, .92);

    box-shadow:
        0 8px 22px rgba(39, 83, 145, .07);
}

body.toka-query-body
.order-no,
body.toka-query-body
.card-title,
body.toka-query-body
.card-name,
body.toka-query-body
.goods-name {
    color: #172b4d;
}

body.toka-query-body
.text-muted,
body.toka-query-body
.order-time,
body.toka-query-body
.payment-time,
body.toka-query-body
.payment-dst,
body.toka-query-body
.amount-label {
    color: #657892 !important;
}

body.toka-query-body
.amount-value,
body.toka-query-body
.goods-price {
    color: #246bfe;
}

body.toka-query-body
.goods-section,
body.toka-query-body
.card-display-content,
body.toka-query-body
.card-content,
body.toka-query-body
.card-content-no-password,
body.toka-query-body
.card-item {
    border:
        1px solid rgba(77, 139, 245, .14);

    background:
        #f7fbff;
}

body.toka-query-body
.dropdown-menu {
    border:
        1px solid rgba(77, 139, 245, .18);

    background: #ffffff;

    box-shadow:
        0 14px 32px rgba(39, 83, 145, .12);
}

body.toka-query-body
.dropdown-item {
    color: #172b4d;
}

body.toka-query-body
.dropdown-item:hover {
    color: #246bfe;
    background: #edf5ff;
}

body.toka-query-body
footer {
    color: #657892;
}

@media screen and (max-width: 767.98px) {
    body.toka-query-body {
        background-attachment: scroll;
    }

    body.toka-query-body
    .toka-query-page {
        max-width: 100%;
        padding: 14px 12px !important;
    }

    body.toka-query-body
    .panel.toka-query-panel {
        border-radius: 15px;
    }

    body.toka-query-body
    .order-query-form
    > .d-flex {
        flex-direction: column;
        gap: 10px !important;
    }

    body.toka-query-body
    .order-query-form
    > .d-flex
    > div {
        width: 100% !important;
    }

    body.toka-query-body
    .toka-query-button {
        width: 100%;
    }
}