// 全局变量定义
$header-height: 44px; // 所有头部高度
$footer-bar-height: 54px; // footer bar高度
$u8-footer-bar-height: 87px; // u8 footer bar高度
$ls-footer-bar-height: 87px; // 联盛 footer bar高度
$space: 12px; // padding 或 margin 的距离
$space2: 12px; // header-left icon padding

// 主题变量映射
$primaryColor1: var(--main-text-color-1);
$primaryColor2: var(--main-text-color-2);
$primaryColor3: var(--main-text-color-3);
$main-bg-color: var(--main-bg-color);
$appFooterBg: var(--app-footer-bg);
$header-bg: var(--header-bg);

$home-header-height: 3.38rem; // 首页头部高度
$home-tabs-height: 4.52rem; // 首页tabs高度
$home-footer-height: 3.3rem; // footer bar高度
$details-header-height: 3.5rem; // 详情页面头部高度

// 伪PC变量
$fake-pc-width: 500px;

// 主题定义
[data-theme="light"] {
	--main-text-color-1: #4b64ac; // 蓝
	--main-text-color-2: #05081a; // 黑
	--main-text-color-3: #8c8d99; // 灰
	--main-bg-color: #fff; // 主体背景色
	--app-footer-bg: url("@/assets/images/public/light-main-bg.png") no-repeat top #fff; // 套壳子app底部处理
	--card-bg-color: #fff; // 卡片主体色
	--lobby-tab-bg: #f0f1f5;
	--header-bg: #fff;
	--header-amount-bg: #f6f7fa;
	--dynamic-dot: #32373d; // 动态点点
	--dynamic-dot2: rgba(43, 42, 42, 0.3); // 动态点点
	--home-title: linear-gradient(to right, #806652, #0e0e0e);
	--lucky-user-name: #cabaa5;
	--lucky-user-amount: #e5cb96;
	--lucky-user-bg1: $main-bg-color;
	--lucky-user-bg2: transparent;
	--home-title-svg: #a0a5ac;
	--tab-active: #000;
	--border-1px-color: #ededed;
	--back-top-bg: #fff;
	--foot-bar-bg: #fff;
	--foot-bar-text: #c29157;
	--foot-bar-middel-icon-bg: #ededed;
	--search-bg: #f6f7fa;
	--search-border: #dddddd;
	--casino-tab-active-bg: #f0f1f5;
	--casino-tab-bg: #fff;
	--casino-game-card-bg: #31343a;
	--casino-tab-bg2: #fff;
	--casino-tab-active-bg2: #e6e6e6;
	--casino-view-more: #f3f3f3;
	--bet-game-bg: #fff;
	--bet-game-amount-bg: #f4f4f4;
	--globe-setting: #fff;
	--bet-game-border-1px: #ebebec;
	--bet-game-border-1px-2: #ebebec;
	--bet-game-bg-top: #ededed;
	--bet-history-bg: #ededed;
	--more-menu-bg: #fff;
	--more-menu-active-bg: #ededed;
	--more-menu-border: #eceaea;
	--input-bg: #fff;
	--crypto-qr-code-bg: #fff;
	--payment-method-bg: #fff;
	--wallet-card-bg: #f6f7fb;
	--wallet-bar-svg: #616974;
	--wallet-bar-active-svg: #ad8e50;
	--wallet-container: #f6f7fa;
	--level-line-bg: #f4f4f8;
	--recycle-svg-color: #292929;
	--wallet-quick-amount-border: #e5cb96;
	--wallet-quick-amount-bg: linear-gradient(94.94deg, #e5cb96 0%, rgba(255, 213, 104, 0.2) 100%);
	--cancel-btn: #fff;
	--loading-mask-bg: rgba(193, 192, 192, 0.24);
	--quick-btn-bg: #f6f7fb;
	--border-1px-other: #fff;
	--userinfo-header-bg: #f6f7fb;
	--userinfo-other-bg: #fff;
	--statistics-bg: #f6f7fb;
	--control-tools: #fff;
	--filter-bg: #c3b46f;
	--vip-gift-instructions: #f6f7fb;
	--vip-gift-instructions-tab: #8f8e8e;
	--task-card-bg: #fff;
	--task-top-bg: #f6f7fb;
	--task-top-title: #000;
	--task-top-btn: #fff;
	--performance-inquiry-card: #fff;
	--share-link-bg: #fff;
	--acc-history-card: #fff;
	--acc-history-btn: #fff;
	--transfer-span: #fff;
	--transfer-span2: #fff;
	--share-link-content: #fff;
	--button-color2: #93823b;
	--button-color3: #fff;
	--security-card: #fff;
	--globe-service: #e5cb96;
	--globe-sercice-box: #272727;
	--drop-list-bg: #fff;
	--dialog-bg: #fff;
	--card-bg-2: #fff;
	--tips-1: #fff;
	--tips-text-1: #206a0b;
	--coding-details-des-bg: #fff;
	--coding-details-card-bg: #fff;
	--first-recharge-event-bg: #fff;
	--first-recharge-task-card-bg: #fff;
	--detailsHeaderSvg: #4b64ac;
	--detailsHeaderBtnBg: #fff;
	--detailsHeaderBtnBorder: 1px solid #ebebed;
	--calendar-background: #fff;
	--calendar-title-text: #000;
	--button-text-color: #fff;
	--van-calendar-range-edge-background: #4b64ac;
	--toast-bg: rgba(151, 146, 146, 0.62);
	--toast-text: #fff;
	--userColor40: #05081a; // 我的界面-退出界面其它页面也在用
	--userColorPop40: #05081a;
	--userColor23: #2f3244;
	--userColorPop23: #2f3244;
	--userColor22: #4b64ac;
	--userColor50: url("@/assets/images/activity/ac_leftBtn.png"), no-repeat;
	--userColor48: #fff;
	--button-disabled-filter: grayscale(0.7);
	--small-button-text-color: #4b64ac;

	//按钮背景色
	--so-button-bg: linear-gradient(90deg, #8294d8 0%, #c8d1f4 100%);
	//按钮右下角角标背景色
	--so-button-corner-bg: linear-gradient(90deg, #c5cff3 0%, #b0bded 100%);
	--header-color: #4b64ac;

	--text-color-base: #2f3244;
}

[data-theme="dark"] {
	--main-text-color-1: #efab4d; // 字体颜色1
	--main-text-color-2: #e5cb96; // 字体颜色2
	--main-text-color-3: #989188; // 字体颜色3
	--main-bg-color: #000; // 主体背景色
	--app-footer-bg: #282828; // 套壳子app底部处理
	--card-bg-color: #2e3035; // 卡片主体色
	--lobby-tab-bg: linear-gradient(270deg, #c29157 0%, #f7e9b8 100%);
	--header-bg: #1e1e1e;
	--header-amount-bg: #141414;
	--dynamic-dot: #f7e9b8; // 动态点点
	--dynamic-dot2: rgba(247, 233, 184, 0.3); // 动态点点
	--home-title: linear-gradient(to right, #fff8e0, #c9a368);
	--lucky-user-name: #cabaa5;
	--lucky-user-amount: #e5cb96;
	--lucky-user-bg1: linear-gradient(180deg, rgba(46, 48, 53, 0) 20%, #2e3035 100%);
	--lucky-user-bg2: linear-gradient(180deg, rgba(46, 48, 53, 0) 0%, #2e3035 100%);
	--home-title-svg: #e5cb96;
	--tab-active: #e5cb96;
	--border-1px-color: #3c3e45;
	--back-top-bg: #25272c;
	--foot-bar-bg: #383634;
	--foot-bar-text: #f7e9b8;
	--foot-bar-middel-icon-bg: #383634;
	--search-bg: #222223;
	--search-border: #3a3a3c;
	--casino-tab-active-bg: #3d3d3f;
	--casino-tab-bg: #1d1e22;
	--casino-game-card-bg: #31343a;
	--casino-tab-bg2: #1c1e22;
	--casino-tab-active-bg2: #31343a;
	--casino-view-more: #24262b;
	--bet-game-bg: #24262b;
	--bet-game-amount-bg: #2d3035;
	--globe-setting: #2d3035;
	--bet-game-border-1px: #3e3f42;
	--bet-game-border-1px-2: #3b3f46;
	--bet-game-bg-top: #3a352d;
	--bet-history-bg: #282b32;
	--more-menu-bg: #2e3035;
	--more-menu-active-bg: #3d4049;
	--more-menu-border: #43454a;
	--input-bg: #000;
	--crypto-qr-code-bg: #24262c;
	--payment-method-bg: #17181b;
	--wallet-card-bg: #1e2024;
	--wallet-bar-svg: #6a655e;
	--wallet-bar-active-svg: #fff8e0;
	--wallet-container: #31343c;
	--level-line-bg: #24262a;
	--recycle-svg-color: #fff8e0;
	--wallet-quick-amount-border: #3bc116;
	--wallet-quick-amount-bg: linear-gradient(95deg, #1ec116 0%, rgba(0, 0, 0, 0) 100%);
	--cancel-btn: #4e4c4c;
	--loading-mask-bg: rgba(0, 0, 0, 0.24);
	--quick-btn-bg: #30333a;
	--border-1px-other: #17181b;
	--userinfo-header-bg: #17181b;
	--userinfo-other-bg: #1c1d21;
	--statistics-bg: #1a1c1f;
	--control-tools: #26282e;
	--filter-bg: #433d32;
	--vip-gift-instructions: #24282b;
	--vip-gift-instructions-tab: #303030;
	--task-card-bg: #26282d;
	--task-top-bg: linear-gradient(180deg, #2c2348 0%, rgba(44, 35, 72, 0) 100%);
	--task-top-title: #9185ff;
	--task-top-btn: #31343c;
	--performance-inquiry-card: #26292d;
	--share-link-bg: #2a2d31;
	--acc-history-card: #1f1f1f;
	--acc-history-btn: #252529;
	--transfer-span: #453e32;
	--transfer-span2: #32453e;
	--share-link-content: linear-gradient(107deg, #1f3418 -8.38%, #17181b 54.8%);
	--button-color2: #3e4147;
	--button-color3: #2c2f34;
	--security-card: #373a3f;
	--globe-service: #151515;
	--globe-sercice-box: linear-gradient(270deg, #c29157 0%, #f7e9b8 100%);
	--drop-list-bg: #393b3f;
	--dialog-bg: #2b2c30;
	--card-bg-2: #26282c;
	--tips-1: #322f2a;
	--tips-text-1: #e5cb96;
	--coding-details-des-bg: #0f0f11;
	--coding-details-card-bg: #1e1e1e;
	--first-recharge-event-bg: #0f0f11;
	--first-recharge-task-card-bg: #24262b;
	--detailsHeaderSvg: #fff;
	--detailsHeaderBtnBg: #2a2929;
	--detailsHeaderBtnBorder: 0;
	--calendar-background: #282828;
	--calendar-title-text: #fff;
	--button-text-color: #141414;
	--van-calendar-range-edge-background: #efab4d;
	--toast-bg: #efab4d;
	--toast-text: #141414;
	--userColor40: #fff;
	--userColorPop40: #05081a;
	--userColor23: #fff;
	--userColorPop23: #2f3244;
	--userColor22: #efab4d;
	--userColor50: #fff4e5;
	--userColor48: #242424;
	--button-disabled-filter: grayscale(0.7);
	--small-button-text-color: #141414;
	//按钮背景色
	--so-button-bg: linear-gradient(90deg, #f0be67 0%, #e3ce81 100%);
	//按钮右下角角标背景色
	--so-button-corner-bg: linear-gradient(90deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.3) 100%);
	--header-color: #fff;

	--text-color-base: #2f3244;
}

[data-theme="red"] {
	--main-text-color-1: #fd232d; // 白
	--main-bg-color: #000; // 主体背景色
	--app-footer-bg: #000; // 套壳子app底部处理
	--detailsHeaderSvg: #fff;
	--userColor40: #fff;
	--userColorPop40: #05081a;
	--userColor23: #fff;
	--userColorPop23: #2f3244;
	--userColor22: linear-gradient(90.51deg, #e44035 0.85%, #da6b69 100%);
	--userColor50: #fae3e3;
	--userColor48: #05081a;
	--calendar-background: #282828;
	--calendar-title-text: #fff;
	--button-text-color: #fff;
	--van-calendar-range-edge-background: #fd232d;
	--toast-bg: rgba(255, 255, 255, 0.8);
	--toast-text: #fd232d;
	--button-disabled-filter: none;
	--small-button-text-color: #fff;
	--header-color: #fff;
	//按钮背景色
	--so-button-primary-bg: linear-gradient(91deg, #fc222e 0%, #ed757b 100%);
	//按钮右下角角标背景色
	--so-button-primary-corner-bg: linear-gradient(90deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.3) 100%);

	--text-color-base: #2f3244;
}

[data-theme="whiteGold"] {
	--main-text-color-1: #daab58; // 白
	--main-bg-color: #fff; // 主体背景色
	--app-footer-bg: #f6ddb9; // 套壳子app底部处理
	--detailsHeaderSvg: #2f3244;
	// --userColor40: #fff;
	--userColorPop40: #05081a;
	// --userColor23: #fff;
	--userColorPop23: #2f3244;
	--userColor22: linear-gradient(90.51deg, #ffb74d 0.85%, #fee29c 100%);
	--userColor50: #fae3e3;
	// --userColor48: #05081A;
	--calendar-background: #282828;
	--calendar-title-text: #fff;
	--button-text-color: #fff;
	--van-calendar-range-edge-background: #daab58;
	--toast-bg: rgba(0, 0, 0, 0.6);
	--toast-text: #fff;
	--button-disabled-filter: none;
	--small-button-text-color: #daab58;
	//按钮背景色
	--so-button-primary-bg: linear-gradient(91deg, #ffb74d 0%, #fee29c 100%);
	//按钮右下角角标背景色
	--so-button-primary-corner-bg: linear-gradient(90deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.3) 100%);
	--header-color: #2f3244;

	--text-color-base: #2f3244;
}

[data-theme="violet"] {
	--main-text-color-1: #7973fb; // 紫
	--main-text-color-2: #05081a; // 黑
	--main-text-color-3: #8c8d99; // 灰
	--main-bg-color: #fff; // 主体背景色
	--app-footer-bg: url("@/assets/images/public/light-main-bg.png") no-repeat top #fff; // 套壳子app底部处理
	--card-bg-color: #fff; // 卡片主体色
	--lobby-tab-bg: #f0f1f5;
	--header-bg: #fff;
	--header-amount-bg: #f6f7fa;
	--dynamic-dot: #32373d; // 动态点点
	--dynamic-dot2: rgba(43, 42, 42, 0.3); // 动态点点
	--home-title: linear-gradient(to right, #806652, #0e0e0e);
	--lucky-user-name: #cabaa5;
	--lucky-user-amount: #e5cb96;
	--lucky-user-bg1: $main-bg-color;
	--lucky-user-bg2: transparent;
	--home-title-svg: #a0a5ac;
	--tab-active: #000;
	--border-1px-color: #ededed;
	--back-top-bg: #fff;
	--foot-bar-bg: #fff;
	--foot-bar-text: #c29157;
	--foot-bar-middel-icon-bg: #ededed;
	--search-bg: #f6f7fa;
	--search-border: #dddddd;
	--casino-tab-active-bg: #f0f1f5;
	--casino-tab-bg: #fff;
	--casino-game-card-bg: #31343a;
	--casino-tab-bg2: #fff;
	--casino-tab-active-bg2: #e6e6e6;
	--casino-view-more: #f3f3f3;
	--bet-game-bg: #fff;
	--bet-game-amount-bg: #f4f4f4;
	--globe-setting: #fff;
	--bet-game-border-1px: #ebebec;
	--bet-game-border-1px-2: #ebebec;
	--bet-game-bg-top: #ededed;
	--bet-history-bg: #ededed;
	--more-menu-bg: #fff;
	--more-menu-active-bg: #ededed;
	--more-menu-border: #eceaea;
	--input-bg: #fff;
	--crypto-qr-code-bg: #fff;
	--payment-method-bg: #fff;
	--wallet-card-bg: #f6f7fb;
	--wallet-bar-svg: #616974;
	--wallet-bar-active-svg: #ad8e50;
	--wallet-container: #f6f7fa;
	--level-line-bg: #f4f4f8;
	--recycle-svg-color: #292929;
	--wallet-quick-amount-border: #e5cb96;
	--wallet-quick-amount-bg: linear-gradient(94.94deg, #e5cb96 0%, rgba(255, 213, 104, 0.2) 100%);
	--cancel-btn: #fff;
	--loading-mask-bg: rgba(193, 192, 192, 0.24);
	--quick-btn-bg: #f6f7fb;
	--border-1px-other: #fff;
	--userinfo-header-bg: #f6f7fb;
	--userinfo-other-bg: #fff;
	--statistics-bg: #f6f7fb;
	--control-tools: #fff;
	--filter-bg: #c3b46f;
	--vip-gift-instructions: #f6f7fb;
	--vip-gift-instructions-tab: #8f8e8e;
	--task-card-bg: #fff;
	--task-top-bg: #f6f7fb;
	--task-top-title: #000;
	--task-top-btn: #fff;
	--performance-inquiry-card: #fff;
	--share-link-bg: #fff;
	--acc-history-card: #fff;
	--acc-history-btn: #fff;
	--transfer-span: #fff;
	--transfer-span2: #fff;
	--share-link-content: #fff;
	--button-color2: #93823b;
	--button-color3: #fff;
	--security-card: #fff;
	--globe-service: #e5cb96;
	--globe-sercice-box: #272727;
	--drop-list-bg: #fff;
	--dialog-bg: #fff;
	--card-bg-2: #fff;
	--tips-1: #fff;
	--tips-text-1: #206a0b;
	--coding-details-des-bg: #fff;
	--coding-details-card-bg: #fff;
	--first-recharge-event-bg: #fff;
	--first-recharge-task-card-bg: #fff;
	--detailsHeaderSvg: #7973fb;
	--detailsHeaderBtnBg: #fff;
	--detailsHeaderBtnBorder: 1px solid #ebebed;
	--calendar-background: #fff;
	--calendar-title-text: #000;
	--button-text-color: #fff;
	--van-calendar-range-edge-background: #7973fb;
	--toast-bg: rgba(151, 146, 146, 0.62);
	--toast-text: #fff;
	--userColor40: #05081a; // 我的界面-退出界面其它页面也在用
	--userColorPop40: #05081a;
	--userColor23: #2f3244;
	--userColorPop23: #2f3244;
	--userColor22: #7973fb;
	--userColor50: url("@/assets/images/activity/ac_leftBtn.png"), no-repeat;
	--userColor48: #fff;
	--button-disabled-filter: grayscale(0.7);
	--small-button-text-color: #7973fb;

	//按钮背景色
	--so-button-bg: linear-gradient(90deg, #8294d8 0%, #c8d1f4 100%);
	//按钮右下角角标背景色
	--so-button-corner-bg: linear-gradient(90deg, #c5cff3 0%, #b0bded 100%);
	--header-color: #504bac;

	--text-color-base: #2f3244;
}
