/* ==========================================================================
   OOTACAMUND'S CORE V6 — SHOP
   SHOP LAYOUT + CATEGORY DISCOVERY
   ========================================================================== */


/* ==========================================================================
   MAIN SHOP LAYOUT
   ========================================================================== */

.oota-shop-layout {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);
    gap: 32px;

    width: 100%;
    max-width: 1240px;

    margin-left: auto;
    margin-right: auto;

    padding-left: 20px;
    padding-right: 20px;

    box-sizing: border-box;
    align-items: start;
}


/* ==========================================================================
   LEFT EXPLORE AREA
   ========================================================================== */

.oota-shop-filter {
    width: 100%;
    box-sizing: border-box;

    padding: 24px 20px;

    background: #ffffff;
    border: 1px solid #e5e5e5;
    border-radius: 12px;
}


.oota-shop-filter-header h2 {
    margin: 0 0 8px;

    color: #27272A;

    font-size: 20px;
    line-height: 1.3;
    font-weight: 600;
}


.oota-shop-filter-header p {
    margin: 0;

    color: #667085;

    font-size: 14px;
    line-height: 1.5;
}


/* ==========================================================================
   CATEGORY NAVIGATION
   ========================================================================== */

.oota-shop-category-navigation {
    margin-top: 24px;
}


.oota-shop-category-list,
.oota-shop-category-children {
    list-style: none;
    margin: 0;
    padding: 0;
}


/* ==========================================================================
   CATEGORY ITEMS
   ========================================================================== */

.oota-shop-category-item {
    margin: 0;
    padding: 0;
}


/* Remove default list-marker / bullet feeling */

.oota-shop-category-item::before {
    display: none !important;
    content: none !important;
}


/* ==========================================================================
   CATEGORY LINKS
   ========================================================================== */

.oota-shop-category-navigation a {
    display: inline-block;

    color: #3F3F46;

    font-size: 15px;
    line-height: 1.45;

    text-decoration: none;

    cursor: pointer;

    transition:
        color 160ms ease,
        transform 160ms ease;
}


.oota-shop-category-navigation a:hover {
    color: #27272A;
    text-decoration: none;
}


/* ==========================================================================
   MAIN CATEGORY
   ========================================================================== */

.oota-shop-category-item > details > summary {
    display: flex;
    align-items: center;

    padding: 8px 0;

    color: #27272A;

    font-size: 15px;
    line-height: 1.45;
    font-weight: 500;

    cursor: pointer;

    list-style: none;

    transition:
        color 160ms ease,
        transform 160ms ease;
}


/* Remove browser's default summary marker */

.oota-shop-category-item > details > summary::-webkit-details-marker {
    display: none;
}


.oota-shop-category-item > details > summary::marker {
    display: none;
}


/* Main category hover */

.oota-shop-category-item > details > summary:hover {
    color: #5A5A60;
}


/* ==========================================================================
   QUIET EXPAND INDICATOR
   ========================================================================== */

.oota-shop-category-item > details > summary::after {
    content: "+";

    margin-left: auto;

    color: #8A8A8F;

    font-size: 16px;
    line-height: 1;

    font-weight: 400;

    transition:
        transform 180ms ease,
        color 180ms ease;
}


.oota-shop-category-item > details[open] > summary::after {
    content: "−";
    color: #5A5A60;
}


/* ==========================================================================
   VIEW ALL
   ========================================================================== */

.oota-shop-category-all {
    margin: 2px 0 6px 0;

    color: #6B6B72 !important;

    font-size: 13px !important;
    line-height: 1.4 !important;

    cursor: pointer;
}


.oota-shop-category-all:hover {
    color: #27272A !important;
}


/* ==========================================================================
   CHILD CATEGORIES
   ========================================================================== */

.oota-shop-category-children {
    margin: 2px 0 8px 10px;
    padding-left: 14px;

    border-left: 1px solid #E7E7E9;
}


.oota-shop-category-children .oota-shop-category-item {
    margin: 0;
}


.oota-shop-category-children a,
.oota-shop-category-children summary {
    font-size: 14px;
}


/* ==========================================================================
   PRODUCT AREA
   ========================================================================== */

.oota-shop-products {
    min-width: 0;
    width: 100%;
}


/* ==========================================================================
   PRESERVE WOOCOMMERCE SHOP BAR
   ========================================================================== */

.oota-shop-products .zak-wc-filter {
    width: 100%;
    box-sizing: border-box;
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 767px) {

    .oota-shop-layout {
        display: block;

        width: 100%;
        max-width: 100%;

        margin-left: 0;
        margin-right: 0;

        padding-left: 16px;
        padding-right: 16px;
    }


    .oota-shop-filter {
        margin-bottom: 24px;
    }


    .oota-shop-products {
        width: 100%;
    }


    .oota-shop-category-navigation {
        margin-top: 20px;
    }

}
/* ==========================================================================
   OOTACAMUND'S CORE V6 — MOBILE EXPLORE ACCORDION
   ========================================================================== */

@media (max-width: 767px) {

    /* --------------------------------------------------------------
       Explore panel
       -------------------------------------------------------------- */

    .oota-shop-filter {
        padding: 0;
        overflow: hidden;
    }


    /* --------------------------------------------------------------
       Explore header becomes the accordion trigger
       -------------------------------------------------------------- */

    .oota-shop-filter-header {
        position: relative;

        padding: 18px 16px;

        cursor: pointer;

        user-select: none;
    }


    .oota-shop-filter-header::after {
        content: "+";

        position: absolute;

        top: 50%;
        right: 16px;

        transform: translateY(-50%);

        color: #8A8A8F;

        font-size: 18px;
        line-height: 1;
        font-weight: 400;
    }


    /* --------------------------------------------------------------
       Heading
       -------------------------------------------------------------- */

    .oota-shop-filter-header h2 {
        margin: 0;

        font-size: 17px;
        line-height: 1.4;
    }


    /* --------------------------------------------------------------
       Supporting text stays hidden while collapsed
       -------------------------------------------------------------- */

    .oota-shop-filter-header p {
        display: none;

        margin: 8px 28px 0 0;

        font-size: 13px;
        line-height: 1.45;
    }


    /* --------------------------------------------------------------
       Category navigation stays hidden while collapsed
       -------------------------------------------------------------- */

    .oota-shop-category-navigation {
        display: none;

        margin: 0;

        padding: 0 16px 18px;
    }


    /* --------------------------------------------------------------
       OPEN STATE
       -------------------------------------------------------------- */

    .oota-shop-filter.is-open .oota-shop-filter-header {
        padding-bottom: 10px;
    }


    .oota-shop-filter.is-open .oota-shop-filter-header::after {
        content: "−";
    }


    .oota-shop-filter.is-open .oota-shop-filter-header p {
        display: block;
    }


    .oota-shop-filter.is-open .oota-shop-category-navigation {
        display: block;
    }


    /* --------------------------------------------------------------
       Category spacing
       -------------------------------------------------------------- */

    .oota-shop-category-navigation a,
    .oota-shop-category-item > details > summary {
        font-size: 14px;
    }


    .oota-shop-category-item > details > summary {
        padding: 7px 0;
    }


    .oota-shop-category-children {
        margin-left: 8px;
        padding-left: 12px;
    }

}
/* ==========================================================================
   OOTACAMUND'S CORE V6 — SHOP PRODUCT CARD
   PRODUCT HIERARCHY
   ========================================================================== */


/* ==========================================================================
   PRODUCT CARD
   ========================================================================== */

.oota-shop-products ul.products li.product {
    box-sizing: border-box;
}


/* ==========================================================================
   PRODUCT TITLE
   ========================================================================== */

.oota-shop-products ul.products li.product
.woocommerce-loop-product__title {
    margin-top: 18px;
    margin-bottom: 8px;

    color: #27272A;

    font-size: 18px;
    line-height: 1.4;
    font-weight: 500;

    text-align: left;
}


/* ==========================================================================
   PRODUCT PRICE
   ========================================================================== */

.oota-shop-products ul.products li.product
.price {
    margin: 0 0 8px;

    color: #27272A;

    font-size: 16px;
    line-height: 1.45;
}


/* Current / sale price */

.oota-shop-products ul.products li.product
.price ins {
    color: #27272A;

    font-weight: 500;

    text-decoration: none;
}


/* Original price */

.oota-shop-products ul.products li.product
.price del {
    margin-right: 6px;

    color: #77777D;

    font-size: 14px;
}


/* ==========================================================================
   ADD TO CART
   ========================================================================== */

.oota-shop-products ul.products li.product
.add_to_cart_button {
    width: 100%;
    box-sizing: border-box;

    margin-top: 18px;

    border-radius: 6px;

    font-size: 15px;
    font-weight: 500;

    text-align: center;
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 767px) {

    .oota-shop-products ul.products li.product
    .woocommerce-loop-product__title {
        margin-top: 12px;
        margin-bottom: 6px;

        font-size: 15px;
        line-height: 1.4;
    }


    .oota-shop-products ul.products li.product
    .price {
        font-size: 14px;
    }


    .oota-shop-products ul.products li.product
    .price del {
        font-size: 13px;
    }


    .oota-shop-products ul.products li.product
    .add_to_cart_button {
        margin-top: 12px;

        font-size: 14px;
    }

}
/* ==========================================================================
   OOTACAMUND'S CORE V6 — SHOP PRODUCT CARD
   CONSISTENT CARD RHYTHM
   ========================================================================== */


/* ==========================================================================
   PRODUCT CARD STRUCTURE
   ========================================================================== */

.oota-shop-products ul.products li.product {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}


/* ==========================================================================
   PRODUCT TITLE
   ==========================================================================
   Reserve enough room for a two-line product name so cards remain balanced.
   ========================================================================== */

.oota-shop-products ul.products li.product
.woocommerce-loop-product__title {
    min-height: 50px;

    display: flex;
    align-items: flex-start;
}


/* ==========================================================================
   PRODUCT RATING
   ==========================================================================
   Keep ratings from creating unexpected vertical jumps.
   ========================================================================== */

.oota-shop-products ul.products li.product
.star-rating {
    min-height: 18px;
    margin-bottom: 6px;
}


/* ==========================================================================
   PRODUCT PRICE
   ========================================================================== */

.oota-shop-products ul.products li.product
.price {
    min-height: 24px;
}


/* ==========================================================================
   ADD TO CART
   ==========================================================================
   Push the purchase action to the bottom of the card.
   ========================================================================== */

.oota-shop-products ul.products li.product
.add_to_cart_button {
    margin-top: auto;
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 767px) {

    .oota-shop-products ul.products li.product
    .woocommerce-loop-product__title {
        min-height: 42px;
    }


    .oota-shop-products ul.products li.product
    .star-rating {
        min-height: 17px;
        margin-bottom: 5px;
    }


    .oota-shop-products ul.products li.product
    .price {
        min-height: 22px;
    }

}
/* ==========================================================================
   OOTACAMUND'S CORE V6 — SHOP
   REFINED SALE BADGE
   ========================================================================== */

.oota-shop-products ul.products li.product
.onsale {
    top: 12px !important;
    left: 12px !important;
    right: auto !important;

    min-width: auto !important;
    min-height: auto !important;

    margin: 0 !important;
    padding: 6px 9px !important;

    background: #27272A !important;
    color: #ffffff !important;

    border: 0 !important;
    border-radius: 4px !important;

    font-size: 12px !important;
    line-height: 1.2 !important;
    font-weight: 500 !important;

    letter-spacing: 0 !important;
    text-transform: none !important;

    box-shadow: none !important;

    transform: none !important;
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 767px) {

    .oota-shop-products ul.products li.product
    .onsale {
        top: 8px !important;
        left: 8px !important;

        padding: 5px 8px !important;

        font-size: 11px !important;
    }

}
/* ==========================================================================
   OOTACAMUND'S CORE V6 — SALE LABEL
   QUIET BRAND LANGUAGE
   ========================================================================== */

.oota-shop-products ul.products li.product
.onsale {
    font-size: 0 !important;
}

.oota-shop-products ul.products li.product
.onsale::after {
    content: "Sale";

    font-size: 12px;
    line-height: 1.2;
    font-weight: 500;
}


@media (max-width: 767px) {

    .oota-shop-products ul.products li.product
    .onsale::after {
        font-size: 11px;
    }

}
/* ==========================================================================
   OOTACAMUND'S CORE V6 — SHOP
   QUIET PRODUCT RATINGS
   ========================================================================== */


/* ==========================================================================
   STAR RATING
   ========================================================================== */

.oota-shop-products ul.products li.product
.star-rating {
    width: 5.4em;

    margin-top: 4px;
    margin-bottom: 6px;

    font-size: 13px;

    letter-spacing: 0;

    color: #B0B0B5;
}


/*
 * Filled stars.
 */

.oota-shop-products ul.products li.product
.star-rating::before {
    color: #D4D4D8;
}


/*
 * Active rating stars.
 */

.oota-shop-products ul.products li.product
.star-rating span::before {
    color: #6B6B72;
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 767px) {

    .oota-shop-products ul.products li.product
    .star-rating {
        width: 5.2em;

        margin-top: 3px;
        margin-bottom: 5px;

        font-size: 12px;
    }

}
/* ==========================================================================
   OOTACAMUND'S SHOP — ADD TO CART BUTTON
   OOTACAMUND theme purple
   ========================================================================== */

.oota-shop-products
ul.products
li.product
.add_to_cart_button {
    width: 100%;
    box-sizing: border-box;

    margin-top: auto;
    padding: 11px 14px;

    background: #C21875 !important;
    border: 1px solid #C21875 !important;
    color: #FFFFFF !important;

    border-radius: 6px;

    font-size: 15px;
    line-height: 1.3;
    font-weight: 500;
    text-align: center;

    transition:
        background-color 180ms ease,
        border-color 180ms ease,
        transform 180ms ease;
}

.oota-shop-products
ul.products
li.product
.add_to_cart_button:hover {
    background: #A91565 !important;
    border-color: #A91565 !important;
    color: #FFFFFF !important;
}

.oota-shop-products
ul.products
li.product
.add_to_cart_button:focus {
    outline: 2px solid #D8A0C0;
    outline-offset: 2px;
}

@media (max-width: 767px) {

    .oota-shop-products
    ul.products
    li.product
    .add_to_cart_button {
        padding: 10px 12px;
        font-size: 14px;
    }
}
/* ==========================================================================
   OOTACAMUND'S SHOP — PAGINATION
   Match pagination with the Shop action colour
   ========================================================================== */

.oota-shop-products
.woocommerce-pagination
ul.page-numbers {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 32px;
}

.oota-shop-products
.woocommerce-pagination
ul.page-numbers
li {
    margin: 0;
    padding: 0;
}

.oota-shop-products
.woocommerce-pagination
ul.page-numbers
li
.page-numbers {
    display: flex;
    align-items: center;
    justify-content: center;

    min-width: 60px;
    height: 60px;
    padding: 0 14px;

    box-sizing: border-box;

    background: #FFFFFF;
    border: 1px solid #C21875;
    border-radius: 6px;

    color: #C21875;

    font-size: 16px;
    line-height: 1;
    font-weight: 500;

    text-decoration: none;

    transition:
        background-color 180ms ease,
        border-color 180ms ease,
        color 180ms ease;
}

.oota-shop-products
.woocommerce-pagination
ul.page-numbers
li
.page-numbers.current {
    background: #C21875;
    border-color: #C21875;
    color: #FFFFFF;
}

.oota-shop-products
.woocommerce-pagination
ul.page-numbers
li
.page-numbers:hover {
    background: #C21875;
    border-color: #C21875;
    color: #FFFFFF;
}

.oota-shop-products
.woocommerce-pagination
ul.page-numbers
li
.page-numbers:focus {
    outline: 2px solid #D8A0C0;
    outline-offset: 2px;
}

@media (max-width: 767px) {

    .oota-shop-products
    .woocommerce-pagination
    ul.page-numbers {
        gap: 6px;
        margin-top: 24px;
    }

    .oota-shop-products
    .woocommerce-pagination
    ul.page-numbers
    li
    .page-numbers {
        min-width: 44px;
        height: 44px;
        padding: 0 10px;
        font-size: 14px;
    }
}
/* ==========================================================================
   OOTACAMUND'S SHOP — RESULTS & SORTING BAR
   Calm, clean and brand-aligned
   ========================================================================== */

/* --------------------------------------------------------------------------
   RESULTS / SORTING WRAPPER
   -------------------------------------------------------------------------- */

.oota-shop-products .zak-wc-filter {
    display: flex;
    align-items: center;
    justify-content: space-between;

    width: 100%;
    box-sizing: border-box;

    margin-bottom: 28px;
    padding: 0;

    background: transparent;
    border: 0;
}

/* --------------------------------------------------------------------------
   RESULT COUNT
   -------------------------------------------------------------------------- */

.oota-shop-products .zak-wc-filter .woocommerce-result-count {
    margin: 0;

    color: #5A5A60;

    font-size: 15px;
    line-height: 1.5;
    font-weight: 400;
}

/* --------------------------------------------------------------------------
   SORTING AREA
   -------------------------------------------------------------------------- */

.oota-shop-products .zak-wc-filter .woocommerce-ordering {
    margin: 0;
}

.oota-shop-products .zak-wc-filter .woocommerce-ordering select {
    min-width: 190px;
    height: 44px;

    padding: 0 38px 0 14px;

    box-sizing: border-box;

    background-color: #FFFFFF;
    border: 1px solid #D4D4D8;
    border-radius: 6px;

    color: #3F3F46;

    font-family: inherit;
    font-size: 14px;
    line-height: 1.3;
    font-weight: 400;

    cursor: pointer;

    transition:
        border-color 180ms ease,
        box-shadow 180ms ease;
}

.oota-shop-products .zak-wc-filter .woocommerce-ordering select:hover {
    border-color: #C21875;
}

.oota-shop-products .zak-wc-filter .woocommerce-ordering select:focus {
    border-color: #C21875;
    outline: 1px solid #D8A0C0;
    outline-offset: 1px;
}

/* --------------------------------------------------------------------------
   MOBILE
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {

    .oota-shop-products .zak-wc-filter {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;

        margin-bottom: 20px;
    }

    .oota-shop-products .zak-wc-filter .woocommerce-result-count {
        font-size: 14px;
    }

    .oota-shop-products .zak-wc-filter .woocommerce-ordering {
        width: 100%;
    }

    .oota-shop-products .zak-wc-filter .woocommerce-ordering select {
        width: 100%;
        min-width: 0;
        height: 42px;

        font-size: 14px;
    }
}
/* ==========================================================================
   OOTACAMUND'S SHOP — PRODUCT IMAGE PRESENTATION
   Clean, consistent catalogue-style image area
   ========================================================================== */

.oota-shop-products
ul.products
li.product
.woocommerce-loop-product__link {
    display: block;
    width: 100%;
}

/* Product image itself */

.oota-shop-products
ul.products
li.product
.woocommerce-loop-product__link
img {
    display: block;

    width: 100%;
    height: auto;

    margin: 0;

    border-radius: 0;

    object-fit: contain;

    transition: opacity 180ms ease;
}

/* Keep the product image area clean */

.oota-shop-products
ul.products
li.product
.woocommerce-loop-product__link {
    overflow: hidden;
}

/* Mobile */

@media (max-width: 767px) {

    .oota-shop-products
    ul.products
    li.product
    .woocommerce-loop-product__link
    img {
        width: 100%;
        height: auto;
    }
}
/* ==========================================================================
   OOTACAMUND'S SHOP — PRODUCT IMAGE HOVER
   Subtle discovery interaction
   ========================================================================== */

.oota-shop-products
ul.products
li.product
.woocommerce-loop-product__link {
    overflow: hidden;
}

.oota-shop-products
ul.products
li.product
.woocommerce-loop-product__link
img {
    transition:
        transform 240ms ease,
        opacity 240ms ease;
    transform: scale(1);
}

.oota-shop-products
ul.products
li.product
.woocommerce-loop-product__link:hover
img {
    transform: scale(1.62);
}

/* Keep the Sale badge stable */

.oota-shop-products
ul.products
li.product
.onsale {
    z-index: 2;
}
/* ================================================================
   SHOP — BOTTOM BREATHING SPACE
   Keep the final product row comfortably above the footer
   ================================================================ */

.oota-shop-products {
    padding-bottom: 90px !important;
    box-sizing: border-box !important;
}

@media (max-width: 767px) {
    .oota-shop-products {
        padding-bottom: 60px !important;
    }
}