/* === v1.33.2 Market Mobile Two Column FORCE ===
   Mobilde 3 kolon market kartı gerçek ürün adları için çok dar kalıyordu.
   Bu dosya head'in en sonunda yüklenir ve gerçek DOM class'larını hedefler.
*/

@media(max-width:760px){
  html body:not(.admin-body) main.main > .market-page-grid,
  html body:not(.admin-body) main.main .market-page-grid{
    display:grid!important;
    grid-template-columns:repeat(2, minmax(0, 1fr))!important;
    gap:12px!important;
    width:100%!important;
    max-width:100%!important;
    overflow:visible!important;
  }

  html body:not(.admin-body) main.main .market-page-grid > .market-product-card,
  html body:not(.admin-body) main.main .market-page-grid > .product-card,
  html body:not(.admin-body) main.main .market-page-grid > .card.product-card.market-product-card{
    min-width:0!important;
    width:100%!important;
    max-width:100%!important;
    padding:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
    border-radius:18px!important;
  }

  html body:not(.admin-body) main.main .market-page-grid .market-product-art{
    padding:10px!important;
    aspect-ratio:1/1!important;
  }

  html body:not(.admin-body) main.main .market-page-grid .market-product-art img{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center center!important;
    border-radius:12px!important;
  }

  html body:not(.admin-body) main.main .market-page-grid .market-product-info{
    padding:11px 10px 12px!important;
    gap:7px!important;
    min-width:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  html body:not(.admin-body) main.main .market-page-grid .market-title-block,
  html body:not(.admin-body) main.main .market-page-grid .market-title-page{
    display:flex!important;
    align-items:flex-start!important;
    gap:6px!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
  }

  html body:not(.admin-body) main.main .market-page-grid .market-title-icon{
    width:18px!important;
    height:18px!important;
    min-width:18px!important;
    flex:0 0 18px!important;
    margin-top:2px!important;
  }

  html body:not(.admin-body) main.main .market-page-grid .market-title-text{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    display:block!important;
  }

  html body:not(.admin-body) main.main .market-page-grid .market-title-text strong{
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
    overflow:hidden!important;
    white-space:normal!important;
    text-overflow:ellipsis!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
    max-width:100%!important;
    min-height:2.16em!important;
    font-size:clamp(18px, 5.2vw, 23px)!important;
    line-height:1.08!important;
    letter-spacing:-.045em!important;
  }

  html body:not(.admin-body) main.main .market-page-grid .market-title-text span{
    display:block!important;
    max-width:100%!important;
    overflow:hidden!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
    font-size:12px!important;
    line-height:1.2!important;
    letter-spacing:.12em!important;
  }

  html body:not(.admin-body) main.main .market-page-grid .market-stock,
  html body:not(.admin-body) main.main .market-page-grid .market-title-stock{
    font-size:12px!important;
    line-height:1.2!important;
    margin-top:5px!important;
    white-space:nowrap!important;
  }

  html body:not(.admin-body) main.main .market-page-grid .market-coin,
  html body:not(.admin-body) main.main .market-page-grid .coin{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:5px!important;
    flex-wrap:wrap!important;
    max-width:100%!important;
    font-size:15px!important;
    line-height:1.08!important;
    margin-top:5px!important;
    white-space:normal!important;
  }

  html body:not(.admin-body) main.main .market-page-grid .coin-badge{
    width:19px!important;
    height:19px!important;
    min-width:19px!important;
    flex:0 0 19px!important;
  }

  html body:not(.admin-body) main.main .market-page-grid form{
    width:100%!important;
    margin-top:3px!important;
  }

  html body:not(.admin-body) main.main .market-page-grid .market-order-btn,
  html body:not(.admin-body) main.main .market-page-grid button.market-order-btn,
  html body:not(.admin-body) main.main .market-page-grid .green.market-order-btn{
    width:100%!important;
    min-width:0!important;
    min-height:42px!important;
    padding:10px 8px!important;
    border-radius:10px!important;
    font-size:15px!important;
    line-height:1.08!important;
    white-space:normal!important;
    text-align:center!important;
  }
}

/* Çok dar cihazlarda da 2 kolon kalsın; 1 kolon olmasın */
@media(max-width:460px){
  html body:not(.admin-body) main.main > .market-page-grid,
  html body:not(.admin-body) main.main .market-page-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr))!important;
    gap:10px!important;
  }

  html body:not(.admin-body) main.main .market-page-grid .market-title-text strong{
    font-size:18px!important;
  }

  html body:not(.admin-body) main.main .market-page-grid .market-order-btn,
  html body:not(.admin-body) main.main .market-page-grid button.market-order-btn{
    font-size:14px!important;
    min-height:40px!important;
  }
}
