@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");

* {
    font-family: "Inter", sans-serif !important;
    font-optical-sizing: auto;
    font-style: normal;
}

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    margin: 0;
}

.footer {
    margin-top: auto;
}

.light-silk-bgcolor {
    background-color: #fae6e3;
}

.silk-product-preview-img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center;
}

.ui-dialog-titlebar-close {
    display: none;
}

.winbox {
    background: #fae6e3;
    border-radius: 1em;
    border-style: solid;
    border-color: #dd3838;
}

.wb-body {
    border-radius: 1em;
}

.wb-title {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    color: #000;
}

.wb-close {
    background-image: url(https://icons.getbootstrap.com/assets/icons/x-lg.svg);
}

.wb-min, .wb-max, .wb-full {
    display: none;
}

#productSearchResults {
    width: 100%;
    border: none;
}

.product-card {
    cursor: pointer;
}

.product-name-clamp {
    display: -webkit-box;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.25s ease;
}

.product-card:hover .product-name-clamp {
    line-clamp: unset;
    -webkit-line-clamp: unset;
}

.product-attr {
    display: -webkit-box;
    line-clamp: 2;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.25s ease;
}

.product-attr:hover {
    line-clamp: unset;
    -webkit-line-clamp: unset;
}

#productImageCarousel {
    width: 100%;
    aspect-ratio: 1 / 1;
}

#productImageCarousel .carousel-inner, #productImageCarousel .carousel-item {
    width: 100%;
    height: 100%;
}

#productImageCarousel .carousel-item img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background-color: #fff;
}

.modal-backdrop {
    --bs-backdrop-bg: #fff;
}

.scroll-container {
    display: flex;
    overflow: hidden;
    white-space: nowrap;
}
.scroll-container > div {
    flex-shrink: 0;
    margin-right: 1rem;
}

#description * {
    max-width: 100%;
    overflow-x: auto;
}