/* ============================================================
   📱 LANDSCAPE FIX – pro zařízení na šířku (nižší výška)
   ============================================================ */
@media (orientation: landscape) and (max-height: 600px) {

  html, body{
    height: 100dvh;
    min-height: 100dvh;
  }

  /* ✅ už ŽÁDNÝ transform na body – kvůli modalu */
  body{
    margin: 0;
    padding: 0 10px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    overflow: hidden;
  }

  .auth-wrapper{
    flex-wrap: nowrap !important;
    gap: 1rem !important;
    align-items: stretch !important;
    justify-content: center !important;
  }

  /* menší karty */
  .auth-wrapper .card{
    width: min(260px, 40vw) !important;
    min-height: 220px !important;
    padding: 0.7rem 0.9rem !important;
    border-radius: 0.8rem !important;
    box-shadow: 0 0 14px rgba(139,92,246,.18) !important;
  }

  /* menší texty v kartách */
  .card h2{
    font-size: 0.9rem !important;
    margin-bottom: 0.2rem !important;
  }
  .card p{
    font-size: 0.75rem !important;
  }

  /* menší inputy login/registrace */
  .card input{
    height: 28px !important;
    padding: 0 0.55rem !important;
    margin: 0.3rem auto !important;
    font-size: 0.8rem !important;
    border-radius: 0.45rem !important;
    width: 92% !important;
    box-sizing: border-box !important;
  }

  /* menší tlačítka v kartách + text přesně uprostřed */
  .card .card__actions > button{
    width: 90% !important;
    height: 30px !important;
    font-size: 0.8rem !important;
    border-radius: 0.45rem !important;
    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
  }

  .link-center{
    font-size: 0.8rem !important;
  }

  /* logo v pravé kartě trochu menší */
  .logo-wrap{
    min-height: 110px !important;
  }
  .logo-wrap img{
    max-width: 70% !important;
    max-height: 55% !important;
  }

  /* ===== MODAL – full-screen backdrop + menší prvky ===== */

  /* backdrop přes CELÝ viewport (bez černých okrajů) */
  .modal-backdrop{
    position: fixed;
    inset: 0 !important;
  }

  .modal{
    width: min(460px, 80vw) !important;
    padding: 1rem 1.25rem 0.85rem !important;
    border-radius: 0.8rem !important;
  }

  .modal h3,
  .modal .accent{
    font-size: 0.95rem !important;
  }

  .modal p{
    font-size: 0.78rem !important;
    line-height: 1.3;
  }

  .modal input{
    font-size: 0.8rem !important;
    padding: 0.5rem 0.6rem !important;
    border-radius: 0.45rem !important;
  }

  /* tlačítko v modalu – menší + text přesně doprostřed */
  .modal-actions .primary-wide{
    width: 55% !important;
    height: 32px !important;
    font-size: 0.85rem !important;
    border-radius: 0.45rem !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    line-height: 1 !important;
  }

  /* menší křížek */
  .modal-close{
    width: 24px !important;
    height: 24px !important;
    font-size: 13px !important;
  }
}
