@import "/libs/weui/weui.min.css";

html,
body,
p, ul, li,
h1, h2, h3, h4, h5, h6,
dt, dd, dl {
    padding: 0;
    margin: 0;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 400;
}

*, :after, :before {
    box-sizing: border-box;
}

* {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

:root {
    --bg-color: #0d101b;
    --color-a1: #D2003C;
    --color-a2: #AA0234;
    --color-a3: #7E0024;
    --color-a4: #2A000C;
    --color-a5: #0D0004;
    --color-a6: #0D101B;
    --color-a7: #FFFFFF;
    --color-b1: #DFE5F3;
    --color-b2: #B3B7D3;
    --color-b3: #8589A7;
    --color-b4: #545C7B;
    --color-b5: #36405F;
    --color-b6: #242D46;
    --color-b7: #171D30;
    --color-b8: #101421;
    --color-b9: #0D101B;
    --color-b10: #090B13;
    --color-b11: #eaecef;
    --color-c2: #0FC6FF;
    --color-c5: #FF9500;
    --color-c6: #171D30;
    --color-c7: #242D46;
    --color-c8: #D2003C;
    --color-c9: #545C7B;
    --color-c10: #101421;
    --color-d1: #8589A7;
    --color-odd: rgba(23, 29, 48, .4);
    --color-even: rgba(16, 20, 33, .4);
    --header-height: 42px;
    --navigation-height: 72px;
    --icon-password-hide: url('/web/images/home/password-hide-icon.png');
    --icon-password-show: url('/web/images/home/password-show-icon.png');
    --icon-popup-mobile: url('/web/images/home/popup-mobile-icon.png');
    --icon-verify-code: url('/web/images/home/verify-code-icon.png');
    --icon-password: url('/web/images/home/password-icon.png');
    --icon-recommend-code: url('/web/images/home/recommend-code-icon.png');
    --icon-realname: url('/web/images/home/realname-icon.png');
    --icon-nickname: url('/web/images/home/nickname-icon.png');
    --icon-nickname-random: url('/web/images/home/random-icon.png');
    --podium-top-bg: url('/web/images/ranking/dark-top-bg.png');
    --top-3: url('/web/images/ranking/dark-top3.png');
    --yesterday-ranking: url('/web/images/ranking/yesterday-ranking.png');
    --today-ranking: url('/web/images/ranking/today-ranking.png');
    --week-ranking: url('/web/images/ranking/week-ranking.png');
    --proxy-top: url('/web/images/proxy/proxy.png');
    --empty-img: url(/web/images/funds/empty-img.png);
}

[data-theme="light"] {
    --bg-color: #ffffff;
    --color-a1: #F4003A;
    --color-a2: #F63361;
    --color-a3: #F86689;
    --color-a4: #FCB3C4;
    --color-a5: #FEE6EC;
    --color-a6: #FFFFFF;
    --color-a7: #FFFFFF;
    --color-b1: #090B13;
    --color-b2: #22242D;
    --color-b3: #2E313A;
    --color-b4: #4A4D57;
    --color-b5: #646975;
    --color-b6: #777B87;
    --color-b7: #9A9CA5;
    --color-b8: #CDCED3;
    --color-b9: #E3E4E9;
    --color-b10: #f7f7f7;
    --color-b11: #f7f7f7;
    --color-c2: #0FC6FF;
    --color-c5: #FF9500;
    --color-c6: #E3E4E9;
    --color-c7: #E3E4E9;
    --color-c8: #F4003A;
    --color-c9: #CDCED3;
    --color-c10: #FFFFFF;
    --color-d1: #2E313A;
    --color-odd: rgba(227, 228, 233, .4);
    --color-even: rgba(255, 255, 255, .4);
    --icon-password-hide: url('/web/images/home/light-password-hide-icon.png');
    --icon-password-show: url('/web/images/home/light-password-show-icon.png');
    --icon-popup-mobile: url('/web/images/home/light-popup-mobile-icon.png');
    --icon-verify-code: url('/web/images/home/light-verify-code-icon.png');
    --icon-password: url('/web/images/home/light-password-icon.svg');
    --icon-recommend-code: url('/web/images/home/light-recommend-code-icon.png');
    --icon-realname: url('/web/images/home/light-realname-icon.png');
    --icon-nickname: url('/web/images/home/light-nickname-icon.png');
    --icon-nickname-random: url('/web/images/home/light-random-icon.png');
    --podium-top-bg: url('/web/images/ranking/light-top-bg.png');
    --top-3: url('/web/images/ranking/light-top3.png');
    --yesterday-ranking: url('/web/images/ranking/light-yesterday-ranking.png');
    --today-ranking: url('/web/images/ranking/light-today-ranking.png');
    --week-ranking: url('/web/images/ranking/light-week-ranking.png');
    --proxy-top: url('/web/images/proxy/light-proxy.png');
    --empty-img: url(/web/images/funds/light-empty-img.png);
}

body {
    position: relative;
    background-color: var(--bg-color);
    min-width: 1376px;
    overflow-y: auto;
}

/* font */
@font-face {
    font-family: LettDinText;
    src: url(/fonts/LettDinText.ttf);
}

/* common */
.main-content {
    position: relative;
    width: 1376px;
    min-width: 1376px;
    margin: 0 auto;
    margin-top: 15px;
    display: flex;
    flex-direction: column;
}

/* 开奖结果小球 */
@font-face {
    font-family: 'BaiJamjuree';
    src: url('/fonts/BaiJamjuree-Bold.ttf') format('ttf');
}

.result-ball {
    position: relative;
    width: 48px;
    height: 48px;
    line-height: 48px;
    font-family: 'hnFont', sans-serif;
    overflow: hidden;
    font-size: 22px;
    font-weight: bold;
    color: #090B13;
    text-align: center;
    background-size: 100% 100%;
}

.result-ball.small {
    width: 36px;
    height: 36px;
    line-height: 36px;
    font-size: 14px;
}

.result-ball-0, .result-ball-10, .result-ball-20, .result-ball-30 {
    background: url('/web/images/home/result-ball-0.png');
    background-size: 100% 100%;
}

.result-ball-1, .result-ball-11, .result-ball-21, .result-ball-31 {
    background: url('/web/images/home/result-ball-1.png');
    background-size: 100% 100%;
}

.result-ball-2, .result-ball-12, .result-ball-22, .result-ball-32 {
    background: url('/web/images/home/result-ball-2.png');
    background-size: 100% 100%;
}

.result-ball-3, .result-ball-13, .result-ball-23, .result-ball-33 {
    background: url('/web/images/home/result-ball-3.png');
    background-size: 100% 100%;
}

.result-ball-4, .result-ball-14, .result-ball-24, .result-ball-34 {
    background: url('/web/images/home/result-ball-4.png');
    background-size: 100% 100%;
}

.result-ball-5, .result-ball-15, .result-ball-25, .result-ball-35 {
    background: url('/web/images/home/result-ball-5.png');
    background-size: 100% 100%;
}

.result-ball-6, .result-ball-16, .result-ball-26, .result-ball-36 {
    background: url('/web/images/home/result-ball-win.png');
    background-size: 100% 100%;
}

.result-ball-7, .result-ball-17, .result-ball-27, .result-ball-37 {
    background: url('/web/images/home/result-ball-7.png');
    background-size: 100% 100%;
}

.result-ball-8, .result-ball-18, .result-ball-28, .result-ball-38 {
    background: url('/web/images/home/result-ball-8.png');
    background-size: 100% 100%;
}

.result-ball-9, .result-ball-19, .result-ball-29, .result-ball-39 {
    background: url('/web/images/home/result-ball-9.png');
    background-size: 100% 100%;
}

.result-ball.win-ball {
    background: url('/web/images/home/result-ball-win2.png');
    background-size: 100% 100%;
}

.result-ball.small {
    width: 36px;
    height: 36px;
    line-height: 36px;
    font-size: 14px;
}

.result-plus-icon {
    position: relative;
    width: 10px;
    height: 10px;
    background: url('/web/images/home/result-plus-icon.png');
}

.result-equal-icon {
    position: relative;
    width: 10px;
    height: 6px;
    background: url('/web/images/home/result-equal-icon.png');
}

.result-equal-icon.small {
    margin: 0 2px;
}

/* 开奖结果小球开始旋转 */
@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.result-ball.spin {
    animation: spin 0.15s linear infinite;
}

/* 翻页倒计时 */
.count-down-content .flip {
    position: relative;
    width: 40px;
    height: 52px;
    line-height: 52px;
    border-radius: 6px;
    overflow: hidden;
    text-align: center;
    /* background: url('/web/images/home/count-down-bg.png'); */
    font-size: 28px;
    color: var(--color-a7);
}

.count-down-content .flip .digital:before,
.count-down-content .flip .digital:after {
    position: absolute;
    content: attr(data-number);
    right: 0;
    left: 0;
    perspective: 160px;
    -webkit-perspective: 160px;
    overflow: hidden;
    color: var(--color-a7);
}

.count-down-content .flip .digital:before {
    background: url('/web/images/home/count-down-top-bg.png');
    background-size: 100% 100%;
}

.count-down-content .flip .digital:after {
    background: url('/web/images/home/count-down-bottom-bg.png');
    background-size: 100% 100%;
}

[data-theme="light"] .count-down-content .flip .digital:before {
    background: url('/web/images/home/light-count-down-top-bg.png');
    background-size: 100% 100%;
}

[data-theme="light"] .count-down-content .flip .digital:after {
    background: url('/web/images/home/light-count-down-bottom-bg.png');
    background-size: 100% 100%;
}

/* 翻页前的数字 */
.count-down-content .flip .digital:before {
    top: 0;
    bottom: 50%;
}

/* 翻页后的数字 */
.count-down-content .flip .digital:after {
    top: 50%;
    bottom: 0;
    line-height: 0;
}

.count-down-content .flip .back:before,
.count-down-content .flip .front:after {
    z-index: 1;
}

.count-down-content .flip .back:after {
    z-index: 2;
}

.count-down-content .flip .front:before {
    z-index: 3;
}

.count-down-content .flip .back:after {
    transform: rotateX(0.5turn);
    -webkit-transform: rotateX(0.5turn);
    transform-origin: center top;
    -webkit-transform-origin: center top;;
}

.count-down-content .flip.running .front:before {
    transform-origin: center bottom;
    -webkit-transform-origin: center bottom;
    animation: frontFlipDown 0.6s ease-in-out;
    -webkit-animation: frontFlipDown 0.6s ease-in-out;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.count-down-content .flip.running .back:after {
    animation: backFlipDown 0.6s ease-in-out;
    -webkit-animation: backFlipDown 0.6s ease-in-out;;
}

@keyframes frontFlipDown {
    to {
        transform: rotateX(0.5turn);
    }
}

@keyframes backFlipDown {
    to {
        transform: rotateX(0);
    }
}

.count-down-content .separator {
    position: relative;
    width: 4px;
    height: 12px;
    background: url('/web/images/home/count-down-separator.png');
}

.message {
    display: inline-block;
    margin-top: -21px;
    margin-left: -7px;
    padding: 2px 5px;
    border-radius: 50%;
    background-color: #fa5151;
    color: #fff;
    line-height: 1.1;
    text-align: center;
    font-size: 12px;
    vertical-align: middle;
}

/* 表格样式 */
.table-wrap {
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--color-b6);
}

.hn-table {
    width: 1028px;
    color: var(--color-b2);
    font-weight: 400;
    font-size: 14px;
    text-align: left;
    border-collapse: collapse;
}

.hn-table td, th {
    padding-left: 24px;
}

.hn-table thead {
    background-color: var(--color-b7);
    opacity: .8;
    height: 48px;
    line-height: 48px;
    color: var(--color-b3);
}

.hn-table tbody tr {
    height: 48px;
    line-height: 48px;
}

.hn-table tbody tr:not(:last-child) {
    border-bottom: 1px solid var(--color-b6);
}

/* 浅色模式 */
[data-theme="light"] .table-wrap {
    border: 1px solid #E3E4E9;
}

[data-theme="light"] .hn-table thead {
    background-color: #E3E4E9;
}

[data-theme="light"] .hn-table tbody tr:not(:last-child) {
    border-bottom: 1px solid #E3E4E9;
}

/* radio 通用样式 */
.radio input[type="radio"] {
    position: absolute;
    opacity: 0;
}

.radio input[type="radio"] + .radio-label {
    color: var(--color-b1);
}

.radio input[type="radio"] + .radio-label:before {
    content: '';
    background: #f4f4f4;
    border-radius: 100%;
    border: 1px solid #b4b4b4;
    display: inline-block;
    width: 1.4em;
    height: 1.4em;
    position: relative;
    top: 0.1em;
    margin: 0 16px;
    vertical-align: top;
    cursor: pointer;
    text-align: center;
    -webkit-transition: all 250ms ease;
    transition: all 250ms ease;
}

.radio input[type="radio"]:checked + .radio-label:before {
    background-color: #D2003C;
    box-shadow: inset 0 0 0 4px #f4f4f4;
}

.radio input[type="radio"]:focus + .radio-label:before {
    outline: none;
    border-color: #D2003C;
}

.radio input[type="radio"]:disabled + .radio-label:before {
    box-shadow: inset 0 0 0 4px #f4f4f4;
    border-color: #b4b4b4;
    background: #b4b4b4;
}

.radio input[type="radio"] + .radio-label:empty:before {
    margin-right: 0;
}

.jconfirm.jconfirm-white .jconfirm-bg, .jconfirm.jconfirm-light .jconfirm-bg {
    opacity: .5 !important;
}

/* 滚动条样式 */
::-webkit-scrollbar {
    /*滚动条整体样式*/
    width: 4px;
}
::-webkit-scrollbar-thumb {
    /*滚动条里面小方块*/
    border-radius: 10px;
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    background: var(--color-b5);
}

::-webkit-scrollbar-track {
    /*滚动条里面轨道*/
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    background: transparent;
}

/* 弹出框全局样式 */
.jconfirm-title-c {
    text-align: center;
}

.jconfirm-title {
    color: var(--color-b1);
    font-family: 700;
    text-align: center !important;
}

.jconfirm-content {
    color: var(--color-b2);
    text-align: center;
}

.jconfirm-box {
    width: 348px;
}

.jconfirm .jconfirm-box {
    position: relative;
    background: #171D30 !important;
}

.jconfirm .jconfirm-box::before {
    content: url('/web/images/funds/alert-bg.png');
    position: absolute;
    top: 0;
    width: 100%;
    left: 0;
    z-index: -1;
}

.jconfirm .jconfirm-box {
    z-index: -2;
}

[data-theme="light"] .jconfirm .jconfirm-box {
    background: white !important;
}

.confirm-btn {
    background-color: #D2003C;
    height: 44px !important;
    border-radius: 22px !important;
    color: white;
    width: 132px;
}

.cancel-btn {
    background-color: var(--color-b6);
    height: 44px !important;
    border-radius: 22px !important;
    color: var(--color-a7);
    width: 132px;
}

.jconfirm-buttons {
    width: 100%;
    display: flex;
    justify-content: space-evenly;
}

/*列表无记录显示 空箱子图片  */
.empty-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 268px;
}
.empty-img {
    content: var(--empty-img);
}
.empty-wrap > div {
    color: var(--color-b4);
    font-size: 14px;
    margin-top: 12px;
}
/* 消息弹框  */
.ext {
    background: #FFF;
    box-shadow: rgba(0, 0, 0, 0.2) 0 1px 6px;
}
[data-theme="light"] .ext {
    background: #ffd2b2; /* 淡蓝：#bbd2ff 淡黄： #ffd2b2 灰色：#E3E4E9*/
    box-shadow: rgba(150, 250, 150, 0.2) 0 1px 6px;
}