
/* ============================================================
   KOSOVA TV V3302.2 — iOS SAFARI + PWA HARDENING
   Final iPhone/Safari/PWA compatibility layer.
   Does not alter playback/source logic.
   ============================================================ */

html.ktv-ios,
html.ktv-ios body{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  overscroll-behavior-y:none;
}

html.ktv-ios input,
html.ktv-ios select,
html.ktv-ios textarea{
  font-size:16px!important; /* stop iOS Safari zoom */
}

/* Dynamic viewport variable set by JS, avoids Safari address-bar jumps */
html.ktv-ios #live.player-overlay.open{
  height:var(--ktv-app-height,100dvh)!important;
  max-height:var(--ktv-app-height,100dvh)!important;
}

html.ktv-ios #live .player-shell{
  max-height:var(--ktv-app-height,100dvh)!important;
}

/* iPhone / Safari player sizing */
@media (max-width:760px){
  html.ktv-ios #live{
    position:fixed!important;
    inset:0!important;
    width:100%!important;
    height:var(--ktv-app-height,100dvh)!important;
    padding:0!important;
    overflow:hidden!important;
    background:#02050a!important;
  }

  html.ktv-ios #live .player-shell{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    border:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    display:flex!important;
    flex-direction:column!important;
  }

  html.ktv-ios #live .player-topbar{
    flex:0 0 auto!important;
    min-height:56px!important;
    padding:
      max(6px,env(safe-area-inset-top,0px))
      10px
      6px!important;
    background:rgba(5,9,14,.985)!important;
  }

  html.ktv-ios #live .player-layout{
    flex:1 1 auto!important;
    height:auto!important;
    min-height:0!important;
    overflow:hidden!important;
  }

  html.ktv-ios #live .player-main{
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
  }

  html.ktv-ios #live .video-wrap{
    flex:0 0 auto!important;
    width:100%!important;
    min-height:0!important;
    background:#000!important;
  }

  html.ktv-ios #live video{
    display:block!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:16/9!important;
    max-height:min(34dvh,calc(var(--ktv-app-height,100dvh) * .34))!important;
    object-fit:contain!important;
    background:#000!important;
  }

  /* Keep controls usable and not clipped by iPhone Home indicator */
  html.ktv-ios #live .player-controlbar{
    flex:0 0 auto!important;
    padding:7px 8px max(8px,env(safe-area-inset-bottom,0px))!important;
    overflow:hidden!important;
  }

  html.ktv-ios #live .player-actions{
    width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }

  html.ktv-ios #live .player-actions::-webkit-scrollbar{
    display:none!important;
  }

  html.ktv-ios #live .player-actions button,
  html.ktv-ios #live .quality-control{
    flex:0 0 auto!important;
    min-height:42px!important;
  }

  /* Final drawer behavior for BOTH Safari and installed PWA */
  html.ktv-ios #live .player-drawer{
    position:absolute!important;
    z-index:120!important;
    left:7px!important;
    right:7px!important;
    bottom:max(7px,env(safe-area-inset-bottom,0px))!important;
    top:auto!important;

    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:min(76dvh,calc(var(--ktv-app-height,100dvh) * .76))!important;

    display:flex!important;
    flex-direction:column!important;

    border:1px solid rgba(255,255,255,.13)!important;
    border-radius:23px!important;

    background:
      radial-gradient(circle at 50% -12%,rgba(255,35,72,.10),transparent 29%),
      rgba(8,13,20,.99)!important;

    box-shadow:
      0 -18px 68px rgba(0,0,0,.58),
      0 20px 70px rgba(0,0,0,.42)!important;

    backdrop-filter:blur(20px)!important;
    -webkit-backdrop-filter:blur(20px)!important;

    overflow:hidden!important;

    transform:translate3d(0,calc(100% + 34px),0)!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    will-change:transform!important;

    transition:
      transform .24s cubic-bezier(.2,.75,.2,1),
      opacity .18s ease,
      visibility .18s ease!important;
  }

  html.ktv-ios #live.drawer-open .player-drawer{
    transform:translate3d(0,0,0)!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }

  html.ktv-ios #live .player-drawer::before{
    content:""!important;
    flex:0 0 auto!important;
    display:block!important;
    width:46px!important;
    height:4px!important;
    margin:8px auto 2px!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.26)!important;
  }

  html.ktv-ios #live.drawer-open .player-shell::after{
    content:""!important;
    position:absolute!important;
    inset:56px 0 0!important;
    z-index:105!important;
    background:rgba(0,0,0,.42)!important;
    pointer-events:none!important;
  }

  html.ktv-ios #live.drawer-open .player-drawer{
    z-index:125!important;
  }

  html.ktv-ios #live .drawer-head{
    flex:0 0 auto!important;
    min-height:54px!important;
    padding:6px 10px 8px!important;
  }

  html.ktv-ios #live .drawer-head button{
    min-width:40px!important;
    min-height:40px!important;
  }

  html.ktv-ios #live .drawer-search{
    flex:0 0 auto!important;
    margin:8px 10px!important;
    min-height:44px!important;
  }

  html.ktv-ios #live .drawer-search input,
  html.ktv-ios #drawerSearch{
    font-size:16px!important;
  }

  html.ktv-ios #drawerList{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    padding:
      0 8px
      calc(14px + env(safe-area-inset-bottom,0px))!important;
  }

  html.ktv-ios #drawerList .drawer-channel{
    min-height:60px!important;
    grid-template-columns:42px minmax(0,1fr) auto!important;
    gap:9px!important;
    padding:7px 8px!important;
    border-radius:13px!important;
  }

  html.ktv-ios #drawerList .drawer-channel img,
  html.ktv-ios #drawerList .drawer-fallback{
    width:42px!important;
    height:42px!important;
    border-radius:10px!important;
  }

  /* Homepage mobile/PWA app shell */
  html.ktv-ios.ktv-standalone body{
    padding-top:env(safe-area-inset-top,0px)!important;
    padding-bottom:env(safe-area-inset-bottom,0px)!important;
    background:#05080d!important;
  }

  html.ktv-ios.ktv-standalone .ott-header{
    padding-top:0!important;
  }

  html.ktv-ios.ktv-standalone .mobile-dock{
    bottom:max(8px,env(safe-area-inset-bottom,0px))!important;
  }

  html.ktv-ios.ktv-standalone .pwa-install{
    display:none!important;
  }
}

/* Smaller iPhones */
@media (max-width:390px){
  html.ktv-ios #live video{
    max-height:min(31dvh,calc(var(--ktv-app-height,100dvh) * .31))!important;
  }

  html.ktv-ios #live .player-drawer{
    left:5px!important;
    right:5px!important;
    height:min(79dvh,calc(var(--ktv-app-height,100dvh) * .79))!important;
    border-radius:21px!important;
  }
}

/* Landscape iPhone: maximize video without breaking drawer */
@media (max-height:500px) and (orientation:landscape){
  html.ktv-ios #live .player-topbar{
    min-height:46px!important;
    padding-top:max(3px,env(safe-area-inset-top,0px))!important;
    padding-bottom:3px!important;
  }

  html.ktv-ios #live video{
    max-height:calc(var(--ktv-app-height,100dvh) - 102px)!important;
  }

  html.ktv-ios #live .player-drawer{
    top:5px!important;
    bottom:5px!important;
    right:max(5px,env(safe-area-inset-right,0px))!important;
    left:auto!important;
    width:min(390px,68vw)!important;
    height:auto!important;
    transform:translate3d(calc(100% + 24px),0,0)!important;
  }

  html.ktv-ios #live.drawer-open .player-drawer{
    transform:translate3d(0,0,0)!important;
  }
}
