/* WeProxy — commerce mobile (catalog table, order steps, cart, checkout) */

@media (max-width: 900px) {
    /* —— Product list (horizontal-list / DataTables) —— */
    #modernpanel .sunucular,
    #modernpanel .sunucular .dataTables_wrapper,
    .sunucular .dataTables_wrapper {
        width: 100% !important;
        max-width: 100% !important;
        overflow: visible !important;
    }

    #modernpanel table.horizontal-list,
    table.horizontal-list {
        width: 100% !important;
        min-width: 0 !important;
        border-collapse: separate !important;
        border-spacing: 0 12px !important;
    }

    #modernpanel table.horizontal-list thead,
    table.horizontal-list thead {
        display: none !important;
    }

    #modernpanel table.horizontal-list tbody tr,
    table.horizontal-list tbody tr {
        display: block !important;
        width: 100% !important;
        margin: 0 0 12px !important;
        padding: 14px !important;
        background: #fff !important;
        border: 1px solid var(--wp-line, #e4e4e7) !important;
        border-radius: 10px !important;
        box-sizing: border-box !important;
    }

    #modernpanel table.horizontal-list tbody tr.child,
    table.horizontal-list tbody tr.child {
        display: none !important;
    }

    #modernpanel table.horizontal-list tbody td,
    table.horizontal-list tbody td {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 12px !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 8px 0 !important;
        text-align: left !important;
        border: 0 !important;
        border-bottom: 1px solid #f4f4f5 !important;
        box-sizing: border-box !important;
        white-space: normal !important;
    }

    #modernpanel table.horizontal-list tbody td.dtr-control,
    #modernpanel table.horizontal-list thead th.dtr-control,
    table.horizontal-list tbody td.dtr-control,
    table.horizontal-list thead th.dtr-control {
        display: none !important;
    }

    #modernpanel table.horizontal-list tbody td.dtr-hidden,
    #modernpanel table.horizontal-list thead th.dtr-hidden,
    table.horizontal-list tbody td.dtr-hidden {
        display: flex !important;
    }

    #modernpanel table.horizontal-list tbody td:first-child,
    table.horizontal-list tbody td:first-child {
        padding-top: 0 !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        color: var(--wp-ink, #111) !important;
        border-bottom: 1px solid var(--wp-line, #e4e4e7) !important;
        padding-bottom: 10px !important;
        margin-bottom: 4px !important;
    }

    #modernpanel table.horizontal-list tbody td:last-child,
    table.horizontal-list tbody td:last-child {
        border-bottom: 0 !important;
        padding-bottom: 0 !important;
        padding-top: 12px !important;
        display: block !important;
    }

    #modernpanel table.horizontal-list tbody td:last-child a,
    #modernpanel table.horizontal-list tbody td:last-child .lbtn,
    #modernpanel table.horizontal-list tbody td:last-child .gonderbtn,
    table.horizontal-list tbody td:last-child a {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-height: 44px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    #modernpanel table.horizontal-list tbody td h4,
    table.horizontal-list tbody td h4 {
        margin: 0 !important;
        font-size: 15px !important;
        line-height: 1.35 !important;
        text-align: right !important;
    }

    #modernpanel .tablepaket,
    #modernpanel .tablopaketler .tablepaket {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        margin: 0 0 12px !important;
    }

    #modernpanel .tablopaketler {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
    }

    /* —— Order steps —— */
    #modernpanel .ilanasamalar,
    .ilanasamalar {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: space-between !important;
        gap: 6px !important;
        width: 100% !important;
        margin: 12px 0 20px !important;
        padding: 0 !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    #modernpanel .ilanasamax,
    .ilanasamax {
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 72px !important;
        font-size: 11px !important;
        line-height: 1.25 !important;
        white-space: normal !important;
    }

    #modernpanel .asamaline,
    .asamaline {
        display: none !important;
    }

    #modernpanel .orderperiodblock-con,
    .orderperiodblock-con {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        width: 100% !important;
    }

    #modernpanel .orderperiodblock,
    .orderperiodblock {
        float: none !important;
        display: block !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    #modernpanel .siparisbilgileri table,
    .siparisbilgileri table {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        table-layout: fixed !important;
    }

    #modernpanel .siparisbilgileri table tbody,
    #modernpanel .siparisbilgileri table tr,
    .siparisbilgileri table tbody,
    .siparisbilgileri table tr {
        display: block !important;
        width: 100% !important;
    }

    #modernpanel .siparisbilgileri table td,
    .siparisbilgileri table td {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 8px 0 !important;
        text-align: left !important;
        word-break: break-word !important;
    }

    #modernpanel .siparisbilgileri table tr:first-child td,
    .siparisbilgileri table tr:first-child td {
        display: none !important;
    }

    #modernpanel .siparisbilgileri table select,
    #modernpanel .siparisbilgileri table input,
    .siparisbilgileri table select,
    .siparisbilgileri table input {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    #modernpanel .siparisbilgileri,
    .siparisbilgileri {
        width: 100% !important;
        float: none !important;
        overflow-x: hidden !important;
    }

    #modernpanel .siparisbilgileri .btn,
    #modernpanel .siparisbilgileri a.btn,
    .siparisbilgileri .btn {
        float: none !important;
        display: flex !important;
        width: 100% !important;
        max-width: none !important;
        margin: 12px 0 0 !important;
        justify-content: center !important;
        box-sizing: border-box !important;
    }

    #modernpanel .sungenbil,
    #modernpanel .sunucusipside,
    .sungenbil,
    .sunucusipside {
        float: none !important;
        width: 100% !important;
    }

    /* —— Cart / checkout columns —— */
    #modernpanel .sepet,
    .sepet {
        display: flex !important;
        flex-direction: column !important;
        gap: 14px !important;
        width: 100% !important;
    }

    #modernpanel .sepetleft,
    #modernpanel .sepetright,
    .sepetleft,
    .sepetright {
        float: none !important;
        width: 100% !important;
        max-width: none !important;
        position: static !important;
        top: auto !important;
    }

    #modernpanel .sepetbaslik,
    .sepetbaslik {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    #modernpanel .sepetbaslik > div,
    .sepetbaslik > div {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 8px 14px !important;
        width: 100% !important;
        padding: 12px 14px !important;
        box-sizing: border-box !important;
        text-align: left !important;
    }

    #modernpanel .sepetbaslik .yuzde70,
    #modernpanel .sepetbaslik .yuzde50,
    #modernpanel .sepetbaslik .yuzde30,
    #modernpanel .sepetbaslik .uhinfo,
    #modernpanel .sepetbaslik .uhperiyod,
    #modernpanel .sepetbaslik .uhtutar,
    .sepetbaslik .yuzde70,
    .sepetbaslik .uhinfo,
    .sepetbaslik .uhperiyod,
    .sepetbaslik .uhtutar {
        float: none !important;
        width: auto !important;
        max-width: 100% !important;
        flex: 1 1 auto !important;
        font-size: 13px !important;
        line-height: 1.35 !important;
        white-space: normal !important;
    }

    #modernpanel .sepetlistcon,
    .sepetlistcon {
        width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        box-sizing: border-box !important;
    }

    #modernpanel .uhinfo,
    #modernpanel .uhperiyod,
    #modernpanel .uhtutar,
    #modernpanel .uhsil,
    .uhinfo,
    .uhperiyod,
    .uhtutar,
    .uhsil {
        float: none !important;
        display: block !important;
        width: 100% !important;
        margin: 0 0 8px !important;
        box-sizing: border-box !important;
    }

    #modernpanel .paymentlogos,
    .paymentlogos {
        text-align: center !important;
    }

    #modernpanel .paymentlogos img,
    .paymentlogos img {
        max-width: 100% !important;
        height: auto !important;
    }

    /* —— Checkout account: Giriş Yap / Kayıt Ol —— */
    #modernpanel .orderuserlogin,
    .orderuserlogin {
        width: 100% !important;
        box-sizing: border-box !important;
    }

    #modernpanel .orderuserlogin h2,
    .orderuserlogin h2 {
        font-size: 16px !important;
        line-height: 1.35 !important;
        word-break: break-word !important;
    }

    #modernpanel .orderuserlogin .radio-custom-label,
    .orderuserlogin .radio-custom-label {
        display: inline-flex !important;
        align-items: center !important;
        margin: 0 12px 12px 0 !important;
        font-size: 14px !important;
        white-space: nowrap !important;
    }

    /* client.css ≤620px sets #modernpanel table { min-width:620px } — kill on commerce */
    #modernpanel .sepet table,
    #modernpanel .sepetleft table,
    #modernpanel .sepetright table,
    #modernpanel .orderuserlogin table,
    #modernpanel #form_register_content table,
    #modernpanel #form_login_content table,
    #modernpanel .sepetsipinfo,
    #modernpanel table.horizontal-list,
    #form_register_content table,
    #form_login_content table,
    .sepetsipinfo {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    #modernpanel #form_register_content table,
    #modernpanel #form_login_content table,
    #form_register_content table,
    #form_login_content table {
        display: block !important;
    }

    #modernpanel #form_register_content table tbody,
    #modernpanel #form_login_content table tbody,
    #form_register_content table tbody,
    #form_login_content table tbody {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    /* Do not force display on rows WISECP hides via inline style (kind-content etc.) */
    #modernpanel #form_register_content table tr:not([style*="display: none"]):not([style*="display:none"]),
    #modernpanel #form_login_content table tr:not([style*="display: none"]):not([style*="display:none"]),
    #form_register_content table tr:not([style*="display: none"]):not([style*="display:none"]),
    #form_login_content table tr:not([style*="display: none"]):not([style*="display:none"]) {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    #modernpanel #form_register_content table tr.kind-content[style*="display: none"],
    #modernpanel #form_register_content table tr.kind-content[style*="display:none"],
    #form_register_content table tr.kind-content[style*="display: none"],
    #form_register_content table tr.kind-content[style*="display:none"] {
        display: none !important;
    }

    #modernpanel #form_register_content table td,
    #modernpanel #form_login_content table td,
    #form_register_content table td,
    #form_login_content table td {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 6px 0 !important;
        box-sizing: border-box !important;
        overflow-wrap: anywhere !important;
    }

    #modernpanel #form_register_content input[type="text"],
    #modernpanel #form_register_content input[type="email"],
    #modernpanel #form_register_content input[type="password"],
    #modernpanel #form_register_content input[type="tel"],
    #form_register_content input[type="text"],
    #form_register_content input[type="email"],
    #form_register_content input[type="password"],
    #form_register_content input[type="tel"] {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    #modernpanel #form_register_content .radio-custom-label,
    #modernpanel #form_login_content .radio-custom-label,
    #form_register_content .radio-custom-label,
    #form_login_content .radio-custom-label {
        display: inline-flex !important;
        width: auto !important;
        max-width: 100% !important;
        margin: 0 14px 10px 0 !important;
        white-space: normal !important;
    }

    #modernpanel #form_register_content .yuzde50,
    #form_register_content .yuzde50 {
        display: block !important;
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 8px !important;
    }

    #modernpanel #form_register_content .yuzde50 + .yuzde50,
    #form_register_content .yuzde50 + .yuzde50 {
        margin-left: 0 !important;
    }

    #modernpanel #form_register_content label,
    #modernpanel #form_login_content label,
    #form_register_content label,
    #form_login_content label {
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    #modernpanel .yuzde30,
    #modernpanel .yuzde70,
    #modernpanel .yuzde50,
    #modernpanel .yuzde40,
    #modernpanel .yuzde60,
    #modernpanel .yuzde100,
    .orderuserlogin .yuzde30,
    .orderuserlogin .yuzde70,
    .orderuserlogin .yuzde50,
    .sepet .yuzde30,
    .sepet .yuzde70,
    .sepet .yuzde50 {
        float: none !important;
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* —— Total payable / sipariş özeti —— */
    #modernpanel .sepetsipinfo,
    .sepetsipinfo {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        table-layout: auto !important;
    }

    #modernpanel .sepetsipinfo tbody,
    #modernpanel .sepetsipinfo tr,
    .sepetsipinfo tbody,
    .sepetsipinfo tr {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    #modernpanel .sepetsipinfo td,
    .sepetsipinfo td {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        word-break: break-word !important;
        font-size: 13px !important;
        vertical-align: top !important;
        padding: 10px 0 !important;
    }

    #modernpanel .sepetsipinfo td h5,
    .sepetsipinfo td h5 {
        width: auto !important;
        max-width: 100% !important;
        margin: 0 !important;
        text-align: right !important;
    }

    #modernpanel .sepetsipinfo .totalamountinfo,
    .sepetsipinfo .totalamountinfo {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 16px 8px 8px !important;
        text-align: center !important;
    }

    #modernpanel .sepetsipinfo .totalamountinfo h5,
    #modernpanel .sepetsipinfo .totalamountinfo .amount_spot_view,
    .sepetsipinfo .totalamountinfo h5,
    .sepetsipinfo .totalamountinfo .amount_spot_view {
        float: none !important;
        display: block !important;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
    }

    #modernpanel .sepetsipinfo .totalamountinfo strong,
    .sepetsipinfo .totalamountinfo strong {
        display: block !important;
        margin: 0 0 6px !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        line-height: 1.35 !important;
        white-space: normal !important;
        word-break: break-word !important;
    }

    #modernpanel .sepetsipinfo .totalamountinfo h5,
    #modernpanel .sepetsipinfo .totalamountinfo #total-amount-payable,
    .sepetsipinfo .totalamountinfo h5,
    .sepetsipinfo .totalamountinfo #total-amount-payable {
        display: block !important;
        margin: 0 auto !important;
        font-size: 24px !important;
        line-height: 1.2 !important;
        word-break: break-word !important;
    }

    /* Never un-hide WISECP state buttons (continue_go / continue_block / pay_button) */
    #modernpanel .sepetright .gonderbtn:not([style*="display: none"]):not([style*="display:none"]),
    #modernpanel .sepetright .lbtn:not([style*="display: none"]):not([style*="display:none"]),
    .sepetright .gonderbtn:not([style*="display: none"]):not([style*="display:none"]),
    .sepetright .lbtn:not([style*="display: none"]):not([style*="display:none"]) {
        display: flex !important;
        width: 100% !important;
        max-width: none !important;
        justify-content: center !important;
        box-sizing: border-box !important;
    }

    #modernpanel .sepetright #continue_go[style*="display: none"],
    #modernpanel .sepetright #continue_go[style*="display:none"],
    #modernpanel .sepetright #continue_block[style*="display: none"],
    #modernpanel .sepetright #continue_block[style*="display:none"],
    #modernpanel .sepetright #pay_button[style*="display: none"],
    #modernpanel .sepetright #pay_button[style*="display:none"],
    #modernpanel .sepetright #block_button[style*="display: none"],
    #modernpanel .sepetright #block_button[style*="display:none"],
    .sepetright #continue_go[style*="display: none"],
    .sepetright #continue_go[style*="display:none"],
    .sepetright #continue_block[style*="display: none"],
    .sepetright #continue_block[style*="display:none"],
    .sepetright #pay_button[style*="display: none"],
    .sepetright #pay_button[style*="display:none"],
    .sepetright #block_button[style*="display: none"],
    .sepetright #block_button[style*="display:none"] {
        display: none !important;
    }

    #modernpanel .sayfayolu,
    .sayfayolu {
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-wrap: anywhere !important;
        word-break: break-word !important;
        white-space: normal !important;
        line-height: 1.4 !important;
    }

    #modernpanel .pakettitle h1,
    .pakettitle h1 {
        font-size: 20px !important;
        line-height: 1.25 !important;
        word-break: break-word !important;
    }
}

@media (max-width: 560px) {
    #modernpanel .ilanasamax,
    .ilanasamax {
        font-size: 10px !important;
        min-width: 64px !important;
    }

    #modernpanel #asamaaktif h3,
    #modernpanel .ilanasamax h3,
    .ilanasamax h3 {
        width: 42px !important;
        height: 42px !important;
        line-height: 42px !important;
        font-size: 16px !important;
        margin-bottom: 6px !important;
    }

    #modernpanel .sepetsipinfo .totalamountinfo h5,
    .sepetsipinfo .totalamountinfo h5 {
        font-size: 22px !important;
    }

    #modernpanel .orderuserlogin > .radio-custom-label,
    .orderuserlogin > .radio-custom-label {
        width: calc(50% - 8px) !important;
        margin: 0 0 10px !important;
        justify-content: flex-start !important;
    }

    #modernpanel #form_register_content .radio-custom-label,
    #modernpanel #form_login_content .radio-custom-label,
    #form_register_content .radio-custom-label,
    #form_login_content .radio-custom-label {
        width: auto !important;
        max-width: calc(50% - 8px) !important;
    }
}