/* PWAW base accent */
.pwaw-hero, .pwaw-popular, .pwaw-recent, .pwaw-trending{ --pwaw-accent: var(--madara-main-color, var(--primary-color, #a10c05)); }

/* PandaWa Asura Widgets - scoped by .pwaw-* */

/* Basic */
.pwaw-empty { padding: 12px; opacity: .8; }
.pwaw-muted { opacity: .75; }

.pwaw-heading {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  margin: 0 0 12px 0;
  padding: 10px 12px;
  background: rgba(0,0,0,.18);
  border-right: 6px solid var(--primary-color, #a10c05);
  border-radius: 6px;
  font-weight: 700;
}
.pwaw-heading-row { justify-content: space-between; }
.pwaw-heading > span { white-space: nowrap; }

.pwaw-badge {
  position: absolute;
  top: 10px;
  right: 10px;
  background: rgba(0,0,0,.6);
  color: #fff;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  backdrop-filter: blur(2px);
}
.pwaw-cover-missing{
  width: 100%;
  height: 100%;
  background: rgba(255,255,255,.06);
}

/* HERO */
.pwaw-hero img{ -webkit-user-drag: none; user-select: none; }
.pwaw-hero a{ -webkit-user-drag: none; }

.pwaw-hero { width: 100%; }
.pwaw-hero .pwaw-hero-swiper { width: 100%; overflow: visible; direction: ltr; }
.pwaw-hero .swiper-slide { width: var(--pwaw-hero-w, 420px); }

.pwaw-hero--fullbleed {
  width: 100vw;
  position: relative;
  left: calc(-50vw + 50%);
  right: calc(-50vw + 50%);
  margin-left: 0;
  margin-right: 0;
  /* Prevent horizontal scrollbar triggering */
  max-width: 100%;
  box-sizing: border-box;
}

@media (max-width: 768px){
  .pwaw-hero--fullbleed{
    width: 100%;
    left: auto;
    margin-left: 0;
    margin-right: 0;
  }
  .pwaw-hero .pwaw-hero-swiper{ overflow: hidden; }
}

.pwaw-hero .swiper-slide{
  transition: transform .22s ease, opacity .22s ease;
  transform: scale(var(--pwaw-hero-inactive-scale, 1));
  z-index: 1;
}
.pwaw-hero .swiper-slide-active{
  transform: translateY(var(--pwaw-hero-pop-y, -10px)) scale(var(--pwaw-hero-active-scale, 1.12));
  z-index: 5;
  opacity: 1;
}


.pwaw-hero-card{
  background:transparent;
  box-shadow:none;
  width: 100%;
  display:block;
  position: relative;
}

.pwaw-hero-cover{
  position:relative;
  border-radius: var(--pwaw-hero-radius, 18px);
  overflow:hidden;
  width: 100%;
  height: var(--pwaw-hero-h, 560px);
  background: rgba(0,0,0,.2);
  object-fit: cover;
  display:block;
}


/* Dim + blur inactive covers (Asura-like) */
.pwaw-hero .pwaw-hero-cover{
  transition: filter .22s ease, opacity .22s ease, border-radius .22s ease;
  will-change: filter, opacity, border-radius;
}
.pwaw-hero .swiper-slide:not(.swiper-slide-active) .pwaw-hero-cover{
  filter: blur(var(--pwaw-hero-dim-blur, 0px)) brightness(var(--pwaw-hero-dim-brightness, 1));
  opacity: var(--pwaw-hero-dim-opacity, 0.55);
}
.pwaw-hero .swiper-slide-active .pwaw-hero-cover{
  filter: none;
  opacity: 1;
}

.pwaw-hero-meta{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 10px 12px;
  background: linear-gradient(to top, rgba(0,0,0,.78), rgba(0,0,0,0));
  text-align: right;
}
.pwaw-hero-title{ color:#fff; font-weight:800; font-size: 16px; line-height: 1.2; }
.pwaw-hero-genres{ color: rgba(255,255,255,.85); font-size: 12px; margin-top: 4px; }

.pwaw-hero-nav{ display:none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 36px; height: 36px;
  border-radius: 999px;
  background: var(--pwaw-pop-rating-bg, rgba(0,0,0,.45));
  cursor: pointer;
  z-index: 3;
}
.pwaw-hero[data-show-nav="1"] .pwaw-hero-nav{ display:block; }
.pwaw-hero-prev{ left: 10px; }
.pwaw-hero-next{ right: 10px; }
.pwaw-hero-nav:after{
  content:'';
  position:absolute;
  inset: 0;
  background: rgba(255,255,255,.0);
}
.pwaw-hero-prev:before,
.pwaw-hero-next:before{
  content:'';
  position:absolute;
  top:50%; left:50%;
  width: 10px; height: 10px;
  border-top: 2px solid rgba(255,255,255,.9);
  border-right: 2px solid rgba(255,255,255,.9);
  transform-origin: center;
}
.pwaw-hero-prev:before{ transform: translate(-50%,-50%) rotate(225deg); }
.pwaw-hero-next:before{ transform: translate(-50%,-50%) rotate(45deg); }

}

/* TRENDING */
.pwaw-trending-grid{
  display: grid;
  grid-template-columns: repeat(var(--pwaw-cols,5), minmax(0,1fr));
  gap: 12px;
}
@media (max-width: 1024px) { .pwaw-trending-grid{ grid-template-columns: repeat(4, minmax(0,1fr)); } }
@media (max-width: 768px) { .pwaw-trending-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }

.pwaw-card{
  display: block;
  text-decoration: none;
  border-radius: 10px;
  overflow: hidden;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
}
.pwaw-card-cover{ position: relative; }
.pwaw-card-cover img{ width: 100%; height: 160px; object-fit: cover; display:block; }
.pwaw-card-body{ padding: 10px 10px 12px; text-align: right; }
.pwaw-card-title{ color: #fff; font-weight: 800; font-size: 13px; line-height: 1.2; }
.pwaw-card-sub{ color: rgba(255,255,255,.8); font-size: 12px; margin-top: 4px; }
.pwaw-last-chapter{ font-weight: 700; }

/* RECENT */
.pwaw-recent-grid{
  display: grid;
  grid-template-columns: repeat(var(--pwaw-cols,2), minmax(0,1fr));
  gap: var(--pwaw-recent-gap, 12px);
}
.pwaw-row{
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 10px;
  border-radius: 10px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
}
.pwaw-row-cover{
  flex: 0 0 var(--pwaw-recent-cover-w, 56px);
  width: var(--pwaw-recent-cover-w, 56px);
  height: var(--pwaw-recent-cover-h, 80px);
  border-radius: 8px;
  overflow: hidden;
  display: block;
  align-self: flex-start;
}
.pwaw-row-cover img{ width: 100%; height: 100%; object-fit: cover; display:block; }

/* Recent cover auto height (match content) */
.pwaw-recent-cover-auto .pwaw-row{ align-items: stretch; }
.pwaw-recent-cover-auto .pwaw-row-cover{ height: auto; align-self: stretch; }
.pwaw-recent-cover-auto .pwaw-row-cover img{ height: 100%; }

.pwaw-row-body{ flex: 1; min-width: 0; text-align: right; }
.pwaw-row-title{
  display: block;
  color: #fff;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pwaw-row-meta{
  margin-top: 0px;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: 12px;
  color: rgba(255,255,255,.82);
}
.pwaw-row-chapter a{ color: rgba(255,255,255,.92); text-decoration: none; font-weight: 700; display:inline-block; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pwaw-row-time{ direction:ltr; white-space: nowrap; }
.pwaw-row-chapter{ flex: 1; min-width: 0; }
.pwaw-row-chapter a{ display: block; min-width: 0; }
.pwaw-chap-label{
  display:block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pwaw-chap-main{ font-weight: 700; }
.pwaw-chap-sep{ opacity: .9; }
.pwaw-chap-sub{ opacity: .95; }


/* POPULAR */
.pwaw-tabs{ display:flex; gap: 6px; }
.pwaw-tab{
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.15);
  color: rgba(255,255,255,.92);
  padding: 6px 10px;
  border-radius: 999px;
  cursor: pointer;
  font-weight: 700;
  font-size: 12px;
}
.pwaw-tab.is-active{
  background: var(--primary-color, #a10c05);
  border-color: rgba(255,255,255,.15);
}

.pwaw-panel{ display:none; }
.pwaw-panel.is-active{ display:block; }

.pwaw-popular-list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--pwaw-pop-gap, 10px);
}
.pwaw-popular-item{
  display: flex;
  gap: 10px;
  padding: 10px;
  border-radius: 10px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  align-items: flex-start;
}
.pwaw-rank{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 26px;
  height: 26px;
  border-radius: 8px;
  background: rgba(0,0,0,.35);
  color: rgba(255,255,255,.95);
  font-weight: 900;
}
.pwaw-popular-cover{
  width: var(--pwaw-pop-cover-w, 56px);
  height: var(--pwaw-pop-cover-h, 80px);
  border-radius: 8px;
  overflow: visible;
  display:block;
  position: relative;
  flex: 0 0 var(--pwaw-pop-cover-w, 56px);
}
.pwaw-popular-cover-inner{
  display:block;
  width: 100%;
  height: 100%;
  border-radius: 8px;
  overflow: hidden;
}
.pwaw-popular-cover img{ width:100%; height:100%; object-fit: cover; display:block; }
.pwaw-popular-body{ min-width: 0; text-align: right; }
.pwaw-popular-title{
  color: #fff;
  font-weight: 800;
  text-decoration: none;
  display:block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pwaw-popular-genres{
  margin-top: 4px;
  color: rgba(255,255,255,.8);
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pwaw-popular-rating{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  direction: ltr;
  font-weight: 900;
  color: rgba(255,255,255,.95);
  margin-top: 6px;
}
.pwaw-popular-rating-missing{
  opacity: .75;
}

.pwaw-popular-rating-spacer{
  visibility: hidden;
}
/* Popular: keep rating alignment when missing */
.pwaw-stars--ghost{ visibility:hidden; }



/* PWAW overrides - Hero slider (Asura-like) */
.pwaw-hero{
  direction: rtl; /* match RTL site layout */
  overflow: hidden; /* clip any oversize slides to avoid scrollbars */
}
.pwaw-hero .swiper{ overflow: visible; }
.pwaw-hero .swiper-slide{ width: auto; display:flex; justify-content:center; }

/* Asura-like "pop" effect:
   - active slide scales up and stays crisp
   - non-active slides scale down, dim and blur slightly
   Note: we apply this to the inner card so it won't fight Swiper's own transforms. */
.pwaw-hero .swiper-slide .pwaw-hero-card{
  background:transparent;
  box-shadow:none;
  width: 100%;
  display:block;
}

@media (max-width: 768px){
  .pwaw-hero .swiper-slide{ width: min(86vw, 420px); }
}

/* Latest Updates - mobile alignment closer to Asura */
@media (max-width: 768px){
  .pwaw-recent .pwaw-row{ align-items: flex-start; }
  .pwaw-recent .pwaw-row-meta{ align-items: flex-start; }
}

/* =========================================================
   PWAW Popular rating stability fixes (v0.1.25)
   - Prevent CSS cascade from switching rating badge to block flex
   - Keep missing-rating "-" aligned exactly like a normal number
   - Make rating-align (left/right) actually work in RTL layouts
========================================================= */
.pwaw-popular .pwaw-popular-rating{
  display: inline-flex !important;
  width: max-content;
  justify-content: flex-start;
}

/* Align the whole rating badge inside the text column */
.pwaw-popular.pwaw-align-center .pwaw-popular-rating{
  margin-left: auto;
  margin-right: auto;
}
.pwaw-popular.pwaw-align-right .pwaw-popular-rating{
  margin-left: auto;
  margin-right: 0;
}
.pwaw-popular.pwaw-align-left .pwaw-popular-rating{
  margin-right: auto;
  margin-left: 0;
}

/* Rating-align control (independent of text-align) */
.pwaw-rating-align-right .pwaw-popular-rating{
  margin-left: auto;
  margin-right: 0;
}
.pwaw-rating-align-left .pwaw-popular-rating{
  margin-right: auto;
  margin-left: 0;
}

/* Keep the number area stable so "-" doesn't 'wander' visually */
.pwaw-popular .pwaw-popular-rating-num{
  min-width: 3ch;
  text-align: left;
}


/* Hover colors inside PWAW widgets */
.pwaw-recent a:hover,
.pwaw-popular a:hover{
  color: var(--pwaw-accent) !important;
}
.pwaw-row-title:hover{ text-decoration: underline; }
.pwaw-row-chapter a:hover,
.pwaw-genre-link:hover{ text-decoration: underline; }



/* Recent Updated: no underline (Asura-like), but let the THEME control hover color */
.pwaw-recent .pwaw-row-title,
.pwaw-recent .pwaw-row-title:hover,
.pwaw-recent .pwaw-row-chapters a,
.pwaw-recent .pwaw-row-chapters a:hover,
.pwaw-recent .pwaw-row-chapter a,
.pwaw-recent .pwaw-row-chapter a:hover{
  text-decoration: none !important;
}

/* Make sure chapter links can receive theme hover color (do NOT lock a:hover color here) */
.pwaw-recent .pwaw-row-chapters a,
.pwaw-recent .pwaw-row-chapter a{
  color: inherit;
}



/* Recent Updated (mobile): stretch cover to match content height so all chapter lines stay aligned with the cover */
@media (max-width: 768px){
  .pwaw-recent .pwaw-row{ align-items: stretch !important; }
  .pwaw-recent .pwaw-row-cover{
    height: auto !important;         /* override fixed height */
    align-self: stretch !important;  /* stretch to row height */
  }
}





/* v0.1.36 fixes */


/* Popular cover: make sure cover CONTAINER follows configured sizes (not just image crop) */
.pwaw-popular-cover{
  width: var(--pwaw-pop-cover-w, 56px) !important;
  height: var(--pwaw-pop-cover-h, 80px) !important;
  flex: 0 0 var(--pwaw-pop-cover-w, 56px) !important;
}
.pwaw-popular-cover-inner{ width: 100%; height: 100%; }



/* Popular tabs: ALWAYS one row on all platforms; horizontal scroll if space is tight */
.pwaw-tabs{
  display:flex;
  flex-wrap: nowrap !important;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none; /* Firefox */
}
.pwaw-tabs::-webkit-scrollbar{ display:none; }
.pwaw-tab{ white-space: nowrap; }



/* Recent Updated cover: ensure cover box follows configured sizes */
.pwaw-row-cover{
  width: var(--pwaw-recent-cover-w, 56px) !important;
  height: var(--pwaw-recent-cover-h, 80px) !important;
  flex: 0 0 var(--pwaw-recent-cover-w, 56px) !important;
}
/* Default keep cover crop like Asura, but allow switching to contain via class */
.pwaw-row-cover img{ width:100%; height:100%; object-fit: cover; display:block; }
.pwaw-recent.pwaw-coverfit-contain .pwaw-row-cover img{ object-fit: contain !important; object-position: center center; background: rgba(0,0,0,.15); }



/* Popular cover fit (no crop) */
.pwaw-popular.pwaw-coverfit-contain .pwaw-popular-cover img{
  object-fit: contain !important;
  object-position: center center;
  background: rgba(0,0,0,.15);
}



/* Status badge (Recent Updated) */
.pwaw-status{ display:none; position:absolute; z-index:4;
  background: var(--pwaw-status-bg, rgba(0,0,0,.55));
  color: var(--pwaw-status-color, #fff);
  font-size: var(--pwaw-status-font, 12px);
  font-weight: 800;
  line-height: var(--pwaw-status-lh, 1.1);
  white-space: nowrap;
  transform: translate(var(--pwaw-status-offset-x, 0px), var(--pwaw-status-offset-y, 0px)) rotate(var(--pwaw-status-rotate, 0deg));
  padding: var(--pwaw-status-pad-top, 4px) var(--pwaw-status-pad-right, 8px) var(--pwaw-status-pad-bottom, 4px) var(--pwaw-status-pad-left, 8px);
  min-width: var(--pwaw-status-min-w, 0px);
  min-height: var(--pwaw-status-min-h, 0px);
  border-radius: var(--pwaw-status-radius, 999px);
  border-style: var(--pwaw-status-border-style, solid);
  border-width: var(--pwaw-status-border-width, 1px);
  border-color: var(--pwaw-status-border-color, rgba(255,255,255,.18));
  backdrop-filter: blur(2px);
}
.pwaw-status-on .pwaw-status{ display:inline-flex; align-items:center; gap:6px; }

.pwaw-status-pos-tr .pwaw-status{ top: 8px; right: 8px; }
.pwaw-status-pos-tl .pwaw-status{ top: 8px; left: 8px; }
.pwaw-status-pos-br .pwaw-status{ bottom: 8px; right: 8px; }
.pwaw-status-pos-bl .pwaw-status{ bottom: 8px; left: 8px; }



/* Status badge (Popular Top) */
.pwaw-popular .pwaw-status{
  display:none;
  position:absolute;
  z-index:4;
  background: var(--pwaw-status-bg, rgba(0,0,0,.55));
  color: var(--pwaw-status-color, #fff);
  font-size: var(--pwaw-status-font, 12px);
  font-weight: 800;
  line-height: var(--pwaw-status-lh, 1.1);
  white-space: nowrap;
  transform: translate(var(--pwaw-status-offset-x, 0px), var(--pwaw-status-offset-y, 0px)) rotate(var(--pwaw-status-rotate, 0deg));
  padding: var(--pwaw-status-pad-top, 4px) var(--pwaw-status-pad-right, 8px) var(--pwaw-status-pad-bottom, 4px) var(--pwaw-status-pad-left, 8px);
  min-width: var(--pwaw-status-min-w, 0px);
  min-height: var(--pwaw-status-min-h, 0px);
  border-radius: var(--pwaw-status-radius, 999px);
  border-style: var(--pwaw-status-border-style, solid);
  border-width: var(--pwaw-status-border-width, 1px);
  border-color: var(--pwaw-status-border-color, rgba(255,255,255,.18));
  backdrop-filter: blur(2px);
}
.pwaw-popular.pwaw-status-on .pwaw-status{ display:inline-flex; align-items:center; gap:6px; }

.pwaw-popular.pwaw-status-pos-tr .pwaw-status{ top: 8px; right: 8px; }
.pwaw-popular.pwaw-status-pos-tl .pwaw-status{ top: 8px; left: 8px; }
.pwaw-popular.pwaw-status-pos-br .pwaw-status{ bottom: 8px; right: 8px; }
.pwaw-popular.pwaw-status-pos-bl .pwaw-status{ bottom: 8px; left: 8px; }



/* Force widget cover img sizing (max specificity) */
.pwaw-popular .pwaw-popular-cover .pwaw-popular-cover-inner > img,
.pwaw-recent .pwaw-row-cover > img{
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  display: block !important;
}



/* Popular cover fit (no crop) strict */
.pwaw-popular.pwaw-coverfit-contain .pwaw-popular-cover .pwaw-popular-cover-inner > img{
  object-fit: contain !important;
  object-position: center center;
  background: rgba(0,0,0,.15);
}
/* Recent cover fit (no crop) strict */
.pwaw-recent.pwaw-coverfit-contain .pwaw-row-cover > img{
  object-fit: contain !important;
  object-position: center center;
  background: rgba(0,0,0,.15);
}
/* Fit to frame (stretch) strict */
.pwaw-popular.pwaw-coverfit-fill .pwaw-popular-cover .pwaw-popular-cover-inner > img,
.pwaw-recent.pwaw-coverfit-fill .pwaw-row-cover > img{
  object-fit: fill !important;
  object-position: center center;
}


/* -------------------------------------------------
   Cover fit: robust override (avoid theme conflicts)
   - Uses CSS variable --pwaw-coverfit
   - cover: crops, contain: no crop, fill: stretch
-------------------------------------------------- */
.pwaw-recent.pwaw-coverfit-cover,
.pwaw-popular.pwaw-coverfit-cover{ --pwaw-coverfit: cover; }
.pwaw-recent.pwaw-coverfit-contain,
.pwaw-popular.pwaw-coverfit-contain{ --pwaw-coverfit: contain; }
.pwaw-recent.pwaw-coverfit-fill,
.pwaw-popular.pwaw-coverfit-fill{ --pwaw-coverfit: fill; }

.pwaw-row-cover{ position: relative; }
.pwaw-popular-cover{ position: relative; }

.pwaw-row-cover img,
.pwaw-popular-cover img{
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: var(--pwaw-coverfit, cover) !important;
  object-position: center center !important;
  display: block !important;
}
.pwaw-recent.pwaw-coverfit-contain .pwaw-row-cover img,
.pwaw-popular.pwaw-coverfit-contain .pwaw-popular-cover img{
  background: rgba(0,0,0,.15);
}

/* -------------------------------------------------
   Hero Slider - definitive responsive styling
   We override earlier rules to make Elementor responsive controls reliable.
-------------------------------------------------- */
.pwaw-hero{
  --pwaw-hero-w: 420px;
  --pwaw-hero-h: 560px;
  --pwaw-hero-radius: 18px;
  --pwaw-hero-space: 18px;
  --pwaw-hero-meta-offset-x: 0px;
  --pwaw-hero-meta-offset-y: 0px;
  --pwaw-hero-rating-offset-x: 0px;
  --pwaw-hero-rating-offset-y: 0px;
  --pwaw-hero-rating-rotate: 0deg;
}

.pwaw-hero .swiper-slide{
  width: var(--pwaw-hero-w, 420px) !important;
}

.pwaw-hero .pwaw-hero-card{
  width: var(--pwaw-hero-w, 420px) !important;
}

.pwaw-hero .pwaw-hero-cover{
  height: var(--pwaw-hero-h, 560px) !important;
  border-radius: var(--pwaw-hero-radius, 18px) !important;
}

.pwaw-hero .pwaw-hero-meta{
  transform: translate(var(--pwaw-hero-meta-offset-x, 0px), var(--pwaw-hero-meta-offset-y, 0px));
}

/* Center-only radius */
.pwaw-hero[data-radius-center-only="1"] .swiper-slide .pwaw-hero-cover{
  border-radius: 0 !important;
}
.pwaw-hero[data-radius-center-only="1"] .swiper-slide-active .pwaw-hero-cover{
  border-radius: var(--pwaw-hero-radius, 18px) !important;
}

/* Show/hide meta and rating based on widget settings */
.pwaw-hero .pwaw-hero-meta,
.pwaw-hero .pwaw-badge.pwaw-badge-rating{
  opacity: 1;
  pointer-events: auto;
}

.pwaw-hero[data-details-active-only="1"] .pwaw-hero-meta{
  opacity: 0;
  pointer-events: none;
}
.pwaw-hero[data-details-active-only="1"] .swiper-slide-active .pwaw-hero-meta{
  opacity: 1;
  pointer-events: auto;
}

.pwaw-hero[data-rating-active-only="1"] .pwaw-badge.pwaw-badge-rating{
  opacity: 0;
  pointer-events: none;
}
.pwaw-hero[data-rating-active-only="1"] .swiper-slide-active .pwaw-badge.pwaw-badge-rating{
  opacity: 1;
  pointer-events: auto;
}

/* Rating position + offsets + rotation */
.pwaw-hero .pwaw-badge.pwaw-badge-rating{
  transform: translate(var(--pwaw-hero-rating-offset-x, 0px), var(--pwaw-hero-rating-offset-y, 0px)) rotate(var(--pwaw-hero-rating-rotate, 0deg));
}
.pwaw-hero[data-rating-pos="tr"] .pwaw-badge.pwaw-badge-rating{ top: 12px; right: 12px; left: auto; bottom: auto; }
.pwaw-hero[data-rating-pos="tl"] .pwaw-badge.pwaw-badge-rating{ top: 12px; left: 12px; right: auto; bottom: auto; }
.pwaw-hero[data-rating-pos="br"] .pwaw-badge.pwaw-badge-rating{ bottom: 12px; right: 12px; left: auto; top: auto; }
.pwaw-hero[data-rating-pos="bl"] .pwaw-badge.pwaw-badge-rating{ bottom: 12px; left: 12px; right: auto; top: auto; }

.pwaw-hero[data-rating-star="0"] .pwaw-rating-star{ display:none !important; }

/* Use responsive spacing var in Swiper wrapper too */
.pwaw-hero .swiper-wrapper{ gap: 0 !important; }



/* Hero: radius only on active slide */
.pwaw-hero[data-radius-center-only="1"] .pwaw-hero-cover{ border-radius: 0; }
.pwaw-hero[data-radius-center-only="1"] .swiper-slide-active .pwaw-hero-cover{ border-radius: var(--pwaw-hero-radius, 18px); }


/* =========================================================
   PWAW Hero + Popular fixes (v0.1.64)
   - Meta box centers consistently for short/long titles
   - Pop-out does not force "zoom" (Active scale default = 1.0)
   - Rounded corners can apply to ALL slides (disable center-only if needed)
   - Popular rank badge stays over the cover (overlay)
========================================================= */

/* HERO: ensure absolute overlays are positioned relative to the card */
.pwaw-hero .pwaw-hero-card{
  position: relative;
}

/* HERO: keep cover corners consistent; allow card to clip overlays inside the radius */
.pwaw-hero .pwaw-hero-card{
  border-radius: var(--pwaw-hero-radius, 18px);
  overflow: hidden;
}
.pwaw-hero .pwaw-hero-cover{
  border-radius: inherit !important;
}

/* HERO: pop-out without forcing image "zoom".
   Users can still increase Active scale via the control if they want. */
.pwaw-hero .swiper-slide{
  transform: scale(var(--pwaw-hero-inactive-scale, 0.92)) !important;
}
.pwaw-hero .swiper-slide-active{
  /* Translate only - no forced zoom-in */
  transform: translateY(var(--pwaw-hero-pop-y, -12px)) !important;
}

/* HERO: Meta box is centered and shrink-wrapped.
   Fixes the "long title vs short title" alignment inconsistency on desktop. */
.pwaw-hero .pwaw-hero-meta{
  left: 50% !important;
  right: auto !important;
  bottom: 12px;
  width: max-content;
  max-width: calc(100% - 24px);
  border-radius: 14px;
  /* Allow Elementor background control to override this default */
  background: rgba(0,0,0,.55);
  transform: translateX(-50%) translate(var(--pwaw-hero-meta-offset-x, 0px), var(--pwaw-hero-meta-offset-y, 0px)) !important;
}
.pwaw-hero .pwaw-hero-title,
.pwaw-hero .pwaw-hero-genres{
  text-align: inherit;
}

/* HERO: rating badge compact defaults; Elementor controls still override */
.pwaw-hero .pwaw-badge.pwaw-badge-rating{
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.pwaw-hero .pwaw-rating-star{ line-height: 1; }

/* POPULAR: rank must overlay the cover (not push layout) */
.pwaw-popular-cover .pwaw-rank{
  position: absolute;
  z-index: 3;
  width: var(--pwaw-rank-size, 26px);
  height: var(--pwaw-rank-size, 26px);
  transform: translate(var(--pwaw-rank-offset-x, 0px), var(--pwaw-rank-offset-y, 0px));
}
.pwaw-popular.pwaw-rank-pos-tr .pwaw-rank{ top: 8px; right: 8px; left: auto; bottom: auto; }
.pwaw-popular.pwaw-rank-pos-tl .pwaw-rank{ top: 8px; left: 8px; right: auto; bottom: auto; }
.pwaw-popular.pwaw-rank-pos-br .pwaw-rank{ bottom: 8px; right: 8px; left: auto; top: auto; }
.pwaw-popular.pwaw-rank-pos-bl .pwaw-rank{ bottom: 8px; left: 8px; right: auto; top: auto; }