/*
 * JavCMS shared display rules (xvid scale build, brief 2.11; lane T). Loaded by every theme's public/include.html
 * together with lowres.js. Colours come from the theme (currentColor), so the same rules fit dark and light themes.
 *   1. is-lowres frames (rule 2): small picture contained at <= 1.5x over a blurred copy of itself
 *   2. RTL bidi (rule 1): a title that starts with a number or a Latin word keeps its own direction on Arabic pages
 *   3. subcats chip row (rule 5), 4. quality badge (rule 7), 5. provider block (the "International" home block)
 */

/* 1. low-resolution frames (lowres.js sets is-lowres, --jv-lowres-w and --jv-lowres-bg) */
.is-lowres {
  overflow: hidden;
  isolation: isolate;
  background-color: #000;
}
.is-lowres::before {
  content: "";
  position: absolute;
  inset: -24px;
  z-index: -1;
  background-image: var(--jv-lowres-bg, none);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  filter: blur(18px) brightness(.55);
  transform: scale(1.06);
  pointer-events: none;
}
/* the blurred copy sits at z-index -1 inside the isolated frame: above the frame background, below the theme's own
   picture and overlays, whatever their positioning (lowres.js makes a static frame position: relative) */
.is-lowres img {
  object-fit: contain !important;
  max-width: min(100%, var(--jv-lowres-w, 100%)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 2. RTL bidi: on Arabic pages every title, description, actor and tag line takes its direction from its own first
      strong character, so "18 Year Old ..." keeps "18" at the line start (THM 5.6, bidi.json) */
:root[dir="rtl"] :is(h1, h2, h3, [class*="title"], [class*="desc"], [class*="synopsis"], [class*="summary"], [class*="actor"], [class*="tag"]) {
  unicode-bidi: plaintext;
}
/* paragraphs inside description blocks (jav "film-desc__body", topaz "tz-prose", topaz-modern "tp-prose",
   velvet-modern "vp-synopsis"): unicode-bidi is not inherited, so each paragraph gets the rule itself */
:root[dir="rtl"] :is([class*="desc"], [class*="synopsis"], [class*="prose"], [class*="summary"]) :is(p, li) {
  unicode-bidi: plaintext;
}

/* 3. subcats: child categories of the current category as one horizontally scrolling chip row */
.jv-subcats {
  margin: .5rem 0 1rem;
  max-width: 100%;
}
.jv-subcats-row {
  display: flex;
  gap: .5rem;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  padding: 2px 2px 6px;
}
.jv-subcat {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 4px 12px;
  border: 1px solid rgba(127, 127, 127, .4);
  border: 1px solid color-mix(in srgb, currentColor 28%, transparent);
  border-radius: 999px;
  color: inherit;
  font-size: .875rem;
  line-height: 1.2;
  white-space: nowrap;
  text-decoration: none;
}
.jv-subcat:hover,
.jv-subcat:focus-visible {
  border-color: currentColor;
}
.jv-subcat.is-active {
  border-color: currentColor;
  background: rgba(127, 127, 127, .18);
  background: color-mix(in srgb, currentColor 14%, transparent);
  font-weight: 600;
}

/* 4. quality badge (AvdbLanguage::qualityBadge); themes place it with their own class */
.jv-q {
  display: inline-block;
  padding: 1px 5px;
  border-radius: 3px;
  background: rgba(0, 0, 0, .72);
  color: #fff;
  font: 700 11px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  letter-spacing: .02em;
  white-space: nowrap;
}

/* 5. provider block: one home section for the provider parent when another catalog also has videos */
.jv-pblock {
  margin: 1.5rem 0;
}
.jv-pblock-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .75rem;
}
.jv-pblock-title {
  margin: 0;
  font-size: 1.25rem;
  line-height: 1.3;
}
.jv-pblock-more {
  color: inherit;
  opacity: .85;
  white-space: nowrap;
}
.jv-pblock-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 1rem;
}
@media (max-width: 640px) {
  .jv-pblock-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .6rem;
  }
}
/* list notes (HO-S-2 / HO-S-5): search planner message, "About {n} results", "{n}+ videos" */
.jv-list-note {
  margin: .75rem 0;
  font-size: .9em;
  opacity: .8;
}
.jv-list-note span + span::before {
  content: " \00b7  ";
}
/* 6. shared pager (NOLIMIT D1): gaps, jump links, "Go to page" (pager.js), open-mode links (Newer / Older results / Oldest) */
.jv-pg-gap {
  display: inline-flex;
  align-items: center;
  padding: 0 .25rem;
  opacity: .7;
}
.jv-pg-more {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .45rem .5rem;
  max-width: 100%;
  margin: .75rem auto 0;
  font-size: .875rem;
  line-height: 1.2;
}
.jv-pg-jumps {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .35rem;
}
.jv-pg-jump,
.jv-pg-link,
.jv-pg-btn,
.jv-pg-in {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.75rem;
  min-height: 2.5rem;
  margin: 0;
  padding: .45rem .7rem;
  border: 1px solid rgba(127, 127, 127, .45);
  border-radius: 999px;
  background: transparent;
  color: inherit;
  font: inherit;
  text-decoration: none;
  white-space: nowrap;
}
.jv-pg-jump:hover,
.jv-pg-link:hover,
.jv-pg-btn:hover {
  border-color: currentColor;
}
.jv-pg-jump:focus-visible,
.jv-pg-link:focus-visible,
.jv-pg-btn:focus-visible,
.jv-pg-in:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}
.jv-pg-link,
.jv-pg-btn {
  font-weight: 600;
  cursor: pointer;
}
.jv-pg-go {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  margin: 0;
}
.jv-pg-go label {
  opacity: .85;
}
.jv-pg-in {
  width: 6.5em;
  min-width: 0;
  border-radius: .5rem;
  text-align: center;
  -moz-appearance: textfield;
  appearance: textfield;
}
.jv-pg-in::-webkit-outer-spin-button,
.jv-pg-in::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.jv-pg-of {
  font-size: .85em;
  opacity: .7;
}
/* 7. theme pager adjustments for long page numbers (NOLIMIT D1: first / last stay visible on phones, 7-digit labels fit) */
.nc-pager[data-long] .nc-pg {
  width: auto;
  min-width: 46px;
  padding: 0 10px;
}
.nc-pager[data-long] .nc-pg b {
  font-size: 12px;
}
nav.pager .jump input {
  width: 5.5em;
}
@media (max-width: 767px) {
  .hn-pager[data-long] a.hn-pg.jv-pg-edge {
    display: grid !important;
  }
  .stui-page__item li.pg-edge {
    display: block;
  }
  nav.tz-pager a.tz-pg--edge {
    display: grid;
  }
  nav.tp-pager a.tp-pg--edge {
    display: inline-flex;
  }
  nav.pager a.edge {
    display: inline-grid;
  }
  nav.ox-pager a.ox-pg-edge {
    display: grid;
  }
  .nc-pager[data-long] .nc-pg {
    min-width: 42px;
    padding: 0 8px;
  }
}