/*
Theme Name: Đấu Trường Vui Nhộn
Theme URI: https://lienquan.garena.vn/
Author: Antigravity
Author URI: https://lienquan.garena.vn/
Description: Theme WordPress Đấu Trường Vui Nhộn lấy cảm hứng và giao diện chuẩn từ Liên Quân Mobile (Garena AOV). Hỗ trợ đầy đủ slider banner, tiêu điểm tướng, thư viện gameplay / tướng đa dạng, tin tức - sự kiện, giao diện game esports đậm chất huyền thoại trên cả PC lẫn Mobile.
Version: 1.0.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dautruongvuinhon
Tags: gaming, esports, entertainment, responsive, custom-background, featured-images, full-width-template
*/

/* Custom additions for Đấu Trường Vui Nhộn theme */
.header__logo-text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  text-decoration: none !important;
  color: #fff;
  line-height: 1.1;
  font-family: 'Montserrat', sans-serif;
  margin-left: 10rem;
}
.header__logo-text h1 {
  font-size: 26rem;
  font-weight: 900;
  text-transform: uppercase;
  margin: 0;
  background: linear-gradient(180deg, #ffeaa7 0%, #fab1a0 40%, #e17055 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.8));
  letter-spacing: 1px;
}
.header__logo-text span {
  font-size: 13rem;
  font-weight: 700;
  color: #fce3bc;
  letter-spacing: 2px;
  text-transform: uppercase;
}

/* Fallback & Enhancements for Hero Spotlight & Videos */
.p-home__hero--video iframe {
  width: 100%;
  height: 100%;
  border-radius: 8rem;
  border: 1rem solid rgba(237, 190, 128, 0.4);
}

/* Single News & Archive enhancements */
.p-news-detail {
  padding: 80rem 0 120rem;
  background: url("assets/img/bg-news.jpg") center top/cover no-repeat;
  min-height: 800rem;
  color: #fff;
}
.p-news-detail__container {
  max-width: 1200rem;
  margin: 0 auto;
  padding: 0 20rem;
}
.p-news-detail__breadcrumb {
  display: flex;
  align-items: center;
  font-size: 16rem;
  color: #adb5bd;
  margin-bottom: 25rem;
  gap: 8rem;
}
.p-news-detail__breadcrumb a {
  color: #edbe80;
}
.p-news-detail__breadcrumb a:hover {
  text-decoration: underline !important;
}
.p-news-detail__card {
  background: rgba(18, 22, 34, 0.92);
  border: 1rem solid rgba(237, 190, 128, 0.35);
  border-radius: 12rem;
  padding: 40rem;
  box-shadow: 0 10rem 30rem rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(8px);
}
.p-news-detail__title {
  font-size: 36rem;
  font-weight: 800;
  color: #edbe80;
  margin-bottom: 15rem;
  line-height: 1.3;
}
.p-news-detail__meta {
  display: flex;
  align-items: center;
  gap: 20rem;
  font-size: 15rem;
  color: #949494;
  border-bottom: 1rem solid rgba(255, 255, 255, 0.1);
  padding-bottom: 20rem;
  margin-bottom: 30rem;
}
.p-news-detail__content {
  font-size: 18rem;
  line-height: 1.8;
  color: #d1d5db;
}
.p-news-detail__content img {
  max-width: 100%;
  height: auto;
  border-radius: 8rem;
  margin: 20rem 0;
  display: block;
}
.p-news-detail__content h2,
.p-news-detail__content h3 {
  color: #fce3bc;
  margin-top: 30rem;
  margin-bottom: 15rem;
  font-weight: 700;
}
.p-news-detail__content p {
  margin-bottom: 20rem;
}

/* Archive / Category Page */
.p-archive-page {
  padding: 80rem 0 120rem;
  background: url("assets/img/bg-news.jpg") center top/cover no-repeat;
  min-height: 800rem;
  color: #fff;
}
.p-archive-page__container {
  max-width: 1240rem;
  margin: 0 auto;
  padding: 0 20rem;
}
.p-archive-page__heading {
  font-size: 42rem;
  font-weight: 800;
  color: #edbe80;
  text-align: center;
  text-transform: uppercase;
  margin-bottom: 40rem;
  position: relative;
  letter-spacing: 1px;
}
.p-archive-page__heading::after {
  content: "";
  display: block;
  width: 120rem;
  height: 3rem;
  background: linear-gradient(90deg, transparent, #edbe80, transparent);
  margin: 15rem auto 0;
}
.p-archive-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30rem;
  margin-top: 30rem;
}
@media (max-width: 991px) {
  .p-archive-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 600px) {
  .p-archive-grid {
    grid-template-columns: 1fr;
  }
}

.p-archive-card {
  background: rgba(18, 22, 34, 0.85);
  border: 1rem solid rgba(237, 190, 128, 0.25);
  border-radius: 10rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}
.p-archive-card:hover {
  transform: translateY(-6rem);
  border-color: #edbe80;
  box-shadow: 0 12rem 25rem rgba(0,0,0,0.5);
}
.p-archive-card__thumb {
  width: 100%;
  height: 200rem;
  object-fit: cover;
  display: block;
}
.p-archive-card__body {
  padding: 20rem;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.p-archive-card__date {
  font-size: 13rem;
  color: #edbe80;
  margin-bottom: 10rem;
  text-transform: uppercase;
  font-weight: 600;
}
.p-archive-card__title {
  font-size: 20rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.4;
  margin-bottom: 12rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.p-archive-card__desc {
  font-size: 14rem;
  color: #949494;
  line-height: 1.6;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Pagination */
.p-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10rem;
  margin-top: 50rem;
}
.p-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42rem;
  height: 42rem;
  padding: 0 12rem;
  background: rgba(18, 22, 34, 0.8);
  border: 1rem solid rgba(237, 190, 128, 0.3);
  color: #fff;
  font-weight: 600;
  font-size: 16rem;
  border-radius: 6rem;
  transition: all 0.2s ease;
}
.p-pagination .page-numbers.current,
.p-pagination .page-numbers:hover {
  background: #edbe80;
  color: #121622;
  border-color: #edbe80;
}

/* Champion Detail Template */
.p-champion-detail {
  padding: 60rem 0 100rem;
  background: url("assets/img/bg-academy.jpg") center top/cover no-repeat;
  min-height: 900rem;
  color: #fff;
}
.p-champion-hero {
  display: flex;
  gap: 40rem;
  background: rgba(10, 14, 23, 0.9);
  border: 1rem solid rgba(237, 190, 128, 0.3);
  border-radius: 14rem;
  padding: 35rem;
  margin-bottom: 40rem;
}
@media (max-width: 900px) {
  .p-champion-hero {
    flex-direction: column;
  }
}
.p-champion-hero__avatar {
  flex: 0 0 320rem;
  height: 380rem;
  border-radius: 10rem;
  overflow: hidden;
  border: 2rem solid #edbe80;
}
.p-champion-hero__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-champion-hero__info {
  flex: 1;
}
.p-champion-hero__name {
  font-size: 38rem;
  font-weight: 800;
  color: #edbe80;
  margin-bottom: 8rem;
}
.p-champion-hero__title {
  font-size: 20rem;
  color: #fce3bc;
  margin-bottom: 20rem;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.p-champion-hero__role {
  display: inline-flex;
  align-items: center;
  gap: 10rem;
  background: rgba(237, 190, 128, 0.15);
  border: 1rem solid #edbe80;
  padding: 6rem 16rem;
  border-radius: 20rem;
  font-size: 15rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 20rem;
}
.p-champion-hero__desc {
  font-size: 16rem;
  line-height: 1.7;
  color: #ced4da;
}