/* =====================================
ANT DESIGN TOKENS
===================================== */

:root {

    /* COLORS */

    --ant-primary: #1677ff;
    --ant-primary-hover: #4096ff;

    --ant-text: #262626;
    --ant-text-secondary: #595959;
    --ant-text-light: #8c8c8c;

    --ant-border: #f0f0f0;
    --ant-border-soft: #e8e8e8;

    --ant-bg: #ffffff;
    --ant-bg-light: #fafafa;
    --ant-bg-page: #f5f5f5;

    /* RADIUS */

    --ant-radius-sm: 6px;
    --ant-radius-md: 8px;
    --ant-radius-lg: 10px;

    /* SHADOW */

    --ant-shadow-sm: 0 2px 8px rgba(0, 0, 0, .06);
    --ant-shadow-md: 0 6px 16px rgba(0, 0, 0, .08);

    /* SPACING */

    --ant-space-xs: 8px;
    --ant-space-sm: 12px;
    --ant-space-md: 16px;
    --ant-space-lg: 24px;
    --ant-space-xl: 40px;

}

/* =====================================
BASE
===================================== */

body {

    margin: 0;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto;
    color: var(--ant-text);
    background: var(--ant-bg);

}

a {
    color: inherit;
    text-decoration: none;
}

img {
    max-width: 100%;
    display: block;
}

/* =====================================
CONTAINER
===================================== */

.u-container--1200 {

    max-width: 1200px;
    margin: 0 auto;
    padding: 50px var(--ant-space-md);

}

/* =====================================
HEADING
===================================== */

.c-heading {

    font-size: 24px;
    font-weight: 600;
    margin-top: 0;
    margin-bottom: var(--ant-space-lg);

}

.c-sub-heading {

    font-size: 16px;
    font-weight: 400;
    margin-top: 20px;
    margin-bottom: var(--ant-space-lg);

}

/* =====================================
HEADER
===================================== */

.l-header {

    position: sticky;
    top: 0;

    background: var(--ant-bg);
    border-bottom: 1px solid var(--ant-border);

    z-index: 1000;

}

.l-header__container {

    max-width: 1200px;
    margin: 0 auto;

    padding: 14px var(--ant-space-md);

    display: flex;
    align-items: center;
    justify-content: space-between;

}

/* logo */

.l-header__logo img {

    height: 50px !important;
    border-radius: 50%;

}

/* nav */

.l-nav__list {

    display: flex;
    align-items: center;

    gap: var(--ant-space-lg);

    list-style: none;
    margin: 0;
    padding: 0;

}

.l-nav__link {

    font-size: 14px;
    font-weight: 500;

    padding: 6px 4px;

    position: relative;

    transition: color .2s ease;

}

.l-nav__link:hover {
    color: var(--ant-primary);
}

.l-nav__item.is-active .l-nav__link {
    color: var(--ant-primary);
}

/* underline */

.l-nav__link::after {

    content: "";

    position: absolute;

    left: 0;
    bottom: -6px;

    width: 0;
    height: 2px;

    background: var(--ant-primary);

    transition: width .25s;

}

.l-nav__link:hover::after {
    width: 100%;
}

.l-nav__item.is-active .l-nav__link::after {
    width: 100%;
}

/* =====================================
CART ICON
===================================== */

.l-cart {

    position: relative;

    width: 40px;
    height: 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 8px;

    color: #595959;

    transition: all .2s;

    cursor: pointer;

}


/* hover */

.l-cart:hover {

    background: #f5f5f5;
    color: #1677ff;

}


/* icon */

.l-cart__icon svg {

    width: 22px;
    height: 22px;

    fill: currentColor;

}


/* badge */

.l-cart__count {

    position: absolute;

    top: 2px;
    right: 2px;

    transform: translate(40%, -40%);

    background: #ff4d4f;

    color: #fff;

    font-size: 11px;
    font-weight: 600;

    min-width: 18px;
    height: 18px;

    border-radius: 20px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0 5px;

    box-shadow: 0 0 0 2px #fff;

}

/* =====================================
CATEGORY
===================================== */

.c-category__list {

    display: grid;
    grid-template-columns: repeat(6, 1fr);

    gap: var(--ant-space-lg);

}

.c-category__item {
    text-align: center;
}

.c-category__img {

    width: 110px;
    height: 110px;

    margin: 0 auto 12px;

    border-radius: 50%;
    overflow: hidden;

    background: var(--ant-bg-light);
    border: 1px solid var(--ant-border);

    display: flex;
    align-items: center;
    justify-content: center;

    transition: transform .25s, border .25s;

}

.c-category__item:hover .c-category__img {

    border-color: var(--ant-primary);
    transform: translateY(-4px);

}

.c-category__title {

    font-size: 14px;
    font-weight: 500;

}

/* =====================================
PRODUCT GRID
===================================== */

.c-product__grid {

    display: grid;
    grid-template-columns: repeat(4, 1fr);

    gap: var(--ant-space-lg);

}

/* card */

.c-product__card {

    background: var(--ant-bg);

    border: 1px solid var(--ant-border);
    border-radius: var(--ant-radius-md);

    overflow: hidden;

    transition: transform .25s, box-shadow .25s;

}

.c-product__card:hover {

    box-shadow: var(--ant-shadow-md);
    border-color: var(--ant-border-soft);

}

/* image */

.c-product__img {

    width: 100%;
    aspect-ratio: 1/1;

    background: var(--ant-bg-light);

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;

}

.c-product__img img {

    width: 100%;
    height: 100%;

    object-fit: cover;

}

/* info */

.c-product__info {

    padding: var(--ant-space-md);

}

.c-product__title {

    font-size: 14px;
    font-weight: 500;

    margin-bottom: 6px;

    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;

    overflow: hidden;

}

.c-product__price {

    font-size: 16px;
    font-weight: 600;

    color: var(--ant-primary);

}

/* cart */

.c-product__cart {

    padding: 0 var(--ant-space-md) var(--ant-space-md);

}

.c-product__cart .button {

    display: block;
    width: 100%;

    background: var(--ant-primary);
    color: #fff;

    text-align: center;

    padding: 10px 0;

    border-radius: var(--ant-radius-sm);

    font-size: 14px;
    font-weight: 500;

    transition: background .2s;

}

.c-product__cart .button:hover {
    background: var(--ant-primary-hover);
}

/* =====================================
MAIN VISUAL
===================================== */

/* .c-mainvisual {} */

.c-mainvisual__slider {

    max-width: 1200px;
    margin: 0 auto;

    overflow: hidden;
    border: 1px solid var(--ant-border);

}

.c-mainvisual__track {

    display: flex;
    transition: transform .6s ease;

}

.c-mainvisual__item {
    min-width: 100%;
}

.c-mainvisual__item img {

    width: 100%;
    aspect-ratio: 16/6;
    object-fit: cover;

}

/* =====================================
FOOTER
===================================== */

.l-footer {

    background: var(--ant-bg-light);
    border-top: 1px solid var(--ant-border);

}

.l-footer__container {

    max-width: 1200px;
    margin: 0 auto;

    padding: 48px var(--ant-space-md);

}

.l-footer__grid {

    display: grid;
    grid-template-columns: repeat(4, 1fr);

    gap: var(--ant-space-xl);

}

.l-footer__title {

    font-size: 16px;
    font-weight: 600;

    margin-bottom: var(--ant-space-md);

}

.l-footer__text {

    font-size: 14px;
    color: var(--ant-text-light);

}

.l-footer__menu {

    list-style: none;
    padding: 0;
    margin: 0;

}

.l-footer__menu li {
    margin-bottom: 8px;
}

.l-footer__menu a {

    font-size: 14px;
    color: var(--ant-text-secondary);

    transition: color .2s;

}

.l-footer__menu a:hover {
    color: var(--ant-primary);
}

.l-footer__contact {
    list-style: none;
    padding: 0;
    margin: 0;
}

.l-footer__contact li {
    font-size: 14px;
    color: var(--ant-text-secondary);
    transition: color .2s;
    margin-bottom: 8px;
}

/* bottom */

.l-footer__bottom {

    border-top: 1px solid var(--ant-border);

    text-align: center;

    padding: 16px;

    font-size: 13px;
    color: var(--ant-text-light);

}

/* =====================================
CART PAGE
===================================== */

.p-cart {
    background: var(--ant-bg-light);
}

.c-cart {

    background: var(--ant-bg);

    padding: 30px;

    border-radius: var(--ant-radius-lg);
    border: 1px solid var(--ant-border);

}

/* =====================================
CHECKOUT PAGE
===================================== */

.p-checkout {

    padding: 60px 0;
    background: var(--ant-bg-page);

}

.c-checkout {

    background: var(--ant-bg);

    padding: 40px;

    border-radius: var(--ant-radius-lg);
    border: 1px solid var(--ant-border);

}

/* =====================================
WOOCOMMERCE FIX
===================================== */

a.added_to_cart.wc-forward {
    display: none;
}

.woocommerce-cart .coupon {
    display: none;
}

.woocommerce-shipping-totals {
    display: none;
}

/* =====================================
RESPONSIVE
===================================== */

@media (max-width:1024px) {

    .c-category__list {
        grid-template-columns: repeat(4, 1fr);
    }

    .c-product__grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .l-footer__grid {
        grid-template-columns: repeat(2, 1fr);
    }

}

@media (max-width:768px) {

    .u-container--1200 {
        padding: 48px var(--ant-space-md);
    }

    .c-category__list {
        grid-template-columns: repeat(3, 1fr);
    }

    .c-product__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .l-footer__grid {
        grid-template-columns: 1fr;
    }

}

@media (max-width:480px) {

    .c-category__list {
        grid-template-columns: repeat(2, 1fr);
    }

    .c-product__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }

    .l-nav__link {
        font-size: 13px;
    }

    .l-cart {
        width: 32px;
        height: 32px;
    }

}

.return-to-shop {
    display: none !important;
}


/* =====================================
PRODUCT DETAIL
===================================== */

.p-product {
    background: var(--ant-bg-page);
}

.c-product-detail {

    display: grid;
    grid-template-columns: 1fr 1fr;

    gap: 40px;

    background: var(--ant-bg);

    padding: 40px;

    border-radius: var(--ant-radius-lg);

    border: 1px solid var(--ant-border);

}

/* gallery */

.c-product-detail__gallery {

    background: var(--ant-bg-light);

    border-radius: var(--ant-radius-md);
    overflow: hidden;

}

.c-product-detail__gallery img {

    width: 100%;
    height: auto;

    object-fit: cover;

}

/* info */

.c-product-detail__title {

    font-size: 28px;
    font-weight: 600;

    margin-bottom: 16px;

}

.c-product-detail__sku {

    margin-top: 20px;

    font-size: 14px;

    color: var(--ant-text-light);

    margin-bottom: 20px;

}

.c-product-detail__price {

    font-size: 24px;
    font-weight: 600;

    color: var(--ant-primary);

    margin-bottom: 20px;

}

/* description */

.c-product-detail__shortdesc {

    font-size: 15px;
    color: var(--ant-text-secondary);

    margin-bottom: 24px;

    line-height: 1.6;

}

/* add to cart */

.c-product-detail__cart .single_add_to_cart_button {

    background: var(--ant-primary) !important;

    border: none;

    padding: 12px 24px;

    border-radius: var(--ant-radius-sm);

    font-weight: 600;

}

.c-product-detail__cart .single_add_to_cart_button:hover {

    background: var(--ant-primary-hover) !important;

}

/* quantity */

.quantity input {

    border: 1px solid var(--ant-border);

    border-radius: var(--ant-radius-sm);

    padding: 8px;

    width: 70px;

}

/* meta */

.c-product-detail__meta {

    margin-top: 20px;

    font-size: 14px;

    color: var(--ant-text-light);

    display: flex;
    flex-direction: column;
    gap: 6px;

}

/* =====================================
PRODUCT TABS
===================================== */

.c-product-tabs {

    margin-top: 40px;

    background: var(--ant-bg);

    border: 1px solid var(--ant-border);

    border-radius: var(--ant-radius-lg);

    padding: 30px;

}

.c-product-description {

    line-height: 1.8;
    color: var(--ant-text-secondary);

}

/* =====================================
RESPONSIVE
===================================== */

@media(max-width:768px) {

    .c-product-detail {

        grid-template-columns: 1fr;

        padding: 24px;

    }

    .c-product-detail__title {
        font-size: 22px;
    }

}

/* product size */

/* ===== variation table ===== */

.variations {
    border: 0;
    margin-bottom: 20px;
}

.variations th.label {
    font-weight: 500;
    font-size: 14px;
    color: #262626;
    padding-bottom: 8px;
    display: block;
}

.variations td.value {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}


/* ===== select style ===== */

.variations select {
    height: 40px;
    padding: 0 12px;
    border-radius: 6px;
    border: 1px solid #d9d9d9;
    font-size: 14px;
    transition: all .2s;
    background: #fff;
}

.variations select:hover {
    border-color: #4096ff;
}

.variations select:focus {
    outline: none;
    border-color: #4096ff;
    box-shadow: 0 0 0 2px rgba(24, 144, 255, .2);
}


/* ===== reset button ===== */

.reset_variations {
    font-size: 13px;
    color: #1677ff;
    margin-left: 8px;
}

.reset_variations:hover {
    text-decoration: underline;
}


/* ===== variation price ===== */

.woocommerce-variation-price .price {
    font-size: 22px;
    font-weight: 600;
    color: #262626;
}


/* ===== stock ===== */

.woocommerce-variation-availability {
    font-size: 14px;
    color: #52c41a;
    margin-top: 4px;
}


/* ===== quantity input ===== */

.quantity input.qty {
    height: 40px;
    width: 80px;
    border-radius: 6px;
    border: 1px solid #d9d9d9;
    text-align: center;
    font-size: 14px;
}

.quantity input.qty:focus {
    border-color: #4096ff;
    outline: none;
    box-shadow: 0 0 0 2px rgba(24, 144, 255, .2);
}


/* ===== add to cart button ===== */

.single_add_to_cart_button {
    height: 40px;
    padding: 0 20px;
    background: #1677ff;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    transition: .2s;
}

.single_add_to_cart_button:hover {
    background: #4096ff;
}

/* container */

/* .variations td.value{
display:flex;
flex-wrap:wrap;
gap:10px;
} */

/* .variations select{
display:none;
}

.size-option{
padding:10px 16px;
border:1px solid #ccc;
background:#fff;
cursor:pointer;
font-size:14px;
transition:.2s;
}

.size-option:hover{
border-color:#000;
}

.size-option.active{
border-color:#000;
font-weight:600;
}

.size-option.disabled{
opacity:.4;
cursor:not-allowed;
} */




/* =========================
CHECKOUT CONTAINER
========================= */

.woocommerce-checkout {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 16px;
}

/* =========================
2 COLUMN LAYOUT
========================= */

.woocommerce-checkout .col2-set {
    display: flex;
    gap: 30px;
}

.woocommerce-checkout .col-1,
.woocommerce-checkout .col-2 {
    flex: 1;
}

/* =========================
CARD STYLE
========================= */

.woocommerce-billing-fields,
.woocommerce-shipping-fields,
.woocommerce-additional-fields,
#order_review {

    background: #fff;
    border: 1px solid #f0f0f0;
    border-radius: 8px;

    padding: 24px;
    margin-bottom: 24px;
}

/* =========================
HEADINGS
========================= */

.woocommerce-billing-fields h3,
#order_review_heading {

    font-size: 20px;
    font-weight: 600;
    margin-bottom: 20px;
}

/* =========================
FORM ROW
========================= */

.woocommerce form .form-row {
    margin-bottom: 16px;
}

.form-row-first,
.form-row-last {
    width: 48%;
}

.form-row-first {
    float: left;
}

.form-row-last {
    float: right;
}

.form-row-wide {
    clear: both;
    width: 100%;
}

/* =========================
LABEL
========================= */

.woocommerce form label {

    display: block;
    font-size: 14px;
    font-weight: 500;

    margin-bottom: 6px;
}

/* =========================
INPUT
========================= */

.woocommerce form .input-text,
.woocommerce form textarea,
.woocommerce form select {

    width: 100%;
    height: 40px;

    padding: 8px 12px;

    border: 1px solid #d9d9d9;
    border-radius: 6px;

    font-size: 14px;

    transition: all .2s;
}

textarea#order_comments {
    height: 90px;
}

/* focus */

.woocommerce form .input-text:focus,
.woocommerce form textarea:focus,
.woocommerce form select:focus {

    border-color: #1677ff;
    outline: none;
    box-shadow: 0 0 0 2px rgba(22, 119, 255, .15);
}

/* =========================
SELECT2
========================= */

.select2-container--default .select2-selection--single {

    height: 40px;
    border-radius: 6px;
    border: 1px solid #d9d9d9;
}

.select2-selection__rendered {
    line-height: 38px !important;
}

.select2-selection__arrow {
    height: 40px !important;
}

/* =========================
ORDER TABLE
========================= */

.woocommerce-checkout-review-order-table {

    width: 100%;
    border-collapse: collapse;
}

.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {

    padding: 12px 0;
    border-bottom: 1px solid #f0f0f0;
}

.product-total {
    text-align: right;
}

/* =========================
TOTAL ROW
========================= */

.order-total th,
.order-total td {

    font-size: 18px;
    font-weight: 600;
}

/* =========================
PAYMENT
========================= */

.wc_payment_methods {

    list-style: none;
    padding: 0;
}

.wc_payment_methods li {

    border: 1px solid #f0f0f0;
    padding: 14px;
    border-radius: 6px;
    margin-bottom: 12px;
}

/* =========================
PLACE ORDER BUTTON
========================= */

#place_order {

    width: 100%;
    height: 44px;

    background: #1677ff;
    border: none;
    border-radius: 6px;

    color: #fff;
    font-size: 16px;
    font-weight: 500;

    cursor: pointer;
    transition: .2s;
}

#place_order:hover {
    background: #4096ff;
}

/* =========================
RESPONSIVE
========================= */

@media (max-width: 768px) {

    .woocommerce-checkout .col2-set {
        flex-direction: column;
    }

    .form-row-first,
    .form-row-last {
        width: 100%;
        float: none;
    }

}

/* ==============================
THANK YOU PAGE CONTAINER
============================== */

.woocommerce-order {
    max-width: 900px;
    margin: 40px auto;
    padding: 0 16px;
}

/* ==============================
SUCCESS MESSAGE
============================== */

.woocommerce-notice--success {

    background: #f6ffed;
    border: 1px solid #b7eb8f;

    padding: 16px 20px;
    border-radius: 8px;

    font-size: 16px;
    margin-bottom: 24px;
}

/* ==============================
ORDER OVERVIEW
============================== */

.woocommerce-order-overview {

    list-style: none;
    padding: 0;
    margin: 0 0 30px 0;

    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;

    background: #fff;
    border: 1px solid #f0f0f0;
    border-radius: 8px;
    padding: 20px;
}

.woocommerce-order-overview li {

    font-size: 14px;
    color: #555;
}

.woocommerce-order-overview strong {

    display: block;
    font-size: 16px;
    margin-top: 4px;
    color: #000;
}

/* ==============================
SECTION CARD
============================== */

.woocommerce-order-details,
.woocommerce-customer-details {

    background: #fff;
    border: 1px solid #f0f0f0;
    border-radius: 8px;

    padding: 24px;
    margin-bottom: 24px;
}

/* ==============================
SECTION TITLES
============================== */

.woocommerce-order-details__title,
.woocommerce-column__title {

    font-size: 20px;
    font-weight: 600;
    margin-bottom: 20px;
}

/* ==============================
ORDER TABLE
============================== */

.woocommerce-table {

    width: 100%;
    border-collapse: collapse;
}

.woocommerce-table th,
.woocommerce-table td {

    padding: 12px 0;
    border-bottom: 1px solid #f0f0f0;
}

.woocommerce-table th {

    text-align: left;
    font-weight: 600;
}

.product-total {
    text-align: right;
}

/* footer rows */

.woocommerce-table tfoot th {

    font-weight: 500;
}

.woocommerce-table tfoot tr:last-child th,
.woocommerce-table tfoot tr:last-child td {

    font-size: 16px;
    font-weight: 600;
}

/* ==============================
ADDRESS GRID
============================== */

.woocommerce-columns {

    display: flex;
    gap: 24px;
}

.woocommerce-column {

    flex: 1;
}

/* ==============================
ADDRESS BOX
============================== */

.woocommerce-column address {

    font-style: normal;
    line-height: 1.7;

    border: 1px solid #f0f0f0;
    border-radius: 6px;

    padding: 16px;
    background: #fafafa;
}

/* ==============================
LINK STYLE
============================== */

.woocommerce-table a {

    color: #1677ff;
    text-decoration: none;
}

.woocommerce-table a:hover {

    text-decoration: underline;
}

/* ==============================
RESPONSIVE
============================== */

@media (max-width: 768px) {

    .woocommerce-order-overview {

        grid-template-columns: 1fr 1fr;
    }

    .woocommerce-columns {
        flex-direction: column;
    }

}

/* PRODUCT GALLERY */

.c-product-gallery-main img {

    width: 100%;
    border-radius: 8px;
}

/* THUMB */

.c-product-gallery-thumb {

    display: flex;
    gap: 10px;
    margin-top: 12px;
    overflow-y: scroll;
}

.c-product-thumb {

    width: 70px;
    height: 70px;

    object-fit: cover;

    border: 2px solid transparent;
    border-radius: 6px;

    cursor: pointer;
    transition: 0.2s;
}

.c-product-thumb:hover {
    border-color: #1677ff;
}

.c-product-thumb.active {

    border-color: #1677ff;
}


/* PRODUCT INFO */

.c-product-detail__info {
    flex: 1;
}

.c-product-detail__title {
    font-size: 28px;
    margin-bottom: 10px;
}

.c-product-detail__price {
    font-size: 22px;
    color: #1677ff;
    margin-bottom: 15px;
}

/* SIZE */

.c-product-detail__attributes {
    margin-bottom: 20px;
}

.c-product-attr {
    margin-bottom: 8px;
}

.c-product-attr__label {
    font-weight: 600;
    margin-right: 5px;
}

.c-product-attr__value {
    background: #f5f5f5;
    padding: 4px 10px;
    border-radius: 6px;
}

/* CART */

.single_add_to_cart_button {
    background: #1677ff;
    border: none;
    padding: 10px 20px;
    color: white;
    border-radius: 6px;
    cursor: pointer;
}

.single_add_to_cart_button:hover {
    background: #4096ff;
}

.cart-subtotal,
.woocommerce-terms-and-conditions-wrapper,
.woocommerce-shipping-fields {
    display: none !important;
}

.woocommerce table.shop_table td {
    text-align: end;
}

.product-name,
.product-price,
.product-quantity,
.product-subtotal {
    text-align: left !important;
}

.woocommerce ul.order_details::after,
.woocommerce ul.order_details::before {
    content: " ";
    display: none !important;
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    background-color: #1677ff !important;
}

.quantity {
    margin-bottom: 20px;
}