/* -------------------------------------- */
/* BASE TEXT + SECTIONS */
/* -------------------------------------- */
.awards-hero {
  background: url("../img/awards/Banner/dleag-award-banner-web.webp") center bottom no-repeat;
  background-size: cover;
  position: relative;
  justify-content: center;
  align-items: center;
  display: flex;
  text-align: center;
}

body[data-theme="dark"] .awards-hero {
  background: url("../img/awards/Banner/dleag-award-banner-web\ dark.webp") center bottom no-repeat;
  background-size: cover;
  position: relative;
  justify-content: center;
  align-items: center;
  display: flex;
  text-align: center;
}

@media (max-width: 480px) {
  .awards-hero {
    background: url("../img/awards/Banner/dleag-award-banner-mobile.webp") center bottom no-repeat !important;
    background-size: cover !important;
    height: 30vh;
  }

  body[data-theme="dark"] .awards-hero {
    background: url("../img/awards/Mobile-Dark/dleag-award-banner-mobile-dark.webp") center bottom no-repeat !important;
    background-size: cover !important;
    height: 30vh;
  }
}

.section-badge {
  display: inline-block;
  background: #efe9ff;
  color: #7b4fc9;
  padding: 4px 12px;
  border-radius: 16px;
  font-size: 14px;
  width: 142px;
  text-align: center;
}

.section-title,
.season-title {
  font-size: 55px !important;
  font-weight: 700;
  color: #70459B;
  margin-top: 10px;
}

.section-content,
.awards-section-content {
  font-size: 16.5px;
  color: #1A182B;
  line-height: 32px;
  margin-top: 20px;
}

.awards-section-content {
  min-height: 237px;
  line-height: 32px;
}

img.page-image {
  width: 100%;
  margin: 20px 0;
}

body[data-theme="dark"] .section-badge {
  background: #C098C620;
  color: #F8FAFC;
}

body[data-theme="dark"] .awards-section-content,
body[data-theme="dark"] .roster-card-header,
body[data-theme="dark"] .roster-card,
body[data-theme="dark"] .section-content {
  color: #F8FAFC;
}

.awards-hero-heading {
  font-size: 70px !important;
  margin-bottom: 20px;
}

.breadcrumb {
  margin-top: -25px;
}

/* -------------------------------------- */
/* ROSTER + AWARD CARDS */
/* -------------------------------------- */
.roster-card {
  background: #F2ECF6;
  border-radius: 8px;
  color: #1A182B;
  min-height: 243px;
  line-height: 32px;
  font-size: 16.5px;
}

.roster-card h5 {
  margin: 15px 0;
}

body[data-theme="dark"] .roster-card {
  background: #70459B25;
}

.roster-card-header {
  font-size: 20px;
  font-weight: semi-bold;
  line-height: 24px;
  color: #70459B;
  font-family: 'Roboto', sans-serif;
  margin-bottom: 20px;
}

.award-card {
  position: relative;
  border-radius: 12px;
  text-align: center;
  padding-top: 40px;
  overflow: hidden;
}

.row {
  overflow-y: hidden;
}

.player-photo {
  width: 100%;
  display: block;
  margin: 0 auto;
  object-fit: contain;
}

.player-name {
  letter-spacing: 1px;
  font-size: 55px;
  color: #70459B;
}

.player-team {
  margin-top: 15px;
  font-size: 14px;
  background: rgba(192, 152, 198, 0.2);
  color: #70459B;
  padding: 4px 12px;
  border-radius: 16px;
  width: 142px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.award-card-purple {
  background: #ece3ff !important;
}

body[data-theme="dark"] .player-team {
  color: #F8FAFC;
}


/* -------------------------------------- */
/* FULL WIDTH AWARD SECTIONS */
/* -------------------------------------- */
.award-section-full {
  width: 100vw;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  position: relative;
  overflow-x: hidden;
}


.award-bg-purple {
  background: #f4edff;
}

body[data-theme="dark"] .award-bg-purple {
  background: #70459B40 !important;
}

.award-bg-light {
  background: transparent;
}

/* -------------------------------------- */
/* BREADCRUMB */
/* -------------------------------------- */
.custom-breadcrumb .breadcrumb-item+.breadcrumb-item::before {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg width='6' height='10' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1 L5 5 L1 9' stroke='%23FFFFFF' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  display: inline-block;
  width: 6px;
  height: 10px;
  margin: 0.40rem 0.35rem 0 0;
}

/* -------------------------------------- */
/* DROPDOWN MENU */
/* -------------------------------------- */
.season-dropdown {
  position: relative;
  width: 264px;
  margin-top: 50px;
}

body[data-theme="dark"] .season-dropdown .dropdown-selected,
body[data-theme="dark"] .dropdown-options {
  background: #1A182B;
  border: 1px solid #F8FAFC;
  color: #F8FAFC;
}

body[data-theme="dark"] .dropdown-options.open {
  border: 1px solid #70459B;
}

body[data-theme="dark"] .season-dropdown.open .dropdown-selected {
  border: 1px solid #70459B !important;
}


body[data-theme="dark"] .dropdown-options li {
  color: #F8FAFC;
}

body[data-theme="dark"] .dropdown-options li:hover,
body[data-theme="dark"] .dropdown-options li.active {
  color: #F8FAFC;
  background: #70459B40;
}

.dropdown-selected {
  padding: 12px 16px;
  font-size: 24px;
  border: 2px solid #d8c4ef;
  border-radius: 16px;
  color: #6a3dbf;
  background: white;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: 'Barlow Condensed', sans-serif;
}

#seasonContent,
#seasonTitle {
  opacity: 1;
  transition: opacity 0.3s ease;
}

.dropdown-options {
  list-style: none;
  padding: 0;
  margin: 0;
  background: white;
  border-radius: 14px;
  box-shadow: 0px 6px 20px rgba(0, 0, 0, 0.1);
  position: absolute;
  width: 100%;
  top: 100%;
  left: 0;
  z-index: 20;
  opacity: 0;
  visibility: hidden;
  overflow: hidden;
  transform: translateY(10px);
  transition: 0.2s ease;
}

.dropdown-options li {
  padding: 12px 16px;
  font-size: 24px;
  color: #6a3dbf;
  cursor: pointer;
  transition: background 0.15s ease;
  text-align: left;
  font-family: 'Barlow Condensed', sans-serif;
}

.dropdown-options.open {
  opacity: 1;
  visibility: visible;
  transform: translateY(5px);
}

.dropdown-options li:hover,
.dropdown-options li.active {
  background: #F2ECF6;
  font-weight: 600;
}

.dropdown-selected .chevron-right path {
  stroke: #6a3dbf;
}

/* Dark mode */
body[data-theme="dark"] .dropdown-selected .chevron-right path {
  stroke: #ffffff;
}

/* mobile optimization */
@media (max-width: 767px) {
  .season-dropdown {
    width: 100%
  }
}

/* -------------------------------------- */
/* SKELETON ANIMATION */
/* -------------------------------------- */
.skeleton {
  background: linear-gradient(90deg, #ececec 25%, #f3f3f3 37%, #ececec 63%);
  background-size: 400% 100%;
  animation: shimmer 1.4s ease infinite;
  border-radius: 8px;
  width: 100%;
}

@keyframes shimmer {
  0% {
    background-position: -400px 0;
  }

  100% {
    background-position: 400px 0;
  }
}

/* -------------------------------------- */
/* AWARDS PAGE SKELETON */
/* -------------------------------------- */
.awards-section-skeleton {
  width: 100%;
}

.awards-section-skeleton .award-card {
  background: #ffffff;
  border-radius: 12px;
}

.skeleton-title {
  width: 40%;
  height: 55px;
  margin: 0 auto 20px auto;
}

.skeleton-desc {
  width: 60%;
  height: 18px;
  margin: 0 auto;
}

.skeleton-desc.short {
  width: 40%;
  height: 18px;
  margin: 10px auto 40px auto;
}

.skeleton-card .image {
  width: 100%;
  height: 260px;
  margin-bottom: 20px;
}

.skeleton-card .name {
  width: 70%;
  height: 22px;
  margin-bottom: 10px;
}

.skeleton-card .team {
  width: 40%;
  height: 18px;
}

/* -------------------------------------- */
/* TEAM PAGE SKELETON */
/* -------------------------------------- */
.skeleton-team-image {
  width: 100%;
  height: 430px;
  border-radius: 12px;
}

.skeleton-card-title {
  width: 60%;
  height: 20px;
  margin-bottom: 20px;
}

.skeleton-line {
  width: 80%;
  height: 16px;
  margin: 10px 0;
}