/* Matrasoft mobile UI fixes — 2026-10-22
   Isolated overrides for UltraStore. Desktop layout is untouched. */

@media screen and (max-width: 767px) {
    /* General mobile rhythm */
    body {
        font-size: 15px;
        line-height: 1.5;
    }

    .container {
        padding-left: 12px;
        padding-right: 12px;
    }

    .row-padding-top {
        padding-top: 18px;
    }

    .us-main-shop-title {
        font-size: 20px;
        line-height: 1.35;
        margin-bottom: 22px;
    }

    /* Information pages (Delivery etc.) */
    .us-content {
        padding: 16px;
        border-radius: 6px;
    }

    .us-content-inform p,
    .us-content-inform li {
        line-height: 1.55;
    }

    /* Delivery: keep the existing accordion logic, but make it usable on touch. */
    .tab_wrapp {
        display: block;
        height: auto;
        margin: 16px 0 0;
        border-radius: 8px;
        box-shadow: 0 2px 12px rgba(0, 0, 0, .08);
        overflow: hidden;
        text-align: left;
    }

    .tab_h {
        position: relative;
        display: block;
        width: 100%;
        margin: 0;
        border: 0;
        border-bottom: 1px solid rgba(255,255,255,.16);
        background: rgb(39, 75, 115);
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
        user-select: none;
    }

    .tab_h span {
        display: block;
        width: 100%;
        padding: 13px 44px 13px 15px;
        border: 0;
        background: transparent;
        color: #fff;
        font-size: 16px;
        font-weight: 600;
        line-height: 20px;
    }

    .tab_h::after {
        content: '›';
        position: absolute;
        right: 16px;
        top: 50%;
        color: #fff;
        font-size: 25px;
        line-height: 1;
        transform: translateY(-50%) rotate(90deg);
        opacity: .9;
    }

    .z_new {
        display: none;
        width: 100%;
        background: #fff;
    }

    .z_new .tab_wr {
        display: flex;
        align-items: center;
        width: 100%;
        min-height: 42px;
        height: auto;
        border: 0;
        border-bottom: 1px solid #eef0f2;
        background: #fff;
    }

    .z_new .tab_wr:nth-child(even) {
        background: #f8f9fa;
    }

    .z_new .tab_z1,
    .z_new .tab_z2 {
        float: none;
        box-sizing: border-box;
        padding: 9px 12px;
        line-height: 1.35;
    }

    .z_new .tab_z1 {
        width: calc(100% - 88px);
        border: 0;
        color: #3d4650;
        text-align: left;
    }

    .z_new .tab_z2 {
        width: 88px;
        color: #263746;
        font-weight: 700;
        text-align: right;
        white-space: nowrap;
    }

    /* Home product cards */
    #common-home .us-module-row {
        margin-left: 0;
        margin-right: 0;
        padding-left: 0;
        padding-right: 0;
        row-gap: 12px;
    }

    #common-home .us-module-item {
        padding-top: 22px;
        padding-bottom: 14px;
        margin-bottom: 0;
        border-radius: 7px;
        box-shadow: 0 1px 6px rgba(0,0,0,.08);
    }

    #common-home .us-module-img a {
        min-height: 0;
        margin-top: 0;
    }

    #common-home .us-module-row .us-module-img img {
        max-width: 210px;
        max-height: 210px;
        width: auto;
        height: auto;
        object-fit: contain;
    }

    #common-home .us-module-title {
        height: auto;
        min-height: 42px;
        margin-top: 12px;
        margin-bottom: 12px;
        padding: 0 14px;
        line-height: 1.35;
    }

    #common-home .us-module-price {
        margin-bottom: 12px;
    }

    #common-home .us-module-cart-btn {
        margin-left: 12px;
        margin-right: 12px;
        width: calc(100% - 24px);
        border-radius: 5px;
    }

    /* Category */
    #product-category .us-category-content {
        padding: 12px 10px 20px;
        border-radius: 6px;
    }

    #product-category .us-subcategory {
        margin-left: -10px;
        margin-right: -10px;
        padding: 0 10px 4px;
    }

    #product-category .subcat-row {
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
        gap: 10px;
        margin-left: 0;
        margin-right: 0;
        padding-bottom: 6px;
    }

    #product-category .subcat-row .us-item {
        flex: 0 0 55%;
        max-width: 55%;
        padding: 0;
        scroll-snap-align: start;
    }

    #product-category .subcat-item {
        margin-bottom: 0;
        padding: 12px;
        border: 1px solid #f0f1f2;
        border-radius: 6px;
        box-shadow: none;
    }

    #product-category .subcat-item-img {
        max-width: 110px;
        max-height: 90px;
        object-fit: contain;
        margin-bottom: 8px;
    }

    #product-category .sort-limit {
        gap: 8px;
    }

    #product-category .sort-limit > * {
        min-width: 0;
    }

    #product-category .sort-select,
    #product-category .limit-select {
        max-width: 100%;
    }

    #product-category .product-grid .us-module-item {
        padding-top: 20px;
        margin-bottom: 12px;
        border-radius: 7px;
    }

    #product-category .product-grid .us-module-img a {
        min-height: 0;
        margin-top: 0;
    }

    #product-category .product-grid .us-module-img img {
        max-height: 240px;
        width: auto;
        max-width: 100%;
        object-fit: contain;
    }

    #product-category .product-grid .us-module-title {
        height: auto;
        min-height: 42px;
        margin: 12px 0;
    }

    /* Product page */
    .us-product {
        border-radius: 7px;
        overflow: hidden;
    }

    .us-product-left {
        padding-top: 8px;
        border-right: 0;
    }

    .us-product-slide-box {
        min-height: 0;
    }

    .us-product-slide-box .oct-gallery {
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 0;
    }

    .us-product-slide-box .oct-gallery img {
        width: auto;
        max-width: 100%;
        height: auto;
        max-height: 360px;
        padding: 10px 12px;
        object-fit: contain;
    }

    .image-additional-box {
        margin-bottom: 12px;
        padding: 0 12px;
    }

    .us-product-rating-wishlist {
        min-height: 52px;
        height: auto;
        padding-left: 14px;
    }

    .compare-wishlist-btn {
        padding: 14px 16px;
    }

    .us-product-info {
        padding: 15px;
        margin-bottom: 10px;
    }

    .us-product-info-list {
        font-size: 14px;
    }

    .us-price-block {
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 14px;
    }

    .us-price-actual,
    .us-price-new,
    .us-price-old {
        margin-right: 0;
    }

    .us-product-action {
        padding: 0 15px 20px;
    }

    .us-product-description-nav {
        flex-direction: row !important;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        gap: 20px;
        padding: 17px 15px 18px;
        scrollbar-width: none;
    }

    .us-product-description-nav::-webkit-scrollbar {
        display: none;
    }

    .us-product-nav-item,
    .us-product-nav-item:not(:last-child) {
        flex: 0 0 auto;
        margin: 0;
    }

    .us-product-nav-item a {
        white-space: nowrap;
    }

    .us-product-description-cont,
    .us-product-attributes,
    .us-product-faq-tab-content {
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media screen and (max-width: 575px) {
    /* One comfortable card per row on narrow phones. */
    #common-home .us-module-row > .col-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    #product-category .product-grid {
        flex: 0 0 100%;
        max-width: 100%;
        padding-left: 0;
        padding-right: 0;
    }

    #product-category .sort-limit {
        flex-direction: column;
        align-items: stretch !important;
    }

    #product-category .sort-select,
    #product-category .limit-select {
        width: 100%;
        margin-right: 0;
    }

    .us-product-slide-box .oct-gallery img {
        max-height: 320px;
    }
}

@media screen and (max-width: 380px) {
    #product-category .subcat-row .us-item {
        flex-basis: 68%;
        max-width: 68%;
    }

    .us-product-slide-box .oct-gallery img {
        max-height: 285px;
    }
}