@charset "utf-8";

/* 重置样式 */
body  { color: #333; }
input { color: #333; }
a { color: inherit; }
table a { color: #38f; }
input::-webkit-input-placeholder {
	color: #999;
}
input:-moz-placeholder {
	color: #999;
} 
input::-moz-placeholder {
	color: #999;
}
input:-ms-input-placeholder {
	color: #999;
}

/* 元素样式 */
.title { color: #333; }
.tip, .desc, .description { color:#666; }
.note { color: #999; }
.hot { color: #F40 }
.money, .total, .price { color: #ff5000; }
.num { #2e7ae5 }
.price_old { color: #666; text-decoration:line-through; }

/* ====== 公共样式 ====== */
/* 背景 */
.bg_white {background:#fff !important;color:#333;}
.bg_black {background:#333 !important;color:#fff;border-color:#333;}
.bg_light { background:#F9F9F9 !important; color:#666; border-color:#F5F5F5;}
.bg_dark {background:#666 !important;color:#fff;border-color:#666;}
.bg_grey,.bg_default {background:#999 !important;color:#fff;border-color:#999;}
.bg_red,.bg_warning {background: #FF0036 !important;color:#fff;border-color:#FF0036;}
.bg_yellow,.bg_danger {background:#fca216 !important;color:#fff;border-color:#fca216;}
.bg_green,.bg_success {background:#09BB07 !important;color:#fff;border-color:#09BB07;}
.bg_cyan,.bg_info {background:#00b2d2 !important;color:#fff;border-color:#00b2d2;}
.bg_blue,.bg_primary {background:#38f !important;color:#fff;border-color:#38f;}
.bg_purple {background: #7f39e8 !important; color:#fff;border-color:#7f39e8;}
.bg_no { background: none !important; }

/* 按钮 */
.button-hover { background-color: rgba(0,0,0,0.1); }

/* 字体颜色 */
.font_black {color:#333 !important;}
.font_dark, .font_default {color:#666 !important;}
.font_grey {color:#999 !important;}
.font_light {color:#ccc !important;}
.font_red, .font_warning {color:#f12f04 !important;}
.font_green, .font_success {color:#44b549 !important;}
.font_blue,.font_primary {color:#38f !important;}
.font_yellow,.font_danger {color:#ff9000 !important;}
.font_cyan,.font_info {color:#26d2ff !important;}

[class*=font_]:active { -webkit-filter: contrast(2) brightness(0.9); filter: contrast(2) brightness(0.9); }

/* 默认配置 */
.mask { background:rgba(0,0,0,0.3); }

/* 边框 */
.br_default { border-color:#666 !important; }
.br_warning { border-color:#f12f04 !important; }
.br_success { border-color:#44b549 !important; }
.br_primary { border-color:#38f !important; }
.br_danger { border-color:#ff9000 !important; }
.br_info { border-color:#26d2ff !important; }

/* 按钮 */
.btn_default-x { color:#666; border-color:#666; }
.btn_warning-x { color:#f12f04; border-color:#f12f04; }
.btn_success-x { color:#44b549; border-color:#44b549; }
.btn_primary-x { color:#38f; border-color:#38f; }
.btn_danger-x { color:#ff9000; border-color:#ff9000; }
.btn_info-x { color:#26d2ff; border-color:#26d2ff; }

.btn_default-x:active { color:#333; background-color:rgba(51, 51, 51, 0.1); }
.btn_warning-x:active { color:#f52d00; background-color:rgba(198, 10, 10, 0.1); }
.btn_success-x:active { color:#00c707; background-color:rgba(47, 152, 51, 0.1); }
.btn_primary-x:active { color:#247bff; background-color:rgba(51, 136, 255, 0.1); }
.btn_danger-x:active { color:#ff5000; background-color:rgba(255, 80, 0, 0.1); }
.btn_info-x:active { color:#0fbfff; background-color:rgba(21, 186, 248, 0.1); }

.btn_default {background-color:#666; color: #fff}
.btn_warning {background-color:#f12f04; color: #fff}
.btn_success {background-color:#44b549; color: #fff}
.btn_primary {background-color:#38f; color: #fff}
.btn_danger {background-color:#ff9000; color: #fff}
.btn_info {background-color:#26d2ff; color: #fff}

.btn_default:active { background-color:#333; color: #fff}
.btn_warning:active {background-color:#d10000; color: #fff}
.btn_success:active {background-color:#2F9833; color: #fff}
.btn_primary:active {background-color:#317EF3; color: #fff}
.btn_danger:active {background-color:#ff5000; color: #fff}
.btn_info:active {background-color:#15baf8; color: #fff}

.price { color: #ff9000 !important; font_weight: 600; }
.num { color: #38f; font_weight: 600; }

.linear_red,.linear_warning{ background-image: linear-gradient(135deg, #FF5A6A 0%, #f12f04 100%); color: #fff; }
.linear_yellow,.linear_danger { background-image: linear-gradient(135deg, rgb(252, 207, 49) 10%, rgb(245, 85, 85) 100%); color: #fff; }
.linear_green,.linear_success { background-image: linear-gradient(135deg, rgb(255, 247, 32) 10%, rgb(60, 213, 0) 100%); color: #fff; }
.linear_blue,.linear_info { background-image: linear-gradient(135deg, rgb(94, 252, 232) 10%, rgb(115, 110, 254) 100%);  color: #fff; }
.linear_purple { background-image: linear-gradient(135deg, #EE9AE5 10%, #5961F9 100%);  color: #fff; }

.linear_red-1 { background-image: linear-gradient(135deg, #fffddc 0%, #ff4c4c 20%, #fa2aa4 100%); color: #fff; }
.linear_red-2 { background-image: linear-gradient(135deg, #ffe7dc 0%, #ff7a4c 20%, #fa2a7d 100%); color: #fff; }
.linear_yellow-1 { background-image: linear-gradient(135deg, #ffe4dc 0%, #faa02a 20%, #ff4c5d 100%); color: #fff; }
.linear_yellow-2 { background-image: linear-gradient(135deg, #fffadc 0%, #faf32a 20%, #ff7f4c 100%); color: #fff; }
.linear_green-1 { background-image: linear-gradient(135deg, #dcf9ff 0%, #e8ff4c 20%, #2afac2 100%); color: #fff; }
.linear_green-2 { background-image: linear-gradient(135deg, #fff7dc 0%, #4cff6e 20%, #46c4fe 100%); color: #fff; }
.linear_blue-1 { background-image: linear-gradient(135deg, #dcfff9 0%, #2afadf 20%, #4c83ff 100%); color: #fff; }
.linear_blue-2 { background-image: linear-gradient(135deg, #dcffe0 0%, #2accfa 20%, #b14cff 100%); color: #fff; }
.linear_purple-1 { background-image: linear-gradient(135deg, #ffe8dc 0%, #ff4cb5 20%, #cc2afa 100%); color: #fff; }
.linear_purple-2 { background-image: linear-gradient(135deg, #ffe8dc 0%, #ec4cff 20%, #652afa 100%); color: #fff; }

/* 表格样式 */
.table_bordered {border:1px solid #dee2e6}
.table_bordered td,.table_bordered th {border:1px solid #dee2e6}
.table_bordered thead td,.table_bordered thead th {border-bottom-width:2px}
.table_striped tbody tr:nth-of-type(odd) {background-color:rgba(0,0,0,.05)}
.table-hover tbody tr:hover {background-color:rgba(0,0,0,.075)}

.table_primary,.table_primary>td,.table_primary>th {background-color:#38f; color: #fff;}
.table-hover .table_primary:hover {background-color:#9fcdff}
.table-hover .table_primary:hover>td,.table-hover .table_primary:hover>th {background-color:#9fcdff}

.table_success,.table_success>td,.table_success>th {background-color:#44b549; color: #fff;}
.table-hover .table_success:hover {background-color:#b1dfbb}
.table-hover .table_success:hover>td,.table-hover .table_success:hover>th {background-color:#b1dfbb}

.table_info,.table_info>td,.table_info>th {background-color:#26d2ff; color: #fff;}
.table-hover .table_info:hover {background-color:#abdde5}
.table-hover .table_info:hover>td,.table-hover .table_info:hover>th {background-color:#abdde5}

.table_warning,.table_warning>td,.table_warning>th {background-color:#f12f04; color: #fff;}
.table-hover .table_warning:hover {background-color:#ffe8a1}
.table-hover .table_warning:hover>td,.table-hover .table_warning:hover>th {background-color:#ffe8a1}

.table_danger,.table_danger>td,.table_danger>th {background-color:#ff9000; color: #fff;}
.table-hover .table_danger:hover {background-color:#f1b0b7}
.table-hover .table_danger:hover>td,.table-hover .table_danger:hover>th {background-color:#f1b0b7}

.table_light,.table_light>td,.table_light>th {background-color:#fdfdfe}
.table-hover .table_light:hover {background-color:#ececf6}
.table-hover .table_light:hover>td,.table-hover .table_light:hover>th {background-color:#ececf6}

.table_dark,.table_dark>td,.table_dark>th {background-color:#c6c8ca}
.table-hover .table_dark:hover {background-color:#b9bbbe}
.table-hover .table_dark:hover>td,.table-hover .table_dark:hover>th {background-color:#b9bbbe}

.table_active,.table_active>td,.table_active>th {background-color:rgba(0,0,0,.075)}
.table-hover .table_active:hover {background-color:rgba(0,0,0,.075)}
.table-hover .table_active:hover>td,.table-hover .table_active:hover>th {background-color:rgba(0,0,0,.075)}

.table_dark {color:#fff;background-color:#212529}
.table_dark td,.table_dark th,.table_dark thead th {border-color:#32383e}
.table_dark.table_bordered {border:0}
.table_dark.table_striped tbody tr:nth-of-type(odd) {background-color:rgba(255,255,255,.05)}
.table_dark.table-hover tbody tr:hover {background-color:rgba(255,255,255,.075)}
.table_dark.thead_dark th {color:#fff;background-color:#212529;border-color:#32383e}
.table_dark.thead_light th {color:#495057;background-color:#e9ecef;border-color:#dee2e6}

/* 反相（反转颜色） 可用于表格或按钮等 */
.inverted { filter: invert(100%); }

@keyframes wave_animation {
	0% {
		top: calc((100% - 0.25rem)/2);
		left: calc((100% - 0.25rem)/2);
		width: .25rem;
		height: .25rem;
		opacity: 0.25;
	}

	50% {
		top: calc((100% - 2rem)/2);
		left: calc((100% - 2rem)/2);
		width: 2rem;
		height: 2rem;
		opacity: 1;
	}

	100% {
		top: calc((100% - 6rem)/2);
		left: calc((100% - 6rem)/2);
		width: 6rem;
		height: 6rem;
		opacity: 0;
	}
}

.wave {
	position: relative;
	overflow: hidden;
}

.wave:active {
	-webkit-filter: saturate(1.5);
	filter: saturate(1.5);
}
.wave:focus:before {
	border-radius: 50%;
	background: rgba(0, 0, 0, .1);
	position: absolute;
	content: "";
	display: block;
	background-attachment: fixed;
	background-position: center center;
	z-index: 2;
	animation: wave_animation 1s forwards;
}

.wave:focus:after {
	border-radius: 50%;
	background: rgba(0, 0, 0, .1);
	position: absolute;
	content: "";
	display: block;
	z-index: 2;
	animation: wave_animation 1.5s forwards;
}