/*
 * Miteru Watch v1.1.14
 * Small layout polish only:
 * - keep v1.1.13 full-width rails and anime hero blend
 * - give carousel ends more breathing room
 * - enlarge homepage poster cards slightly
 * - soften poster shading, modernize the hero watch CTA
 * - use larger transparent outlined ranking numerals
 */

/* Keep the existing sidebar exactly as-is; only let homepage rails extend behind it. */
@media (min-width: 981px) {
  body.aw-rail-layout {
    --aw-v113-layout-rail: var(--awg-rail);
  }

  body.aw-rail-layout.aw-rail-collapsed {
    --aw-v113-layout-rail: var(--awg-rail-collapsed);
  }

  .awg-home :is(
    .awg-episode-rail,
    .awg-rank-rail,
    .awg-poster-rail,
    .awg-continue-rail,
    .awg-home-genre-rail
  ) {
    /*
     * The main column starts after the fixed rail. The normal .aw-wide-container
     * is also centred inside that column. Pull the scrolling viewport back to
     * the browser edge, then restore the normal visual start with padding.
     * Once the user scrolls, cards can travel underneath the fixed sidebar.
     */
    --aw-v113-container-gutter: max(
      17px,
      calc((100vw - var(--aw-v113-layout-rail) - 1560px) / 2)
    );
    width: 100vw !important;
    max-width: none !important;
    margin-left: calc(
      0px - var(--aw-v113-layout-rail) - var(--aw-v113-container-gutter)
    ) !important;
    margin-right: 0 !important;
    padding-left: calc(
      var(--aw-v113-layout-rail) + var(--aw-v113-container-gutter)
    ) !important;
    padding-right: calc(clamp(48px, 4.5vw, 84px) + env(safe-area-inset-right)) !important;
    scroll-padding-left: calc(
      var(--aw-v113-layout-rail) + var(--aw-v113-container-gutter)
    );
    scroll-padding-right: calc(clamp(48px, 4.5vw, 84px) + env(safe-area-inset-right));
    box-sizing: border-box;
    overscroll-behavior-inline: contain;
  }
}

/*
 * Anime detail: remove the hard hero/content seam. The content starts inside
 * the final part of the banner fade, placing the Episodes heading naturally
 * over the soft transition instead of below a straight divider.
 */
.aw16-anime-page .aw16-content {
  position: relative;
  z-index: 4;
  margin-top: -108px !important;
  padding-top: 64px !important;
  border-top: 0 !important;
  overflow: visible !important;
  background: linear-gradient(
    180deg,
    rgba(18, 18, 20, 0) 0,
    rgba(18, 18, 20, .28) 30px,
    rgba(18, 18, 20, .72) 72px,
    #121214 128px,
    #121214 72%,
    #151517 100%
  ) !important;
}

.aw16-anime-page .aw16-episodes {
  position: relative;
  z-index: 2;
  padding-top: 0 !important;
}

.aw16-anime-page .aw16-section__head--episodes {
  border-top: 0 !important;
  border-bottom: 0 !important;
}

/* Keep the overlap proportional when the hero gets shorter. */
@media (max-width: 980px) {
  .aw16-anime-page .aw16-content {
    margin-top: -82px !important;
    padding-top: 52px !important;
    background: linear-gradient(
      180deg,
      rgba(18, 18, 20, 0) 0,
      rgba(18, 18, 20, .38) 24px,
      #121214 96px,
      #121214 74%,
      #151517 100%
    ) !important;
  }
}

@media (max-width: 640px) {
  .aw16-anime-page .aw16-content {
    margin-top: -62px !important;
    padding-top: 42px !important;
  }
}

/* v1.1.14 — homepage card polish without changing the existing page structure. */
@media (min-width: 981px) {
  .awg-home .awg-poster-card {
    flex-basis: 184px !important;
  }

  .awg-home .awg-rank-card {
    flex-basis: 190px !important;
  }

  .awg-home .awg-home-genre-card {
    flex-basis: 164px !important;
  }
}

@media (min-width: 981px) and (max-width: 1280px) {
  .awg-home .awg-poster-card {
    flex-basis: 172px !important;
  }

  .awg-home .awg-rank-card {
    flex-basis: 178px !important;
  }

  .awg-home .awg-home-genre-card {
    flex-basis: 156px !important;
  }
}

/* Poster artwork stays readable instead of sitting under a heavy black veil. */
.awg-home .awg-poster-card__shade {
  background: linear-gradient(
    0deg,
    rgba(7, 7, 9, .30) 0%,
    rgba(7, 7, 9, .10) 34%,
    rgba(7, 7, 9, 0) 58%
  ) !important;
}

.awg-home .awg-rank-card__shade {
  background: linear-gradient(
    0deg,
    rgba(7, 7, 9, .22) 0%,
    rgba(7, 7, 9, .06) 34%,
    rgba(7, 7, 9, 0) 56%
  ) !important;
}

.awg-home .awg-home-genre-card__media::after {
  background: linear-gradient(
    0deg,
    rgba(7, 7, 9, .20) 0%,
    rgba(7, 7, 9, .05) 30%,
    transparent 52%
  ) !important;
}

/* Top ranking: hollow outlined numbers so the poster remains visible below it. */
.awg-home .awg-rank-card__poster em {
  left: 8px !important;
  bottom: 7px !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 1.55px rgba(250, 250, 252, .94);
  paint-order: stroke fill;
  font-size: 54px !important;
  line-height: .86 !important;
  font-weight: 900 !important;
  letter-spacing: -.065em !important;
  text-shadow: 0 4px 18px rgba(0, 0, 0, .22) !important;
}

/* The existing Şimdi İzle CTA keeps its place, only its visual treatment is refined. */
.awg-home .awg-primary-btn {
  min-width: 132px;
  height: 46px;
  gap: 9px;
  padding: 0 16px 0 8px;
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 12px;
  background: rgba(246, 245, 247, .96);
  color: #111114;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .20), inset 0 1px 0 rgba(255,255,255,.7);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform .22s ease, box-shadow .22s ease, background .22s ease;
}

.awg-home .awg-primary-btn svg {
  width: 29px;
  height: 29px;
  padding: 7px;
  border-radius: 999px;
  background: #19191d;
  color: #fff;
  flex: 0 0 29px;
}

@media (hover: hover) and (pointer: fine) {
  .awg-home .awg-primary-btn:hover {
    transform: translateY(-1px);
    background: #fff;
    box-shadow: 0 14px 34px rgba(0, 0, 0, .25), inset 0 1px 0 rgba(255,255,255,.9);
  }
}

@media (max-width: 760px) {
  .awg-home .awg-rank-card__poster em {
    font-size: 38px !important;
    -webkit-text-stroke-width: 1.25px;
  }

  .awg-home .awg-primary-btn {
    min-width: 0;
    height: 43px;
    padding-right: 14px;
  }

  .awg-home .awg-primary-btn svg {
    width: 27px;
    height: 27px;
    flex-basis: 27px;
    padding: 6px;
  }
}


/* v1.1.15 — homepage refinement: softer CTA, matched genre cards, minimal continue-watching. */

/* Hero watch CTA: soft Miteru red glass, no black inner fill. */
.awg-home .awg-primary-btn {
  min-width: 138px;
  height: 46px;
  gap: 9px;
  padding: 0 17px 0 9px;
  border: 1px solid rgba(255, 218, 221, .34);
  border-radius: 13px;
  background: linear-gradient(135deg, rgba(211, 82, 91, .94), rgba(174, 62, 72, .92));
  color: #fff;
  box-shadow: 0 12px 30px rgba(91, 24, 30, .26), inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  text-shadow: 0 1px 8px rgba(68, 13, 18, .22);
}

.awg-home .awg-primary-btn svg {
  width: 29px;
  height: 29px;
  flex: 0 0 29px;
  padding: 7px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
}

@media (hover: hover) and (pointer: fine) {
  .awg-home .awg-primary-btn:hover {
    transform: translateY(-2px);
    background: linear-gradient(135deg, rgba(225, 94, 103, .98), rgba(188, 68, 78, .96));
    box-shadow: 0 15px 34px rgba(91, 24, 30, .32), inset 0 1px 0 rgba(255,255,255,.22);
  }
}

/* Featured genre uses the same poster width as normal featured poster cards. */
@media (min-width: 1281px) {
  .awg-home .awg-home-genre-card { flex-basis: 184px !important; }
}

@media (min-width: 981px) and (max-width: 1280px) {
  .awg-home .awg-home-genre-card { flex-basis: 172px !important; }
}

/* Minimal continue-watching cards: banner backdrop + compact poster + progress. */
.awg-home .awg-continue-section--minimal {
  padding-top: 16px;
  padding-bottom: 8px;
}

.awg-home .awg-continue-card--minimal {
  position: relative;
  isolation: isolate;
  flex: 0 0 390px;
  min-height: 132px;
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  overflow: hidden;
  padding: 12px 15px 12px 12px;
  border: 1px solid rgba(255,255,255,.065);
  border-radius: 13px;
  background: #121214;
  box-shadow: 0 9px 28px rgba(0,0,0,.12);
  transform: translateZ(0);
  transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease;
}

.awg-home .awg-continue-card--minimal .awg-continue-card__backdrop {
  position: absolute;
  inset: 0;
  z-index: -3;
  display: block;
}

.awg-home .awg-continue-card--minimal .awg-continue-card__backdrop img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 35%;
  filter: saturate(.78) brightness(.48);
  transform: scale(1.025);
}

.awg-home .awg-continue-card--minimal .awg-continue-card__veil {
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(12,12,14,.86) 0%, rgba(12,12,14,.72) 34%, rgba(12,12,14,.58) 100%),
    linear-gradient(0deg, rgba(10,10,12,.20), rgba(10,10,12,.08));
  pointer-events: none;
}

.awg-home .awg-continue-card--minimal .awg-continue-card__poster {
  position: relative;
  z-index: 2;
  width: 68px;
  aspect-ratio: 2 / 3;
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.12);
  background: #1a1a1d;
  box-shadow: 0 8px 22px rgba(0,0,0,.32);
}

.awg-home .awg-continue-card--minimal .awg-continue-card__poster img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .30s ease;
}

.awg-home .awg-continue-card--minimal .awg-continue-card__copy {
  position: relative;
  z-index: 2;
  display: block;
  min-width: 0;
  padding: 0 !important;
}

.awg-home .awg-continue-card--minimal .awg-continue-card__copy small,
.awg-home .awg-continue-card--minimal .awg-continue-card__copy strong,
.awg-home .awg-continue-card--minimal .awg-continue-card__copy em {
  display: block;
  min-width: 0;
}

.awg-home .awg-continue-card--minimal .awg-continue-card__copy small {
  margin: 0 0 5px;
  color: rgba(236,231,237,.62);
  font-size: 9px;
  font-weight: 650;
  letter-spacing: .025em;
}

.awg-home .awg-continue-card--minimal .awg-continue-card__copy strong {
  overflow: hidden;
  margin: 0;
  color: #f5f2f5;
  font-family: var(--aw-font-display);
  font-size: 14px !important;
  line-height: 1.28 !important;
  font-weight: 700 !important;
  letter-spacing: -.01em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.awg-home .awg-continue-card--minimal .awg-continue-progress {
  position: relative;
  display: block;
  width: 100%;
  height: 4px;
  overflow: hidden;
  margin-top: 15px;
  border-radius: 999px;
  background: rgba(255,255,255,.16);
}

.awg-home .awg-continue-card--minimal .awg-continue-progress i {
  position: absolute;
  inset: 0 auto 0 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #d85f66, #ee8d93);
  box-shadow: 0 0 12px rgba(216,95,102,.20);
}

.awg-home .awg-continue-card--minimal .awg-continue-card__copy em {
  margin-top: 6px;
  color: rgba(235,230,236,.68);
  font-size: 9px !important;
  line-height: 1.2 !important;
  font-style: normal;
  font-weight: 600;
}

.awg-home .awg-continue-card--minimal .awg-continue-premium {
  position: absolute;
  z-index: 4;
  top: 9px;
  right: 9px;
  left: auto;
  padding: 4px 6px;
  border: 1px solid rgba(234,137,143,.20);
  border-radius: 6px;
  background: rgba(16,15,18,.68);
  color: #efb0b4;
  font-size: 7.5px;
  line-height: 1;
  font-weight: 700;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

@media (hover: hover) and (pointer: fine) {
  .awg-home .awg-continue-card--minimal:hover {
    transform: translateY(-2px);
    border-color: rgba(255,255,255,.12);
    box-shadow: 0 14px 32px rgba(0,0,0,.20);
  }

  .awg-home .awg-continue-card--minimal:hover .awg-continue-card__poster img {
    transform: scale(1.035);
  }
}

@media (max-width: 760px) {
  .awg-home .awg-primary-btn {
    height: 43px;
    padding-right: 14px;
  }

  .awg-home .awg-continue-card--minimal {
    flex-basis: min(86vw, 350px);
    min-height: 118px;
    grid-template-columns: 58px minmax(0,1fr);
    gap: 12px;
    padding: 10px 12px 10px 10px;
    border-radius: 11px;
  }

  .awg-home .awg-continue-card--minimal .awg-continue-card__poster {
    width: 58px;
    border-radius: 7px;
  }

  .awg-home .awg-continue-card--minimal .awg-continue-card__copy strong {
    font-size: 12.5px !important;
  }

  .awg-home .awg-continue-card--minimal .awg-continue-progress {
    margin-top: 12px;
  }
}
