/* Mobile adaptation for fixed-width mall layout. Applies only below 760px viewport. */
@media screen and (max-width: 760px) {

    /* Remove PC fixed-width constraints and browser default body margin */
    html, body {
        min-width: 0 !important;
        width: 100%;
        margin: 0 !important;
        padding: 0 !important;
        overflow-x: hidden;
    }

    /* Full-width containers */
    .drd_container, .drd_containerbig, .container, .pisen-goods-box,
    .hot-goods, .goods-pages {
        width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box;
    }

    /* Header */
    header {
        width: 100% !important;
    }

    header .topnav, header .topnav .topnav_l, header .mainnav,
    header .logobox, .logobox, ul.navbox {
        width: 100% !important;
        min-width: 0 !important;
    }

    header .topnav .toptxt {
        float: none !important;
        text-align: right;
    }

    /* Header stack: centered logo, then full-width search row */
    .logobox {
        padding: 10px 12px !important;
        box-sizing: border-box;
    }

    header .logobox .logo {
        position: static !important;
        margin: 0 auto !important;
        text-align: center;
        float: none !important;
    }

    /* Desktop-only floating badge overlaps content on small screens */
    #weishangcheng-link {
        display: none !important;
    }

    header .logobox .shopcarbox {
        width: 100% !important;
        margin-top: 8px;
    }

    header .logobox .logo img {
        height: 40px;
        width: auto !important;
    }

    header .logobox .searchbox {
        width: 100% !important;
        margin-top: 8px;
    }

    header .logobox .searchbox input {
        width: calc(100% - 42px) !important;
    }

    header .logobox .searchbox .quicksetbox {
        display: none !important;
    }

    header .logobox .shopcarbox {
        width: auto !important;
        float: right !important;
    }

    header .mainnav ul.navbox li .prorecommend,
    .mainnav ul.navbox li .prorecommend {
        width: 100% !important;
        max-width: 100vw;
    }

    header .mainnav dl.classbox {
        position: static !important;
        width: 100% !important;
    }

    /* Homepage banner */
    .banner, .banner_imgbox {
        width: 100% !important;
        height: auto !important;
        min-width: 0 !important;
    }

    .banner_imgbox .slides img {
        width: 100% !important;
        height: auto !important;
    }

    .banner_pic li {
        width: 33.33% !important;
        height: auto !important;
        min-height: 90px;
        float: left;
        box-sizing: border-box;
    }

    /* Homepage product rows become horizontal scroll strips */
    .flexsbox1, .drd_paymain, .drd_py_tit01, .drd_py_box02, .drd_py_box02ul,
    .drd_py_serice_new, .ft_addr, .footlink, .g9, footer {
        width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box;
    }

    /* fluid rows: each item-group takes half width, two per row.
       Rows are built as several ULs, each holding one product. */
    .drd_py_listbox {
        width: auto !important;
        margin: 0 10px !important;
        padding: 0 !important;
    }

    .drd_py_list {
        width: 100% !important;
        height: auto !important;
    }

    .drd_py_list ul, .drd_py_list ul.cf {
        width: 48% !important;
        margin-right: 2% !important;
        float: left !important;
        box-sizing: border-box;
    }

    .drd_py_list ul li, .drd_py_list ul li:first-child {
        width: 100% !important;
        margin: 0 !important;
        float: none !important;
        box-sizing: border-box;
    }

    .drd_py_list .imgbox img {
        width: 100% !important;
        max-width: 170px !important;
        height: auto !important;
    }

    /* List page goods grid becomes two columns */
    .chiki-goods-list ul.goods-box-item li,
    ul.goods-box-item li.S_carBox {
        width: 48% !important;
        margin-right: 2% !important;
        float: left !important;
        box-sizing: border-box;
    }

    ul.goods-box-item li.S_carBox a {
        width: 100% !important;
    }

    /* List page bottom recommendation cards: shrink card, images, wrap names */
    .myC_box {
        width: 100% !important;
        box-sizing: border-box;
    }

    .myC_box img {
        width: 120px !important;
        height: auto !important;
        margin-left: 15px !important;
        margin-top: 15px !important;
    }

    .myC_box .myC_info .f16 a {
        white-space: normal !important;
        word-break: break-all;
    }

    .myC_box .myC_info_title {
        width: auto !important;
        max-width: 100% !important;
        white-space: normal !important;
    }

    .myC_btn a, .myC_btn button, .myC_btn .btn {
        width: auto !important;
        max-width: 48% !important;
        box-sizing: border-box;
    }

    .chiki-filter-box, .box-hd, .box-bd, .filter-lists, dl.list1,
    ul.filterBox, .chiki-goods-box, .goods-list-hd, .goods-list-head,
    .goods-list-bd, .goods-list-section, .goods-list-wrap {
        width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box;
    }

    /* Detail page */
    .drd_Prodetail_l {
        width: 100% !important;
        float: none !important;
    }

    /* Main image: show only the first slide, fully responsive.
       The PC carousel relies on fixed-width clipping, which breaks when
       the column is fluid, so we normalize it here. */
    .main_image {
        width: 100% !important;
        height: auto !important;
        overflow: hidden;
    }

    .main_image ul.slides {
        width: 100% !important;
        height: auto !important;
    }

    .main_image ul.slides li {
        display: none !important;
        width: 100% !important;
        height: auto !important;
        float: none !important;
    }

    .main_image ul.slides li:first-child {
        display: block !important;
    }

    .main_image ul.slides li a {
        display: block !important;
        width: 100% !important;
        height: auto !important;
    }

    .main_image ul.slides li img {
        width: 100% !important;
        height: auto !important;
    }

    .main_image .controlsbox, .main_image .flex-direction-nav {
        display: none !important;
    }

    .drd_Prodetail_r {
        width: 100% !important;
        float: none !important;
    }

    .drd_Prodetail_r .protitle, .drd_Prodetail_r .proindro,
    .drd_Prodetail_r .propircebox, .drd_Prodetail_r .propirce,
    .drd_Prodetail_r .procollect, .drd_Prodetail_r .prosign,
    .drd_Prodetail_r .promun, .drd_Prodetail_r .probtnbox {
        width: auto !important;
        max-width: 100% !important;
    }

    .drd_Prodetail_r dt, .drd_Prodetail_r dd {
        max-width: 100% !important;
    }

    .ProNumInf {
        width: auto !important;
    }

    .drd_Proother, .drd_Proother_r, .Productdail, .describewrap,
    .Productnorms, .ProductComment {
        width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box;
    }

    .drd_Proother_r {
        float: none !important;
    }

    .describewrap img, .Productdail img {
        max-width: 100% !important;
        height: auto !important;
    }

    .Productnorms table {
        width: 100% !important;
        table-layout: fixed;
    }

    .bread {
        width: 100% !important;
        box-sizing: border-box;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    /* Cart and checkout tables become horizontal scroll */
    .shopcart, .ml10, .f22, .mt10 {
        width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box;
    }

    .shopcart .ml10 {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .shopcar-goods .item .col-1,
    .col-1, .shopcar-goods .item-more .col-1 {
        width: auto !important;
        max-width: 60vw !important;
    }

    /* Bottom sticky buy bar stacks vertically and fits viewport */
    .goodsSubBar {
        width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box;
    }

    .goodsSubBar .subbar_l, .goodsSubBar .subbar_r {
        width: auto !important;
        max-width: 100% !important;
        float: none !important;
        box-sizing: border-box;
    }

    .goodsSubBar .subbar_l {
        padding: 6px 10px 0 !important;
    }

    .goodsSubBar .subbar_l .f_r {
        width: auto !important;
        max-width: 70vw;
    }

    .goodsSubBar .subbar_r a {
        padding: 0 10px !important;
    }

    /* Recommendation section under detail */
    .drd_Proothertitle, .drd_Proother_r .Productdail,
    .drd_Proother_r .describewrap, .drd_Proother_r .Productnorms,
    .drd_Proother_r .ProductComment {
        width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box;
    }

    /* Pay flow and modals fit viewport */
    .modal, .modal.modal-600, .modal.modal-700, .modal.modal-800, .modal.modal-900 {
        width: calc(100% - 24px) !important;
        max-width: 100% !important;
        margin-left: 12px !important;
    }

    /* Generic guards */
    img {
        max-width: 100% !important;
    }

    table {
        max-width: 100%;
    }

    /* Form controls must not exceed their column (padding/border included) */
    input, select, textarea, button {
        box-sizing: border-box;
        max-width: 100% !important;
    }
}
