/* v2.80: card draft layering, Zhao Yun follow-up and full revealed card descriptions. */

/* The draft footer used to be sticky and physically covered the card carousel.
   Keep it in normal document flow so cards and controls can never overlap. */
.battle-card-overlay .battle-card-draft {
  isolation: isolate;
}

.battle-card-draft .selected-card-slots,
.battle-card-draft .battle-card-hand {
  position: relative;
  z-index: 2;
}

.battle-card-draft .battle-card {
  isolation: isolate;
}

.battle-card-draft .battle-card-order {
  z-index: 8 !important;
}

.battle-card-draft .card-draft-footer {
  position: static !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  z-index: auto !important;
  width: 100%;
  box-sizing: border-box;
  margin: 12px 0 0 !important;
}

/* Use a dedicated element instead of the legacy <p> that older mobile rules hide.
   The card grows vertically as needed; no line clamp or hidden overflow is allowed. */
.battle-screen.battle-screen-v271 .battle-card-reveal > article.revealed-card {
  height: auto !important;
  min-height: 230px !important;
  grid-template-rows: 92px minmax(128px, auto) !important;
}

.battle-screen.battle-screen-v271 .battle-card-reveal > article.revealed-card .revealed-card-copy {
  display: flex !important;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  min-height: 128px !important;
  height: auto !important;
  overflow: visible !important;
}

.battle-screen.battle-screen-v271 .battle-card-reveal .revealed-card-description-v280 {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100%;
  max-width: 100%;
  height: auto !important;
  max-height: none !important;
  margin: 5px 0 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  -webkit-line-clamp: unset !important;
  line-clamp: unset !important;
  -webkit-box-orient: initial !important;
  font-size: 11px !important;
  line-height: 1.42 !important;
  color: rgba(240, 232, 214, .88) !important;
}

@media (max-width: 760px) {
  .battle-card-draft .battle-card-hand {
    padding-bottom: 10px !important;
  }

  .battle-card-draft .card-draft-footer {
    margin: 10px 0 0 !important;
    padding: 12px 10px calc(12px + env(safe-area-inset-bottom)) !important;
  }

  .battle-screen.battle-screen-v271 .battle-card-reveal > article.revealed-card {
    min-height: 218px !important;
    grid-template-rows: 90px minmax(118px, auto) !important;
  }

  .battle-screen.battle-screen-v271 .battle-card-reveal > article.revealed-card .revealed-card-copy {
    min-height: 118px !important;
  }

  .battle-screen.battle-screen-v271 .battle-card-reveal .revealed-card-description-v280 {
    font-size: 10px !important;
    line-height: 1.38 !important;
  }
}

@media (max-width: 520px) {
  .battle-screen.battle-screen-v271 .battle-card-reveal .revealed-card-description-v280 {
    font-size: 9px !important;
    line-height: 1.36 !important;
  }
}