
body{padding-bottom:calc(82px + env(safe-area-inset-bottom));}

.bottom-nav{
  position:fixed !important;
  left:50% !important;
  right:auto !important;
  bottom:max(10px,env(safe-area-inset-bottom)) !important;
  transform:translateX(-50%) !important;
  z-index:99999 !important;

  width:min(1180px,calc(100vw - 24px)) !important;
  height:72px !important;
  padding:7px 8px !important;

  display:grid !important;
  grid-template-columns:repeat(7,minmax(0,1fr)) !important;
  grid-template-rows:1fr !important;
  align-items:center !important;
  gap:6px !important;

  border:1px solid rgba(255,255,255,.10) !important;
  border-radius:20px !important;
  background:rgba(13,16,22,.96) !important;
  -webkit-backdrop-filter:blur(18px) !important;
  backdrop-filter:blur(18px) !important;
  box-shadow:0 14px 44px rgba(0,0,0,.42) !important;

  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
  overflow:hidden !important;
}

/* v179 — live TV has 6 buttons; movies has 7. Prevent empty right column. */
.bottom-nav.bottom-nav-live{
  grid-template-columns:repeat(6,minmax(0,1fr)) !important;
}
.bottom-nav.bottom-nav-movies{
  grid-template-columns:repeat(7,minmax(0,1fr)) !important;
}

.bottom-nav>button{
  min-width:0 !important;
  width:100% !important;
  height:56px !important;
  margin:0 !important;
  padding:0 8px !important;

  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;

  border:0 !important;
  border-radius:13px !important;
  background:transparent !important;
  color:#aeb7c5 !important;

  font:inherit !important;
  font-size:11px !important;
  font-weight:800 !important;
  white-space:nowrap !important;
  cursor:pointer !important;
}

.bottom-nav>button.nav-active{
  background:#1a202b !important;
  color:#fff !important;
}

.bottom-nav>button svg{
  width:19px !important;
  height:19px !important;
  min-width:19px !important;
  flex:0 0 19px !important;
  margin:0 !important;
  fill:none !important;
  stroke:currentColor !important;
  stroke-width:1.9 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}

.bottom-nav>button:first-child svg{
  fill:currentColor !important;
}

.bottom-nav>button span{
  display:inline-block !important;
  width:auto !important;
  margin:0 !important;
  padding:0 !important;
  line-height:1 !important;
  white-space:nowrap !important;
}

@media(min-width:700px){
  .bottom-nav{
    height:76px !important;
    padding:8px 12px !important;
    gap:10px !important;
  }
  .bottom-nav>button{
    height:60px !important;
    gap:9px !important;
    padding:0 12px !important;
    font-size:13px !important;
  }
  .bottom-nav>button svg{
    width:23px !important;
    height:23px !important;
    min-width:23px !important;
    flex-basis:23px !important;
  }
}

@media(max-width:620px){
  body{padding-bottom:calc(72px + env(safe-area-inset-bottom)) !important;}
  .bottom-nav{
    width:calc(100vw - 12px) !important;
    height:64px !important;
    bottom:max(6px,env(safe-area-inset-bottom)) !important;
    padding:5px 4px !important;
    gap:1px !important;
    border-radius:16px !important;
  }
  .bottom-nav>button{
    height:52px !important;
    padding:0 1px !important;
    gap:3px !important;
    font-size:7.6px !important;
  }
  .bottom-nav>button svg{
    width:15px !important;
    height:15px !important;
    min-width:15px !important;
    flex-basis:15px !important;
  }
}


/* v18 — one clean clearance: normal channel strip + nav underneath */
.player.open ~ .bottom-nav{
  display:grid !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
}

@media(max-width:620px){
  .player.open{
    padding-bottom:calc(70px + env(safe-area-inset-bottom)) !important;
  }
  .player.open .strip-panel{
    height:122px !important;
    padding:8px 8px 10px !important;
  }
  .player.open .channel-strip{
    height:80px !important;
    margin-bottom:0 !important;
  }
  .player.open ~ .bottom-nav{
    bottom:max(6px,env(safe-area-inset-bottom)) !important;
    z-index:1100 !important;
  }
}

.player.is-fullscreen{
  padding-bottom:0 !important;
}
.player.is-fullscreen ~ .bottom-nav,
.player:fullscreen ~ .bottom-nav,
.player:-webkit-full-screen ~ .bottom-nav,
:fullscreen .bottom-nav{
  display:none !important;
}

/* v19 — desktop player clearance: keep bottom navigation BELOW the channel strip */
@media (min-width:621px){
  .player.open{
    padding-bottom:calc(98px + env(safe-area-inset-bottom)) !important;
  }

  .player.open ~ .bottom-nav{
    bottom:max(10px,env(safe-area-inset-bottom)) !important;
    z-index:1100 !important;
  }
}

/* v20 — compact bottom navigation on mobile landscape only */
@media (max-height:500px) and (orientation:landscape) and (pointer:coarse){
  body{padding-bottom:calc(50px + env(safe-area-inset-bottom)) !important;}
  .bottom-nav{
    width:min(760px,calc(100vw - 18px)) !important;
    height:44px !important;
    bottom:max(3px,env(safe-area-inset-bottom)) !important;
    padding:3px 5px !important;
    gap:2px !important;
    border-radius:12px !important;
  }
  .bottom-nav>button{
    height:36px !important;
    padding:0 4px !important;
    gap:4px !important;
    border-radius:9px !important;
    font-size:8.5px !important;
  }
  .bottom-nav>button svg{
    width:13px !important;
    height:13px !important;
    min-width:13px !important;
    flex-basis:13px !important;
  }
  .player.open{
    padding-bottom:calc(48px + env(safe-area-inset-bottom)) !important;
  }
  .player.open ~ .bottom-nav{
    bottom:max(3px,env(safe-area-inset-bottom)) !important;
  }
}

/* v169 — Movies/Series favorites */
body[data-view="movies"] .bottom-nav>button#movieNavFavorites svg{fill:currentColor!important;}
body[data-view="movies"] .bottom-nav>button#movieNavFavorites.nav-active{color:#ff5a4f!important;background:rgba(255,72,32,.12)!important;}
@media(max-width:620px){body[data-view="movies"] .bottom-nav>button{font-size:7px!important;gap:2px!important;}body[data-view="movies"] .bottom-nav>button svg{width:14px!important;height:14px!important;min-width:14px!important;flex-basis:14px!important;}}

/* v227 — mobile Kurdish bottom bar cleanup: icon above text, no overlap */
@media (max-width:620px){
  body{padding-bottom:calc(82px + env(safe-area-inset-bottom)) !important;}
  .bottom-nav{
    direction:ltr !important;
    height:74px !important;
    padding:5px 3px !important;
    gap:2px !important;
    overflow:visible !important;
  }
  .bottom-nav>button{
    height:62px !important;
    min-width:0 !important;
    padding:3px 1px 2px !important;
    gap:3px !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    overflow:hidden !important;
    line-height:1 !important;
  }
  .bottom-nav>button svg{
    width:17px !important;
    height:17px !important;
    min-width:17px !important;
    flex:0 0 17px !important;
  }
  .bottom-nav>button span{
    width:100% !important;
    max-width:100% !important;
    min-height:18px !important;
    max-height:22px !important;
    padding:0 1px !important;
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    overflow:hidden !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    text-align:center !important;
    line-height:1.05 !important;
    font-size:8px !important;
  }
  body.live-lang-ku .bottom-nav>button span,
  html[dir="rtl"] .bottom-nav>button span{
    direction:rtl !important;
    font-family:SpedaKurd,'Speda Kurdish',Tahoma,Arial,sans-serif !important;
    font-size:8.6px !important;
    line-height:1.05 !important;
  }
  .player.open{padding-bottom:calc(80px + env(safe-area-inset-bottom)) !important;}
  .player.open ~ .bottom-nav{bottom:max(6px,env(safe-area-inset-bottom)) !important;}
}

/* Slightly roomier Live TV bar: only six actions. */
@media (max-width:620px){
  .bottom-nav.bottom-nav-live>button span{font-size:8.6px !important;}
  body.live-lang-ku .bottom-nav.bottom-nav-live>button span{font-size:9px !important;}
}

/* v228 — Kurdish navigation follows RTL */
html[dir="rtl"] .bottom-nav, body.live-lang-ku .bottom-nav{direction:rtl !important;}
html[dir="rtl"] .bottom-nav>button, body.live-lang-ku .bottom-nav>button{direction:rtl !important;}

/* v230 — mobile bottom bar readability fix: larger icons + readable labels */
@media (max-width:620px){
  body{padding-bottom:calc(82px + env(safe-area-inset-bottom)) !important;}

  .bottom-nav{
    width:calc(100vw - 10px) !important;
    height:74px !important;
    bottom:max(5px,env(safe-area-inset-bottom)) !important;
    padding:5px 3px !important;
    gap:2px !important;
    border-radius:17px !important;
    overflow:visible !important;
  }

  .bottom-nav>button{
    height:62px !important;
    min-width:0 !important;
    padding:5px 1px 4px !important;
    gap:5px !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:11px !important;
    font-size:9px !important;
    font-weight:800 !important;
    line-height:1.05 !important;
    letter-spacing:0 !important;
    overflow:hidden !important;
  }

  .bottom-nav>button svg{
    width:20px !important;
    height:20px !important;
    min-width:20px !important;
    flex:0 0 20px !important;
    stroke-width:2.2 !important;
  }

  .bottom-nav>button span{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    text-align:center !important;
    line-height:1.15 !important;
    white-space:nowrap !important;
  }

  .bottom-nav>button.nav-active{
    background:#1b2430 !important;
    color:#fff !important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.055) !important;
  }
}

/* Small phones: keep all 7 movie buttons readable without shrinking icons. */
@media (max-width:390px){
  .bottom-nav>button{font-size:8.2px !important;gap:4px !important;}
  .bottom-nav>button svg{width:19px !important;height:19px !important;min-width:19px !important;flex-basis:19px !important;}
}


/* v231 — restore Movies bottom navigation and keep all seven actions visible */
.bottom-nav.bottom-nav-movies{
  display:grid !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
  grid-template-columns:repeat(7,minmax(0,1fr)) !important;
  z-index:99999 !important;
}
@media(max-width:620px){
  .bottom-nav.bottom-nav-movies{
    width:calc(100vw - 8px) !important;
    height:76px !important;
    padding:5px 2px !important;
    gap:1px !important;
  }
  .bottom-nav.bottom-nav-movies>button{
    display:flex !important;
    flex-direction:column !important;
    height:64px !important;
    padding:4px 0 3px !important;
    gap:4px !important;
    overflow:visible !important;
  }
  .bottom-nav.bottom-nav-movies>button svg{
    display:block !important;
    width:20px !important;height:20px !important;min-width:20px !important;flex:0 0 20px !important;
  }
  .bottom-nav.bottom-nav-movies>button span{
    display:block !important;
    width:100% !important;
    font-size:7.8px !important;
    line-height:1.1 !important;
    text-align:center !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
  html[dir="rtl"] .bottom-nav.bottom-nav-movies>button span{font-size:8.4px !important;}
}


/* v232 — Movies EN labels: more breathing room between icon and text. */
@media(max-width:620px){
  html[dir="ltr"] .bottom-nav.bottom-nav-movies>button{
    gap:8px !important;
    padding-top:5px !important;
    padding-bottom:5px !important;
  }
  html[dir="ltr"] .bottom-nav.bottom-nav-movies>button span{
    line-height:1.2 !important;
  }
}

/* v234 — Mobile Sorani Live TV nav: give icon and label breathing room.
   Scoped to RTL + live bar only, so English and Movies are unchanged. */
@media(max-width:620px){
  html[dir="rtl"] .bottom-nav.bottom-nav-live>button{
    flex-direction:column !important;
    justify-content:center !important;
    align-items:center !important;
    gap:5px !important;
    padding:3px 1px 2px !important;
    line-height:1.05 !important;
  }
  html[dir="rtl"] .bottom-nav.bottom-nav-live>button svg{
    width:17px !important;
    height:17px !important;
    min-width:17px !important;
    flex:0 0 17px !important;
  }
  html[dir="rtl"] .bottom-nav.bottom-nav-live>button span{
    line-height:1.15 !important;
  }
}

/* v235 — Mobile Sorani Movies nav: match the Live TV icon/label spacing. */
@media(max-width:620px){
  html[dir="rtl"] .bottom-nav.bottom-nav-movies>button{
    flex-direction:column !important;
    justify-content:center !important;
    align-items:center !important;
    gap:7px !important;
    padding:4px 0 3px !important;
    line-height:1.05 !important;
  }
  html[dir="rtl"] .bottom-nav.bottom-nav-movies>button svg{
    width:18px !important;
    height:18px !important;
    min-width:18px !important;
    flex:0 0 18px !important;
  }
  html[dir="rtl"] .bottom-nav.bottom-nav-movies>button span{
    line-height:1.2 !important;
    margin-top:0 !important;
  }
}

/* v238 — soft neutral light moving slowly across Live TV + Movies nav.
   Low-contrast white glow; translate3d keeps the motion smooth on iPhone Safari. */
.bottom-nav{
  isolation:isolate !important;
  overflow:hidden !important;
  background:rgba(13,16,22,.95) !important;
  -webkit-transform:translateZ(0);
  transform:translateZ(0);
}

.bottom-nav::before{
  content:"";
  position:absolute;
  z-index:0;
  pointer-events:none;
  top:-70px;
  left:-180px;
  width:260px;
  height:190px;
  border-radius:50%;
  opacity:.42;
  background:radial-gradient(ellipse at center,
    rgba(255,255,255,.34) 0%,
    rgba(226,236,248,.22) 28%,
    rgba(190,210,232,.10) 50%,
    rgba(190,210,232,0) 74%
  );
  -webkit-filter:blur(12px);
  filter:blur(12px);
  -webkit-transform:translate3d(0,0,0);
  transform:translate3d(0,0,0);
  -webkit-animation:bottomNavSoftLight 16s ease-in-out infinite;
  animation:bottomNavSoftLight 16s ease-in-out infinite;
  will-change:transform;
}

.bottom-nav::after{
  content:"";
  position:absolute;
  z-index:0;
  pointer-events:none;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(180deg,rgba(255,255,255,.035),transparent 50%,rgba(0,0,0,.08));
}

.bottom-nav>button{
  position:relative !important;
  z-index:1 !important;
}

@-webkit-keyframes bottomNavSoftLight{
  0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);}
  50%{-webkit-transform:translate3d(calc(100vw + 120px),0,0);transform:translate3d(calc(100vw + 120px),0,0);}
  100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);}
}
@keyframes bottomNavSoftLight{
  0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);}
  50%{-webkit-transform:translate3d(calc(100vw + 120px),0,0);transform:translate3d(calc(100vw + 120px),0,0);}
  100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);}
}

@media(min-width:900px){
  .bottom-nav::before{
    width:340px;
    height:220px;
    top:-85px;
    left:-230px;
    opacity:.36;
    -webkit-animation-duration:19s;
    animation-duration:19s;
  }
}

@media(max-width:620px){
  .bottom-nav::before{
    top:-62px;
    left:-165px;
    width:245px;
    height:175px;
    opacity:.46;
    -webkit-animation-duration:16s;
    animation-duration:16s;
  }
}

/* v240 — professional desktop dock only */
@media (min-width:1100px){
  .bottom-nav{
    width:auto!important;min-width:690px!important;max-width:760px!important;height:66px!important;
    left:50%!important;right:auto!important;bottom:18px!important;transform:translateX(-50%)!important;
    padding:7px 9px!important;gap:5px!important;border-radius:19px!important;
    border:1px solid rgba(255,255,255,.105)!important;
    background:rgba(12,15,21,.91)!important;
    box-shadow:0 18px 50px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.045)!important;
    backdrop-filter:blur(22px)!important;-webkit-backdrop-filter:blur(22px)!important;
  }
  .bottom-nav>button{
    height:52px!important;min-width:102px!important;padding:0 12px!important;gap:8px!important;border-radius:13px!important;
    font-size:11px!important;color:#a7afbc!important;transition:background .18s ease,color .18s ease,transform .18s ease!important;
  }
  .bottom-nav>button svg{width:19px!important;height:19px!important;min-width:19px!important;flex-basis:19px!important}
  .bottom-nav>button:hover{background:rgba(255,255,255,.055)!important;color:#fff!important;transform:translateY(-1px)!important}
  .bottom-nav>button.active,.bottom-nav>button[aria-current="page"]{
    color:#fff!important;background:linear-gradient(135deg,rgba(255,86,42,.22),rgba(255,86,42,.08))!important;
    box-shadow:inset 0 0 0 1px rgba(255,94,48,.18)!important;
  }
}
