/* Canal FM v0.13.21 — organização isolada do player normal no celular vertical. */
@media (max-width:700px) and (orientation:portrait){
  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active) #cfm-player:not(:fullscreen){
    box-sizing:border-box!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;
    align-content:center!important;
    width:100%!important;
    min-height:176px!important;
    height:176px!important;
    padding:12px 14px 13px!important;
    gap:10px!important;
    overflow:visible!important;
  }

  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active) #cfm-player:not(:fullscreen) .cfm-player-station{
    grid-column:1!important;
    grid-row:1!important;
    box-sizing:border-box!important;
    width:100%!important;
    min-width:0!important;
    padding-right:52px!important;
    gap:11px!important;
    overflow:hidden!important;
  }

  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active) #cfm-player:not(:fullscreen) .cfm-player-station>img{
    flex:0 0 62px!important;
    width:62px!important;
    min-width:62px!important;
    height:62px!important;
    border-radius:14px!important;
  }

  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active) #cfm-player:not(:fullscreen) .cfm-player-copy{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
  }

  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active) #cfm-player:not(:fullscreen) .cfm-player-copy small{
    font-size:9px!important;
    line-height:1.15!important;
  }

  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active) #cfm-player:not(:fullscreen) .cfm-player-copy strong{
    display:-webkit-box!important;
    max-width:100%!important;
    overflow:hidden!important;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    white-space:normal!important;
    text-overflow:ellipsis!important;
    overflow-wrap:anywhere!important;
    font-size:15px!important;
    line-height:1.12!important;
  }

  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active) #cfm-player:not(:fullscreen) .cfm-player-location,
  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active) #cfm-player:not(:fullscreen) .cfm-player-status{
    display:block!important;
    max-width:100%!important;
    overflow:hidden!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
    font-size:9px!important;
    line-height:1.25!important;
  }

  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active) #cfm-player:not(:fullscreen) .cfm-player-controls{
    grid-column:1!important;
    grid-row:2!important;
    display:flex!important;
    box-sizing:border-box!important;
    width:100%!important;
    min-width:0!important;
    justify-content:space-evenly!important;
    align-items:center!important;
    gap:8px!important;
    padding:0 2px!important;
    overflow:visible!important;
    flex-wrap:nowrap!important;
  }

  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active) #cfm-player:not(:fullscreen) .cfm-player-controls button:not(.cfm-choose){
    display:grid!important;
    flex:0 0 48px!important;
    width:48px!important;
    min-width:48px!important;
    max-width:48px!important;
    height:48px!important;
    min-height:48px!important;
    max-height:48px!important;
    padding:0!important;
  }

  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active) #cfm-player:not(:fullscreen) .cfm-player-controls label{
    display:none!important;
  }

  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active) #cfm-player:not(:fullscreen) .cfm-mode-tools{
    top:13px!important;
    right:12px!important;
  }

  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active) #cfm-player:not(:fullscreen) .cfm-mode-menu-toggle{
    width:44px!important;
    min-width:44px!important;
    max-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    max-height:44px!important;
  }

  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active) #cfm-player.is-idle:not(:fullscreen) .cfm-player-controls .cfm-choose{
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:48px!important;
    min-height:48px!important;
    max-height:48px!important;
    justify-content:center!important;
  }

  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active).cfm-player-active .cfm-main{padding-top:194px!important}
  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active).cfm-portal-page .cosmobit-content{padding-top:306px!important}
}

/* Respiro menor no celular horizontal, preservando a altura compacta do player. */
@media (max-width:800px) and (orientation:landscape){
  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active).cfm-player-active .cfm-main{padding-top:124px!important}
  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active).cfm-portal-page .cosmobit-content{padding-top:236px!important}
}

/* iPhones horizontais mais largos usam a composição intermediária do portal. */
@media (min-width:801px) and (max-width:950px) and (orientation:landscape) and (max-height:600px){
  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active).cfm-player-active .cfm-main{padding-top:138px!important}
}

@media (max-width:370px) and (orientation:portrait){
  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active) #cfm-player:not(:fullscreen) .cfm-player-controls{
    gap:5px!important;
  }
  body:not(.cfm-car-mode-active):not(.cfm-fullscreen-active) #cfm-player:not(:fullscreen) .cfm-player-controls button:not(.cfm-choose){
    flex-basis:44px!important;
    width:44px!important;
    min-width:44px!important;
    max-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    max-height:44px!important;
  }
}
