:root {

  /**
  * 色彩计算
  */
  /* 浅色(低对比度色) */
  --color-dark: #FFFFFF;
  /* 深色(高对比度色) */
  --color-light: #000000;
  /* 白色 */
  --color-white: #FFFFFF;
  /* 黑色 */
  --color-black: #000000;
/**
 * Background Color
 */
/* 背景色 */
--color-background: #090307;
/* 基础背景色 */
--color-background-base: #111111;
--color-background-light: #333333;
/* 覆盖背景色 */
--color-background-overlay: #232324;
/**
 * Brand Color
 */
--color-primary: #0be035 /* 主题色 */;
--color-primary-light-2: color-mix(in srgb, var(--color-primary) 80%, var(--color-light));
--color-primary-dark-2: color-mix(in srgb, var(--color-primary) 80%, var(--color-dark));
--color-primary-light-3: color-mix(in srgb, var(--color-primary) 70%, var(--color-light));
--color-primary-dark-3: color-mix(in srgb, var(--color-primary) 70%, var(--color-dark));
--color-primary-light-4: color-mix(in srgb, var(--color-primary) 60%, var(--color-light));
--color-primary-dark-4: color-mix(in srgb, var(--color-primary) 60%, var(--color-dark));
--color-primary-light-5: color-mix(in srgb, var(--color-primary) 50%, var(--color-light));
--color-primary-dark-5: color-mix(in srgb, var(--color-primary) 50%, var(--color-dark));
--color-primary-light-6: color-mix(in srgb, var(--color-primary) 40%, var(--color-light));
--color-primary-dark-6: color-mix(in srgb, var(--color-primary) 40%, var(--color-dark));
--color-primary-light-7: color-mix(in srgb, var(--color-primary) 30%, var(--color-light));
--color-primary-dark-7: color-mix(in srgb, var(--color-primary) 30%, var(--color-dark));
--color-primary-light-8: color-mix(in srgb, var(--color-primary) 20%, var(--color-light));
--color-primary-dark-8: color-mix(in srgb, var(--color-primary) 20%, var(--color-dark));
--color-primary-light-9: color-mix(in srgb, var(--color-primary) 10%, var(--color-light));
--color-primary-dark-9: color-mix(in srgb, var(--color-primary) 10%, var(--color-dark));

--color-overlay: #007EFF /* 主题色 */;
--color-overlay-light-2: color-mix(in srgb, var(--color-overlay) 80%, var(--color-light));
--color-overlay-dark-2: color-mix(in srgb, var(--color-overlay) 80%, var(--color-dark));
--color-overlay-light-3: color-mix(in srgb, var(--color-overlay) 70%, var(--color-light));
--color-overlay-dark-3: color-mix(in srgb, var(--color-overlay) 70%, var(--color-dark));
--color-overlay-light-4: color-mix(in srgb, var(--color-overlay) 60%, var(--color-light));
--color-overlay-dark-4: color-mix(in srgb, var(--color-overlay) 60%, var(--color-dark));
--color-overlay-light-5: color-mix(in srgb, var(--color-overlay) 50%, var(--color-light));
--color-overlay-dark-5: color-mix(in srgb, var(--color-overlay) 50%, var(--color-dark));
--color-overlay-light-6: color-mix(in srgb, var(--color-overlay) 40%, var(--color-light));
--color-overlay-dark-6: color-mix(in srgb, var(--color-overlay) 40%, var(--color-dark));
--color-overlay-light-7: color-mix(in srgb, var(--color-overlay) 30%, var(--color-light));
--color-overlay-dark-7: color-mix(in srgb, var(--color-overlay) 30%, var(--color-dark));
--color-overlay-light-8: color-mix(in srgb, var(--color-overlay) 20%, var(--color-light));
--color-overlay-dark-8: color-mix(in srgb, var(--color-overlay) 20%, var(--color-dark));
--color-overlay-light-9: color-mix(in srgb, var(--color-overlay) 10%, var(--color-light));
--color-overlay-dark-9: color-mix(in srgb, var(--color-overlay) 10%, var(--color-dark));
/**
 * Functional Color
 */
--color-success: #09D0B2 /* 成功颜色 */;
--color-success-light-2: color-mix(in srgb, var(--color-success) 80%, var(--color-light));
--color-success-dark-2: color-mix(in srgb, var(--color-success) 80%, var(--color-dark));
--color-success-light-3: color-mix(in srgb, var(--color-success) 70%, var(--color-light));
--color-success-dark-3: color-mix(in srgb, var(--color-success) 70%, var(--color-dark));
--color-success-light-4: color-mix(in srgb, var(--color-success) 60%, var(--color-light));
--color-success-dark-4: color-mix(in srgb, var(--color-success) 60%, var(--color-dark));
--color-success-light-5: color-mix(in srgb, var(--color-success) 50%, var(--color-light));
--color-success-dark-5: color-mix(in srgb, var(--color-success) 50%, var(--color-dark));
--color-success-light-6: color-mix(in srgb, var(--color-success) 40%, var(--color-light));
--color-success-dark-6: color-mix(in srgb, var(--color-success) 40%, var(--color-dark));
--color-success-light-7: color-mix(in srgb, var(--color-success) 30%, var(--color-light));
--color-success-dark-7: color-mix(in srgb, var(--color-success) 30%, var(--color-dark));
--color-success-light-8: color-mix(in srgb, var(--color-success) 20%, var(--color-light));
--color-success-dark-8: color-mix(in srgb, var(--color-success) 20%, var(--color-dark));
--color-success-light-9: color-mix(in srgb, var(--color-success) 10%, var(--color-light));
--color-success-dark-9: color-mix(in srgb, var(--color-success) 10%, var(--color-dark));
--color-warning: #FF6900 /* 警告颜色 */;
--color-warning-light-2: color-mix(in srgb, var(--color-warning) 80%, var(--color-light));
--color-warning-dark-2: color-mix(in srgb, var(--color-warning) 80%, var(--color-dark));
--color-warning-light-3: color-mix(in srgb, var(--color-warning) 70%, var(--color-light));
--color-warning-dark-3: color-mix(in srgb, var(--color-warning) 70%, var(--color-dark));
--color-warning-light-4: color-mix(in srgb, var(--color-warning) 60%, var(--color-light));
--color-warning-dark-4: color-mix(in srgb, var(--color-warning) 60%, var(--color-dark));
--color-warning-light-5: color-mix(in srgb, var(--color-warning) 50%, var(--color-light));
--color-warning-dark-5: color-mix(in srgb, var(--color-warning) 50%, var(--color-dark));
--color-warning-light-6: color-mix(in srgb, var(--color-warning) 40%, var(--color-light));
--color-warning-dark-6: color-mix(in srgb, var(--color-warning) 40%, var(--color-dark));
--color-warning-light-7: color-mix(in srgb, var(--color-warning) 30%, var(--color-light));
--color-warning-dark-7: color-mix(in srgb, var(--color-warning) 30%, var(--color-dark));
--color-warning-light-8: color-mix(in srgb, var(--color-warning) 20%, var(--color-light));
--color-warning-dark-8: color-mix(in srgb, var(--color-warning) 20%, var(--color-dark));
--color-warning-light-9: color-mix(in srgb, var(--color-warning) 10%, var(--color-light));
--color-warning-dark-9: color-mix(in srgb, var(--color-warning) 10%, var(--color-dark));
--color-danger: #FF1312 /* 危险颜色 */;
--color-danger-light-2: color-mix(in srgb, var(--color-danger) 80%, var(--color-light));
--color-danger-dark-2: color-mix(in srgb, var(--color-danger) 80%, var(--color-dark));
--color-danger-light-3: color-mix(in srgb, var(--color-danger) 70%, var(--color-light));
--color-danger-dark-3: color-mix(in srgb, var(--color-danger) 70%, var(--color-dark));
--color-danger-light-4: color-mix(in srgb, var(--color-danger) 60%, var(--color-light));
--color-danger-dark-4: color-mix(in srgb, var(--color-danger) 60%, var(--color-dark));
--color-danger-light-5: color-mix(in srgb, var(--color-danger) 50%, var(--color-light));
--color-danger-dark-5: color-mix(in srgb, var(--color-danger) 50%, var(--color-dark));
--color-danger-light-6: color-mix(in srgb, var(--color-danger) 40%, var(--color-light));
--color-danger-dark-6: color-mix(in srgb, var(--color-danger) 40%, var(--color-dark));
--color-danger-light-7: color-mix(in srgb, var(--color-danger) 30%, var(--color-light));
--color-danger-dark-7: color-mix(in srgb, var(--color-danger) 30%, var(--color-dark));
--color-danger-light-8: color-mix(in srgb, var(--color-danger) 20%, var(--color-light));
--color-danger-dark-8: color-mix(in srgb, var(--color-danger) 20%, var(--color-dark));
--color-danger-light-9: color-mix(in srgb, var(--color-danger) 10%, var(--color-light));
--color-danger-dark-9: color-mix(in srgb, var(--color-danger) 10%, var(--color-dark));
--color-info: #373737 /* 信息颜色 */;
--color-info-light-2: color-mix(in srgb, var(--color-info) 80%, var(--color-light));
--color-info-dark-2: color-mix(in srgb, var(--color-info) 80%, var(--color-dark));
--color-info-light-3: color-mix(in srgb, var(--color-info) 70%, var(--color-light));
--color-info-dark-3: color-mix(in srgb, var(--color-info) 70%, var(--color-dark));
--color-info-light-4: color-mix(in srgb, var(--color-info) 60%, var(--color-light));
--color-info-dark-4: color-mix(in srgb, var(--color-info) 60%, var(--color-dark));
--color-info-light-5: color-mix(in srgb, var(--color-info) 50%, var(--color-light));
--color-info-dark-5: color-mix(in srgb, var(--color-info) 50%, var(--color-dark));
--color-info-light-6: color-mix(in srgb, var(--color-info) 40%, var(--color-light));
--color-info-dark-6: color-mix(in srgb, var(--color-info) 40%, var(--color-dark));
--color-info-light-7: color-mix(in srgb, var(--color-info) 30%, var(--color-light));
--color-info-dark-7: color-mix(in srgb, var(--color-info) 30%, var(--color-dark));
--color-info-light-8: color-mix(in srgb, var(--color-info) 20%, var(--color-light));
--color-info-dark-8: color-mix(in srgb, var(--color-info) 20%, var(--color-dark));
--color-info-light-9: color-mix(in srgb, var(--color-info) 10%, var(--color-light));
--color-info-dark-9: color-mix(in srgb, var(--color-info) 10%, var(--color-dark));
/**
 * Font Color
 */
--color-text-primary: #FFFFFF /* 文字颜色 */;
/* 常规文字颜色 */
--color-text-regular: #F1F1F1;
/* 次要文字颜色 */
--color-text-secondary: #B1B0B0;
/* 占位文字颜色 */
--color-text-placeholder: #8F8F8F;
/**
 * Border Color
 */
--color-border: #383839 /* 边框色 */;

/**
 * Custom Size
 */
--border-radius: 2px /* 边框圆角半径 */;
--border-size: 1px /* 边框圆角半径 */;
/* 字体大小 */
--font-size-small-extra: 12px;
--font-size-small: 14px;
--font-size: 16px;
--font-size-medium: 24px;
--font-size-large: 28px;
--font-size-large-extra: 30px;
/* 高度 */
--form-height-large: 40px;
--form-height: 32px;
--form-height-small: 24px;
--padding-base: 8px /* 内边距 */;
--margin-base: 15px /* 外边距Or间隔 */;
}

html {
	width: 100%;
	height: 100%;
}

body {
  font-family: sans-serif;
  font-size: var(--size-font, 16px);
  color: var(--color-text-regular, #000000);
  background-color: var(--color-background, #FFFFFF);
}

img.wp-smiley,img.emoji {
  display: inline !important;
  border: none !important;
  box-shadow: none !important;
  height: 1em !important;
  width: 1em !important;
  margin: 0 0.07em !important;
  vertical-align: -0.1em !important;
  background: none !important;
  padding: 0 !important;
}
span.form-error-message {
  color: var(--color-danger);
  display: none;
}


.match-full-data {
  margin-bottom: 15px;
  border-radius: 7.5px;
  background: var(--color-background-light);
  padding: 15px;
}

.match-full-data .competition-label {
  margin-bottom: 10px;
  font-size: 16px;
}

.match-full-mid {
  display: grid;
  grid-template-columns: calc(50% - 40px) 80px calc(50% - 40px);
  justify-items: center;
  text-align: center;
  align-items: center;
}

.match-full-mid .logo-box img {
  max-height: 80px;
  width: auto;
  margin-bottom: 10px;
  width: auto;
}

.team-label,.match-status-overview {
  color: var(--color-text-primary);
  font-weight: 500;
}

.status-side {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.score-overview-header {
  display: flex;
  justify-content: center;
  align-items: center;
}

.match-full-data .match-time,.match-full-data .match-score {
  font-size: 24px;
  padding: 3px 10px;
  background-color: var(--color-primary);
  border-radius: 5px;
}

.match-date {
  font-size: 20px;
}

.match-full-data .home-score,.match-full-data .away-score,.option-7 .home-score {
  font-size: 28px;
  background-color: #8080806e;
  height: 40px;
  width: 55px;
  display: inline-grid;
  border-radius: 8px;
  align-items: center;
  justify-content: center;
}

.score-overview-header .divide-score {
  padding-left: 2px;
  padding-right: 2px;
  font-weight: 700;
}

.status-time-text {
  font-size: 12px;
  text-transform: uppercase;
  font-weight: bold;
  border-radius: 4px;
  background: linear-gradient(139deg,#4c615b 0%,var(--color-primary));
  color: var(--color-text-primary);
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  line-height: 18px;
  text-transform: uppercase;
  padding: 4px 12px;
  width: max-content;
  margin-top: 15px;
}

.title_countdown_scl {
  margin-bottom: 15px;
  margin-top: 20px;
}

.player-container {
  background: var(--color-background-light);
  display: inline-block;
  width: 66.66%;
  position: relative;
}

.player {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  z-index: 1997;
}

.player #liveVideo,.player .overlay-match {
  position: relative;
  width: 100%;
  height: 100%;
  max-height: 690px;
}

/* .player .overlay-match {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  cursor: pointer;
  background: var(--color-background-light);
  z-index: 9;
}

.player .text-match {
  width: 150px;
  height: 150px;
  position: absolute;
  bottom: 0;
  right: 0;
  margin: auto;
  left: 0;
  top: 0;
  background: no-repeat center url("data:image/svg+xml;charset=utf8,%3Csvg aria-hidden='true' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' %3E%3Cpath fill='%23fff' d='M256,0C114.617,0,0,114.615,0,256s114.617,256,256,256s256-114.615,256-256S397.383,0,256,0z M344.48,269.57l-128,80  c-2.59,1.617-5.535,2.43-8.48,2.43c-2.668,0-5.34-0.664-7.758-2.008C195.156,347.172,192,341.82,192,336V176 c0-5.82,3.156-11.172,8.242-13.992c5.086-2.836,11.305-2.664,16.238,0.422l128,80c4.676,2.93,7.52,8.055,7.52,13.57 S349.156,266.641,344.48,269.57z' class=''%3E%3C/path%3E%3C/svg%3E")
} */

.author-list {
  padding: 5px 15px 0px;
}

.match-blv ul,.author-list ul {
  margin-left: 10px;
  list-style-type: none;
  padding-left: 0;
  margin-bottom: 0;
  display: flex;
  align-items: center;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
}

.match-blv ul li,.author-list ul li {
  list-style-type: none;
  padding-left: 0;
  display: flex;
  align-items: center;
  margin: 0;
  margin-left: 1.3em;
}

.author-list ul li span {
  cursor: pointer;
  display: block;
  width: 100%;
  height: 100%;
  padding: 3px 15px;
  color: var(--color-text-primary);
  font-weight: bold;
  background: var(--color-background-light);
  font-size: 14px;
  border-radius: 0px;
  line-height: 1.2em;
  display: grid;
  align-items: center;
  position: relative;
  z-index: 1;
}

.author-list ul li:hover,.author-list ul li span.active {
  background: var(--color-primary);
  color: var(--color-text-regular);
}

.float_right {
  float: right;
  width: 100%;
  padding-left: 20px;
}

.chat-feedback {
  list-style-type: none;
  flex-wrap: nowrap;
  display: flex;
  padding: 0;
  width: 100%;
  gap: 10px;
  justify-content: center;
  align-items: stretch;
}

.chat-feedback li {
  box-sizing: content-box;
  flex: 1 1 25%;
  padding: 5px 0;
  font-size: 12px;
  margin: 0 !important;
  text-transform: uppercase;
  display: inline-grid;
  align-items: center;
  border-bottom: 3px solid transparent;
  cursor: pointer;
  text-align: center;
  border-radius: 5px 6px 0 0;
}

.chat-feedback li:hover, .chat-feedback li.active {
  background-color: var(--color-background-light);
  color: var(--color-primary);
}


.main-chat #messages {
  list-style: none;
  overflow-y: auto;
  background-color: var(--color-background-light);
  border: 1px solid var(--color-background-light);
  border-radius: 10px;
  padding: 10px;
  height: 355px;
  margin-bottom: 12px !important;
}

.main-chat #messages li {
  margin-left: 0px !important;
  margin-bottom: 0px !important;
  animation: fadeIn 0.5s ease-in-out;
  display: flex;
  align-items: flex-start;
  padding: 8px;
  border-radius: 8px;
  background-color: var(--color-background-light);
}

.main-chat .message-container .comment {
  font-size: 14px;
  color: var(--color-text-primary);
  word-wrap: break-word;
  word-break: break-all;
}

.main-chat form#comment {
  display: flex;
  gap: 10px;
  margin-bottom: 0px !important;
}

.main-chat textarea#messageText {
  min-height: 40px;
  margin-bottom: 0px !important;
  flex: 1;
  resize: none;
  padding: 10px;
  border: 1px solid var(--color-border);
  background-color: var(--color-background-overlay);
  border-radius: 8px;
  height: 40px;
  font-size: 14px;
  box-shadow: inset 0 1px 5px var(--color-background-light);
  color: var(--color-text-primary);
  overflow: hidden;
}

.main-chat button[type="submit"] {
  padding: 10px;
  background-color: var(--color-primary);
  color: var(--color-text-primary);
  border: none;
  border-radius: 8px;
  cursor: pointer;
  font-size: 1em;
  transition: background-color 0.3s,transform 0.2s;
  margin-bottom: 0px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
}

#messages .nickname {
  font-weight: bold;
  font-size: 16px;
}

#messages .nickname.other {
  color: #007EFF;
}

.loader-container_scl {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 430px;
  width: 100%;
  position: relative;
  background: var(--color-background-light);
}

.loader-container_scl .dot {
  width: 20px;
  height: 20px;
  background-color: var(--color-primary);
  border-radius: 50%;
  margin: 0 5px;
  animation: bounce 1.1s ease infinite;
}

.loader-container_scl .dot:nth-child(1) {
  animation-delay: 0s;
}

.loader-container_scl .dot:nth-child(2) {
  animation-delay: 0.1s;
}

.loader-container_scl .dot:nth-child(3) {
  animation-delay: 0.2s;
}

.loader-container_scl .dot:nth-child(4) {
  animation-delay: 0.3s;
}

.loader-container_scl .dot:nth-child(5) {
  animation-delay: 0.4s;
}

@keyframes bounce {
  0%,20%,50%,80%,100% {
      transform: translateY(0);
  }

  40% {
      transform: translateY(-60px);
  }

  60% {
      transform: translateY(25px);
  }
}

#countdown_scl {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px;
  padding: 30px;
}

#countdown_scl .divide {
  height: fit-content;
  padding: 15px 0;
  font-size: 40px;
}

.countdown_scl_wrap:after {
  content: '';
  background: var(--color-background-base);
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  opacity: .4;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  border-radius: 5px;
}

#countdown_scl>* {
  text-align: center;
  color: var(--color-primary);
}

#countdown_scl>*>span {
  background: var(--color-background-overlay);
}

#countdown_scl>*>span:first-child {
  display: block;
  margin-bottom: 15px;
  margin-top: 10px;
}

#countdown_scl span:last-child {
  border-radius: 10px;
  padding: 15px;
  display: block;
  font-size: 40px;
  font-weight: bold;
  min-width: 100px;
}

#loginButton {
  margin-top: 5px;
  display: block;
  padding: 10px 20px;
  font-size: 16px;
  font-weight: bold;
  color: var(--color-text-primary);
  background-color: var(--color-background);
  border: 1px solid var(--color-primary);
  border-radius: 5px;
  cursor: pointer;
  transition: background-color 0.3s,transform 0.2s;
  width: 100%;
}

#loginModal, #registerModal {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  background-color: var(--color-background-overlay);
  padding: 50px;
  border-radius: 10px;
  box-shadow: 0 2px 10px var(--color-border);
  z-index: 1000;
  width: 500px;
  display: none;
}

.modal-content,.modal-dialog-centered {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.modal-content {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  background-clip: padding-box;
  background-color: var(--color-background-overlay);
  /* border: var(--border-size) solid var(--color-border); */
  border-radius: var(---border-radius);
  color: var(--color-text-primary);
  -ms-flex-direction: column;
  flex-direction: column;
  outline: 0;
  pointer-events: auto;
  position: relative;
  width: 100%;
}

.modal-content {
  padding: 10px 15px;
}

#loginModal .modal-content,#registerModal .modal-content {
  text-align: center;
}

#loginModal label, #registerModal label {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
  color: var(--color-text-primary);
  text-align: left;
}

#registerModal .required,#loginModal .required {
  color: var(--color-danger);
  margin-left: 4px;
}

#loginModal input,#registerModal input {
  width: calc(100% - 0px);
  padding: 8px;
  margin-bottom: 10px;
  border: var(--border-size) solid var(--color-border);
  border-radius: 5px;
  font-size: 14px;
}

#submitRegister,#backToLoginButton,#registerButton,#submitLogin {
  display: block;
  margin: 0px auto;
  padding: 10px 20px;
  font-size: 16px;
  font-weight: bold;
  color: var(--color-text-primary);
  background-color: var(--color-primary);
  border: 1px solid var(--color-primary);
  border-radius: 5px;
  cursor: pointer;
  transition: background-color 0.3s,transform 0.2s;
  width: 100%;
}

#submitRegister,#backToLoginButton,#registerButton,#submitLogin {
  height: 50px;
}

#registerModal .spinner,#loginModal .spinner {
  border: 2px solid var(--color-text-regular);
  border-top: 2px solid var(--color-overlay);
  border-radius: 50%;
  width: 16px;
  height: 16px;
  animation: spin 1s linear infinite;
  display: inline-block;
  vertical-align: middle;
  margin-left: 8px;
}

#backToLoginButton,#registerButton {
  background-color: var(--color-background-base);
  /* border: 1px solid var(--color-background-base); */
}

#submitRegister,#backToLoginButton,#registerButton,#submitLogin {
  height: 50px;
  line-height: 1;
}

#backToLoginButton,#registerButton {
  margin-top: 5px;
}

#submitLogin span,#submitRegister span {
  color: var(--color-text-primary);
}

#country_code {
  border-radius: 5px;
  margin-right: 10px;
  width: 80px;
  font-size: 16px;
  padding: 8px;
  margin-bottom: 10px;
  border: 1px solid var(--color-border);
  border-radius: 5px;
  font-size: 14px;
}

#loginModal input,#registerModal input {
  width: calc(100% - 0px);
  padding: 8px;
  margin-bottom: 10px;
  border: 1px solid var(--color-border);
  border-radius: 5px;
  font-size: 14px;
}

.owards {
  text-transform: uppercase !important;
  font-family: oswald,sans-serif !important;
  font-weight: 500 !important;
  margin-bottom: 5px;
}

ul.match_filter_wg,ul.match_filter {
  list-style-type: none;
  flex-wrap: nowrap;
  display: flex;
  padding: 5px 0;
}

.match-list-container ul.match_filter {
  display: grid;
  width: 800px;
  max-width: 100%;
  grid-template-columns: repeat(5,1fr);
  pointer-events: unset;
}

.match-list-widget .tab-data li,.match_filter li {
  margin-right: 5px;
  white-space: nowrap;
}

.match_filter_wg li,.tab-option-1 .match_filter li {
  padding: 10px;
  text-transform: uppercase;
  display: inline-flex;
  border-bottom: 3px solid transparent;
  cursor: pointer;
  justify-content: center;
  margin-left: 0;
}

.match_filter_wg li:hover,.match_filter_wg li.active,.tab-option-1 .match_filter li:hover,.tab-option-1 .match_filter li.active {
  border-bottom: 3px solid var(--color-primary);
  color: var(--color-primary);
}

.match-item {
  position: relative;
  margin-bottom: 10px;
  cursor: pointer;
}
.match-item-inner {
  border: 1px solid transparent;
  background: var(--color-background);
  border-radius: 7px;
  position: relative;
  overflow: hidden;
  z-index: 1;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.mirror-effect .match-big-container, .mirror-effect .match-item-inner {
  transition: 0.5s;
}
.match-item-inner::before {
  background-image: url(../images/bg-ball.png);
  background-position-x: 100%;
  background-size: cover;
  content: "";
  position: absolute;
  top: 0;
  right: -10%;
  width: 100%;
  max-width: 300px;
  height: 100%;
  opacity: 0.05;
  z-index: -1;
  transform: rotate(0deg);
  transition: transform 0.35s ease-in-out;
}
.mirror-effect .match-big-container::after, .mirror-effect .match-item-inner::after {
  background: linear-gradient(90deg, transparent, rgba(240, 248, 255, 0.32));
  position: absolute;
  width: 250px;
  transform: rotate(25deg);
  height: 600px;
  top: -80%;
  content: "";
  z-index: 5;
  left: -100%;
}

/* 头 */
.match-item-head {
  height: 50px;
}
.match-item-body, .match-item-head {
  padding: 10px;
}
.match-item__comp {
  z-index: 2;
  color: var(--color-primary);
}
.match-item__comp span {
  display: block;
  font-size: 12px;
  line-height: 16px;
}
.match-item__time span {
  color: var(--color-primary);
  text-align: center;
  font-family: "Proxima Nova", "Inter", sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  border-radius: 13px;
  padding: 3px 8px;
  background: linear-gradient(#1a1e23, #1a1e23) padding-box, linear-gradient(180deg, #1a1e23 0%, var(--color-primary) 100%) border-box;
  border: 1px solid transparent;
}
.match-item-body {
  flex: 1;
}

.match-team {
  display: flex;
  justify-content: center;
  width: 35%;
}
.match-team-inner * {
  text-align: center;
}
.logo-team-inner {
  min-height: 70px;
  min-width: 70px;
  position: relative;
  margin: auto;
  z-index: -1;
}
.logo-team-inner img {
  bottom: 0;
  font-family: "object-fit: cover;";
  height: 100%;
  left: 0;
  -o-object-fit: cover;
  object-fit: scale-down;
  -o-object-position: 50% 50%;
  object-position: 50% 50%;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
}
.name-team-inner span {
  font-size: 12px;
  color: var(--scl-text);
  font-weight: 700;
}
.match-overview {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.match-overview-inner {
  text-align: center;
}

.status-match, .match-score-scl, .match-running, .time-text {
  display: none;
}
.status-match.vs-match,.status-match.end-match {
  font-size: 30px;
  font-weight: 700;
  color: #fff;
  display:none;
}
.match-score-scl {
  background-color: var(--color-overlay);
  background-image: linear-gradient(141deg, var(--color-overlay-light-4) 0%, var(--color-overlay) 100%);
  padding: 3px 0px;
  font-size: 24px;
  line-height: 24px;
  border-radius: 3px;
  color: #fff;
}
.status-match+.match-score-scl {
  margin-top: 5px;
}
.match-item:not(.live) .status-match.vs-match{
  display: block;
}
.match-item.live .status-match-data,.match-item.live .match-score-scl {
  display: block;
}
.match-item.live .time-text {
  display: inline-block;
}
.match-view-inner {
  display: flex;
  align-items: center;
  margin-top: 5px;
}
.match-view-link {
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 700;
  border-radius: 4px;
  background-color: var(--color-primary);
  background-image: linear-gradient(139deg, var(--color-primary-dark-7) 0%, var(--color-primary) 100%);
  color: #fff;
  text-align: center;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  line-height: 18px;
  text-transform: uppercase;
  padding: 4px 12px;
  width: max-content;
}
.match-view-inner span {
  color: #fff;
}
.match-item-footer {
  padding: 0;
  background: var(--color-background);
  overflow: hidden;
  position: relative;
}
.match-footer-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 100%;
}
.match-item-footer .match-footer-container .view-box, .option-6 .match-item-footer .match-footer-container .count-blv {
  padding: 10px;
}
.footer-match--flag {
  background: var(--color-background-overlay);
  color: #ACACAC;
  font-family: 'Roboto';
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
  border-radius: 24px;
  padding: 6px 14px;
  gap: 10px;
  display: flex;
}
.footer-match--flag .footer-match__goal-score {
  gap: 6px;
}
.footer-match__goal-score span {
  color: var(--color-primary);
}
.blv-list {
  display: flex;
  grid-column-gap: 10px;
  position: absolute;
  top: 0px;
  z-index: 1;
  left: 180px;
  transition: 0.5s;
}
.blv-item-scl .dropdown-item {
  display: flex;
  width: fit-content;
  align-items: center;
  font-size: 12px;
  color: var(--color-primary);
  cursor: pointer;
  padding: 16px 36px;
  margin: 0 -20px;
  position: relative;
  overflow: hidden;
}
.blv-item-scl .dropdown-item:hover {
  background-color: var(--color-background-light);
  color: white;
}
.blv-item-scl .dropdown-item:hover::before {
  left: 0px;
  bottom: 0px;
}
.blv-item-scl .dropdown-item:hover::after {
  right: 0px;
  top: 0px;
}
.blv-item-scl .dropdown-item:hover::after,
.blv-item-scl .dropdown-item:hover::before {
  background-color: var(--color-background);
  content: "";
  height: 120px;
  transform: rotate(20deg);
  width: 20px;
  position: absolute;
  font-weight: bold;
  z-index: 1;
}
.match-flex {
  display: flex;
  justify-content: space-between;
}
.match_filter li span {
  position: relative;
}
.match_filter li span::after, .match_filter li span::after {
  content: attr(amount);
  color: var(--color-primary);
  left: calc(100% + 5px);
  min-width: 20px;
  min-height: 20px;
  display: block;
  position: absolute;
  top: 0;
  text-align: center;
}
.match_filter li span::after, .match_filter li span::after {
  font-size: 12px;
  background: var(--color-background);
  border-radius: 2px;
  width: fit-content;
  height: 18px;
  line-height: 1.2em;
  padding: 2px;
}

.no-match-list{
  min-height: 100px;
  text-align: center;
  margin-top: 20px;
}
@media screen and (max-width: 850px) {
  .player-container {
      width: 100%;
      margin-bottom: 15px;
  }
  .large-4.float_right{
      padding:0;
  }
  .countdown_scl_wrap{
      min-height:auto !important;
      height:300px;
      margin-bottom:10px;
  }
}
@media screen and (max-width: 768px) {
  .sm-time.sm-text {
      width: 100% !important;
  }
}
@media screen and (max-width: 680px) {
  #countdown_scl span:last-child{
      min-width: 100px;
  }
}
@media screen and (max-width: 600px) {
  .match_filter_wg li span::after, .match_filter li span {
      font-size:14px;
  }
}
@media screen and (max-width: 570px) {
  #countdown_scl span:last-child{
      min-width: 80px;
  }
  .player .text-match{
      width: 100px;
      height: 100px;
  }
  .match-full-mid .logo-box img{
      max-height: 45px;
  }

}
@media screen and (max-width: 480px) {
  #countdown_scl span:last-child{
      min-width: auto;
      padding: 5px;
  }
  .player .text-match{
      width: 50px;
      height: 50px;
  }
}
#messages .nickname{ font-weight: bold; font-size: 16px;}
#messages .nickname.other{color: var(--color-overlay);}
#footer .widget-title {
  color: var(--color-primary);
}
.ketqua-table .match-item-row {
  align-items: center;
  justify-content: center;
  padding: 5px 0;
  border-bottom: 0.5px solid rgb(97 91 90 / 26%);
  align-items: center;
}
.match-history-detail {
  display: grid;
  grid-template-columns: calc(50% - 40px) 80px calc(50% - 40px);
  align-items: center;
  align-content: center;
}
.match-item-row .sm-time, .match-item-row .match-history-detail {
  margin: 0;
}
.match-item-row .sm-time, .match-item-row .match-history-detail {
  margin: 0;
}
.match-history-detail .team-info:nth-child(1) {
  grid-template-columns: 1fr 30px;
  text-align: right;
}
.team-info .team-name {
  font-size: 12px;
  max-width: 100%;
  color: white;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
}
.team-info {
  display: grid;
  align-items: center;
  grid-column-gap: 5px;
}
.ketqua-table .team-logo {
  max-height: 28px;
  height: auto;
  width: 28px;
  max-width: 60px;
  margin: 0;
}
.ver-center {
  display: grid;
  align-items: center;
}
.ketqua-table .lv-score {
  background: var(--color-primary);
  padding: 2px 8px;
  border-radius: 3px;
  font-weight: 700;
  font-size: 14px;
  max-width: 60px;
  color: var(--color-text-primary);
  margin: 0 auto;
}
.text-center .is-divider, .text-center .is-star-rating, .text-center .star-rating, .text-center>div, .text-center>div>div {
  margin-left: 0px !important;
  margin-right: 0px !important;
}
.match-history-detail .team-info:nth-child(3) {
  grid-template-columns: 30px 1fr;
  text-align: left;
}
.match-history{margin-bottom: 20px;}
.ketqua-table .com-row {
  color: white;
  padding: 5px 5px;
  background-color: #2a3038;
}
.link-match {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  left: 0;
}
.match-item-head {
  height: 50px;
}
.match-item-body, .match-item-head {
  padding: 10px;
}
.match-flex {
  display: flex;
  justify-content: space-between;
}
.match-item__comp {
  z-index: 2;
  color: var(--color-text-primary);
}
.match-item__comp span {
  display: block;
  font-size: 12px;
  line-height: 16px;
}
.post-sidebar span.widget-title span{color:#fff !important;}
.post-sidebar ul li a ,#post-list .post-title a {color:var(--color-overlay) !important;}
.taxonomy-description{color:var(--color-primary);}
/* 翻页 */
.pagination {
  display:flex;
  justify-content:center;
  list-style-type:none;
  padding:0;
  margin:0;
  width:100%;
}
.pagination>li {
  margin: 0 !important;
}
.pagination>li>a {
  margin:0 4px;
  padding:8px 14px;
  min-height:38px;
  min-width:38px;
  border-radius:2px;
  text-align:center;
  transition:all 0.2s ease-in-out 0s;
  font-size:14px;
  line-height:20px;
  border:1px solid var(--color-overlay);
  color:var(--color-overlay);
}
.pagination li span {
  border-radius:2px;
}
.pagination > li > a:focus, .pagination > li > a:hover, .pagination > li > span:focus, .pagination > li > span:hover {
  background-color:var(--color-overlay-dark-4);
  color:var(--color-text-primary)!important;
  border:solid 1px var(--color-overlay-dark-4);
}
.pagination li.active a {
  background-color:var(--color-overlay-dark-4);
  color:var(--color-text-primary)!important;
  border:solid 1px var(--color-overlay-dark-4);
}


.sticky_header {background-color: var(--color-background);position: sticky;top: calc(var(--header-height, 0px) + var(--aside-height, 0px));box-shadow: 0px 6px 5px -5px var(--color-border);z-index: 1;}
.tabs {--tabs-height: 34px;}
.tabs {position: relative;width: 100%;box-sizing: content-box;padding: 12px 0;margin-bottom: 10px;overflow: hidden;height: var(--tabs-height);background-color: var(--color-background);cursor: ew-resize;}
.tabs>.tabs_wrapper {position: absolute;left: 0;width: fit-content;display: flex;height: var(--tabs-height);line-height: var(--tabs-height);transition: none;}
.tabs>.tabs_wrapper .tabs_item {background-color: var(--color-background-base);color: var(--color-text-primary);border-radius: var(--border-radius);padding: 0 var(--padding-base);white-space: nowrap;user-select: none;cursor: pointer;}
.tabs>.tabs_wrapper .tabs_item.is_active {background-color: var(--color-primary);color: var(--color-light);}
.tabs>.tabs_wrapper .tabs_item:not(:last-child) {margin-right: 10px;}
.date_group {width: 100%;height: fit-content;display: flex;align-items: center;background-color: var(--color-background-base);border-top-left-radius:  var(--border-radius);border-top-right-radius:  var(--border-radius);}
.date {position: relative;width: calc(100% - 120px);height: 60px;overflow: hidden;}
.date_prev,.date_next {color: var(--color-text-placeholder);fill: currentColor;font-size: 30px;margin: auto;user-select: none;cursor: pointer;}
.date_prev:hover,.date_next:hover {color: var(--color-text-secondary);fill: currentColor;}
.date>.date_wrapper {position: absolute;left: 0;bottom: 0;display: flex;justify-content: center;align-items: center;width: fit-content;min-width: 100%;height: 100%;transition: none;}
.date>.date_wrapper .date_item {width: 120px;height: calc(100% - 10px);display: flex;flex-direction: column;justify-content: center;align-items: center;flex-shrink: 0;padding: 0 10px;margin-left: auto;margin-right: auto;border-radius: var(--border-radius);text-align: center;user-select: none;cursor: pointer;}
.date>.date_wrapper .date_item.is_active {background-color: var(--color-primary-light-9);color: var(--color-primary);font-weight: bold;}
.date>.date_wrapper .date_item * {pointer-events: none;}
.list {width: 100%;height: fit-content;}
.list>.list_wrapper {width: calc(100% - 76px);padding: 0 38px;box-sizing: content-box;height: fit-content;background-color: var(--color-background-base);border-bottom-left-radius:  var(--border-radius);border-bottom-right-radius:  var(--border-radius);overflow: hidden;}
.list>.list_wrapper .list_item {width: 100%;height: 60px;box-sizing: border-box;padding: 10px 15px;display: block;font-size: 14px;content-visibility: auto;contain-intrinsic-size: auto 60px;position: relative;}
.list>.list_wrapper .list_item.is_top:before {content: "";display: block;height: 60px;position: absolute;inset: 1px 0px;background: linear-gradient(to right, var(--color-danger-light-8), var(--color-background-base) 75%);z-index: -1;}
.list>.list_wrapper .list_item:not(:last-child) {box-shadow: inset 0px -1px 0px 0px var(--color-border);}
.list>.list_wrapper .list_item>.info_left {position: absolute;top: 0;left: 0;height: 100%;width: calc(20% + 10px);display: flex;justify-content: flex-start;align-items: center;overflow: hidden;}
.list>.list_wrapper .list_item>.info_center {position: absolute;top: 0;left: 0;right: 0;height: 100%;width: calc(80% - 30px);margin-left: auto;margin-right: 10px;display: flex;justify-content: center;align-items: center;overflow: hidden;}
.list>.list_wrapper .list_item>.info_right {position: absolute;top: 0;right: 0;height: 100%;width: fit-content;display: flex;justify-content: flex-end;align-items: center;overflow: hidden;}
.list>.list_wrapper .list_item>.info_left>img {margin-right: 10px;}
.list>.list_wrapper .list_item>.info_left>.left_title {max-width: calc(100% - 85px);white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.list>.list_wrapper .list_item>.info_left>.left_time {max-width: 50px;margin-left: 10px;}
.list>.list_wrapper .list_item>.info_center>.team {display: flex;width: calc(50% - 120px);align-items: center;}
.list>.list_wrapper .list_item>.info_center>.team span {white-space: nowrap;max-width: calc(100% - 32px);overflow: hidden;text-overflow: ellipsis;font-weight: bold;}
.list>.list_wrapper .list_item>.info_center>.team.home {justify-content: flex-end;}
.list>.list_wrapper .list_item>.info_center>.team.away {justify-content: flex-start;}
.list>.list_wrapper .list_item>.info_center>.team.home span {margin-right: 4px;}
.list>.list_wrapper .list_item>.info_center>.team.away span {margin-left: 4px;}
.list>.list_wrapper .list_item>.info_center>.score {display: flex;width: 240px;flex-shrink: 0;justify-content: center;align-items: center;white-space: nowrap;}
.list>.list_wrapper .list_item>.info_center>.score span {padding: 0 5px;font-size: 18px;}
.list>.list_wrapper .list_item>.info_center>.score em {display: block;width: 100%;font-style: normal;color: var(--color-text-primary);font-size: 10px;}
.list>.list_wrapper .list_item>.info_center>.score .staute {display: block;text-align: center;font-size: 14px;width: 160px;overflow: hidden;text-overflow: ellipsis;}
.list>.list_wrapper .list_item>.info_right>.btn_info {width: fit-content;padding: 0 6px;width: 160px;height: 32px;border-radius: var(--border-radius);display: flex;justify-content: center;align-items: center;column-gap: 6px;}
.list>.list_wrapper .list_group {width: 100%;height: fit-content;}
.list>.list_wrapper .list_group .list_item:not(:last-child) {box-shadow: inset 0px -1px 0px 0px var(--color-border);}
.list>.list_wrapper:empty {position: relative;height: 240px;background-size: 180px;background-position: center top;background-repeat: no-repeat;}
.light-theme .list>.list_wrapper:empty {background-image: url('../images/empty0_light.svg');}
.dark-theme .list>.list_wrapper:empty {background-image: url('../images/empty0_dark.svg');}
.list>.list_wrapper:empty::before {display: block;position: absolute;left: 0;right: 0;bottom: 42px;content: "暂无赛事";text-align: center;font-size: 18px;color: var(--color-text-regular);font-weight: bold;}
.list>.list_wrapper:empty::after {display: block;position: absolute;left: 0;right: 0;bottom: 20px;content: "看看其他比赛吧";text-align: center;font-size: 12px;color: var(--color-text-placeholder);}
.list .more_load {line-height: 40px;height: 40px;padding: 10px 38px var(--padding-base);box-sizing: content-box;width: calc(100% - 76px);margin-top: calc(var(--border-radius) * -1);text-align: center;background-color: var(--color-background-base);border-bottom-left-radius: var(--border-radius);border-bottom-right-radius: var(--border-radius);cursor: pointer;}
.list .more_load>* {background-color: var(--color-background-light);}