/* ==================== MOBİL GÖRÜNÜM İYİLEŞTİRMELERİ ==================== */

/* SADECE Takas ve Discard modalları için mobil responsive ayarları */
@media (max-width: 768px),
only screen and (max-device-width: 768px) {

    /* Tam ekran butonunu sol üstte tut (Android) */
    #btn-fullscreen {
        left: 10px !important;
        right: auto !important;
    }

    /* SADECE Takas ve Discard modal - kenarlarda boşluk */
    #trade-modal-overlay .modal-content,
    #discard-modal-overlay .modal-content {
        width: 98% !important;
        /* Ekranın %90'ı, %5 her kenarda boşluk */
        margin: 1% 1%;
        /* Kenarlarda %5 boşluk */
    }

    .res-control img {
        width: 30px !important;
        height: 30px !important;
    }

    /* Buton boyutları */
    .submit-btn {
        font-size: 1rem !important;
        padding: 10px !important;
    }

    /* Owned/mevcut bilgisi */
    .owned-info,
    .ratio-info {
        font-size: 0.7rem !important;
    }
}

/* Çok Küçük Ekranlar (Telefon - Portrait) */
@media (max-width: 480px) {

    /* SADECE Takas ve Discard modal */
    #trade-modal-overlay .modal-content,
    #discard-modal-overlay .modal-content {
        width: 98% !important;
        margin: 1% 1%;
        min-height: 300px !important;
    }

    .res-control img {
        width: 28px !important;
        height: 28px !important;
    }

    .btn-count {
        width: 22px !important;
        height: 22px !important;
        font-size: 0.9rem !important;
    }

    .count-val {
        font-size: 1rem !important;
    }
}