@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');

*{
    font-family: 'Outfit', sans-serif;
}

.no-scrollbar::-webkit-scrollbar {

    display: none;

}



.no-scrollbar {

    -ms-overflow-style: none;

    scrollbar-width: none;

}



.animate-pop {

    animation: popIn 0.3s ease-out;

}



@keyframes popIn {

    from {

        opacity: 0;

        transform: scale(0.95) translateY(10px);

    }



    to {

        opacity: 1;

        transform: scale(1) translateY(0);

    }

}

.product-gallery-thumbs .swiper-slide {

    width: auto;

    margin-right: 12px;

}



.product-gallery-thumbs .swiper-slide {

    width: 80px;

    flex-shrink: 0;

}



.product-gallery-thumbs .swiper-wrapper {

    display: flex;

}



.product-gallery-thumbs .swiper-slide img {

    transition: opacity 0.3s;

}



.product-gallery-thumbs .swiper-slide:hover img {

    opacity: 0.7;

}



.product-gallery-thumbs .swiper-slide.ring-2 img {

    opacity: 1;

}



.return-product-card {

    position: relative;

    border: 1px solid #e5e7eb;

    border-radius: 1rem;

    padding: 1rem;

    display: flex;

    align-items: center;

    gap: 0.85rem;

    cursor: pointer;

    transition: border-color 0.2s ease, box-shadow 0.2s ease,

        background-color 0.2s ease;

}



.return-product-card:hover {

    border-color: #93c5fd;

    box-shadow: 0 10px 20px rgba(15, 23, 42, 0.05);

}



.return-product-card .return-card-thumb {

    width: 48px;

    height: 48px;

    border-radius: 12px;

    border: 1px solid #e5e7eb;

    background: #f9fafb;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    overflow: hidden;

    flex-shrink: 0;

}



.return-product-card .return-card-info {

    display: flex;

    flex-direction: column;

    gap: 0.25rem;

}



.return-product-card .return-card-title {

    font-size: 0.9rem;

    font-weight: 600;

    color: #111827;

}



.return-product-card .return-card-price {

    font-size: 0.8rem;

    font-weight: 600;

    color: #4b5563;

}



.return-product-card .return-check {

    position: absolute;

    top: 0.5rem;

    right: 0.5rem;

    width: 24px;

    height: 24px;

    border-radius: 999px;

    border: 1px solid #d1d5db;

    background: #fff;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    color: #059669;

    opacity: 0;

    transition: all 0.2s ease;

    pointer-events: none;

}



.return-product-card.is-selected {

    border-color: #34d399;

    background: #ecfdf5;

}



.return-product-card.is-selected .return-card-title {

    color: #065f46;

}



.return-product-card.is-selected .return-card-price {

    color: #047857;

}



.return-product-card.is-selected .return-check {

    opacity: 1;

    border-color: #059669;

    background: #059669;

    color: #fff;

}



.return-product-card.is-disabled {

    opacity: 0.6;

    cursor: not-allowed;

    pointer-events: none;

    border-style: dashed;

}



.return-product-card.is-disabled .return-check {

    display: none;

}

.chekcout-form {

    margin-top: 0px !important;

}



.return-card-badge {

    position: absolute;

    bottom: 0.75rem;

    right: 0.75rem;

    font-size: 0.65rem;

    font-weight: 600;

    padding: 0.2rem 0.55rem;

    border-radius: 999px;

    background: #fef3c7;

    color: #b45309;

    text-transform: uppercase;

}



.checkout-payment-option {

    position: relative;

    border: 1px solid #e5e7eb;

    border-radius: 1rem;

    padding: 1rem;

    display: flex;

    gap: 0.85rem;

    align-items: flex-start;

    cursor: pointer;

    transition: border-color 0.2s ease, background-color 0.2s ease,

        box-shadow 0.2s ease;

}



.checkout-payment-option:hover {

    border-color: #a7f3d0;

    background: #f0fdf4;

}



.checkout-payment-option .option-icon {

    width: 44px;

    height: 44px;

    border-radius: 999px;

    background: #ecfdf5;

    color: #047857;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    font-size: 1.25rem;

    flex-shrink: 0;

}



.checkout-payment-option .option-check {

    position: absolute;

    top: 0.75rem;

    right: 0.75rem;

    width: 22px;

    height: 22px;

    border-radius: 999px;

    border: 1px solid #d1d5db;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    font-size: 0.9rem;

    color: #fff;

    background: #10b981;

    opacity: 0;

    transition: opacity 0.2s ease;

}



.checkout-payment-option.is-selected {

    border-color: #34d399;

    background: #ecfdf5;

    box-shadow: 0 12px 24px rgba(16, 185, 129, 0.15);

}



.checkout-payment-option.is-selected .option-check {

    opacity: 1;

}



.home-hero {

    position: relative;

    width: 100%;

    overflow: hidden;

}



.home-hero .swiper,

.home-hero .swiper-slide {

    width: 100%;

    height: 100%;

}



.home-hero__slide {

    position: relative;

    min-height: 520px;

    display: flex;

    align-items: center;

    justify-content: center;

}



.home-hero__media {

    position: absolute;

    inset: 0;

}



.home-hero__image {

    width: 100%;

    height: 100%;

    object-fit: cover;

}



.home-hero__overlay {

    position: absolute;

    inset: 0;

    /* background: linear-gradient(

        120deg,

        rgba(15, 23, 42, 0.85) 20%,

        rgba(15, 23, 42, 0.25) 90%

    ); */

}



.home-hero__content {

    position: relative;

    width: 100%;

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 1.25rem;

}



.home-hero__body {

    max-width: 520px;

    color: #fff;

    display: flex;

    flex-direction: column;

    gap: 1.25rem;

}



.home-hero__kicker {

    font-size: 0.85rem;

    letter-spacing: 0.3em;

    text-transform: uppercase;

    opacity: 0.8;

}



.home-hero__title {

    font-size: clamp(2.5rem, 4vw, 3rem);

    line-height: 1.1;

    font-weight: 700;

}



.home-hero__description {

    font-size: 1.05rem;

    color: rgba(255, 255, 255, 0.85);

}



.home-hero__actions {

    margin-top: 0.5rem;

}



.home-hero__button {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 0.5rem;

    padding: 0.9rem 2.5rem;

    border-radius: 999px;

    background: #fff;

    color: #0f172a;

    font-weight: 600;

    transition: transform 0.2s ease, box-shadow 0.2s ease;

}



.home-hero__button:hover {

    transform: translateY(-2px);

    box-shadow: 0 15px 30px rgba(15, 23, 42, 0.2);

}



.home-hero__pagination {

    position: absolute;

    bottom: 1.5rem;

    left: 50%;

    transform: translateX(-50%);

}



.home-hero__nav {

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    width: 42px;

    height: 42px;

    border-radius: 999px;

    background: rgba(255, 255, 255, 0.2);

    color: #fff;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    cursor: pointer;

    transition: background 0.2s ease;

    z-index: 10;

}



.home-hero__nav:hover {

    background: rgba(255, 255, 255, 0.35);

}



.home-hero__nav--prev {

    left: 1.5rem;

}



.home-hero__nav--next {

    right: 1.5rem;

}



@media (max-width: 1024px) {

    .home-hero__slide {

        min-height: 420px;

    }

    .home-hero__nav {

        display: none;

    }

}



.category-tree {

    list-style: none;

    margin: 0;

    padding: 0;

    display: flex;

    flex-direction: column;

    gap: 0.35rem;

}



.category-tree__item {

    --category-level: 0;

    position: relative;

}



/* .category-tree__item::before {

    content: "";

    position: absolute;

    top: 50%;

    left: calc(var(--category-level) * 1.25rem);

    width: calc(100% - var(--category-level) * 1.25rem - 0.75rem);

    height: 1px;

    background: rgba(15, 23, 42, 0.04);

    pointer-events: none;

} */



.category-tree__link {

    position: relative;

    display: flex;

    align-items: center;

    gap: 0.65rem;

    padding: 0.3rem 0.55rem;

    padding-left: calc(1rem + var(--category-level) * 1rem);

    border-radius: 0.65rem;

    /* color: #1f2937; */

    font-size: 0.9rem;

    font-weight: 500;

    /* background: linear-gradient(

        90deg,

        rgba(248, 250, 252, 0.9),

        rgba(255, 255, 255, 0.8)

    ); */

    /* border: 1px solid rgba(226, 232, 240, 0.7); */

    transition: all 0.2s ease;

}



.category-tree__link:hover {

    /* border-color: rgba(99, 102, 241, 0.35); */

    /* box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08); */

    transform: translateX(2px);

}



/* .category-tree__link.is-active {

    background: linear-gradient(

        90deg,

        rgba(99, 102, 241, 0.12),

        rgba(99, 102, 241, 0.08)

    );

    border-color: rgba(99, 102, 241, 0.5);

    color: #312e81;

    box-shadow: 0 10px 25px rgba(99, 102, 241, 0.15);

} */



/* .category-tree__link.is-path:not(.is-active) {

    border-color: rgba(99, 102, 241, 0.25);

    color: #4338ca;

} */



.category-tree__icon {

    width: 30px;

    height: 30px;

    border-radius: 10px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    font-size: 1rem;

    flex-shrink: 0;

    /* background: rgba(15, 23, 42, 0.04); */

    /* color: #475569; */

}



.category-tree__icon.is-folder {

    /* background: rgba(59, 130, 246, 0.12); */

    /* color: #1d4ed8; */

}



.category-tree__icon.is-leaf {

    /* background: rgba(16, 185, 129, 0.12); */

    /* color: #047857; */

}



.category-tree__label {

    display: flex;

    align-items: center;

    gap: 0.35rem;

    flex: 1;

    min-width: 0;

}



.category-tree__name {

    display: inline-block;

    max-width: 100%;

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis;

}



.category-tree__badge {

    /* background: rgba(15, 23, 42, 0.08); */

    /* color: #475569; */

    font-size: 0.7rem;

    padding: 0.15rem 0.5rem;

    border-radius: 999px;

    font-weight: 600;

}



/* .category-tree__link.is-active .category-tree__badge,

.category-tree__link.is-path .category-tree__badge {

    background: rgba(99, 102, 241, 0.15);

    color: #312e81;

} */



.category-tree__chevron {

    width: 28px;

    height: 28px;

    border-radius: 999px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    color: #94a3b8;

    transition: transform 0.2s ease;

}



.category-tree__chevron.is-open {

    transform: rotate(90deg);

    /* color: #312e81; */

}



.category-tree__children {

    list-style: none;

    margin: 0.25rem 0 0.25rem;

    padding: 0;

    border-left: 1px dashed rgba(15, 23, 42, 0.08);

    margin-left: 0.75rem;

    display: none;

}



.category-tree__children.is-visible {

    display: flex;

    flex-direction: column;

    gap: 0.35rem;

}

