/*==================================================
TESTED OK ELECTRONICS
SHOP / PRODUCT ARCHIVE
SHOP-ONLY STYLES
==================================================*/


/*==================================================
SHOP PAGE BASE
==================================================*/

.tok-shop-page {
    width: 100%;
    background: #ffffff;
    color: #071A33;
}

.tok-shop-page .tok-shop-container {
    width: min(1200px, calc(100% - 48px));
    max-width: 1200px;
    margin: 0 auto;
}


/*==================================================
SHOP HERO
==================================================*/

.tok-shop-page .tok-shop-hero {
    position: relative;
    overflow: hidden;
    padding: 82px 0 78px;
    background: linear-gradient(
        135deg,
        #071A33 0%,
        #0D47A1 100%
    );
}

.tok-shop-page .tok-shop-hero::before {
    content: "";
    position: absolute;
    top: -210px;
    right: -120px;

    width: 420px;
    height: 420px;

    border-radius: 50%;

    background: rgba(255,255,255,.05);
}

.tok-shop-page .tok-shop-hero::after {
    content: "";
    position: absolute;
    bottom: -180px;
    left: -80px;

    width: 280px;
    height: 280px;

    border-radius: 50%;

    background: rgba(227,30,36,.10);
}

.tok-shop-page .tok-shop-hero-content {
    position: relative;
    z-index: 2;
    max-width: 760px;
}

.tok-shop-page .tok-shop-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    margin-bottom: 20px;

    color: #ffffff;

    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2px;
}

.tok-shop-page .tok-shop-eyebrow span {
    width: 30px;
    height: 3px;

    background: #E31E24;
}

.tok-shop-page .tok-shop-hero h1 {
    margin: 0 0 20px;

    color: #ffffff;

    font-size: 52px;
    line-height: 1.08;
    font-weight: 800;

    letter-spacing: -1px;
}

.tok-shop-page .tok-shop-hero h1 span {
    color: #E31E24;
}

.tok-shop-page .tok-shop-hero p {
    max-width: 680px;

    margin: 0 0 28px;

    color: rgba(255,255,255,.82);

    font-size: 17px;
    line-height: 1.8;
}

.tok-shop-page .tok-shop-breadcrumb {
    display: flex;
    align-items: center;
    gap: 10px;

    color: rgba(255,255,255,.65);

    font-size: 13px;
}

.tok-shop-page .tok-shop-breadcrumb a {
    color: #ffffff !important;
    text-decoration: none !important;
}

.tok-shop-page .tok-shop-breadcrumb a:hover {
    color: #E31E24 !important;
}

.tok-shop-page .tok-shop-breadcrumb i {
    color: rgba(255,255,255,.45);
    font-size: 10px;
}


/*==================================================
SHOP CONTENT
==================================================*/

.tok-shop-page .tok-shop-content {
    padding: 70px 0 100px;
}


/*==================================================
SHOP CATEGORY SECTION
==================================================*/

.tok-shop-page .tok-shop-categories {
    width: 100%;
    margin-bottom: 60px;
    overflow: visible;
}

.tok-shop-page .tok-shop-category-heading {
    margin-bottom: 24px;
}

.tok-shop-page .tok-shop-category-heading span {
    display: block;

    margin-bottom: 7px;

    color: #E31E24;

    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.8px;

    line-height: 1.2;
    text-transform: uppercase;
}

.tok-shop-page .tok-shop-category-heading h2 {
    margin: 0;

    color: #071A33;

    font-family: "Space Grotesk", Arial, sans-serif;

    font-size: 30px;
    line-height: 1.2;
    font-weight: 800;
}


/*==================================================
CATEGORY ROW
==================================================*/

.tok-shop-page .tok-shop-category-list {
    display: flex;
    align-items: stretch;
    justify-content: flex-start;

    flex-wrap: wrap;

    gap: 12px;

    width: 100%;

    margin: 0;
    padding: 0;

    overflow: visible;

    list-style: none;
}


/*==================================================
CATEGORY BUTTON
==================================================*/

.tok-shop-page .tok-shop-category {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;

    flex: 0 0 auto;

    min-width: 0;
    min-height: 48px;

    padding: 0 14px;

    border: 1px solid #DCE4ED;

    background: #ffffff;

    color: #071A33 !important;

    font-size: 12px;
    font-weight: 700;
    line-height: 1;

    text-decoration: none !important;

    white-space: nowrap;

    box-sizing: border-box;

    transition:
        background .25s ease,
        border-color .25s ease,
        color .25s ease,
        transform .25s ease;
}

.tok-shop-page .tok-shop-category:hover {
    border-color: #0D47A1;

    background: #F5F8FC;

    color: #0D47A1 !important;

    transform: translateY(-2px);
}


/*==================================================
ACTIVE CATEGORY
==================================================*/

.tok-shop-page .tok-shop-category.is-active {
    border-color: #0D47A1;

    background: #0D47A1;

    color: #ffffff !important;
}

.tok-shop-page .tok-shop-category.is-active:hover {
    border-color: #0D47A1;

    background: #0D47A1;

    color: #ffffff !important;
}


/*==================================================
CATEGORY ICON
==================================================*/

.tok-shop-page .tok-shop-category-icon {
    position: relative;

    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    flex: 0 0 30px;

    width: 30px;
    min-width: 30px;
    height: 30px;
    min-height: 30px;

    margin-right: 9px;

    padding: 0;

    background: #F1F5F9;

    color: #0D47A1;

    font-size: 13px;

    line-height: 1;

    text-align: center;

    box-sizing: border-box;

    overflow: visible;
}


/*==================================================
FONT AWESOME ICON INSIDE CATEGORY
==================================================*/

.tok-shop-page .tok-shop-category-icon i {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    width: auto;
    height: auto;

    margin: 0 !important;
    padding: 0 !important;

    color: inherit !important;

    font-family: "Font Awesome 6 Free" !important;

    font-size: 13px !important;

    font-weight: 900 !important;

    line-height: 1 !important;

    opacity: 1 !important;

    visibility: visible !important;

    transform: none !important;
}


/*==================================================
ACTIVE ICON
==================================================*/

.tok-shop-page .tok-shop-category.is-active .tok-shop-category-icon {
    background: rgba(255,255,255,.16);

    color: #ffffff !important;
}

.tok-shop-page .tok-shop-category.is-active .tok-shop-category-icon i {
    color: #ffffff !important;

    opacity: 1 !important;
    visibility: visible !important;
}


/*==================================================
CATEGORY TEXT
==================================================*/

.tok-shop-page .tok-shop-category-label {
    display: inline-block;

    color: inherit;

    line-height: 1.2;

    white-space: nowrap;
}

.tok-shop-page .tok-shop-category.is-active .tok-shop-category-label {
    color: #ffffff !important;
}


/*==================================================
DESKTOP CATEGORY SIZING
==================================================*/

@media (min-width: 1025px) {

    .tok-shop-page .tok-shop-category {
        min-height: 48px;

        padding-left: 14px;
        padding-right: 16px;
    }

}


/*==================================================
TABLET
==================================================*/

@media (max-width: 1024px) and (min-width: 768px) {

    .tok-shop-page .tok-shop-category-list {
        flex-wrap: wrap;
    }

    .tok-shop-page .tok-shop-category {
        min-height: 48px;
    }

}


/*==================================================
MOBILE CATEGORY ROW
==================================================*/

@media (max-width: 767px) {

    .tok-shop-page .tok-shop-category-list {
        flex-wrap: nowrap;

        width: calc(100vw - 28px);

        max-width: none;

        overflow-x: auto;
        overflow-y: hidden;

        padding: 3px 2px 12px;

        margin-right: -14px;

        scrollbar-width: none;

        -webkit-overflow-scrolling: touch;
    }

    .tok-shop-page .tok-shop-category-list::-webkit-scrollbar {
        display: none;
    }

    .tok-shop-page .tok-shop-category {
        flex: 0 0 auto;

        min-height: 48px;

        padding: 0 14px;
    }

    .tok-shop-page .tok-shop-category-icon {
        flex-basis: 30px;

        width: 30px;
        min-width: 30px;
        height: 30px;
    }

}


/*==================================================
SMALL MOBILE
==================================================*/

@media (max-width: 480px) {

    .tok-shop-page .tok-shop-category-list {
        width: calc(100vw - 20px);

        margin-right: -10px;
    }

    .tok-shop-page .tok-shop-category {
        min-height: 46px;

        padding: 0 12px;

        font-size: 11px;
    }

    .tok-shop-page .tok-shop-category-icon {
        flex-basis: 28px;

        width: 28px;
        min-width: 28px;
        height: 28px;

        margin-right: 8px;
    }

    .tok-shop-page .tok-shop-category-icon i {
        font-size: 12px !important;
    }

}

/*==================================================
SHOP TOOLBAR
==================================================*/

.tok-shop-page .tok-shop-toolbar {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 30px;

    margin-bottom: 30px;
    padding-bottom: 22px;

    border-bottom: 1px solid #E5EAF0;
}

.tok-shop-page .tok-shop-results-label {
    display: block;

    margin-bottom: 5px;

    color: #E31E24;

    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;

    text-transform: uppercase;
}

.tok-shop-page .tok-shop-results h2 {
    margin: 0 0 5px;

    color: #071A33;

    font-size: 30px;
    line-height: 1.2;
    font-weight: 800;
}

.tok-shop-page .tok-shop-results p {
    margin: 0;

    color: #89929D;

    font-size: 13px;
}

.tok-shop-page .tok-shop-toolbar-right {
    display: flex;
    align-items: center;

    gap: 12px;
}

.tok-shop-page .tok-shop-ordering .woocommerce-ordering {
    margin: 0 !important;
}

.tok-shop-page .tok-shop-ordering select {
    min-width: 180px;
    height: 46px;

    padding: 0 38px 0 14px;

    border: 1px solid #DCE3EB;
    border-radius: 8px;

    background: #ffffff;

    color: #071A33;

    font-size: 13px;
    font-weight: 600;
}

.tok-shop-page .tok-shop-filter-toggle {
    display: none;

    align-items: center;
    justify-content: center;

    gap: 8px;

    height: 46px;

    padding: 0 16px;

    border: 1px solid #DCE3EB;
    border-radius: 8px;

    background: #ffffff;

    color: #071A33;

    font-size: 13px;
    font-weight: 700;

    cursor: pointer;
}


/*==================================================
SHOP PRODUCT GRID
==================================================*/

/*
 * IMPORTANT:
 *
 * Everything below is scoped to .tok-shop-page.
 * It cannot affect the homepage product cards.
 */

.tok-shop-page .tok-shop-products ul.products {
    display: grid !important;

    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 28px 22px;

    margin: 0 !important;
    padding: 0 !important;

    list-style: none !important;
}

.tok-shop-page .tok-shop-products ul.products::before,
.tok-shop-page .tok-shop-products ul.products::after {
    display: none !important;
}

.tok-shop-page .tok-shop-products ul.products li.product {
    width: auto !important;

    float: none !important;

    margin: 0 !important;

    padding: 0 !important;
}


/*==================================================
ARCHIVE PRODUCT CARD
==================================================*/

.tok-shop-page .tok-shop-products li.product {
    position: relative;

    display: flex !important;
    flex-direction: column;

    width: auto !important;
    min-width: 0;
    height: 100%;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden;

    border: 1px solid #E4E9EF;

    background: #ffffff;

    box-sizing: border-box;

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease;
}

.tok-shop-page .tok-shop-products li.product:hover {
    transform: translateY(-5px);

    border-color: #D6DEE8;

    box-shadow: 0 16px 38px rgba(7,26,51,.10);
}


/*==================================================
ARCHIVE IMAGE
==================================================*/

.tok-shop-page .tok-shop-products li.product > a:first-child {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 270px;

    padding: 20px;

    background: #F6F8FA;

    overflow: hidden;
}

.tok-shop-page .tok-shop-products li.product > a:first-child img {
    display: block;

    width: 100%;
    height: 100%;

    max-width: 100%;
    max-height: 100%;

    margin: 0 !important;

    object-fit: contain;

    transition: transform .5s ease;
}

.tok-shop-page .tok-shop-products li.product:hover > a:first-child img {
    transform: scale(1.045);
}


/*==================================================
SALE BADGE
==================================================*/

.tok-shop-page .tok-shop-products li.product .onsale {
    position: absolute !important;

    top: 14px !important;
    left: 14px !important;
    right: auto !important;

    z-index: 5;

    min-width: auto !important;
    min-height: auto !important;

    margin: 0 !important;

    padding: 7px 10px !important;

    border-radius: 4px !important;

    background: #E31E24 !important;

    color: #ffffff !important;

    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1 !important;

    letter-spacing: .7px;

    text-transform: uppercase;
}


/*==================================================
ARCHIVE PRODUCT CONTENT
==================================================*/

.tok-shop-page .tok-shop-products li.product .woocommerce-loop-product__title {
    display: -webkit-box;

    min-height: 52px;

    margin: 0 !important;

    padding: 18px 18px 6px !important;

    overflow: hidden;

    color: #071A33 !important;

    font-family: "Space Grotesk", Arial, sans-serif;

    font-size: 16px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;

    text-decoration: none !important;

    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;

    box-sizing: border-box;
}

.tok-shop-page .tok-shop-products li.product .woocommerce-loop-product__title:hover {
    color: #0D47A1 !important;
}





/*==================================================
ARCHIVE PRICE
==================================================*/

.tok-shop-page .tok-shop-products li.product .price {
    display: flex !important;

    align-items: baseline;

    flex-wrap: wrap;

    gap: 8px;

    min-height: 26px;

    margin: 9px 0 0 !important;

    padding: 0 18px !important;

    color: #071A33 !important;

    font-family: "Space Grotesk", Arial, sans-serif;

    font-size: 18px !important;

    font-weight: 800 !important;

    line-height: 1.3 !important;

    box-sizing: border-box;
}

.tok-shop-page .tok-shop-products li.product .price del {
    color: #9AA3AD !important;

    font-size: 12px;

    font-weight: 500;
}

.tok-shop-page .tok-shop-products li.product .price ins {
    color: #E31E24 !important;

    text-decoration: none !important;
}


/*==================================================
ARCHIVE ADD TO CART
==================================================*/

.tok-shop-page .tok-shop-products li.product .add_to_cart_button,
.tok-shop-page .tok-shop-products li.product .button {
    display: inline-flex !important;

    align-items: center;
    justify-content: center;

    min-height: 42px;

    margin: auto 18px 18px !important;

    padding: 0 18px !important;

    border: 0 !important;

    border-radius: 6px !important;

    background: #E31E24 !important;

    color: #ffffff !important;

    font-size: 12px !important;
    font-weight: 700 !important;

    line-height: 1 !important;

    text-decoration: none !important;

    transition:
        background .3s ease,
        transform .3s ease;
}

.tok-shop-page .tok-shop-products li.product .add_to_cart_button:hover,
.tok-shop-page .tok-shop-products li.product .button:hover {
    background: #071A33 !important;

    color: #ffffff !important;

    transform: translateY(-2px);
}


/*==================================================
VIEW CART
==================================================*/

.tok-shop-page .tok-shop-products li.product .added_to_cart {
    display: inline-block;

    margin: 0 18px 18px;

    color: #0D47A1 !important;

    font-size: 12px;
    font-weight: 700;

    text-decoration: none !important;
}


/*==================================================
MOBILE FILTER PANEL
==================================================*/

.tok-shop-page .tok-shop-filter-panel {
    display: none;
}

.tok-shop-page .tok-shop-filter-panel.is-open {
    display: block;
}

.tok-shop-page .tok-shop-filter-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;

    padding-bottom: 18px;

    border-bottom: 1px solid #E5EAF0;
}

.tok-shop-page .tok-shop-filter-panel-header strong {
    color: #071A33;

    font-size: 18px;
}

.tok-shop-page .tok-shop-filter-close {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 38px;
    height: 38px;

    border: 0;

    background: #F4F6F8;

    color: #071A33;

    cursor: pointer;
}

.tok-shop-page .tok-shop-filter-block {
    padding-top: 22px;
}

.tok-shop-page .tok-shop-filter-block h3 {
    margin: 0 0 15px;

    color: #071A33;

    font-size: 15px;
    font-weight: 800;
}

.tok-shop-page .tok-shop-filter-block ul {
    margin: 0;
    padding: 0;

    list-style: none;
}

.tok-shop-page .tok-shop-filter-block li {
    border-bottom: 1px solid #EDF0F3;
}

.tok-shop-page .tok-shop-filter-block li a {
    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 12px 0;

    color: #56616E !important;

    font-size: 13px;

    text-decoration: none !important;
}

.tok-shop-page .tok-shop-filter-block li a:hover {
    color: #E31E24 !important;
}

.tok-shop-page .tok-shop-filter-block li a span {
    color: #9AA2AD;
}


/*==================================================
PAGINATION
==================================================*/

.tok-shop-page .tok-shop-pagination {
    margin-top: 55px;
}

.tok-shop-page .tok-shop-pagination .woocommerce-pagination {
    margin: 0 !important;

    text-align: center;
}

.tok-shop-page .tok-shop-pagination .page-numbers {
    display: inline-flex !important;

    align-items: center;
    justify-content: center;

    min-width: 42px;
    height: 42px;

    margin: 0 4px !important;

    border: 1px solid #DCE3EB !important;
    border-radius: 8px;

    background: #ffffff !important;

    color: #071A33 !important;

    font-size: 13px;
    font-weight: 700;

    text-decoration: none !important;
}

.tok-shop-page .tok-shop-pagination .page-numbers.current,
.tok-shop-page .tok-shop-pagination .page-numbers:hover {
    border-color: #0D47A1 !important;

    background: #0D47A1 !important;

    color: #ffffff !important;
}


/*==================================================
EMPTY SHOP
==================================================*/

.tok-shop-page .tok-shop-empty {
    padding: 80px 20px;

    text-align: center;

    border: 1px solid #E5EAF0;

    background: #F8FAFC;
}

.tok-shop-page .tok-shop-empty-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 70px;
    height: 70px;

    margin: 0 auto 20px;

    background: #EAF1FB;

    color: #0D47A1;

    font-size: 25px;
}

.tok-shop-page .tok-shop-empty h2 {
    margin: 0 0 10px;

    color: #071A33;

    font-size: 28px;
}

.tok-shop-page .tok-shop-empty p {
    max-width: 500px;

    margin: 0 auto 25px;

    color: #7B8591;

    font-size: 14px;
    line-height: 1.7;
}

.tok-shop-page .tok-shop-empty-button {
    display: inline-flex;
    align-items: center;

    gap: 9px;

    padding: 13px 22px;

    background: #E31E24;

    color: #ffffff !important;

    font-size: 13px;
    font-weight: 700;

    text-decoration: none !important;
}


/*==================================================
TABLET
==================================================*/

@media (max-width: 1100px) {

    .tok-shop-page .tok-shop-container {
        width: calc(100% - 40px);
    }

    .tok-shop-page .tok-shop-products ul.products {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .tok-shop-page .tok-shop-hero h1 {
        font-size: 46px;
    }

}


/*==================================================
MOBILE / TABLET
==================================================*/

@media (max-width: 767px) {

    .tok-shop-page .tok-shop-container {
        width: calc(100% - 28px);
    }

    .tok-shop-page .tok-shop-hero {
        padding: 58px 0 55px;
    }

    .tok-shop-page .tok-shop-hero h1 {
        font-size: 37px;
        letter-spacing: -.6px;
    }

    .tok-shop-page .tok-shop-hero p {
        font-size: 15px;
        line-height: 1.7;
    }

    .tok-shop-page .tok-shop-content {
        padding: 48px 0 70px;
    }

    .tok-shop-page .tok-shop-categories {
        margin-bottom: 42px;
    }

    .tok-shop-page .tok-shop-category-heading h2 {
        font-size: 25px;
    }

    .tok-shop-page .tok-shop-toolbar {
        align-items: center;

        margin-bottom: 24px;

        padding-bottom: 18px;
    }

    .tok-shop-page .tok-shop-results h2 {
        font-size: 24px;
    }

    .tok-shop-page .tok-shop-toolbar-right {
        flex-shrink: 0;
    }

    .tok-shop-page .tok-shop-filter-toggle {
        display: inline-flex;
    }

    .tok-shop-page .tok-shop-ordering select {
        min-width: 145px;
        max-width: 155px;
    }

    .tok-shop-page .tok-shop-products ul.products {
        grid-template-columns: repeat(2, minmax(0, 1fr));

        gap: 22px 12px;
    }

    .tok-shop-page .tok-shop-filter-panel.is-open {
        margin-bottom: 25px;

        padding: 22px;

        border: 1px solid #E1E7EE;

        background: #ffffff;
    }

    .tok-shop-page .tok-shop-products li.product > a:first-child {
        height: 220px;

        padding: 14px;
    }

    .tok-shop-page .tok-shop-products li.product .woocommerce-loop-product__title {
        min-height: 48px;

        padding: 15px 13px 6px !important;

        font-size: 14px !important;
    }

    .tok-shop-page .tok-shop-products li.product .price {
        padding: 0 13px !important;

        font-size: 15px !important;
    }

    .tok-shop-page .tok-shop-products li.product .product-categories,
    .tok-shop-page .tok-shop-products li.product .posted_in,
    .tok-shop-page .tok-shop-products li.product .product-category,
    .tok-shop-page .tok-shop-products li.product .tok-product-category {
        min-height: 28px;

        padding: 0 13px !important;

        font-size: 9px;
    }

    .tok-shop-page .tok-shop-products li.product .add_to_cart_button,
    .tok-shop-page .tok-shop-products li.product .button {
        width: calc(100% - 26px);

        margin: 13px 13px 15px !important;

        min-height: 40px;

        padding: 0 10px !important;

        font-size: 11px !important;
    }

}


/*==================================================
SMALL MOBILE
==================================================*/

@media (max-width: 480px) {

    .tok-shop-page .tok-shop-container {
        width: calc(100% - 20px);
    }

    .tok-shop-page .tok-shop-hero {
        padding: 48px 0 45px;
    }

    .tok-shop-page .tok-shop-eyebrow {
        font-size: 10px;
        letter-spacing: 1.5px;
    }

    .tok-shop-page .tok-shop-hero h1 {
        font-size: 31px;
    }

    .tok-shop-page .tok-shop-hero p {
        font-size: 14px;
    }

    .tok-shop-page .tok-shop-toolbar {
        display: block;
    }

    .tok-shop-page .tok-shop-toolbar-right {
        display: grid;

        grid-template-columns: 1fr 1fr;

        width: 100%;

        margin-top: 18px;
    }

    .tok-shop-page .tok-shop-filter-toggle,
    .tok-shop-page .tok-shop-ordering,
    .tok-shop-page .tok-shop-ordering .woocommerce-ordering,
    .tok-shop-page .tok-shop-ordering select {
        width: 100%;
    }

    .tok-shop-page .tok-shop-products ul.products {
        gap: 18px 10px;
    }

    .tok-shop-page .tok-shop-products li.product > a:first-child {
        height: 190px;
    }

}








/*==================================================
SHOP ARCHIVE — PRIMARY CATEGORY ONLY
==================================================*/

.tok-shop-page .tok-product-card .tok-product-category {
    display: block;

    width: 100%;

    min-height: 18px;

    margin: 0 !important;

    padding: 0 !important;

    color: #89929D !important;

    font-family: "Inter", Arial, sans-serif;

    font-size: 10px !important;

    font-weight: 600 !important;

    line-height: 1.4 !important;

    letter-spacing: 0;

    text-transform: uppercase;

    text-align: left;

    box-sizing: border-box;
}


/*
|--------------------------------------------------------------------------
| Keep the category aligned with the card content
|--------------------------------------------------------------------------
*/

.tok-shop-page .tok-product-card .tok-product-body {
    padding-left: 18px;
    padding-right: 18px;
}


/*
|--------------------------------------------------------------------------
| Remove inherited spacing from elements around category
|--------------------------------------------------------------------------
*/

.tok-shop-page .tok-product-card .tok-product-category + * {
    margin-top: 0;
}


/*
|--------------------------------------------------------------------------
| Archive Add To Cart
|--------------------------------------------------------------------------
*/

.tok-shop-page .tok-product-card .tok-product-footer {
    width: 100%;

    margin-top: auto;

    padding-top: 18px;
}


/*
|--------------------------------------------------------------------------
| Mobile
|--------------------------------------------------------------------------
*/

@media (max-width: 767px) {

    .tok-shop-page .tok-product-card .tok-product-body {
        padding-left: 13px;
        padding-right: 13px;
    }

    .tok-shop-page .tok-product-card .tok-product-category {
        font-size: 9px !important;
    }

}







/* =========================================================
   TESTED OK — SHOP PRODUCT CARD ALIGNMENT
   ========================================================= */


/* ---------------------------------------------------------
   CARD
   --------------------------------------------------------- */

.tok-shop-page .tok-product-card {
    height: 100%;
    box-sizing: border-box;
}


/* ---------------------------------------------------------
   CARD BODY
   --------------------------------------------------------- */

.tok-shop-page .tok-product-card .tok-product-body {
    display: flex;
    flex-direction: column;

    height: 100%;

    box-sizing: border-box;
}


/* ---------------------------------------------------------
   PRODUCT TITLE
   Always reserve exactly 2 lines
   --------------------------------------------------------- */

.tok-shop-page .tok-product-card .tok-product-title {
    min-height: 52px;

    margin-top: 0 !important;
    margin-bottom: 12px !important;

    line-height: 1.4;

    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;

    overflow: hidden;
}


/* ---------------------------------------------------------
   PRICE
   --------------------------------------------------------- */

.tok-shop-page .tok-product-card .tok-price-stock {
    width: 100%;

    min-height: 28px;

    margin: 0 !important;

    box-sizing: border-box;
}


/* ---------------------------------------------------------
   PRODUCT CATEGORY
   ONLY ONE CATEGORY
   --------------------------------------------------------- */

.tok-shop-page .tok-product-card .product-categories,
.tok-shop-page .tok-product-card .product-category,
.tok-shop-page .tok-product-card .posted_in,
.tok-shop-page .tok-product-card .tok-product-categories,
.tok-shop-page .tok-product-card .tok-categories {

    width: 100%;

    min-height: 20px;

    margin: 6px 0 0 !important;

    padding: 0 !important;

    line-height: 1.3 !important;

    box-sizing: border-box;

    overflow: hidden;
}


/* ---------------------------------------------------------
   CATEGORY LINK
   --------------------------------------------------------- */

.tok-shop-page .tok-product-card .product-categories a,
.tok-shop-page .tok-product-card .product-category a,
.tok-shop-page .tok-product-card .posted_in a,
.tok-shop-page .tok-product-card .tok-product-categories a {

    display: inline-block;

    margin: 0 !important;
    padding: 0 !important;

    color: #89929D !important;

    font-size: 10px !important;
    font-weight: 600 !important;

    line-height: 1.3 !important;

    text-transform: uppercase;

    text-decoration: none;
}


/* ---------------------------------------------------------
   REMOVE EXTRA CATEGORY ITEMS IF ANY EXIST
   --------------------------------------------------------- */

.tok-shop-page .tok-product-card .product-categories .separator,
.tok-shop-page .tok-product-card .product-categories br {
    display: none !important;
}


/* ---------------------------------------------------------
   FOOTER
   Push button to same position
   --------------------------------------------------------- */

.tok-shop-page .tok-product-card .tok-product-footer {
    width: 100%;

    margin-top: auto !important;

    padding-top: 16px !important;

    box-sizing: border-box;
}


/* ---------------------------------------------------------
   ADD TO CART
   --------------------------------------------------------- */

.tok-shop-page .tok-product-card .tok-add-cart {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    min-height: 40px;

    box-sizing: border-box;
}


/* ---------------------------------------------------------
   GRID
   --------------------------------------------------------- */

.tok-shop-page .tok-shop-products {
    width: 100%;
}


.tok-shop-page .tok-shop-products ul.products {
    align-items: stretch !important;
}


.tok-shop-page .tok-shop-products ul.products > li {
    height: 100% !important;
}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 767px) {

    .tok-shop-page .tok-product-card .tok-product-title {
        min-height: 52px;
    }

    .tok-shop-page .tok-product-card .product-categories,
    .tok-shop-page .tok-product-card .product-category,
    .tok-shop-page .tok-product-card .posted_in,
    .tok-shop-page .tok-product-card .tok-product-categories {
        min-height: 20px;
    }

}








/* =========================================================
   FINAL FIX — ADD TO CART BUTTON
   ========================================================= */

.tok-shop-page .tok-product-footer {
    width: 100% !important;
    margin-top: auto !important;
    padding-top: 18px !important;
}

.tok-shop-page .tok-add-cart {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    min-width: 0 !important;

    height: 42px !important;
    min-height: 42px !important;

    margin: 0 !important;
    padding: 0 15px !important;

    border: 0 !important;
    border-radius: 6px !important;

    background: #E31E24 !important;
    color: #ffffff !important;

    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    text-align: center !important;
    text-decoration: none !important;

    box-sizing: border-box !important;

    float: none !important;
    position: relative !important;

    transform: none;
}

.tok-shop-page .tok-add-cart:hover {
    background: #071A33 !important;
    color: #ffffff !important;
}


/* Remove WooCommerce / theme pseudo-elements
   that may be producing the stray red mark */

.tok-shop-page .tok-add-cart::before,
.tok-shop-page .tok-add-cart::after {
    display: none !important;
    content: none !important;
}


/* Make sure the product footer itself
   doesn't inherit WooCommerce button rules */

.tok-shop-page .tok-product-footer .button,
.tok-shop-page .tok-product-footer .add_to_cart_button {
    width: 100% !important;
    margin: 0 !important;
    float: none !important;
}







/* =========================================================
   FINAL PRODUCT CARD ALIGNMENT
   ========================================================= */

/* ---------------------------------------------------------
   PRODUCT BODY
   --------------------------------------------------------- */

.tok-shop-page
.tok-shop-products
.tok-product-body {
    display: flex !important;

    flex-direction: column !important;

    width: 100% !important;

    min-width: 0 !important;

    flex: 1 1 auto !important;

    padding: 18px !important;

    margin: 0 !important;

    box-sizing: border-box !important;
}


/* ---------------------------------------------------------
   PRODUCT TITLE
   Keep exactly the same title space on every card.
   --------------------------------------------------------- */

.tok-shop-page
.tok-shop-products
.tok-product-title {
    display: -webkit-box !important;

    width: 100% !important;

    min-height: 52px !important;

    max-height: 52px !important;

    margin: 0 0 10px 0 !important;

    padding: 0 !important;

    overflow: hidden !important;

    color: #071A33 !important;

    font-size: 16px !important;

    line-height: 1.4 !important;

    font-weight: 700 !important;

    -webkit-line-clamp: 2 !important;

    -webkit-box-orient: vertical !important;

    box-sizing: border-box !important;
}

.tok-shop-page
.tok-shop-products
.tok-product-title a {
    display: block !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #071A33 !important;

    text-decoration: none !important;
}


/* ---------------------------------------------------------
   PRICE
   --------------------------------------------------------- */

.tok-shop-page
.tok-shop-products
.tok-product-price {
    width: 100% !important;

    min-height: 25px !important;

    margin: 0 !important;

    padding: 0 !important;

    box-sizing: border-box !important;
}


/* ---------------------------------------------------------
   CATEGORY
   --------------------------------------------------------- */

.tok-shop-page
.tok-shop-products
.tok-product-category {
    width: 100% !important;

    min-height: 22px !important;

    margin: 6px 0 0 0 !important;

    padding: 0 !important;

    box-sizing: border-box !important;
}


/* ---------------------------------------------------------
   FOOTER
   --------------------------------------------------------- */

.tok-shop-page
.tok-shop-products
.tok-product-footer {
    display: block !important;

    width: 100% !important;

    margin: auto 0 0 0 !important;

    padding: 18px 0 0 0 !important;

    box-sizing: border-box !important;

    position: relative !important;

    left: 0 !important;

    right: auto !important;

    float: none !important;
}


/* ---------------------------------------------------------
   ADD TO CART
   --------------------------------------------------------- */

.tok-shop-page
.tok-shop-products
.tok-product-footer
a.tok-add-cart {
    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    width: 100% !important;

    min-width: 0 !important;

    max-width: none !important;

    height: 42px !important;

    min-height: 42px !important;

    margin: 0 !important;

    padding: 0 !important;

    border: 0 !important;

    border-radius: 6px !important;

    background: #E31E24 !important;

    color: #ffffff !important;

    font-size: 12px !important;

    font-weight: 700 !important;

    line-height: 42px !important;

    text-align: center !important;

    text-decoration: none !important;

    position: relative !important;

    left: 0 !important;

    right: auto !important;

    top: auto !important;

    bottom: auto !important;

    float: none !important;

    transform: none !important;

    box-sizing: border-box !important;
}


/* ---------------------------------------------------------
   REMOVE EVERYTHING THEME / WOOCOMMERCE
   MAY BE ADDING BEFORE THE BUTTON
   --------------------------------------------------------- */

.tok-shop-page
.tok-shop-products
.tok-product-footer
a.tok-add-cart::before,

.tok-shop-page
.tok-shop-products
.tok-product-footer
a.tok-add-cart::after {
    display: none !important;

    content: none !important;

    width: 0 !important;

    height: 0 !important;

    margin: 0 !important;

    padding: 0 !important;
}


/* ---------------------------------------------------------
   REMOVE BUTTON PSEUDO ICONS FROM PARENT
   --------------------------------------------------------- */

.tok-shop-page
.tok-shop-products
.tok-product-footer::before,

.tok-shop-page
.tok-shop-products
.tok-product-footer::after {
    display: none !important;

    content: none !important;
}


/* ---------------------------------------------------------
   HOVER
   --------------------------------------------------------- */

.tok-shop-page
.tok-shop-products
.tok-product-footer
a.tok-add-cart:hover {
    background: #071A33 !important;

    color: #ffffff !important;

    transform: none !important;
}


/* =========================================================
   MAKE EVERY CARD EQUAL HEIGHT
   ========================================================= */

.tok-shop-page
.tok-shop-products
ul.products {
    align-items: stretch !important;
}

.tok-shop-page
.tok-shop-products
li.tok-shop-product-item {
    display: flex !important;

    flex-direction: column !important;

    height: auto !important;
}

.tok-shop-page
.tok-shop-products
li.tok-shop-product-item
.tok-product-card {
    display: flex !important;

    flex-direction: column !important;

    width: 100% !important;

    height: 100% !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .tok-shop-page
    .tok-shop-products
    .tok-product-title {
        min-height: 48px !important;

        max-height: 48px !important;

        font-size: 14px !important;
    }

}







