/* Pinball-Network responsive storefront layer.
 * Desktop behavior is intentionally untouched; all changes are viewport scoped.
 */

.pn-mobile-left-column-trigger {
    display: none;
}

@media (max-width: 1661px) {
    /*
     * The theme gives its main containers a 1630px width. Because
     * .tv-main-div is a grid, its implicit column otherwise grows to that
     * max-content width and clips the storefront on laptops and smaller
     * devices.
     */
    .tv-main-div {
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
        max-width: 100%;
    }

    #header,
    #wrapper,
    #footer {
        width: 100%;
        max-width: 100%;
    }

    #tvdesktop-megamenu .menu-content {
        width: 100%;
        white-space: nowrap;
    }
}

@media (min-width: 1380px) and (max-width: 1661px) {
    #header #tvdesktop-megamenu .menu-content > li.level-1 > a {
        padding-right: 10px;
        padding-left: 10px;
        font-size: 16px;
    }
}

@media (min-width: 1200px) and (max-width: 1379px) {
    #header #tvdesktop-megamenu .menu-content > li.level-1 > a {
        padding-right: 8px;
        padding-left: 8px;
        font-size: 15px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    #header #tvdesktop-megamenu .menu-content > li.level-1 > a {
        padding-right: 6px;
        padding-left: 6px;
        font-size: 13px;
        letter-spacing: 0.5px;
    }

    .pn-topbar-shipping-countries .pn-topbar-icon,
    .pn-topbar-shipping-countries .pn-topbar-label {
        display: none;
    }

    .pn-topbar-free-shipping {
        justify-content: center;
        white-space: normal;
        text-align: center;
        line-height: 1.25;
    }
}

@media (max-width: 1024px) {
    html,
    body {
        max-width: 100%;
        overflow-x: hidden;
    }

    .tv-main-div,
    #wrapper,
    #content-wrapper,
    #main,
    .page-content,
    .card,
    .card-block {
        min-width: 0;
    }

    #wrapper > .container,
    #wrapper > .container-fluid,
    #content-wrapper,
    .page-content {
        width: 100%;
        max-width: 100%;
    }

    body.layout-left-column #content-wrapper,
    body.layout-right-column #content-wrapper,
    body.layout-both-columns #content-wrapper {
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
    }

    #right-column {
        display: none;
    }

    #right-column.open {
        display: block;
    }

    .pn-mobile-left-column-trigger {
        display: flex;
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
        margin-bottom: 15px;
        padding-right: 15px;
        padding-left: 15px;
    }

    .pn-mobile-left-column-trigger .tv-left-pannal-btn-wrapper {
        display: inline-flex;
        float: none;
        align-items: center;
        justify-content: center;
        gap: 8px;
        width: auto;
        min-width: 190px;
        height: auto;
        min-height: 44px;
        margin: 0;
        padding: 10px 16px;
        color: #fff;
        background-color: #3e5e89;
        background-image: none;
        border: 0;
        border-radius: 3px;
        font: inherit;
    }

    .pn-mobile-left-column-trigger .tv-left-pannal-btn-wrapper i,
    .pn-mobile-left-column-trigger .tv-left-pannal-btn-wrapper span {
        display: block;
        color: inherit;
    }

    .pn-mobile-left-column-trigger .tv-left-pannal-btn-wrapper i {
        font-size: 20px;
        line-height: 1;
    }

    #left-column {
        display: block !important;
        position: fixed !important;
        z-index: 1070;
        top: 0;
        bottom: 0;
        left: 0;
        width: min(88vw, 380px) !important;
        max-width: 88vw !important;
        height: 100vh;
        height: 100dvh;
        padding: 0 15px 24px;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
        visibility: hidden;
        pointer-events: none;
        background: #f5f6f8;
        opacity: 0;
        transform: translateX(-105%);
        transition: transform 0.25s ease, opacity 0.25s ease, visibility 0.25s ease;
    }

    #left-column.open {
        visibility: visible;
        pointer-events: auto;
        opacity: 1;
        transform: translateX(0);
    }

    #left-column > .theiaStickySidebar {
        position: static !important;
        width: 100% !important;
        min-height: 0 !important;
        transform: none !important;
    }

    #left-column .tvleft-column-remove {
        position: sticky;
        z-index: 2;
        top: 0;
        height: 54px;
        margin: 0 -15px 15px;
        background: #f5f6f8;
    }

    #left-column .tvleft-column-close-btn {
        position: absolute;
        top: 7px;
        right: 7px;
        width: 40px;
        height: 40px;
        padding: 0;
        color: #222;
        background: #fff;
        border: 1px solid #dfe2e7;
        border-radius: 50%;
        cursor: pointer;
    }

    #left-column .tvleft-column-close-btn::before {
        content: "\00d7";
        display: block;
        font-size: 30px;
        font-weight: 300;
        line-height: 36px;
        text-align: center;
    }

    .page-content,
    .cms-description,
    .product-description,
    .tvproduct-page-decs,
    .alert,
    .modal-content {
        overflow-wrap: anywhere;
    }

    img,
    video,
    iframe {
        max-width: 100%;
    }

    iframe {
        width: 100%;
    }

    #wrapper .breadcrumb {
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }

    #wrapper .breadcrumb ol {
        display: flex;
        flex-wrap: nowrap;
        width: max-content;
        min-width: 100%;
        white-space: nowrap;
    }

    #category-description,
    #category-description > *,
    .block-category .category-description,
    .block-category .category-description p {
        text-align: left !important;
    }

    .modal-dialog {
        width: auto;
        max-width: calc(100% - 24px);
        margin: 12px auto;
    }

    .modal-content {
        max-height: calc(100vh - 24px);
        max-height: calc(100dvh - 24px);
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    .nav-tabs {
        display: flex;
        flex-wrap: nowrap;
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }

    .nav-tabs .nav-item,
    .nav-tabs .nav-link {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    input,
    select,
    textarea,
    .form-control,
    .input-group {
        min-width: 0;
        max-width: 100%;
    }

    #product .tvprduct-image-info-wrapper {
        align-items: flex-start;
    }

    #product .tv-product-page-image,
    #product .tv-product-page-content {
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
    }

    #product .tv-product-page-content h1 {
        overflow-wrap: anywhere;
    }

    #product .product-quantity {
        display: flex;
        flex-wrap: wrap;
        align-items: stretch;
        gap: 10px;
        width: 100%;
    }

    #product .product-quantity .qty,
    #product .product-quantity .tvcart-btn-model,
    #product .product-quantity .tvwishlist-compare-wrapper-page {
        margin: 0;
    }

    #product .product-quantity .tvcart-btn-model {
        flex: 1 1 220px;
    }

    #product .product-quantity .add-to-cart {
        min-height: 44px;
        white-space: normal;
    }

    #product .pn-quantity-tiers {
        max-width: 100%;
    }

    .tvcmsofferbanners-one .tvofferbanner-content,
    .tvcmsofferbanners-two .tvofferbanner2-content {
        padding: 24px;
    }

    .tvcmsofferbanners-one .tvofferbanner-content h1,
    .tvcmsofferbanners-one .tvofferbanner-content h2,
    .tvcmsofferbanners-one .tvofferbanner-content h3,
    .tvcmsofferbanners-one .tvofferbanner-content h4,
    .tvcmsofferbanners-two .tvofferbanner2-content h1,
    .tvcmsofferbanners-two .tvofferbanner2-content h2,
    .tvcmsofferbanners-two .tvofferbanner2-content h3,
    .tvcmsofferbanners-two .tvofferbanner2-content h4 {
        font-size: clamp(22px, 3vw, 34px);
        line-height: 1.2;
    }

    #cart .cart-grid-body,
    #cart .cart-grid-right,
    body#checkout .tvcheckout-process-left,
    body#checkout .tvcheckout-process-right {
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
    }

    #cart .cart-grid-right,
    body#checkout .tvcheckout-process-right {
        margin-top: 24px;
    }

    body#checkout .checkout-step,
    body#checkout .cart-summary,
    #cart .cart-container,
    #cart .cart-summary {
        min-width: 0;
    }
}

@media (max-width: 991px) {
    .tvcmsdesktop-top-header-wrapper {
        display: block;
    }

    .tvcmsdesktop-top-header-wrapper > .tvcmsdesktop-top-header,
    .tvcmsdesktop-top-header-wrapper > .tvcmsdesktop-top-second,
    .tvcmsdesktop-top-header-wrapper > .tvcms-header-menu-offer-wrapper {
        display: none;
    }

    #tvcms-mobile-view-header,
    #tvcms-mobile-view-header .tvcmsmobile-header-menu-offer-text,
    #tvcms-mobile-view-header .tvcmsmobile-header-search-logo-wrapper {
        display: block;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    #tvcms-mobile-view-header .tvcmsmobile-header-menu-offer-text {
        display: grid;
        grid-template-columns: 48px minmax(0, 1fr) auto;
        align-items: center;
        gap: 10px;
        padding-right: max(15px, env(safe-area-inset-right));
        padding-left: max(15px, env(safe-area-inset-left));
    }

    #tvcms-mobile-view-header .tvcmsmobile-header-menu,
    #tvcms-mobile-view-header .tvcmsmobile-header-logo-right-wrapper,
    #tvcms-mobile-view-header .tvcmsmobile-cart-acount-text {
        width: auto;
        max-width: none;
        padding: 0;
        float: none;
    }

    #tvcms-mobile-view-header .tvcmsmobile-header-logo-right-wrapper {
        min-width: 0;
        overflow: hidden;
    }

    #tvcms-mobile-view-header #tvcmsmobile-header-logo,
    #tvcms-mobile-view-header #tvcmsmobile-header-logo .tv-header-logo {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        width: 100%;
        min-width: 0;
    }

    #tvcms-mobile-view-header #tvcmsmobile-header-logo .tv-header-logo {
        padding: 10px 0;
    }

    #tvcms-mobile-view-header #tvcmsmobile-header-logo img {
        display: block;
        width: auto;
        max-width: 100%;
        height: auto;
        max-height: 42px;
        object-fit: contain;
    }

    #tvcms-mobile-view-header .tvcmsmobile-cart-acount-text {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 8px;
        overflow: visible;
    }

    #tvcms-mobile-view-header #tvcmsmobile-account-button,
    #tvcms-mobile-view-header #tvmobile-cart {
        flex: 0 0 44px;
        width: 44px;
        max-width: 44px;
    }

    #tvcms-mobile-view-header .tvheader-cart-wrapper,
    #tvcms-mobile-view-header .tvheader-cart-btn-wrapper {
        overflow: visible;
    }

    /*
     * The generated theme palette paints these SVG outlines white for the
     * mobile-header-1 variant. On this shop's white header that hides the
     * account body, cart frame and wheels, leaving only abstract blue shapes.
     */
    #header #tvcms-mobile-view-header.mobile-header-1 .tv-myaccount-btn-desktop svg {
        width: 28px;
        height: 28px;
        overflow: visible;
    }

    #header #tvcms-mobile-view-header.mobile-header-1 .tv-myaccount-btn-desktop svg path:nth-child(1),
    #header #tvcms-mobile-view-header.mobile-header-1 .tv-myaccount-btn-desktop svg circle {
        stroke: #222 !important;
        stroke-width: 1.25px !important;
    }

    #header #tvcms-mobile-view-header.mobile-header-1 .tv-cart-icon-main svg {
        width: 30px;
        height: 30px;
        overflow: visible;
    }

    #header #tvcms-mobile-view-header.mobile-header-1 .tv-cart-icon-main svg g path:nth-child(2) {
        fill: #222 !important;
    }

    #header #tvcms-mobile-view-header.mobile-header-1 .tv-cart-icon-main svg g ellipse {
        stroke: #222 !important;
        stroke-width: 1.35px !important;
    }

    #tvcms-mobile-view-header .tv-cart-cart-inner {
        top: 1px;
        right: 1px;
        left: auto;
    }

    #tvcms-mobile-view-header #tvcmsmobile-account-button {
        margin: 0;
    }

    #tvcms-mobile-view-header .tvmobile-sliderbar-btn a,
    #tvcms-mobile-view-header .tv-myaccount-btn,
    #tvcms-mobile-view-header .tvheader-cart-btn-wrapper > a {
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 44px;
        min-height: 44px;
    }

    #tvcms-mobile-view-header .tvcmsmobile-header-search {
        width: 100%;
        padding: 0 max(15px, env(safe-area-inset-right)) 12px max(15px, env(safe-area-inset-left));
    }

    #tvcms-mobile-view-header .tvsearch-top-wrapper,
    #tvcms-mobile-view-header .tvsearch-header-display-wrappper,
    #tvcms-mobile-view-header .tvsearch-header-display-wrappper form {
        width: 100%;
        max-width: 100%;
    }

    #tvcms-mobile-view-header .tvsearch-top-wrapper {
        height: 44px !important;
        min-height: 44px;
        max-height: 44px;
        padding: 0 !important;
    }

    #tvcms-mobile-view-header .tvsearch-header-display-wrappper,
    #tvcms-mobile-view-header .tvsearch-header-display-wrappper form {
        display: flex;
        align-items: center;
        height: 44px !important;
        min-height: 44px;
        max-height: 44px;
        overflow: hidden;
    }

    #tvcms-mobile-view-header .tvheader-top-search {
        flex: 1 1 auto;
        height: 44px;
        min-width: 0;
    }

    #tvcms-mobile-view-header .tvheader-top-search-wrapper {
        display: flex;
        flex: 0 0 44px;
        align-items: center;
        justify-content: center;
        width: 44px !important;
        max-width: 44px;
        height: 44px !important;
        padding: 0 !important;
    }

    #tvcms-mobile-view-header .tvsearch-result {
        width: 100%;
        max-width: 100%;
    }

    #tvcms-mobile-view-header .tvcmssearch-words,
    #tvcms-mobile-view-header .tvheader-search-btn {
        box-sizing: border-box;
        height: 44px !important;
        min-height: 44px;
        max-height: 44px;
    }

    #tvcms-mobile-view-header .tvheader-search-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 44px !important;
        min-width: 44px;
        max-width: 44px;
        padding: 0 !important;
    }

    #tvcms-mobile-view-header .tvheader-search-btn svg {
        display: block;
        flex: 0 0 auto;
        margin: 0;
    }

    /* Keep the fixed mobile header visually identical to its normal state. */
    #header #tvcms-mobile-view-header.mobile-header-1
        .tvcmsmobile-header-menu-offer-text.tvcmsheader-sticky.sticky {
        color: #7a7a7a !important;
        background-color: #fff !important;
    }

    #header #tvcms-mobile-view-header.mobile-header-1
        .tvcmsmobile-header-menu-offer-text.tvcmsheader-sticky.sticky
        .tvmobile-sliderbar-btn a,
    #header #tvcms-mobile-view-header.mobile-header-1
        .tvcmsmobile-header-menu-offer-text.tvcmsheader-sticky.sticky
        .tvmobile-sliderbar-btn i {
        color: #222 !important;
    }

    #header #tvcms-mobile-view-header.mobile-header-1
        .tvcmsmobile-header-menu-offer-text.tvcmsheader-sticky.sticky
        #tvcmsmobile-header-logo,
    #header #tvcms-mobile-view-header.mobile-header-1
        .tvcmsmobile-header-menu-offer-text.tvcmsheader-sticky.sticky
        #tvcmsmobile-header-logo .tv-header-logo,
    #header #tvcms-mobile-view-header.mobile-header-1
        .tvcmsmobile-header-menu-offer-text.tvcmsheader-sticky.sticky
        #tvcmsmobile-account-button,
    #header #tvcms-mobile-view-header.mobile-header-1
        .tvcmsmobile-header-menu-offer-text.tvcmsheader-sticky.sticky
        #tvmobile-cart,
    #header #tvcms-mobile-view-header.mobile-header-1
        .tvcmsmobile-header-menu-offer-text.tvcmsheader-sticky.sticky
        .tv-myaccount-btn,
    #header #tvcms-mobile-view-header.mobile-header-1
        .tvcmsmobile-header-menu-offer-text.tvcmsheader-sticky.sticky
        .tvheader-cart-btn-wrapper > a {
        background-color: transparent !important;
    }

    #header #tvcms-mobile-view-header.mobile-header-1
        .tvcmsmobile-header-menu-offer-text.tvcmsheader-sticky.sticky
        .tv-myaccount-btn-desktop svg path:nth-child(2),
    #header #tvcms-mobile-view-header.mobile-header-1
        .tvcmsmobile-header-menu-offer-text.tvcmsheader-sticky.sticky
        .tv-cart-icon-main svg g path:nth-child(1) {
        fill: #3e5e89 !important;
    }

    #header #tvcms-mobile-view-header.mobile-header-1
        .tvcmsmobile-header-menu-offer-text.tvcmsheader-sticky.sticky
        .tv-cart-cart-inner {
        color: #fff !important;
        background-color: #3e5e89 !important;
        border-color: #fff !important;
    }

    #tvcmsmobile-horizontal-menu .tvcmsmain-menu-wrapper > .tv-header-menu {
        position: fixed;
        top: 0;
        bottom: 0;
        left: -100%;
        width: min(88vw, 380px);
        max-width: 88vw;
        max-height: 100vh;
        max-height: 100dvh;
        padding: 58px 18px 24px;
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    #tvcmsmobile-horizontal-menu .tvcmsmain-menu-wrapper > .tv-header-menu.open {
        left: 0;
    }

    /*
     * Touch browsers retain :hover after expanding a branch. The theme's
     * global level-1 hover rule then paints the complete open branch blue.
     * Keep every menu level and interaction state transparent while retaining
     * the white slide-out panel as the readable menu surface.
     */
    #tvmobile-megamenu .menu-content,
    #tvmobile-megamenu .menu-content ul,
    #tvmobile-megamenu .menu-content li,
    #tvmobile-megamenu .menu-content li:hover,
    #tvmobile-megamenu .menu-content li:focus,
    #tvmobile-megamenu .menu-content li:focus-within,
    #tvmobile-megamenu .menu-content a,
    #tvmobile-megamenu .menu-content a:hover,
    #tvmobile-megamenu .menu-content a:focus,
    #tvmobile-megamenu .menu-content a:active,
    #tvmobile-megamenu .menu-content .icon-drop-mobile,
    #tvmobile-megamenu .menu-content .icon-drop-mobile:hover,
    #tvmobile-megamenu .menu-content .icon-drop-mobile:focus,
    #tvmobile-megamenu .menu-content .icon-drop-mobile:active {
        background: transparent !important;
    }

    #tvcmsmobile-horizontal-menu > .tvcmsmain-menu-wrapper > .tv-header-menu > li > .tvmenu-link-wrapper {
        padding: 12px 42px 12px 12px;
        text-align: left;
    }

    #products .products-selection,
    #products .tvleft-penal-product-top,
    #products .tv-grid-list-all-wrapper,
    #products .tvall-page-shortby {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 10px;
        max-width: 100%;
    }

    #products .products-selection > *,
    #products .tvleft-penal-product-top > * {
        min-width: 0;
    }

    #products .products-sort-order,
    #products .products-sort-order .select-title {
        max-width: 100%;
    }

    #products .tvproduct-wrapper,
    #products .thumbnail-container,
    #products .product-description {
        min-width: 0;
        max-width: 100%;
    }

    #products .product-title,
    #products .product-title a,
    #products .tv-product-desc {
        overflow-wrap: anywhere;
    }

    #products .tvproduct-hover-btn {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
    }

    .footer-container,
    .footer-container .container,
    .footer-container .row {
        max-width: 100%;
    }

    .footer-container .tvfooter-title-wrapper,
    .footer-container .tvfooter-title,
    .footer-container a,
    .footer-container p {
        overflow-wrap: anywhere;
    }
}

@media (max-width: 767px) {
    #wrapper > .container {
        width: 100%;
        padding-right: 12px;
        padding-left: 12px;
    }

    #content-wrapper,
    #content-wrapper > #main {
        width: 100%;
        max-width: 100%;
    }

    h1,
    .h1,
    .page-header h1,
    .form-title h1,
    #product .tv-product-page-content h1 {
        font-size: clamp(24px, 7vw, 30px);
        line-height: 1.2;
    }

    h2,
    .h2,
    .tvcms-main-title .tvmain-title h2 {
        font-size: clamp(21px, 6vw, 26px) !important;
        line-height: 1.25;
    }

    .page-content,
    .card-block {
        padding: 18px;
    }

    .tvcmsofferbanners-one .container,
    .tvcmsofferbanners-two .container,
    .tvcmsmultibanners .container {
        padding-right: 0;
        padding-left: 0;
    }

    .tvcmsofferbanners-one .container .tvbanner-hover-wrapper,
    .tvcmsofferbanners-two .container .tvbanner-hover-wrapper {
        flex-direction: column;
    }

    .tvcmsofferbanners-one .tvbanner-hover-wrapper > .tv-img-responsive,
    .tvcmsofferbanners-two .tvbanner-hover-wrapper > .tv-img-responsive,
    .tvcmsofferbanners-one .tvofferbanner-content,
    .tvcmsofferbanners-two .tvofferbanner2-content {
        flex: 0 0 auto;
        width: 100%;
        max-width: 100%;
    }

    .tvcmsofferbanners-one .tvofferbanner-content,
    .tvcmsofferbanners-two .tvofferbanner2-content {
        padding: 18px;
    }

    .tvcmsofferbanners-one .tvofferbanner-content p,
    .tvcmsofferbanners-two .tvofferbanner2-content p {
        font-size: 15px;
        line-height: 1.55;
    }

    #product .tvproduct-page-wrapper,
    #product .tvprduct-image-info-wrapper,
    #product .tv-product-page-image,
    #product .tv-product-page-content,
    #product .images-container,
    #product .product-cover,
    #product .product-cover img {
        max-width: 100%;
    }

    #product .tv-product-page-content {
        padding-right: 0;
        padding-left: 0;
    }

    #product .product-actions,
    #product .product-variants,
    #product .product-additional-info,
    #product .product-discounts {
        max-width: 100%;
    }

    #product .product-variants > .product-variants-item ul {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    #product .product-variants > .product-variants-item ul li {
        margin: 0;
    }

    .page-content table,
    .cms-description table,
    table.table,
    table.tvwishlist-info {
        display: block;
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap;
    }

    .form-group.row {
        margin-right: 0;
        margin-left: 0;
    }

    .form-group.row > [class*="col-"] {
        width: 100%;
        max-width: 100%;
        padding-right: 0;
        padding-left: 0;
    }

    .form-control-label {
        margin-bottom: 7px;
        text-align: left;
    }

    input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
    select,
    textarea,
    .form-control {
        font-size: 16px;
    }

    .btn,
    button,
    input[type="submit"],
    .form-control-submit,
    .tvall-inner-btn {
        min-height: 44px;
    }

    #cart .cart-grid,
    #cart .cart-grid-body,
    #cart .cart-grid-right,
    body#checkout #content > .row,
    body#checkout .tvcheckout-process-left,
    body#checkout .tvcheckout-process-right {
        margin-right: 0;
        margin-left: 0;
    }

    #cart .cart-item .product-line-grid,
    #cart .cart-summary-line,
    body#checkout .cart-summary-line {
        min-width: 0;
    }

    body#checkout section.checkout-step {
        padding: 18px;
    }

    body#checkout section.checkout-step .step-title {
        overflow-wrap: anywhere;
        line-height: 1.3;
    }

    .ttvcmscart-show-dropdown-right {
        width: min(100vw, 420px);
        max-width: 100vw;
    }

    .ttvcmscart-show-dropdown-right .tvcart-product-content-box,
    .ttvcmscart-show-dropdown-right .ttvcart-product-label-value {
        min-width: 0;
    }

    .pagination,
    .pagination .page-list,
    .pagination .tvinner-page-pagination {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 6px;
        max-width: 100%;
    }

    .footer-container .tvfooter-storelogo-imformation,
    .footer-container .tvfooter-copy-payment-icon-inner {
        margin-right: 0;
        margin-left: 0;
    }

    #footer .tvpayment-icons-single-row {
        box-sizing: border-box;
        padding: 7px;
    }

    #footer .tvpayment-icons-single-row .tvfooter-payment-icon-wrapper {
        display: flex;
        flex-wrap: wrap !important;
        align-items: center;
        justify-content: center;
        column-gap: 2px;
        row-gap: 12px;
        width: 100%;
        max-width: 100%;
    }

    #footer .tvpayment-icons-single-row .tvfooter-payment-content-block {
        display: flex;
        flex: 0 0 calc((100% - 12px) / 7);
        align-items: center;
        justify-content: center;
        min-width: 0;
        margin: 0;
    }

    #footer .tvpayment-icons-single-row .tvfooter-payment-icon a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
    }

    #footer .tvpayment-icons-single-row .tvfooter-payment-icon img {
        display: block;
        width: 68px !important;
        max-width: 100%;
        height: auto !important;
        margin: 0 !important;
        padding: 7px;
        aspect-ratio: 4 / 3;
        object-fit: contain;
    }

    #footer .tvcopylink {
        padding-right: 0;
        padding-left: 0;
    }

    #footer .tvcopylink p {
        font-size: 12px;
        line-height: 18px;
        letter-spacing: 0;
        overflow-wrap: normal;
        white-space: nowrap;
    }
}

@media (min-width: 576px) and (max-width: 767px) {
    #footer .tvpayment-icons-single-row .tvfooter-payment-icon-wrapper {
        row-gap: 15px;
    }

    #footer .tvpayment-icons-single-row .tvfooter-payment-icon img {
        transform: scale(1);
        transform-origin: center;
    }
}

@media (max-width: 575px) {
    #footer .tvpayment-icons-single-row .tvfooter-payment-icon img {
        transform: scale(1.1);
        transform-origin: center;
    }

    #product .tv-product-page-content h1 {
        padding-right: 0;
        overflow-wrap: break-word;
    }

    #product .tvproduct-title-brandimage .tvproduct-brand {
        position: static;
        display: inline-block;
        max-width: 120px !important;
        margin-bottom: 12px;
    }

    #tvcms-mobile-view-header .tvcmsmobile-header-menu-offer-text {
        grid-template-columns: 44px minmax(0, 1fr) 88px;
        gap: 6px;
        padding-right: max(10px, env(safe-area-inset-right));
        padding-left: max(10px, env(safe-area-inset-left));
    }

    #tvcms-mobile-view-header #tvcmsmobile-header-logo img {
        max-height: 36px;
    }

    #tvcms-mobile-view-header .tvcmsmobile-cart-acount-text {
        display: grid;
        grid-template-columns: repeat(2, 44px);
        gap: 0;
        width: 88px;
        min-width: 88px;
        max-width: 88px;
    }

    #tvcms-mobile-view-header .tvcmsmobile-header-search {
        padding: 0 max(10px, env(safe-area-inset-right)) 10px max(10px, env(safe-area-inset-left));
    }

    /*
     * Primary and textual actions span the available content width on phones.
     * Compact icon controls (header, quantity, sliders and pagination) are
     * intentionally excluded and retain their 44px touch targets.
     */
    #wrapper .btn:not(.btn-touchspin):not(.dropdown-toggle):not(.close):not(.page-link):not(.ttvclose-cart),
    #wrapper .form-control-submit,
    #wrapper input[type="submit"],
    #wrapper .tvall-inner-btn:not(.btn-touchspin),
    .pn-mobile-left-column-trigger .tv-left-pannal-btn-wrapper,
    .modal-content .btn:not(.btn-touchspin):not(.close),
    .footer-container .form-control-submit,
    .footer-container button[type="submit"] {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100% !important;
        max-width: 100%;
        min-height: 44px;
        margin-right: 0 !important;
        margin-left: 0 !important;
        box-sizing: border-box;
        white-space: normal;
        text-align: center;
    }

    .modal-footer,
    .form-footer,
    #product .ets-rv-product-comments-additional-info {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        width: 100%;
    }

    #product .product-actions .tvcart-btn-model,
    #product .product-actions .js-mailalert,
    #product .product-actions .ets-rv-product-comments-additional-info {
        width: 100%;
        max-width: 100%;
    }

    #product .tvproduct-stock-social,
    #product .tvproduct-stock-social .product-additional-info {
        display: block;
        width: 100%;
        max-width: 100%;
    }

    #product .product-actions .add-to-cart,
    #product .product-actions .js-mailalert-add,
    #product .ets-rv-product-comments-additional-info .ets-rv-btn-comment {
        width: 100% !important;
        max-width: 100%;
        margin-right: 0 !important;
        margin-left: 0 !important;
    }

    #wrapper .input-group-btn .btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: auto !important;
        min-width: 70px;
        max-width: none;
        height: 100%;
        margin: 0 !important;
        padding-right: 12px;
        padding-left: 12px;
        white-space: nowrap !important;
    }

    #tvcmsmobile-horizontal-menu .tvcmsmain-menu-wrapper > .tv-header-menu {
        width: 90vw;
        max-width: 90vw;
    }

    #wrapper .breadcrumb {
        margin-right: -2px;
        margin-left: -2px;
    }

    .page-content,
    .card-block,
    body#checkout section.checkout-step {
        padding: 15px;
    }

    #products .products-selection,
    #products .tvleft-penal-product-top {
        align-items: stretch;
    }

    #products .products-selection > *,
    #products .tvall-page-shortby,
    #products .products-sort-order {
        max-width: 100%;
    }

    #product .product-quantity .qty {
        flex: 0 0 auto;
    }

    #product .product-quantity .tvcart-btn-model {
        flex: 1 1 170px;
    }

    #product .product-quantity .add-to-cart {
        width: 100%;
    }

    #product .pn-quantity-tiers__row {
        column-gap: 10px;
    }

    #cart .cart-grid-body,
    #cart .cart-grid-right,
    body#checkout .tvcheckout-process-left,
    body#checkout .tvcheckout-process-right {
        padding-right: 0;
        padding-left: 0;
    }

    .ttvcmscart-show-dropdown-right {
        width: 100vw;
        max-width: 100vw;
    }

    .ttvcmscart-show-dropdown-right > .ttvcart-product-list-btn-wrapper {
        min-height: 54px;
    }

    .ttvcmscart-show-dropdown-right .ttvcart-product-list-viewcart,
    .ttvcmscart-show-dropdown-right .ttvcart-product-list-checkout {
        height: 54px;
        min-height: 54px;
    }

    .ttvcmscart-show-dropdown-right .ttvcart-product-list-viewcart > a,
    .ttvcmscart-show-dropdown-right .ttvcart-product-list-checkout > a {
        padding: 0 8px;
        font-size: 13px;
        white-space: normal;
        text-align: center;
    }

    .footer-container .tvnewsleeter-input-button-wraper,
    .footer-container .input-wrapper,
    .footer-container .input-wrapper input {
        width: 100%;
        max-width: 100%;
    }

    .footer-container .tvnewsleeter-input-button-wraper {
        display: flex;
        flex-direction: column;
        gap: 10px;
        height: auto;
    }

    .footer-container .tvnewsleteer-btn-wrapper {
        position: static;
        width: 100%;
        height: auto;
    }

    .footer-container .tvnewsleteer-btn-wrapper .tvall-inner-btn {
        width: 100% !important;
        margin: 0 !important;
    }
}

@media (hover: none) and (pointer: coarse) {
    a.btn,
    button,
    input[type="submit"],
    .tvall-inner-btn,
    .nav-link,
    .pagination a {
        min-height: 44px;
    }
}