/* =========================================================
   PLAYLANMYM - Selector país / moneda MOBILE
   Archivo: assets/css/popup_selector_mobile.css
   Uso:
   - Mobile: lista simple, clara y táctil.
   - Desktop: no afecta.
   ========================================================= */

@media (max-width: 768px) {

  #plm-overlay {
    align-items: flex-start !important;
    justify-content: center !important;
    overflow-y: auto !important;
    padding: 18px 14px !important;
  }

  .plm-card {
    width: 100% !important;
    max-width: 430px !important;
    margin: 18px auto !important;
    padding: 18px !important;
    border-radius: 22px !important;
  }

  .plm-head {
    gap: 12px !important;
    margin-bottom: 14px !important;
  }

  .plm-title {
    font-size: 20px !important;
  }

  .plm-sub {
    font-size: 13px !important;
    margin-bottom: 14px !important;
  }

  .plm-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
  }

  .plm-tile {
    width: 100% !important;
    min-height: unset !important;
    padding: 14px 14px !important;
    border-radius: 16px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }

  .plm-row {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
  }

  .plm-flag {
    width: 34px !important;
    height: 24px !important;
    margin-right: 0 !important;
  }

  .plm-name {
    font-size: 16px !important;
    font-weight: 900 !important;
  }

  .plm-code {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #00ffaa !important;
  }

  .plm-chip {
    display: none !important;
  }

  .plm-footer {
    display: none !important;
  }

  .pais-header-mobile {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;

    background: #111 !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    border-radius: 999px !important;

    padding: 10px 14px !important;
    margin-top: 8px !important;

    font-size: 13px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
  }

  .pais-header-mobile img {
    width: 21px !important;
    height: 15px !important;
    border-radius: 3px !important;
    object-fit: cover !important;
  }

  .pais-mobile-action {
    color: #00ffaa !important;
    font-weight: 900 !important;
  }

  .pais-mobile-separator {
    opacity: .45 !important;
  }
}

@media (min-width: 769px) {
  .pais-header-mobile {
    display: none !important;
  }
}

/* =========================================================
   FORZAR POPUP MOBILE VERTICAL REAL
   ========================================================= */

@media (max-width: 768px) {

  .plm-grid{
      display:flex !important;
      flex-direction:column !important;
      grid-template-columns:none !important;
      gap:12px !important;
      width:100% !important;
  }

  .plm-tile{
      width:100% !important;
      min-width:100% !important;
      max-width:100% !important;

      display:flex !important;
      align-items:center !important;
      justify-content:space-between !important;

      padding:16px 14px !important;
      border-radius:18px !important;
  }

  .plm-row{
      display:flex !important;
      flex-direction:row !important;
      align-items:center !important;
      gap:14px !important;
  }

  .plm-flag{
      width:38px !important;
      height:26px !important;
      flex-shrink:0 !important;
  }

  .plm-name{
      font-size:17px !important;
      font-weight:900 !important;
      line-height:1 !important;
  }

  .plm-code{
      font-size:14px !important;
      color:#00ffaa !important;
      margin-top:4px !important;
      font-weight:800 !important;
  }

  .plm-chip{
      display:none !important;
  }

  .plm-footer{
      display:none !important;
  }

}