@charset "utf-8";body{background-color:var(--base-2);color:var(--contrast);}a{color:var(--accent);}a{text-decoration:underline;}.entry-title a, .site-branding a, a.button, .wp-block-button__link, .main-navigation a{text-decoration:none;}a:hover, a:focus, a:active{color:var(--contrast);}.grid-container{max-width:1320px;}.wp-block-group__inner-container{max-width:1320px;margin-left:auto;margin-right:auto;}.dropdown-click .main-navigation ul ul{display:none;visibility:hidden;}.dropdown-click .main-navigation ul ul ul.toggled-on{left:0;top:auto;position:relative;box-shadow:none;border-bottom:1px solid rgba(0,0,0,0.05);}.dropdown-click .main-navigation ul ul li:last-child > ul.toggled-on{border-bottom:0;}.dropdown-click .main-navigation ul.toggled-on, .dropdown-click .main-navigation ul li.sfHover > ul.toggled-on{display:block;left:auto;right:auto;opacity:1;visibility:visible;pointer-events:auto;height:auto;overflow:visible;float:none;}.dropdown-click .main-navigation.sub-menu-left .sub-menu.toggled-on, .dropdown-click .main-navigation.sub-menu-left ul li.sfHover > ul.toggled-on{right:0;}.dropdown-click nav ul ul ul{background-color:transparent;}.dropdown-click .widget-area .main-navigation ul ul{top:auto;position:absolute;float:none;width:100%;left:-99999px;}.dropdown-click .widget-area .main-navigation ul ul.toggled-on{position:relative;left:0;right:0;}.dropdown-click .widget-area.sidebar .main-navigation ul li.sfHover ul, .dropdown-click .widget-area.sidebar .main-navigation ul li:hover ul{right:0;left:0;}.dropdown-click .sfHover > a > .dropdown-menu-toggle > .gp-icon svg{transform:rotate(180deg);}:root{--contrast:#222222;--contrast-2:#575760;--contrast-3:#b2b2be;--base:#f0f0f0;--base-2:#f7f8f9;--base-3:#ffffff;--accent:#1e73be;}:root .has-contrast-color{color:var(--contrast);}:root .has-contrast-background-color{background-color:var(--contrast);}:root .has-contrast-2-color{color:var(--contrast-2);}:root .has-contrast-2-background-color{background-color:var(--contrast-2);}:root .has-contrast-3-color{color:var(--contrast-3);}:root .has-contrast-3-background-color{background-color:var(--contrast-3);}:root .has-base-color{color:var(--base);}:root .has-base-background-color{background-color:var(--base);}:root .has-base-2-color{color:var(--base-2);}:root .has-base-2-background-color{background-color:var(--base-2);}:root .has-base-3-color{color:var(--base-3);}:root .has-base-3-background-color{background-color:var(--base-3);}:root .has-accent-color{color:var(--accent);}:root .has-accent-background-color{background-color:var(--accent);}.top-bar{background-color:#636363;color:#ffffff;}.top-bar a{color:#ffffff;}.top-bar a:hover{color:#303030;}.site-header{background-color:var(--base-3);}.main-title a,.main-title a:hover{color:var(--contrast);}.site-description{color:var(--contrast-2);}.mobile-menu-control-wrapper .menu-toggle,.mobile-menu-control-wrapper .menu-toggle:hover,.mobile-menu-control-wrapper .menu-toggle:focus,.has-inline-mobile-toggle #site-navigation.toggled{background-color:rgba(0, 0, 0, 0.02);}.main-navigation,.main-navigation ul ul{background-color:var(--base-3);}.main-navigation .main-nav ul li a, .main-navigation .menu-toggle, .main-navigation .menu-bar-items{color:var(--contrast);}.main-navigation .main-nav ul li:not([class*="current-menu-"]):hover > a, .main-navigation .main-nav ul li:not([class*="current-menu-"]):focus > a, .main-navigation .main-nav ul li.sfHover:not([class*="current-menu-"]) > a, .main-navigation .menu-bar-item:hover > a, .main-navigation .menu-bar-item.sfHover > a{color:var(--accent);}button.menu-toggle:hover,button.menu-toggle:focus{color:var(--contrast);}.main-navigation .main-nav ul li[class*="current-menu-"] > a{color:var(--accent);}.navigation-search input[type="search"],.navigation-search input[type="search"]:active, .navigation-search input[type="search"]:focus, .main-navigation .main-nav ul li.search-item.active > a, .main-navigation .menu-bar-items .search-item.active > a{color:var(--accent);}.main-navigation ul ul{background-color:var(--base);}.separate-containers .inside-article, .separate-containers .comments-area, .separate-containers .page-header, .one-container .container, .separate-containers .paging-navigation, .inside-page-header{background-color:var(--base-3);}.entry-title a{color:var(--contrast);}.entry-title a:hover{color:var(--contrast-2);}.entry-meta{color:var(--contrast-2);}.sidebar .widget{background-color:var(--base-3);}.footer-widgets{background-color:var(--base-3);}.site-info{background-color:var(--base-3);}input[type="text"],input[type="email"],input[type="url"],input[type="password"],input[type="search"],input[type="tel"],input[type="number"],textarea,select{color:var(--contrast);background-color:var(--base-2);border-color:var(--base);}input[type="text"]:focus,input[type="email"]:focus,input[type="url"]:focus,input[type="password"]:focus,input[type="search"]:focus,input[type="tel"]:focus,input[type="number"]:focus,textarea:focus,select:focus{color:var(--contrast);background-color:var(--base-2);border-color:var(--contrast-3);}button,html input[type="button"],input[type="reset"],input[type="submit"],a.button,a.wp-block-button__link:not(.has-background){color:#ffffff;background-color:#55555e;}button:hover,html input[type="button"]:hover,input[type="reset"]:hover,input[type="submit"]:hover,a.button:hover,button:focus,html input[type="button"]:focus,input[type="reset"]:focus,input[type="submit"]:focus,a.button:focus,a.wp-block-button__link:not(.has-background):active,a.wp-block-button__link:not(.has-background):focus,a.wp-block-button__link:not(.has-background):hover{color:#ffffff;background-color:#3f4047;}a.generate-back-to-top{background-color:rgba( 0,0,0,0.4 );color:#ffffff;}a.generate-back-to-top:hover,a.generate-back-to-top:focus{background-color:rgba( 0,0,0,0.6 );color:#ffffff;}:root{--gp-search-modal-bg-color:var(--base-3);--gp-search-modal-text-color:var(--contrast);--gp-search-modal-overlay-bg-color:rgba(0,0,0,0.2);}@media (max-width: 768px){.main-navigation .menu-bar-item:hover > a, .main-navigation .menu-bar-item.sfHover > a{background:none;color:var(--contrast);}}.nav-below-header .main-navigation .inside-navigation.grid-container, .nav-above-header .main-navigation .inside-navigation.grid-container{padding:0px 20px 0px 20px;}.site-main .wp-block-group__inner-container{padding:40px;}.separate-containers .paging-navigation{padding-top:20px;padding-bottom:20px;}.entry-content .alignwide, body:not(.no-sidebar) .entry-content .alignfull{margin-left:-40px;width:calc(100% + 80px);max-width:calc(100% + 80px);}.rtl .menu-item-has-children .dropdown-menu-toggle{padding-left:20px;}.rtl .main-navigation .main-nav ul li.menu-item-has-children > a{padding-right:20px;}@media (max-width:768px){.separate-containers .inside-article, .separate-containers .comments-area, .separate-containers .page-header, .separate-containers .paging-navigation, .one-container .site-content, .inside-page-header{padding:30px;}.site-main .wp-block-group__inner-container{padding:30px;}.inside-top-bar{padding-right:30px;padding-left:30px;}.inside-header{padding-right:30px;padding-left:30px;}.widget-area .widget{padding-top:30px;padding-right:30px;padding-bottom:30px;padding-left:30px;}.footer-widgets-container{padding-top:30px;padding-right:30px;padding-bottom:30px;padding-left:30px;}.inside-site-info{padding-right:30px;padding-left:30px;}.entry-content .alignwide, body:not(.no-sidebar) .entry-content .alignfull{margin-left:-30px;width:calc(100% + 60px);max-width:calc(100% + 60px);}.one-container .site-main .paging-navigation{margin-bottom:20px;}}/* End cached CSS */.is-right-sidebar{width:30%;}.is-left-sidebar{width:30%;}.site-content .content-area{width:100%;}@media (max-width: 768px){.main-navigation .menu-toggle,.sidebar-nav-mobile:not(#sticky-placeholder){display:block;}.main-navigation ul,.gen-sidebar-nav,.main-navigation:not(.slideout-navigation):not(.toggled) .main-nav > ul,.has-inline-mobile-toggle #site-navigation .inside-navigation > *:not(.navigation-search):not(.main-nav){display:none;}.nav-align-right .inside-navigation,.nav-align-center .inside-navigation{justify-content:space-between;}.has-inline-mobile-toggle .mobile-menu-control-wrapper{display:flex;flex-wrap:wrap;}.has-inline-mobile-toggle .inside-header{flex-direction:row;text-align:left;flex-wrap:wrap;}.has-inline-mobile-toggle .header-widget,.has-inline-mobile-toggle #site-navigation{flex-basis:100%;}.nav-float-left .has-inline-mobile-toggle #site-navigation{order:10;}}
.dynamic-author-image-rounded{border-radius:100%;}.dynamic-featured-image, .dynamic-author-image{vertical-align:middle;}.one-container.blog .dynamic-content-template:not(:last-child), .one-container.archive .dynamic-content-template:not(:last-child){padding-bottom:0px;}.dynamic-entry-excerpt > p:last-child{margin-bottom:0px;}
.main-navigation .main-nav ul li a,.menu-toggle,.main-navigation .menu-bar-item > a{transition: line-height 300ms ease}.sticky-enabled .gen-sidebar-nav.is_stuck .main-navigation {margin-bottom: 0px;}.sticky-enabled .gen-sidebar-nav.is_stuck {z-index: 500;}.sticky-enabled .main-navigation.is_stuck {box-shadow: 0 2px 2px -2px rgba(0, 0, 0, .2);}.navigation-stick:not(.gen-sidebar-nav) {left: 0;right: 0;width: 100% !important;}.both-sticky-menu .main-navigation:not(#mobile-header).toggled .main-nav > ul,.mobile-sticky-menu .main-navigation:not(#mobile-header).toggled .main-nav > ul,.mobile-header-sticky #mobile-header.toggled .main-nav > ul {position: absolute;left: 0;right: 0;z-index: 999;}.nav-float-right .navigation-stick {width: 100% !important;left: 0;}.nav-float-right .navigation-stick .navigation-branding {margin-right: auto;}.main-navigation.has-sticky-branding:not(.grid-container) .inside-navigation:not(.grid-container) .navigation-branding{margin-left: 10px;}.main-navigation.navigation-stick.has-sticky-branding .inside-navigation.grid-container{padding-left:40px;padding-right:40px;}@media (max-width:768px){.main-navigation.navigation-stick.has-sticky-branding .inside-navigation.grid-container{padding-left:0;padding-right:0;}}
@media all{/*
Theme Name:   GeneratePress Child
Theme URI:    https://generatepress.com
Description:  Default GeneratePress child theme
Author:       Tom Usborne
Author URI:   https://tomusborne.com
Template:     generatepress
Version:      0.1
*/
/*---------------------------*/
/*---------------------------*/
body {
  font-family: 'Lexend Deca', 'Segoe UI', Roboto, Arial, sans-serif;
}
:root {
  --text-color-light: #fff;
  --text-color-dark: #222;
  --primary-bg: #fff;
  --blue-color: #007bff;
  --red-color: #e74c3c;
}

/* gacha link */
.grecaptcha-badge {
  display: none !important;
}
.container-page {
  max-width: 1380px;
  margin: 0 auto;
}
body.dark-mode {
  --text-color-light: #222;
  --text-color-dark: #fff;
  --primary-bg: #0d1117;
}
/* page redirect */
body.page-redirect {
  background: #181a1d;
}
.redirect-pa.container.text-center {
  margin: 0 auto;
  text-align: center;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  max-width: 850px;
}
.redirect-pa a.custom-logo-link img {
  max-width: 250px;
  width: 250px !important;
  object-fit: cover;
}
.box_redirect {
  margin-top: 15px;
  padding: 30px 60px;
  border-radius: 12px;
  background: #242629;
}
.box_redirect h2 {
  font-size: 18px;
  font-weight: bold;
  color: #eee;
  margin-bottom: 0;
  padding-bottom: 5px;
  font-weight: 500;
}
.box_redirect p {
  color: #ccc;
  font-size: 12px;
  padding-bottom: 0;
  margin-bottom: 5px;
}
.box_redirect a.btn.btn-primary.btn-lg.mb-4 {
  margin-bottom: 10px !important;
  background: #2a2e33 !important;
  border: 2px red solid;
  color: #eee;
  font-size: 14px;
  border-radius: 4px;
  padding: 8px 20px;
  cursor: pointer;
}
.box_redirect a.btn.btn-primary.btn-lg.mb-4:hover {
  background: #3d424a !important;
  color: #eee !important;
}
.box_redirect a.btn_link {
  font-size: 12px;
  color: #a3a3a3;
  text-decoration: none;
}
.box_redirect a.btn_link:hover {
  color: #fff !important;
}
.ft-page p.mt-3 {
  font-size: 9px;
  color: #ccc;
  opacity: 0.1;
  text-align: center;
}
.link-redirect {
  margin: 18px;
}
/* end page redirect */
body.dark-mode .modal-body,
body.dark-mode .sc__rating label,
body.dark-mode p.text-center.mt-2.w-100.d-block,
body.dark-mode p.mx-auto.text-center {
  color: #111;
}
.game-right-sidebar h3.widget-title {
  color: var(--secondary-color) !important;
}

/* Cài đặt màu chữ cho chế độ Dark Mode */
html.dark-mode,
body.dark-mode {
  background: #111212 !important;
  color: #ffffff !important;
}

body.dark-mode button#menu-open {
  color: #fff;
}
/* Đặt màu chữ cho các liên kết */
body.dark-mode .featured-content p,
body.dark-mode .game-show .game-excerpt,
body.dark-mode .game-list a,
body.dark-mode .featured-game .game-title a,
body.dark-mode .featured-game a.btn-view,
body.dark-mode .game-tags a,
body.dark-mode .all-games a,
body.dark-mode .text-muted,
body.dark-mode .footer-widgets a,
body.dark-mode .footer-widgets p,
body.dark-mode .header-navigation a,
body.dark-mode .marquee-content a,
body.dark-mode .game-item-new .game-title a:hover,
body.dark-mode .list-group h5:hover,
body.dark-mode .blog-game .post-title a:hover,
body.dark-mode .mdsco-about-content,
body.dark-mode .taxonomy-content,
body.dark-mode .bg-page h2,
body.dark-mode .bg-page p,
body.dark-mode .main-blog .post-info:hover .post-title,
body.dark-mode .main-blog .post-info .post-title a:hover {
  color: #e5e7eb !important; /* Màu liên kết */
}

/* Đặt màu cho SVG */
body.dark-mode .all-games svg {
  fill: #e5e7eb !important; /* Màu nền SVG */
}

/* Đặt màu chữ khi hover */
body.dark-mode a:hover,
body.dark-mode .game-item-new .game-title a,
body.dark-mode .blog-game .post-title a,
body.dark-mode .tab-update h5,
body.dark-mode .list-group h5,
body.dark-mode .featured-game .game-title a:hover,
body.dark-mode .detail .game-tags a,
body.dark-mode .main-blog .post-info .post-title,
body.dark-mode .main-blog .post-info .post-title a {
  color: var(--secondary-color) !important; /* Màu liên kết hover */
}

/* Đặt màu cho nút khi hover */
body.dark-mode .btn-row .btn:hover {
  border-color: #101215;
  color: #fff !important;
}

/* Đặt nền phụ cho các thành phần */
body.dark-mode .tab-update,
body.dark-mode .list-group-item,
body.dark-mode .header-navigation ul li:hover .sub-menu,
body.dark-mode .bg-page,
body.dark-mode .inside-article,
body.dark-mode .spoiler-content,
body.dark-mode .sidebar .widget {
  background: #111212 !important; /* Màu nền phụ */
}

/* Đặt đường viền cho danh sách */
body.dark-mode .list-group > a.list-group-item {
  border-top: 1px solid #30363d; /* Đường viền */
}

body.dark-mode .scoll-icon img {
  filter: brightness(0) invert(1);
}

/* Đặt màu chữ cho tiêu đề */
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6 {
  color: #f1f1f1 !important; /* Màu trắng sáng cho tiêu đề */
}

/* Đặt màu chữ nổi bật cho số đếm */
body.dark-mode .topbar-comments-user .count,
body.dark-mode .topbar-notify-user .count {
  color: #ffcc00; /* Màu vàng nổi bật */
}

/* Đặt nền cho các thành phần cụ thể */
body.dark-mode .new-box .featured-game,
body.dark-mode .game-show .game-item {
  background-color: #02050a; /* Nền phụ */
}

/* Đặt màu cho nút */
body.dark-mode .new-box .btn-view {
  background-color: #000000;
  border: 1px solid #fff;
}

/* Đặt màu cho nút khi hover */
body.dark-mode .new-box .btn-view:hover {
  background-color: #183d6d; /* Màu nền nút hover */
}

body.dark-mode .fade-overlay {
  height: 0px;
  background: linear-gradient(
    to bottom,
    rgb(255 255 255 / 0%) 0%,
    #000000 100%
  );
}
body.dark-mode .footer-widgets,
body.dark-mode .site-info {
  background-color: unset !important;
}
/* Toggle switch container */
.dark-mode-toggle .toggle-switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 30px;
}

/* Hide the default checkbox */
.dark-mode-toggle .toggle-switch input {
  display: none;
}

/* The slider */
.dark-mode-toggle .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #b7bbbdb3;
  transition: 0.4s;
  border-radius: 30px;
}

/* Circle inside the slider */
.dark-mode-toggle .slider::before {
  position: absolute;
  content: "";
  height: 24px;
  width: 24px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  transition: 0.4s;
  border-radius: 50%;
}

/* Sun and Moon icons */
.dark-mode-toggle .icon {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 16px;
  transition: 0.4s;
}

.dark-mode-toggle .sun {
  left: 6px;
  opacity: 1;
  transition: opacity 0.4s;
}

.dark-mode-toggle .moon {
  right: 6px;
  opacity: 0;
  transition: opacity 0.4s;
}

/* When checkbox is checked */
.dark-mode-toggle input:checked + .slider {
  background-color: #333;
}

.dark-mode-toggle input:checked + .slider::before {
  transform: translateX(30px);
}

.dark-mode-toggle input:checked + .slider .sun {
  opacity: 0;
}

.dark-mode-toggle input:checked + .slider .moon {
  opacity: 1;
}
.top-user.dark-mode-toggle {
  width: 60px;
}
body.dark-mode .top-bar a {
  color: #ffffff;
}
body.dark-mode .notify-description a {
  text-decoration: none;
  color: var(--secondary-color);
}
body.dark-mode .notify-description a:hover {
  color: #303030;
}
.header-logo h1 {
  margin-bottom: 0rem;
}
.mdsco-page-404 {
  text-align: center;
  padding: 100px 0px;
}
.no-results {
  padding: 40px 0px;
}
.btn-load-um {
  margin-top: 25px;
}
/* Container chính */
.container {
  max-width: 1320px;
  margin: 0 auto;
}

/* Lưới hiển thị game */
.grid-container {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

/* Mỗi item trong lưới */
.grid-item {
  flex: 0 0 calc(25% - 20px); /* 4 item mỗi hàng */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  overflow: hidden;
  text-align: center;
}

/* Ảnh đại diện */
.game-thumbnail {
  height: 200px;
  background-color: #f0f0f0;
}

.game-thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Tiêu đề */
.entry-title-list {
  margin: 10px 0;
  font-size: 1.25em;
}

/* Phân trang */
.pagination {
  display: flex;
  justify-content: center;
  margin-top: 20px;
  list-style: none;
  padding: 0;
}

.pagination a,
.pagination span {
  color: #333;
  background-color: #f8f8f8;
  border: 1px solid #ddd;
  padding: 8px 12px;
  margin: 0 5px;
  text-decoration: none;
  font-size: 1rem;
  border-radius: 4px;
  transition: all 0.3s ease;
}

.pagination a:hover {
  background-color: #0073aa;
  color: #fff;
  border-color: #0073aa;
}

.pagination .current {
  background-color: #0073aa;
  color: #fff;
  border-color: #0073aa;
}

/* Căn chỉnh ảnh đại diện */
.post-thumbnail img {
  max-width: 100%;
  height: auto;
}

/* Tiêu đề */
.entry-title {
  font-size: 2em;
  margin-bottom: 20px;
}

/* Danh mục và thẻ */
.game-category,
.game-tags {
  font-size: 1em;
  margin-bottom: 15px;
}
.game-category a,
.game-tags a {
  color: #0073aa;
  text-decoration: none;
}

/*---------------------------*/
/*---------------------------*/

/* CSS author */
.table-info a {
  text-decoration: none;
}
li.wl_guide {
  padding-top: 5px;
}
.site-footer .social-icons.follow-icons a {
  display: flex;
  align-items: center;
}
.site-footer .social-icons.follow-icons {
  display: flex;
  gap: 10px;
  justify-content: flex-start;
  margin-top: 5px;
}
.footer-widget-3 .widget {
  margin-bottom: 10px;
}
.mdsco-info .um-clear a {
  display: flex;
  align-items: center;
  font-size: 14px;
  text-decoration: none;
}
.game-tags svg.bi.bi-book {
  margin-right: 5px;
  color: var(--primary-color);
  font-weight: bold;
}
.game-tags li {
  list-style: none;
  font-size: 14px;
}
.mdsco-about-content .um-clear {
  display: none;
}
.mdsco-about-content.content__lessmore.show_more .um-clear {
  padding-bottom: 20px;
}
.top-bar-tt a {
  color: var(--secondary-color);
  text-decoration: none;
  text-transform: uppercase;
}
/* CSS cho Game Download Row */
.game-download-row {
  display: flex;
  align-items: center;
  padding: 12px;
  border: 1px solid #e3e3e3;
  background-color: #fefefe;
  margin-bottom: 16px;
  transition: box-shadow 0.3s ease;
}

.game-download-row:hover {
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
}

/* CSS cho các cột */
.download-column {
  flex: 1; /* Mỗi cột chiếm cùng một phần không gian */
  display: flex;
  align-items: center;
  justify-content: center; /* Căn giữa nội dung trong mỗi cột */
}

/* CSS cho OS và Version */
.game-download-row .download-os,
.game-download-row .download-version {
  font-size: 14px;
  color: #555;
  /* 	background-color: #fff; */
  padding: 6px 14px;
  border-radius: 20px;
  /* 	border: 1px solid #ddd; */
  display: block;
  width: 100%;
  min-width: 140px;
  align-items: center;
  gap: 8px;
}

.download-version::before {
  content: "\1F4D7"; /* Icon cho Version */
  font-size: 16px;
  color: #f39c12;
}
.mdsco-download-game .mdsco-download-content {
  border-radius: 12px;
  overflow: hidden;
}
/* CSS cho Download Links */
.download-links {
  display: flex; /* Chuyển sang flexbox cho các nút */
  gap: 10px; /* Khoảng cách giữa các nút */
  justify-content: center; /* Căn giữa các nút trong cột Download */
}

.download-links .download-button {
  display: inline-block;
  padding: 8px 14px;
  background-color: #0073e6;
  color: #fff;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  border-radius: 4px;
  transition: background-color 0.3s, transform 0.2s;
  box-shadow: 0px 2px 5px rgba(0, 115, 230, 0.3);
  min-width: 80px; /* Đảm bảo các nút có chiều rộng tối thiểu */
}

.download-links .download-button:hover {
  background-color: #005bb5;
  transform: translateY(-2px);
  box-shadow: 0px 4px 10px rgba(0, 115, 230, 0.2);
}

/* Nút cuối cùng không có khoảng cách bên phải */
.download-links .download-button:last-child {
  margin-right: 0;
}

.search-results-list img {
  border-radius: 0.5rem;
}
/* CSS breadcrumb*/
.mdsco-breadcrumb {
  padding-top: 10px;
}
.mdsco-breadcrumb a {
  font-size: 14.4px;
  text-decoration: none;
}
.mdsco-breadcrumb .last a {
  color: var(--pirmary-color) !important;
}
.mdsco-breadcrumb span.last {
  font-size: 14.4px;
  color: var(--pirmary-color) !important;
}
/* End CSS breadcrumb*/

.separate-containers .comments-area {
  padding: 0px;
}
/* CSS single post */
.single-image img {
  width: 100%;
  border-radius: 0.5rem;
}
.single-image {
  margin-bottom: 15px;
}
.single-game .mdsco-blog-game h2 {
  font-size: 16px !important;
}
.single-game .mdsco-blog-game p,
.content-post {
  font-size: 14px;
}

/* CSS Button Error */
.btn-error svg.bi.bi-exclamation-triangle {
  margin-right: 5px;
}
button.btn-error {
  color: #fff;
  background-color: #f0ad4e;
  border-color: #eea236;
  display: flex;
  margin-top: 10px;
  cursor: pointer;
  border: 1px solid transparent;
  white-space: nowrap;
  padding: 6px 12px;
  font-size: 14px;
  border-radius: 4px;
  -ms-user-select: none;
  user-select: none;
  align-items: center;
}
button.btn-error:hover {
  color: #fff;
  background-color: #ec971f;
  border-color: #d58512;
}

.error-link-form textarea.wpcf7-form-control.wpcf7-textarea {
  margin-top: 10px;
  border: 1px solid #ccc;
  width: 100% !important;
  border-radius: 5px;
  padding: 5px 15px;
  font-size: 15px;
  color: #354052;
}
.error-link-form input.wpcf7-form-control.wpcf7-submit.has-spinner {
  padding: 0 10px;
  border: none;
  border-radius: 5px;
  line-height: 35px;
  color: #fff;
  font-size: 13px;
  min-width: 50px;
  cursor: pointer;
  background-color: #f18121;
  font-weight: 600;
}
.error-link-form p {
  margin-bottom: 10px;
}
.error-link-form label {
  font-weight: bold;
}
.error-link-form .modal-content {
  top: 100px;
}
.detail-form {
  display: none;
}
.error-link-form span.sub-des {
  font-weight: 400;
  color: red;
}
/* Thiết lập vòng tròn với 100% chiều rộng và chiều cao */
.c100 {
  position: relative;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  margin: 0;
  background-color: #484e54;
}

/* Vòng tròn bên trong */
.c100:after {
  position: absolute;
  top: 8px;
  left: 8px;
  display: block;
  content: " ";
  border-radius: 50%;
  background-color: #232930;
  width: 164px;
  height: 164px;
  transition: all 0.2s ease-in;
}

/* Hiển thị điểm */
.c100 .txt-rating {
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  width: 180px;
  height: 180px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  flex-direction: column;
}

/* Phần số điểm */
.c100 .txt-rating span.number-rating {
  font-size: 60px;
  font-weight: 600;
  color: #fff;
  line-height: 60px;
}

/* Phần title của điểm */
.c100 .txt-rating span.title-rating {
  font-size: 20px;
  color: #fff;
}

/* Phần bar của vòng tròn */
.c100 .bar,
.c100 .fill {
  position: absolute;
  border: 8px solid #ff0000;
  width: 180px;
  height: 180px;
  clip: rect(0, 90px, 180px, 0);
  border-radius: 50%;
  transform: rotate(0);
}

/* Phần bar ban đầu */
.c100 .bar {
  transform: rotate(180deg); /* Cái này giúp vòng tròn đầy 100% */
}

/* Phần fill ban đầu */
.c100 .fill {
  transform: rotate(180deg); /* Cái này giúp phần fill đầy 100% */
}

/* Phần fill sẽ được cập nhật trong JS */
.c100 .fill {
  transition: transform 0.5s ease;
}

/* CSS single Video */
.perfmatters-lazy-youtube {
  position: relative;
  width: 100%; /* Đặt chiều rộng bằng 100% để video chiếm toàn bộ chiều rộng của container */
  height: 0;
  padding-bottom: 59.23%; /* Tỷ lệ khung hình 16:9 (480px/360px = 1.3333, 1/1.3333 = 0.75 -> 75%) */
  overflow: hidden;
  background-color: #000; /* Màu nền để làm nổi bật video */
}

/* Đảm bảo iframe chiếm toàn bộ diện tích của container */
.perfmatters-lazy-youtube iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
/* End CSS single Video */

.hidden-content {
  display: none; /* Nội dung ban đầu ẩn đi */
}

.mdsco-load-more {
  background-color: #4caf50;
  color: white;
  padding: 10px;
  border: none;
  cursor: pointer;
  margin-top: 10px;
}

.mdsco-load-more:hover {
  background-color: #45a049;
}

/* CSS single thông tin game */
.mdsco-info-game {
  padding-bottom: 10px;
}
h3.mdsco-title {
  margin-bottom: 0;
  font-size: 15px;
}
.spoiler-content {
  padding: 10px;
  background-color: #f0f0f0;
  border: 1px solid #ddd;
  margin-top: 10px;
  font-size: 14px;
  display: none; /* Hidden by default */
}

.mdsco-load_more {
  background-color: #293139;
  color: var(--secondary-color);
  padding: 10px;
  border: none;
  cursor: pointer;
  font-size: 14px;
  margin-top: 10px;
}

.mdsco-load_more:hover {
  background-color: var(--secondary-color);
}

/* Begin CSS Footer */
.footer-widgets,
.site-info {
  background-color: unset !important;
}

.inside-footer-widgets a {
  color: var(--primary-color);
  font-size: 1rem; /* 16px by default */
  font-weight: 600;
  text-decoration: none;
}
.inside-footer-widgets ul li {
  list-style-type: disc;
  margin-bottom: 0.2em;
}
.inside-footer-widgets ul {
  padding-left: 30px;
}
.widget-title {
  font-size: 1.25rem; /* 20px */
  color: var(--primary-color);
  font-weight: bold;
  margin-bottom: 10px;
}
.inside-footer-widgets p {
  font-size: 1rem; /* 16px */
  color: var(--primary-color);
}
.footer-widgets-container.grid-container {
  border-top: 3px solid var(--footer-border);
}
.footer-widgets-container {
  padding: 30px 0;
}
/* End CSS Footer */

/* Begin CSS Slider */
/* Định dạng chung cho slider */
.slider {
  position: relative;
  overflow: unset;
  width: 100%;
}

/* Wrapper của slider */
.game-slider-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

/* Các slide trong slider */
.game-slider {
  display: flex;
  transition: transform 0.5s ease;
  max-width: 1200px;
  margin: 0 auto;
}

/* Mỗi slide */
.slide {
  min-width: 100%;
  display: none; /* Mặc định không hiển thị các slide */
}

/* Hiển thị slide active */
.slide.active {
  display: block;
}

/* Đảm bảo ảnh trong slider có cùng kích thước, width full, height cố định và tỷ lệ 16:9 */
.slider-image {
  width: 100%;
  height: 550px;
  object-fit: cover;
  aspect-ratio: 16/9;
}

/* Các chỉ báo carousel */
.carousel-indicators {
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  padding: 0;
  margin: 0;
  list-style-type: none;
}

.carousel-indicators li {
  box-sizing: content-box;
  flex: 0 1 auto;
  width: 40px;
  height: 3px;
  padding: 0;
  margin-right: 3px;
  margin-left: 3px;
  text-indent: -999px;
  cursor: pointer;
  background-color: #fff;
  background-clip: padding-box;
  border: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  opacity: 0.5;
  transition: opacity 0.6s ease;
}

.carousel-indicators .active {
  background-color: #fff;
}

/* Nút điều hướng slider */
.slider-prev,
.slider-next {
  position: absolute;
  top: 50%;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  transform: translateY(-50%);
  background-color: #fff;
  color: var(--secondary-color);
  border: none;
  padding: 0px;
  font-size: 24px;
  cursor: pointer;
  z-index: 10;
  transition: background-color 0.3s;
  box-shadow: 0 3px 5px 0 rgb(49 49 49);
}

.slider-prev {
  left: -20px;
}

.slider-next {
  right: -20px;
}

.slider-prev:hover,
.slider-next:hover {
  background-color: var(--secondary-color);
}

/* .game-slider-wrapper::before {
content: '';
position: absolute;
right: 0;
bottom: 0px;
left: 0;
background: linear-gradient(85.19deg, #ff2a64 -133.27%, #ffaf48 105.93%);
height: 3px;
} */
/* End CSS Slider */

/* Begin CSS block 6 game */
.block-game {
  display: none;
}
/* End CSS block 6 game */

/* Begin CSS game Hot */
.title__wrapper {
  display: grid;
  grid-template-columns: 30px auto 1fr;
  align-items: center;
  margin-top: 1.5rem;
}
.title-game {
  margin: 0 10px;
}
.line--left {
  background-color: #293139;
  width: 100%;
  height: 3px;
}
h3.title-game {
  padding: 0px 20px;
  margin: 0;
  background: unset;
  text-transform: uppercase;
  font-size: 22.4px;
  font-weight: bold;
}
.title-game span {
  color: var(--secondary-color);
}
.game-hot:before {
  display: none !important;
}
/* Bố cục tổng */
.new-box {
  /* display: flex;
	flex-wrap: wrap;
	gap: 20px; */
  margin-top: 20px;
}

/* Phần bên trái - bài viết nổi bật */
.new-box .featured-game {
  border: 1px solid transparent;
  border-radius: 8px;
  background-color: #fff;
  box-shadow: 0 6px 40px rgba(0, 0, 0, 0.05);
}
.new-box .featured-img,
.game-thumbnail-new,
.post-thumbnail-new,
.tabup-img,
.thumbnail,
.single-image {
  position: relative;
  overflow: hidden; /* Đảm bảo hiệu ứng không vượt khỏi phần tử chính */
}

.new-box .featured-img::before,
.game-thumbnail-new::before,
.post-thumbnail-new::before,
.tabup-img:before,
.thumbnail::before,
.single-image::before {
  content: "";
  position: absolute;
  top: 0;
  left: -120%; /* Bắt đầu ngoài khung nhìn */
  z-index: 9999;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    to right,
    rgba(255, 255, 255, 0) 0,
    rgba(255, 255, 255, 0.3) 100%
  );
  transform: skewX(-25deg);
  animation: none; /* Mặc định không chạy */
}

.new-box .featured-img:hover::before,
.game-thumbnail-new:hover::before,
.post-thumbnail-new:hover::before,
.tabup-img:hover::before,
.thumbnail:hover::before,
.single-image:hover::before {
  animation: slide 0.6s ease-in-out forwards; /* Chỉ chạy khi hover */
}

/* Keyframes cho hiệu ứng */
@keyframes slide {
  0% {
    left: -120%;
  }
  100% {
    left: 120%; /* Trượt hoàn toàn sang phải */
  }
}

.new-box .featured-img img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.new-box .featured-content {
  padding: 15px;
}
.featured-content h2 {
  font-size: 17px;
  color: var(--primary-color);
  font-weight: bold;
}
.featured-content p {
  font-size: 16px;
  color: var(--primary-color);
}
.featured-content a {
  font-size: 13px;
  color: var(--primary-color);
  text-transform: uppercase;
  font-weight: bold;
}
.new-box .btn-view {
  display: inline-block;
  padding: 5px 20px;
  background-color: #fff;
  text-decoration: none;
  border-radius: 5px;
  border: 1px var(--primary-color) solid;
}

/* Phần bên phải - danh sách bài viết */
.game-list {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.game-show {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: scroll;
  overflow-x: hidden;
  outline: 0;
}
.game-show .game-item {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 10px;
  padding: 10px;
  cursor: pointer;
  background-color: #fff;
  border-radius: 0.5rem;
  border: 1px solid transparent;
}

.game-show .game-thumbnail img {
  width: 100px;
  height: 56px;
  object-fit: cover;
  border-radius: 5px;
}
.game-show a {
  color: var(--primary-color);
  text-decoration: none;
  font-weight: bold;
}
.game-show .game-title {
  font-size: 16px;
  margin: 0;
}
.game-show .game-excerpt {
  font-size: 14px;
  color: var(--primary-color);
  margin-top: 5px;
}
.game-show .game-thumbnail {
  height: auto;
  background-color: unset;
}
.game-show::-webkit-scrollbar {
  display: none;
}
.game-show .game-info p {
  width: 500px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-bottom: 0;
}
.game-thumbnail-new img {
  width: 100%;
  height: 60px;
  object-fit: cover;
}
/* End CSS game Hot */

/* Begin CSS game New */
.title__wrapper.title__all {
  grid-template-columns: 30px auto 1fr auto;
}
.all-games span {
  padding: 0 5px;
  font-size: 14px;
  font-weight: bold;
}
.all-games {
  padding-left: 20px;
}
.all-games svg {
  fill: var(--primary-color);
  width: 1.3rem;
  height: 1.3rem;
}
.all-games a {
  text-decoration: none;
  color: var(--primary-color);
}
.game-new .line--left {
  background-color: red;
}
.game-new .game-thumbnail-new,
.game-thumbnail-hot {
  height: auto;
  background-color: #f0f0f0;
  border-radius: 0.5rem;
}
.game-thumbnail-new img,
.post-thumbnail-new img {
  width: 100%;
  height: 170px;
  object-fit: cover;
}
.game-new-grid .game-tags {
  font-size: 0.8rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  min-height: 2.5rem;
  margin-bottom: 0.3rem;
}
.game-new-grid h3.game-title,
.btn-row .btn,
.game-show .game-title {
  overflow: hidden;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  margin-top: 0px;
  margin-bottom: 0px;
}
.game-new-grid .game-item {
  padding: 15px 0px;
}
.game-title a {
  font-size: 16px;
  text-decoration: none;
  color: var(--primary-color);
  font-weight: 600;
}
.game-info-btn .btn-row a {
  display: block;
  width: 100%;
  text-align: center;
  margin-bottom: 10px;
}
.game-info-btn .btn-row a:focus {
  color: #fff;
}

.game-info-btn .btn-row {
  display: flex;
  gap: 10px;
}
.btn-row .btn {
  background-color: #293139;
  border-color: #101215;
  font-size: 12px;
  border-radius: 0.3rem;
  font-weight: 600;
  text-transform: uppercase;
  cursor: pointer;
}
.btn-row .btn:hover {
  background-color: var(--secondary-color);
  border-color: var(--secondary-color);
}
svg.bi.bi-star-fill {
  fill: #f5c518;
}
.btn-row .btn-secondary {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.game-item-new {
  padding-top: 0 !important;
  margin-top: 15px;
  position: relative;
}
.game-item-new .mdsco-tt {
  position: absolute;
  top: 10px;
  left: 0;
  width: 100%;
}
.game-info-left {
  display: inline-block;
  width: auto;
}
.game-info-right {
  position: absolute;
  width: auto;
  display: inline-block;
  top: 0;
  right: 0;
  width: auto;
  padding: 5px 8px;
}
span.label-new {
  width: 100%;
  line-height: 16px;
  font-size: 16px;
  color: yellow;
  display: flex;
  align-items: center;
  justify-content: center;
}
.game-version {
  background: #81d742;
  color: #fff;
  padding: 0px 5px;
  border-radius: 0 4px 4px 0;
  margin-bottom: 5px;
}
.game-release-date {
  background: #22a2b1;
  color: #fff;
  padding: 0px 5px;
  border-radius: 0 4px 4px 0;
}
.game-info-left span {
  font-weight: 600;
  color: #fff;
  font-size: 12px;
}
.game-info-right {
  top: -10px;
  padding: 8px 12px !important;
}
.game-info-btn .btn-row i.icon-dw {
  line-height: 22px;
  font-size: 22px;
  display: inline-block;
  margin-right: 5px;
}
.label-new svg.bi.bi-star-fill {
  fill: yellow !important;
  /*     stroke: white;
	stroke-width: 2; */
  width: 20px;
  height: 20px;
}
/* End CSS game New */

/* Begin CSS game completed */
.game-info-btn.completed-btn a.btn-secondary {
  display: block;
  text-wrap: nowrap;
}
.game-info-btn.completed-btn a {
  display: flex;
  width: 100%;
  text-align: center;
  margin-bottom: 10px;
  align-items: baseline;
}
.list-group-item {
  border: none;
  padding: 10px 15px;
  transition: background-color 0.3s ease;
}

.list-group-item:hover {
  background-color: #f8f9fa;
}

.list-group-item img {
  border: 1px solid #ddd;
  border-radius: 5px;
}

.list-group-item h5 {
  font-size: 16px;
  font-weight: bold;
  color: #e74c3c; /* Màu đỏ tiêu đề */
  margin-bottom: 5px;
}

.list-group-item p {
  font-size: 14px;
  color: #7f8c8d; /* Màu xám ngày tháng */
  margin-bottom: 0;
}

.nav-tabs .nav-link {
  font-weight: bold;
  color: #fff;
  background-color: var(--red-color);
  margin-right: 5px;
  border-radius: 5px 5px 0 0;
}

.nav-tabs .nav-link.active {
  background-color: #3f3ce7;
  color: #fff;
}
/* Đảm bảo ảnh căn giữa và có kích thước đồng đều */
.list-group-item .flex-shrink-0 {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* End CSS game completed */

.blog-list {
  margin-top: 15px;
}
.blog-list a {
  text-decoration: none;
  padding-top: 10px;
  font-size: 16px;
  color: var(--primary-color);
  font-weight: bold;
}
.blog-list h3.post-title a {
  overflow: hidden;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  line-height: 20px;
}
.blog-list img.img-fluid {
  border-radius: 10px;
}
/* End CSS HOME */

.nut-ko-link {
  padding: 5px;
  width: 100%;
  text-align: center;
  margin-bottom: 10px;
  background-color: #293139;
  border-color: #101215;
  font-size: 12px;
  border-radius: 0.3rem;
  font-weight: 600;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.game-category a,
.game-tags a,
.game-tags > a {
  cursor: pointer !important;
}
/* Media Queries for Mobile */
}@media all and (max-width: 739px){
  .comments-mb,
  .notify-mb {
    display: none;
  }
  .dark-mode-mobi {
    position: absolute;
    top: 25px;
    bottom: auto;
    right: 52px;
  }
  /* 	begin css scroll */
  .game-list {
    padding-top: 10px;
  }
  .game-show {
    position: relative;
    padding: 0;
  }
  .game-show .game-info p {
    width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    -webkit-box-orient: vertical;
  }
  /* 	End css scroll */
  .box_redirect {
    padding: 15px;
  }
  /* Display none Silebar */
  .sidebar.sidebar-sticky {
    display: none;
  }
  .top-bar-col {
    margin-top: 0;
  }
  .top-bar {
    padding-bottom: 0rem;
  }
}

@media all{/* Media Queries for ipad */
}@media all and (min-width: 740px) and (max-width: 1024px){
  .container {
    padding-right: 0;
    margin-right: 0;
    overflow: hidden;
  }

  .slider .slider-prev {
    left: 10px !important;
  }
  .slider .slider-next {
    right: 10px !important;
  }
  .game-show {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: scroll;
    overflow-x: hidden;
    outline: 0;
  }
  .game-show .game-info p,
  .game-show a {
    width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    -webkit-box-orient: vertical;
  }
  /* Display none Silebar */
  .sidebar.sidebar-sticky {
    display: none;
  }
}

@media all and (max-width: 541px){
  .slider .slider-prev {
    left: 10px !important;
  }
  .slider .slider-next {
    right: 10px !important;
  }
  .slider-image {
    width: 100%;
    height: 300px;
    object-fit: cover;
    aspect-ratio: 16/9;
  }
}

@media all{.dropdown-menu {
  display: none;
  position: absolute;
  top: 50px;
  right: 0;
  background-color: white;
  box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
  z-index: 1;
  width: 300px;
  padding: 10px;
}

.notify-description {
  margin-bottom: 15px;
}

.notify-description i {
  font-size: 14px;
  color: #333;
}

.post-date {
  display: block;
  font-size: 12px;
  color: #666;
}

.dropdown-btn {
  cursor: pointer;
}
}