/* MKF_Custom 1.0.1: mobile homepage and native JTL list/cart, 2026-11-04. */
#js-filters,
.filter-type-FilterItemSort > .btn {
    background-color:#ff6519;
    border-color:#ff6519;
    color:#1f1714;
    font-weight:600;
}
#js-filters:hover,
#js-filters:focus-visible,
.filter-type-FilterItemSort > .btn:hover,
.filter-type-FilterItemSort > .btn:focus-visible {
    background-color:#ed560b;
    border-color:#ed560b;
    color:#1f1714;
    outline-color:#b83c00;
}
@media(max-width:767.98px) {
    .stuck-usp-container .row.container {
        width:100%;max-width:100%;margin:0;padding:0 8px;row-gap:12px;
    }
    .stuck-usp-container .row.container > .col {
        flex:0 0 50%;max-width:50%;padding:0 8px;
    }
    .stuck-usp-container .row.container > .clearfix {display:none!important}
    .stuck-usp-container .grid-container {height:100%}
    .stuck-usp-container .grid-container picture {display:flex;align-items:center;justify-content:center;height:92px;overflow:hidden}
    .stuck-usp-container .grid-container img {width:92px!important;height:92px!important;max-width:92px;object-fit:contain}
    .stuck-usp-container .grid-container p {margin:0;line-height:1.35}
    .stuck-usp-container .grid-container p span {font-size:14px!important}
    .cat-container {margin-top:12px!important;margin-bottom:28px!important}
    .recomendation-grid {row-gap:36px}
    .recomendation-grid > .col {margin-bottom:0}
    .recomendation-grid .opc-Container.left,
    .recomendation-grid .opc-Container.right {padding:0!important}
    .recomendation-grid h2 {margin-bottom:20px!important;line-height:1.3}
    .recomendation-grid p {margin-top:20px;margin-bottom:20px}

    .product-list.layout-list > .product-wrapper {
        flex:0 0 100%;max-width:100%;height:auto!important;
        margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid #e5e5e5;
    }
    .product-list.layout-list .productbox-row .productbox-image {max-width:220px;margin-inline:auto}
    .product-list.layout-list .productbox-row .list-gallery {display:block!important}
    .product-list.layout-list .productbox-row .list-gallery .first-wrapper {display:block!important;width:100%;height:220px;margin:0}
    .product-list.layout-list .productbox-row .list-gallery .first-wrapper::before {content:none}
    .product-list.layout-list .productbox-row .list-gallery .first-wrapper > .inner {position:static;width:100%;height:100%}
    .product-list.layout-list .productbox-row .list-gallery .first-wrapper picture {display:block;height:100%}
    .product-list.layout-list .productbox-row .list-gallery .first-wrapper img {width:100%;height:100%;object-fit:contain}
    .product-list.layout-list .productbox-row .list-gallery .second-wrapper {display:none!important}
    .product-list.layout-list .productbox-row .productbox-title {margin-top:12px;margin-bottom:12px;white-space:normal}
    .product-list.layout-list .productbox-row .productbox-title a {font-size:17px!important;font-weight:600;line-height:1.4;display:block}
    .product-list.layout-list .productbox-row .item-list-description {display:block!important;font-size:14px;line-height:1.5}
    .product-list.layout-list .productbox-row .productbox-details {display:block!important;margin-block:12px}
    .product-list.layout-list .productbox-row .productbox-details > .productlist-item-detail {display:flex!important;white-space:normal!important}
    .product-list.layout-list .productbox-row .productlist-item-detail dd {overflow-wrap:anywhere}
    .product-list.layout-list .productbox-row .item-list-price {margin-top:12px;text-align:left}
    .product-list.layout-list .productbox-row .delivery-status {display:block;text-align:left}
    .product-list.layout-list .productbox-row .item-list-basket-details {display:flex!important;visibility:visible!important;opacity:1!important;position:static!important;margin-top:14px}
    .product-list.layout-list .productbox-row .item-list-basket-details > .col {display:block!important}
    .product-list.layout-list .productbox-row .form-counter {min-height:44px;margin-bottom:10px}
    .product-list.layout-list .productbox-row .basket-details-add-to-cart {display:block!important;min-height:44px;width:100%}
}

/* MKF 1.0.2: the server now supplies real list rows to phone user agents. */
@media (max-width:767.98px) {
    /* MTS mobile reference: 48px symbols, two columns retained. */
    .stuck-usp-container .grid-container {margin-bottom:0!important}
    .stuck-usp-container .grid-container picture {height:56px;overflow:visible}
    .stuck-usp-container .grid-container img {
        width:48px!important;height:48px!important;max-width:48px;margin:0!important;
    }
    .stuck-usp-container .row.container {row-gap:16px}
    #product-list.layout-list > .product-wrapper {
        flex:0 0 100%; max-width:100%; min-width:0; height:auto!important;
    }
    #product-list.layout-list .productbox-row,
    #product-list.layout-list .productbox-row .productbox-inner {
        height:auto!important; text-align:left;
    }
    #product-list.layout-list .productbox-row .productbox-title {
        text-align:left; margin:16px 0 12px;
    }
    #product-list.layout-list .productbox-row .item-list-description {
        display:block!important; margin:0 0 12px; font-size:14px; line-height:1.5;
        height:auto; max-height:none; overflow:visible;
    }
    #product-list.layout-list .productbox-row .item-list-description ul {
        padding-left:20px; margin:0;
    }
    #product-list.layout-list .productbox-row .productbox-details {
        display:block!important; margin:12px 0; font-size:13px; line-height:1.5;
    }
    #product-list.layout-list .productbox-row .productbox-details > .productlist-item-detail {
        display:flex!important; white-space:normal!important;
    }
    #product-list.layout-list .productbox-row .productbox-options,
    #product-list.layout-list .productbox-row .item-list-price,
    #product-list.layout-list .productbox-row .price_wrapper,
    #product-list.layout-list .productbox-row .delivery-status {
        text-align:left!important;
    }
    #product-list.layout-list .productbox-row .price_wrapper {
        display:flex; flex-direction:column; align-items:flex-start;
    }
    #product-list.layout-list .productbox-row .am-discount--list {
        align-self:flex-start; margin:0 0 8px; max-width:100%;
    }
    #product-list.layout-list .productbox-row .price {
        position:static; float:none; margin:0; font-size:24px; line-height:1.3;
    }
    #product-list.layout-list .productbox-row .item-list-price {margin:8px 0 12px}
    #product-list.layout-list .productbox-row .delivery-status {font-size:12px; line-height:1.5}
    #product-list.layout-list .productbox-row .item-list-basket-details {
        display:flex!important; visibility:visible!important; opacity:1!important;
        position:static!important; margin-top:16px;
    }
    #product-list.layout-list .productbox-row .item-list-basket-details > .col {
        display:block!important; flex:0 0 100%; max-width:100%;
    }
    #product-list.layout-list .productbox-row .form-counter,
    #product-list.layout-list .productbox-row .basket-details-add-to-cart {
        min-height:44px; width:100%;
    }
}

/* The native filter dialog already contains sorting. Retain the separate
   sorting fallback on pages without a visible combined filter control. */
.displayoptions:has(> #improve_search:not(.d-lg-none) #js-filters) > .filter-type-FilterItemSort {
    display:none!important;
}
#js-filters,
#js-filters:hover,
#js-filters:focus,
#js-filters:active,
.filter-type-FilterItemSort > .btn,
.filter-type-FilterItemSort > .btn:hover,
.filter-type-FilterItemSort > .btn:focus {
    background-color:#fc631f!important;
    border-color:#fc631f!important;
    color:#fff!important;
}
#js-filters .fas {color:inherit!important}
#js-filters:focus-visible {
    outline:2px solid #333;
    outline-offset:3px;
    box-shadow:none;
}

/* Use MK's existing .btn-primary corner animation, as on Add to cart. */
#js-filters {position:relative;flex-shrink:0}
#js-filters:hover,
#js-filters:focus-visible {
    background-color:var(--link-effect, #fb901e)!important;
    border-color:var(--link-effect, #fb901e)!important;
}
#js-filters::before,
#js-filters::after {pointer-events:none}
@media (prefers-reduced-motion:reduce) {
    #js-filters,
    #js-filters::before,
    #js-filters::after {transition:none!important}
}

/* Square filter button; preserve MK's native animated corner borders. */
#js-filters {border-radius:0!important}

/* Shared MK orange for navigation text and icons on hover/keyboard focus. */
#header-top-bar a.nav-link,
#shop-nav > .nav-item > .nav-link,
#shop-nav > .mkf-a11y-item > .asw-menu-btn,
#footer a:not(.btn) {
    transition:color .2s ease!important;
}
#header-top-bar a.nav-link:hover,
#header-top-bar a.nav-link:focus-visible,
#shop-nav > .nav-item > .nav-link:hover,
#shop-nav > .nav-item > .nav-link:focus-visible,
#shop-nav > .mkf-a11y-item > .asw-menu-btn:hover,
#shop-nav > .mkf-a11y-item > .asw-menu-btn:focus-visible,
#footer a:not(.btn):hover,
#footer a:not(.btn):focus-visible {
    color:#fc631f!important;
}
#shop-nav > .mkf-a11y-item > .asw-menu-btn:hover,
#shop-nav > .mkf-a11y-item > .asw-menu-btn:focus-visible {
    background:transparent!important;
}
#shop-nav > .mkf-a11y-item > .asw-menu-btn:focus-visible {
    outline-color:#fc631f!important;
}
@media (prefers-reduced-motion:reduce) {
    #header-top-bar a.nav-link,
    #shop-nav > .nav-item > .nav-link,
    #shop-nav > .mkf-a11y-item > .asw-menu-btn,
    #footer a:not(.btn) {transition:none!important}
}
