/* V8: multilingual interface, no new runtime libraries or external calls. */
.v8-language-picker{position:relative;display:inline-block;z-index:65;font-size:13px;color:#fff;direction:ltr}
.v8-language-picker summary{display:flex;align-items:center;gap:5px;cursor:pointer;list-style:none;white-space:nowrap;min-height:30px;padding:4px 8px}
.v8-language-picker summary::-webkit-details-marker{display:none}
.v8-language-picker summary:focus-visible{outline:2px solid #ffe000;outline-offset:2px}
.v8-language-list{position:absolute;inset-inline-end:0;top:100%;display:grid;grid-template-columns:repeat(2,minmax(170px,1fr));gap:0;min-width:390px;max-width:min(94vw,550px);max-height:min(68vh,470px);overflow-y:auto;background:#05045b;border:1px solid #5c71e8;box-shadow:0 12px 32px #0009;padding:8px;z-index:70}
.v8-language-picker:not([open]) .v8-language-list{display:none}
.v8-language-list a{padding:6px 8px;display:flex;align-items:center;gap:7px;color:#fff;font-size:13px;min-height:30px;text-decoration:none;white-space:normal}
.v8-language-list a small{font-size:9px;color:#aebcec;margin-inline-start:auto;white-space:nowrap}
.v8-language-list a:hover,.v8-language-list a[aria-current="page"]{background:#1b45bc}
.v8-translation-note{margin:10px auto 16px;max-width:1045px;color:#d6dfff;font-size:13px;line-height:1.5}
.v8-translation-note a{color:#ffe000;text-decoration:underline}
.v8-translation-preview{color:#c7cfff;font-size:12px;margin:0 auto 12px;max-width:1045px}
.wordmark{direction:ltr;unicode-bidi:isolate}
html[dir="rtl"] .main-content,html[dir="rtl"] .sidebar{text-align:right}
html[dir="rtl"] .wordmark,html[dir="rtl"] .search-form,html[dir="rtl"] .thumbnail{direction:ltr}
html[dir="rtl"] .category-card .video-badge{direction:rtl}
@media(max-width:760px){
 .mobile-tools .v8-language-picker{height:46px;width:100%;display:flex;justify-content:center;align-items:center}
 .mobile-tools .v8-language-picker summary{padding:4px;font-size:0;justify-content:center;height:42px;white-space:nowrap}
 .mobile-tools .v8-language-picker summary:before{content:"🌐";font-size:22px}
 .mobile-tools .v8-language-picker summary span{font-size:11px}
 .mobile-tools .v8-language-list{position:fixed;top:131px;left:3vw;right:3vw;inset-inline-end:auto;grid-template-columns:repeat(2,minmax(0,1fr));min-width:0;max-width:none;max-height:60vh}
 .v8-language-list a{font-size:12px;padding:7px 5px}
 .v8-translation-note,.v8-translation-preview{margin:10px 0}
}

/* V8.0.2: stable RTL widths + compact, readable 51-locale dropdown. */
:root{--v8-menu-bg:#05045b;--v8-menu-border:#6779ed}
html,body{max-width:100%;min-width:0}
.site-header,.header-inner,.primary-nav,.page-shell,.sidebar,.main-content,.page-section,.category-grid,.category-card{min-width:0;max-width:100%}
.header-inner{width:100%}
.header-center{min-width:0}
.header-right{min-width:0}
.v8-language-picker{direction:ltr;position:relative;z-index:80;max-width:100%;min-width:0}
.v8-language-picker summary{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:34px;max-width:100%;padding:4px 7px;color:#fff;user-select:none;border-radius:3px;outline-offset:2px}
.v8-language-picker[open] summary,.v8-language-picker summary:hover{background:#1b45bc}
.v8-language-picker summary .v8-current-name{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.v8-language-picker summary .v8-chevron{font-size:10px;color:#cbd5ff}
.v8-language-list{box-sizing:border-box;position:absolute;top:calc(100% + 4px);right:0;left:auto;inset-inline-end:auto;direction:ltr;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px;width:min(490px,calc(100vw - 24px));min-width:0;max-width:calc(100vw - 24px);max-height:min(65vh,520px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#8094f5 #080763;background:var(--v8-menu-bg);border:1px solid var(--v8-menu-border);box-shadow:0 12px 28px #0009;padding:8px;border-radius:3px;z-index:100}
.v8-language-picker:not([open]) .v8-language-list{display:none}
.v8-language-list a{box-sizing:border-box;display:grid;grid-template-columns:22px minmax(0,1fr) auto;align-items:center;column-gap:6px;min-width:0;min-height:35px;padding:6px 7px;text-align:start;line-height:1.25;font-size:13px;border-radius:2px}
.v8-language-list .v8-flag{font-size:16px;line-height:1;white-space:nowrap}
.v8-language-list .v8-native{min-width:0;overflow-wrap:anywhere;unicode-bidi:isolate}
.v8-language-list small{margin:0;font-size:10px;color:#becaff;white-space:nowrap;justify-self:end}
.v8-language-list a:hover,.v8-language-list a:focus-visible,.v8-language-list a[aria-current="page"]{background:#1b45bc;outline-offset:-2px}
.v8-translation-note,.v8-translation-preview{min-width:0;overflow-wrap:anywhere}
html[dir="rtl"] .header-right{margin-left:0;margin-inline-start:auto}
html[dir="rtl"] .site-header,html[dir="rtl"] .page-shell,html[dir="rtl"] .main-content{min-width:0;max-width:100%}
html[dir="rtl"] .header-center{flex:1 1 230px;min-width:0}
html[dir="rtl"] .brand-block{min-width:0}
html[dir="rtl"] .sidebar{box-shadow:-3px 0 12px rgba(0,0,0,.22)}
html[dir="rtl"] .category-grid{min-width:0}
html[dir="rtl"] .wordmark{white-space:nowrap}
/* Keep off-screen menus inside the viewport without globally hiding real overflow. */
html[dir="rtl"] .v8-language-list{left:0;right:auto}
@media(max-width:1100px) and (min-width:761px){
 .v8-language-list{width:min(420px,calc(100vw - 24px))}
 html[dir="rtl"] .header-right{gap:8px}
}
@media(max-width:760px){
 .mobile-tools .v8-language-picker{width:100%;height:46px;min-width:0;display:flex;align-items:center;justify-content:center;max-width:100%}
 .mobile-tools .v8-language-picker summary{width:100%;height:44px;min-height:0;max-width:100%;padding:3px 1px;gap:2px;font-size:21px;justify-content:center}
 .mobile-tools .v8-language-picker summary:before{content:none}
 .mobile-tools .v8-language-picker summary .v8-current-name{display:none}
 .mobile-tools .v8-language-picker summary .v8-chevron{font-size:10px}
 .mobile-tools .v8-language-list,.v8-language-list{position:fixed;top:calc(132px + env(safe-area-inset-top,0px));left:8px;right:8px;inset-inline-end:auto;direction:ltr;width:auto;min-width:0;max-width:none;max-height:min(65vh,520px);grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;padding:6px}
 .v8-language-list a{padding:7px 5px;min-height:38px;font-size:12px;grid-template-columns:21px minmax(0,1fr) auto;column-gap:4px}
 .v8-language-list small{font-size:9px}
 html[dir="rtl"] .v8-language-list{left:8px;right:8px}
 html[dir="rtl"] .header-inner{min-width:0;max-width:100%}
 html[dir="rtl"] .brand-block{min-width:0;max-width:100%}
 html[dir="rtl"] .brand-block .wordmark{max-width:100%;font-size:clamp(27px,9.1vw,42px)}
 html[dir="rtl"] .sidebar{left:12%;right:0}
 html[dir="rtl"] .sidebar.is-open{left:12%;right:0}
 html[dir="rtl"] .page-shell{width:100%}
}
@media(max-width:380px){
 .v8-language-list,.mobile-tools .v8-language-list{grid-template-columns:minmax(0,1fr)}
}

/* V8.2.4: prevent the legacy off-screen skip link from creating a ~999px
   horizontal scroll area on right-to-left mobile pages. Preserve keyboard access. */
html[dir="rtl"] .skip-link{
  left:auto;
  right:0;
  top:0;
  width:1px;
  height:1px;
  padding:0;
  overflow:hidden;
  clip:rect(0,0,0,0);
  clip-path:inset(50%);
  white-space:nowrap;
}
html[dir="rtl"] .skip-link:focus,
html[dir="rtl"] .skip-link:focus-visible{
  left:auto;
  right:10px;
  top:5px;
  width:auto;
  height:auto;
  padding:10px;
  overflow:visible;
  clip:auto;
  clip-path:none;
  white-space:normal;
}


/* V8.2.5: RTL mobile watch-page content containment.
   Preserve the V8.2.4 skip-link fix. Avoid global overflow hiding;
   wrap long multilingual headings, descriptions, buttons and tag labels instead. */
@media (max-width:760px) {
  html[dir="rtl"] .watch-layout .main-content {
    padding-inline: 18px;
  }
  html[dir="rtl"] .watch-layout .watch-section,
  html[dir="rtl"] .watch-layout .watch-title,
  html[dir="rtl"] .watch-layout .v82-description,
  html[dir="rtl"] .watch-layout .crumbs,
  html[dir="rtl"] .watch-layout .watch-actions,
  html[dir="rtl"] .watch-layout .watch-metadata {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
    text-align: right;
  }
  html[dir="rtl"] .watch-layout .watch-player {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }
  html[dir="rtl"] .watch-layout .watch-poster,
  html[dir="rtl"] .watch-layout .watch-player iframe {
    display: block;
    width: 100%;
    max-width: 100%;
    height: 100%;
  }
  html[dir="rtl"] .watch-layout .player-launch {
    max-width: calc(100% - 24px);
    white-space: normal;
    overflow-wrap: anywhere;
  }
  html[dir="rtl"] .watch-layout .watch-tags {
    box-sizing: border-box;
    direction: rtl;
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 6px;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }
  html[dir="rtl"] .watch-layout .watch-tags > a {
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
    flex: 0 1 auto;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
    unicode-bidi: isolate;
    text-align: right;
  }
}


/* V8.2.6: isolate the watch-page layout from inherited document RTL.
   Verified in Chrome iPhone emulation: preserve Arabic reading direction for text
   while laying out the watch section itself left-to-right. Only applies to
   RTL watch pages at mobile widths; other pages/locales remain unchanged. */
@media (max-width: 760px) {
  html[dir="rtl"] body.watch-layout .watch-section {
    direction: ltr;
  }

  html[dir="rtl"] body.watch-layout .watch-section .crumbs,
  html[dir="rtl"] body.watch-layout .watch-section .watch-title,
  html[dir="rtl"] body.watch-layout .watch-section .v82-description,
  html[dir="rtl"] body.watch-layout .watch-section .watch-actions,
  html[dir="rtl"] body.watch-layout .watch-section .watch-metadata,
  html[dir="rtl"] body.watch-layout .watch-section .watch-tags {
    direction: rtl;
    text-align: right;
  }
}
