/*
 * AC Tire Catalog Manager 1.6
 * Product cards, widths, image dimensions, gutters, and responsive breakpoints
 * are intentionally left entirely to WooCommerce/Hugo/Colibri. This stylesheet
 * only controls the inserted size headings and the distance between native
 * WooCommerce product lists.
 */
.ac-tcm-start,
.ac-tcm-end{
    display:block;
    width:100%;
    height:0;
    margin:0;
    padding:0;
    clear:both;
}

.ac-tcm-heading{
    display:flex;
    align-items:center;
    gap:14px;
    width:100%;
    clear:both;
    margin:26px 0 16px !important;
    padding:0 !important;
    font-size:27px;
    line-height:1.2;
    font-weight:400;
    color:inherit;
}

.ac-tcm-start + .ac-tcm-heading{
    margin-top:8px !important;
}

.ac-tcm-heading::after{
    content:"";
    flex:1;
    height:1px;
    background:currentColor;
    opacity:.18;
}

/* Native category pages use one products list. Multiple lists can inherit a
 * large bottom margin, so only that external margin is normalized here. No
 * card or image styling is applied. */
ul.products.ac-tcm-products{
    clear:both;
    width:100%;
    min-height:0 !important;
    height:auto !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
}

ul.products.ac-tcm-products + .ac-tcm-heading{
    margin-top:30px !important;
}

@media (max-width:767px){
    .ac-tcm-heading{
        gap:10px;
        margin:21px 0 12px !important;
        font-size:21px;
    }

    .ac-tcm-start + .ac-tcm-heading{
        margin-top:6px !important;
    }

    ul.products.ac-tcm-products + .ac-tcm-heading{
        margin-top:22px !important;
    }
}
