/* VMV Device Optimizer */

.grid{
  width:100%!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
}

.cell{
  position:relative!important;
  overflow:hidden!important;
  touch-action:manipulation!important;
  user-select:none!important;
}

.cell iframe{
  width:100%!important;
  height:100%!important;
  border:0!important;
}

/* Mobile */
@media(max-width:700px){
  .grid{
    grid-template-columns:1fr!important;
    height:auto!important;
    min-height:auto!important;
    overflow-y:auto!important;
  }

  .cell{
    aspect-ratio:16/9!important;
    min-height:auto!important;
  }

  .channel-select,
  select{
    font-size:16px!important;
  }
}

/* iPad / Tablet */
@media(min-width:701px) and (max-width:1180px){
  .grid[data-count="1"]{grid-template-columns:1fr!important}
  .grid[data-count="2"]{grid-template-columns:repeat(2,1fr)!important}
  .grid[data-count="4"]{grid-template-columns:repeat(2,1fr)!important}
  .grid[data-count="9"]{grid-template-columns:repeat(3,1fr)!important}
  .grid[data-count="12"]{grid-template-columns:repeat(3,1fr)!important}
  .grid[data-count="16"]{grid-template-columns:repeat(4,1fr)!important}
}

/* TV / Desktop */
@media(min-width:1181px){
  .grid[data-count="1"]{grid-template-columns:1fr!important}
  .grid[data-count="2"]{grid-template-columns:repeat(2,1fr)!important}
  .grid[data-count="4"]{grid-template-columns:repeat(2,1fr)!important}
  .grid[data-count="9"]{grid-template-columns:repeat(3,1fr)!important}
  .grid[data-count="12"]{grid-template-columns:repeat(4,1fr)!important}
  .grid[data-count="16"]{grid-template-columns:repeat(4,1fr)!important}
}

/* Eco mode indicator */
.vmv-eco-badge{
  position:fixed;
  left:10px;
  bottom:10px;
  z-index:9999;
  background:rgba(0,0,0,.65);
  color:#ff9d00;
  border:1px solid rgba(255,157,0,.4);
  padding:6px 9px;
  border-radius:10px;
  font-size:11px;
  font-weight:bold;
  pointer-events:none;
}