@font-face {
  font-family: "gotham-book";
  src: url("../fonts/gotham-book.woff") format("woff2"),
    url("../fonts/gotham-book.woff2") format("woff");
}

@font-face {
  font-family: "gotham-bold";
  src: url("../fonts/gotham-bold.woff") format("woff2"),
    url("../fonts/gotham-bold.woff2") format("woff");
}

@font-face {
  font-family: "gotham-medium";
  src: url("../fonts/gotham-medium.woff") format("woff2"),
    url("../fonts/gotham-medium.woff2") format("woff");
}

@font-face {
  font-family: "kanit-regular";
  src: url("../fonts/kanit-regular.woff") format("woff2"),
    url("../fonts/kanit-regular.woff2") format("woff");
}

@font-face {
  font-family: "kanit-medium";
  src: url("../fonts/kanit-medium.woff") format("woff2"),
    url("../fonts/kanit-medium.woff2") format("woff");
}

@font-face {
  font-family: "kanit-semiBold";
  src: url("../fonts/kanit-semiBold.woff") format("woff2"),
    url("../fonts/kanit-semiBold.woff2") format("woff");
}

@font-face {
  font-family: "kanit-bold";
  src: url("../fonts/kanit-bold.woff") format("woff2"),
    url("../fonts/kanit-bold.woff2") format("woff");
}

@font-face {
  font-family: "montserrat-medium";
  src: url("../fonts/montserrat-medium.woff") format("woff2"),
    url("../fonts/montserrat-medium.woff2") format("woff");
}

@font-face {
  font-family: "montserrat-semibold";
  src: url("../fonts/montserrat-semibold.woff") format("woff2"),
    url("../fonts/montserrat-semibold.woff2") format("woff");
}

@font-face {
  font-family: "montserrat-bold";
  src: url("../fonts/montserrat-bold.woff") format("woff2"),
    url("../fonts/montserrat-bold.woff2") format("woff");
}

@font-face {
  font-family: "inter-regular";
  src: url("../fonts/inter-regular.woff") format("woff2"),
    url("../fonts/inter-regular.woff2") format("woff");
}

@font-face {
  font-family: "inter-medium";
  src: url("../fonts/inter-medium.woff") format("woff2"),
    url("../fonts/inter-medium.woff2") format("woff");
}

@font-face {
  font-family: "inter-extrabold";
  src: url("../fonts/inter-extrabold.woff") format("woff2"),
    url("../fonts/inter-extrabold.woff2") format("woff");
}

@font-face {
  font-family: "publicsans-regular";
  src: url("../fonts/publicsans-regular.woff2") format("woff2"),
    url("../fonts/publicsans-regular.woff") format("woff");
}

@font-face {
  font-family: "rubik-medium";
  src: url("../fonts/rubik-medium.woff2") format("woff2"),
    url("../fonts/rubik-medium.woff") format("woff");
}

:root {
  --purple: #8f009d;
  --purple-two: #891feb;
  --purple-three: #4d00b2;
  --orange: #f26522;
  --white: #fff;
  --red: #eb2525;
  --blue: #212d82;
  --blue-two: #2e6ed5;
  --black: #191c1f;
  --green: #1fc926;
  --pink: #ff16aa;

  --gradient-one: linear-gradient(
    90deg,
    var(--orange) 0%,
    var(--purple-two) 100%
  );
}

body {
  font-family: "gotham-book";
}

.montserrat-medium {
  font-family: "montserrat-medium";
}

.montserrat-semibold {
  font-family: "montserrat-semibold";
}

.montserrat-bold {
  font-family: "montserrat-semibold";
}

.gotham-book {
  font-family: "gotham-book";
}

.gotham-medium {
  font-family: "gotham-medium";
}

.gotham-bold {
  font-family: "gotham-bold";
}

.kanit-medium {
  font-family: "kanit-medium";
}

.kanit-regular {
  font-family: "kanit-regular";
}

.kanit-bold {
  font-family: "kanit-bold";
}

.kanit-semibold {
  font-family: "kanit-semiBold";
}

.publicsans-regular {
  font-family: "publicsans-regular";
}

.inter-regular,
.product-reassurance .content-bloc {
  font-family: "inter-regular";
}

.inter-extrabold,
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "inter-extrabold";
}

.inter-medium {
  font-family: "inter-medium";
}

.blue-text {
  color: #2e6ed5;
}

.green,
.blockcart-modal .modal-title i {
  color: var(--green);
}

.purple {
  color: #4e00b3;
}

.purple-two {
  color: #6201bd;
}

.purple-three {
  color: #8401ff;
}

.orange {
  color: #f8621b !important;
}

.bg-orange {
  background-color: #f8621b;
}

#pagenotfound .wrapper {
  padding-top: 0;
}

#pagenotfound #content-wrapper {
  padding-bottom: 0;
}

.main-container {
  max-width: 1500px;
  width: 95%;
  margin: 0 auto;
}

a {
  color: #8401ff;
  font-family: "gotham-medium";
}

.pink-btn {
  background: #c50083;
  color: #fff;
  font-family: "gotham-book";
  text-transform: uppercase;
}

/* Header style: */
.header-bottom__container {
  max-width: 1400px;
  width: 95%;
  margin: 0 auto;
}

.header-bottom__row {
  display: flex;
  justify-content: space-around;
  align-items: center;
  gap: 37px;
}

.header-bottom__links {
  display: flex;
  gap: 20px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
}

.header-bottom__links a {
  font-family: "gotham-bold";
  color: var(--purple) !important;
  flex-shrink: 0;
  display: flex;
  gap: 5px;
  align-items: center;
}

.user-info {
  background: var(--gradient-one);
  border-radius: 6px;
}

.user-info .header-block a:not(.dropdown-menu.show a) {
  font-family: "kanit-medium";
  color: var(--white) !important;
  border-radius: 6px;
}

.header-banner {
  background-color: var(--purple-three);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  border-radius: 4px;
}

.section-title {
  font-family: "kanit-bold";
  text-transform: uppercase;
  font-size: 1.5rem !important;
  letter-spacing: 0.5px;
}

.red-title {
  color: var(--red);
}

.green-title {
  color: var(--green);
}

.pink-title {
  color: var(--pink) !important;
}

.promo-product__wrapper {
  display: flex;
  border: 1.5px solid var(--blue);
  border-radius: 7px;
  align-items: center;
  position: relative;
  height: 100%;
}

.promo-product__wrapper .product-title,
.promo-product__wrapper .product-title a {
  font-family: "kanit-bold";
  color: var(--black);
  font-size: 1.12rem;
}

.see-more-btn {
  width: 100%;
  background: var(--purple-three);
  color: #fff;
  border-color: transparent;
  font-family: "gotham-medium";
  border-radius: 3px;
}

.brands-slider .splide__list {
  align-items: center;
  text-align: center;
  width: fit-content;
}

.header-bloc {
  /* background: linear-gradient(95deg, #e40045 0%, #ff7a00 50%, #a6d81c 100%); */
  background: linear-gradient(
    to right,
    #ff0066 0%,
    #ff3300 10%,
    #ff9900 55%,
    #ffcc00 63%,
    #ccff00 75%,
    #66ff33 100%
  );
  display: flex;
  justify-content: space-around;
  align-items: center;
  flex-wrap: wrap;
  border-radius: 4px;
}

#search_widget .search-icon {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
}

#search_widget form {
  position: relative;
  width: 440px;
}

.header-block__badge {
  font-size: 13px;
  line-height: 1.6;
  position: absolute;
  left: 22px;
  width: fit-content;
  top: 0;
}

.footer .footer__main {
  background: url("/themes/inko/assets/images/rainbow_bg.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.footer__main__bottom {
  border-top: 1.5px solid #fff;
}

.pt_vegamenu .pt_vmegamenu_title,
.main-menu .header-block__action-btn {
  background: linear-gradient(90deg, #7b1fa2 0%, #e91e63 100%);
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-radius: 4px;
  cursor: pointer;
}

.pt_vegamenu .pt_vmegamenu_title h2,
.main-menu .header-block__action-btn h2 {
  color: #fff;
  font-size: 1rem;
  font-family: "kanit-medium";
  font-weight: normal;
}

.pt_vegamenu #pt_vmegamenu {
  border-radius: 4px;
  border: 1px solid #a415e2;
  background: #f7ebff;
  position: relative;
}

.pt_vegamenu #pt_vmegamenu .pt_menu {
  margin-bottom: 0.5em;
  position: relative;
}

.pt_vegamenu #pt_vmegamenu .parentMenu a {
  font-family: "rubik-medium";
  text-transform: uppercase;
  color: #8401ff;
  display: flex;
  gap: 10px;
  line-height: 1.5;
  font-size: 15px;
}

.pt_vegamenu #pt_vmegamenu .wrap-popup .popup {
  left: 100%;
  background: #f7ebff;
  position: absolute;
  top: 0;
  z-index: 100;
  border: 1px solid #a415e2;
  border-radius: 4px;
}

.pt_vegamenu #pt_vmegamenu .wrap-popup .block1 {
  display: flex;
  width: 880px;
  /* min-width: 100%; */
  flex-wrap: wrap;
  gap: 35px;
}

.pt_vegamenu #pt_vmegamenu .wrap-popup .popup {
  padding: 25px 30px;
}

.pt_vegamenu #pt_vmegamenu .wrap-popup .column.no-children {
  width: 100%;
}

.pt_vegamenu #pt_vmegamenu .wrap-popup .itemMenu {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  margin: 10px 0;
  line-height: 1.7;
}

/* .pt_vegamenu #pt_vmegamenu .wrap-popup .itemSubMenu .itemMenuName,
.pt_vegamenu
  #pt_vmegamenu
  .wrap-popup
  .itemMenu.level1
  > .itemMenuName:not(:first-child)*/
.pt_vegamenu #pt_vmegamenu .wrap-popup .no-child,
.pt_vegamenu #pt_vmegamenu .wrap-popup .menu-children .menu-child {
  font-family: "publicsans-regular";
  color: #0f172a;
  display: list-item;
}

.pt_vegamenu
  #pt_vmegamenu
  .wrap-popup
  .itemMenu.level1
  > .itemMenuName:first-child {
  font-family: "rubik-medium";
  text-transform: uppercase;
  color: #8401ff;
}

.pt_vegamenu #pt_vmegamenu .parentMenu svg {
  transition: transform 0.3s ease;
}

.pt_vegamenu #pt_vmegamenu .menu-grid {
  display: flex;
  flex-wrap: wrap;
}

.pt_vegamenu #pt_vmegamenu .menu-col.no-children {
  width: 33.3%;
  padding: 15px 10px;
}

.pt_vegamenu #pt_vmegamenu .wrap-popup .menu-children .menu-child {
  padding: 10px;
}

.pt_vegamenu #pt_vmegamenu .menu-child {
  display: block;
  margin-left: 10px;
}

.header {
  position: initial;
}

/* Product page: */
.product__current-price span {
  color: #8401ff;
  font-size: 30px;
}

.product-actions__quantity .input-group .btn,
.quantity-button button {
  background: #6201bd;
  color: #fff;
  border-radius: 8px !important;
}

.product-actions__quantity #quantity_wanted {
  border: 0;
  max-width: 3em;
  font-family: "kanit-regular";
  color: #000;
  font-size: 18px;
}

.product-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.product-actions .add-to-cart {
  background: #6201bd;
  border-color: #6201bd;
  font-family: "gotham-medium";
  width: fit-content !important;
}

.product-actions .quotation-request {
  background: #00d399;
  border-color: #00d399;
  color: #fff;
  font-family: "gotham-medium";
  border-radius: 7px;
  width: fit-content !important;
  text-transform: uppercase;
}

.product__attachments .attachment-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* .page-product .product__infos .info {
  border-bottom: 1.5px solid #6201bd;
} */

.page-product .product__infos .accordion-button {
  font-family: "inter-extrabold";
  font-size: 1.5rem;
}

.product__details .detail,
.product__features .detail {
  border: 1px solid #6201bd;
  border-radius: 5px;
}

.product__details .detail + .detail,
.product__features .detail + .detail {
  margin-top: 10px;
}

.product-slider .splide__arrows {
  display: flex;
  gap: 10px;
  justify-content: end;
  margin-top: 25px;
  margin-bottom: 30px;
}

.product-slider .splide__arrows .splide__arrow {
  position: initial;
  background: transparent;
  border-radius: 6px;
  border: 1px solid #4d00b2;
  background: #fff;
}

.product-slider .splide__arrows .splide__arrow svg {
  fill: #4d00b2;
}

.product-miniature .product-miniature__price {
  font-family: "gotham-book";
  color: #4e00b3;
}

.product-miniature__infos__bottom .btn {
  border-radius: 4px;
  background: #4d00b2;
  color: #fff;
  font-family: "gotham-book";
}

.product-miniature .product-miniature__title {
  color: #191c1f;
  font-family: "gotham-book";
}

.product-miniature {
  border-radius: 2.915px;
  border: 0.972px solid #4e00b3;
  background: var(--Gray-00, #fff);
}

.products article .wishlist-button-add {
  background: transparent;
  box-shadow: none;
}

.products article .wishlist-button-add i {
  color: #4d00b2;
}

.splide__track--nav > .splide__list > .splide__slide {
  opacity: 0.5;
}

.splide__track--nav > .splide__list > .splide__slide.is-active {
  opacity: 1;
  border: none !important;
}

.product__price-taxless {
  color: #a19e9e;
  font-family: "kanit-medium";
  font-size: 25px;
}

.product-available:not(i) {
  color: #157d7c;
  font-family: "inter-medium";
}

.product-reassurance .content-bloc p:last-child {
  margin-bottom: 0;
}

.blockcart-modal__product {
  border-right: 1px solid var(--black);
}

.blockcart-modal__product .product-wrapper {
  border: 0.972px solid #4e00b3;
  width: 361px;
  max-width: 100%;
  margin: 0 auto;
}

.blockcart-modal__product img {
  max-height: 200px;
  object-fit: contain;
}

.blockcart-modal__summery .title {
  color: #1fc926;
  font-family: "kanit-bold";
  font-size: 20px;
}

.continue-btn,
#displayQuotationRequest .submit-btn {
  border-radius: 8px;
  border: 1.4px solid #6201bd;
  color: #6201bd;
  font-family: "gotham-medium";
}

.order-btn {
  background: #6201bd;
  border-radius: 8px;
  font-family: "gotham-medium";
  border-color: #6201bd;
}

#displayQuotationRequest .image-wrapper {
  border-right: 1px solid #c4c4c4;
}

#displayQuotationRequest .image-wrapper img {
  max-width: 220px;
  margin: 0 auto;
}

#displayQuotationRequest input {
  background: #f8f8f8;
}

#cart .cart-summary {
  border-radius: 4px;
  border: 1px solid #8401ff;
}

.product-miniature .product-miniature__quickview_touch {
  display: none;
}

.cart-detailed__actions .btn-primary {
  background: #6201bd;
  border-radius: 6px;
  border-color: #6201bd;
  font-family: "gotham-medium";
}

.cart-container .cart__item {
  border-radius: 3px;
  border: 1px solid #4e00b3;
}

.cart-container .cart__item .price,
.cart-summary-top p {
  font-size: 20px;
}

.cart__item .product-line__actions a:after {
  background: none;
}

.cart-summary__product {
  background: #f9f9f9;
}

/* Checkout page: */
body#checkout section.checkout-step.step--unreachable,
body#checkout section.checkout-step.-unreachable,
body#checkout section.checkout-step.step--complete:not(.-current) {
  background: #f7f0ff;
  border-radius: 6px;
  margin-bottom: 1.5rem !important;
}

body#checkout section.checkout-step.step--unreachable,
body#checkout section.checkout-step.-unreachable,
.btn.disabled,
.btn:disabled,
fieldset:disabled .btn {
  cursor: no-drop;
}

body#checkout section.checkout-step.step--complete {
  cursor: pointer;
}

body#checkout section.checkout-step .step-number {
  margin-left: 0.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 33px;
  height: 33px;
  margin-right: 0.65rem;
  font-size: 1rem;
  vertical-align: bottom;
  border-radius: 50%;
  background-color: #8401ff;
  color: #fff;
}

body#checkout section.checkout-step:not(.-current) .step__content,
body#checkout section.checkout-step:not(.-current) .step__title hr {
  display: none;
}

body#checkout section.checkout-step .step__content .nav-tabs .nav-item {
  flex: 0 0 49%;
  width: 50%;
}

body#checkout section.checkout-step .step__content .nav-tabs .nav-link {
  border-radius: 6px;
  border: 1px solid #8401ff;
  background: #fff;
  height: -webkit-fill-available;
}

body#checkout section.checkout-step .step__content .nav-tabs .nav-link.active {
  background: #8401ff;
  color: #fff;
}

body#checkout section.checkout-step form .form-label,
.form-label {
  font-family: "gotham-medium";
  font-weight: 500;
  color: var(--black);
}

body#checkout section.checkout-step form .form-control,
body#checkout section.checkout-step form .form-select {
  border-radius: 8px;
  background-color: #f8f8f8;
  border: 0;
}

body#checkout section.checkout-step form .btn.continue {
  border-radius: 6px;
  background: #8401ff;
  border-color: #8401ff;
}

.form-check-input:checked,
.btn-primary {
  background-color: #8401ff;
  border-color: #8401ff;
  font-family: "gotham-medium";
}

.cancel-address {
  border-color: #eb2622;
  color: #eb2622;
}

.step .address.selected,
.definition-list .card,
.address,
.addresses__new-address {
  border-color: #8401ff;
}

.order-top {
  border-radius: 6px;
  background: #f7f0ff;
}

.order-top .order-top-wrapper {
  max-width: 450px;
  margin: 0 auto;
}

.order-confirmation,
#order-details {
  border-radius: 6px;
  border: 1px solid #8401ff;
  background: #fff;
}

.product-line__cell--img {
  width: 7.5rem;
}

.search-filters .search-filters-subtitle button {
  font-weight: 500;
  font-size: 20px !important;
}

#search-filters .accordion-item * {
  font-family: "kanit-regular";
  color: #8401ff !important;
  font-size: 18px;
}

#search-filters .accordion-item .form-check {
  margin-bottom: 10px;
}

#search-filters .accordion-collapse {
  max-height: 12.5rem;
  overflow-y: auto;
}

#search-filters .noUi-connect {
  background: #8401ff;
}

.search-filters .noUi-horizontal .noUi-handle {
  border-width: 6px;
  border-color: #8401ff;
}

.search-filters .noUi-horizontal {
  height: 7px;
}

.pagination .page-item .page-link {
  border-color: #8401ff;
  color: #8401ff;
  font-family: "inter-medium";
}

.pagination .page-item.active .page-link {
  border-color: #8401ff;
  background: #8401ff;
  color: #fff;
  font-family: "inter-medium";
}

.pagination .page-item:not(.active) .page-link.disabled,
.pagination .page-item.disabled .page-link {
  opacity: 0.5;
  background: transparent;
}

.search-filters .clear-all-wrapper button {
  border-color: #eb2622;
  color: #eb2622;
}

.active-filters-item,
.btn-outline-primary {
  border: 1px solid #8401ff;
  color: #8401ff;
}

#category .quantity-button input {
  max-width: 65px;
  width: 65px;
}

.customer-link a span,
.customer-link__link span {
  border: 1px solid #4e00b3;
  background: transparent;
  justify-content: center;
  align-items: center;
  height: 100%;
  text-align: center;
}

.account-menu > a {
  margin-bottom: 5px;
}

.page-history .order__actions a:after {
  content: none;
}

#order-detail #content-wrapper .page-header {
  margin-bottom: 1rem;
}

.badge.discount {
  background: #eb2622;
  color: #fff;
  border: 0;
  border-radius: 1px;
  border-top-left-radius: 2px;
}

.footer .footer__block__content-list li:not(:last-child) {
  margin-bottom: 10px;
}

/* Login + Sign up pages */
body#authentication,
body#registration {
  background: url("/themes/inko/assets/images/desktop.png");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100dvh;
}

body#authentication .auth-container,
body#registration .auth-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100dvh;
}

body#authentication .auth-container #content-wrapper,
body#registration .auth-container #content-wrapper {
  background: white;
  width: 666px;
  border-radius: 20px;
  padding: 35px;
  max-height: 90vh;
  overflow-y: scroll;
}

body#authentication .auth-container #content-wrapper .logo,
body#registration .auth-container #content-wrapper .logo {
  width: 119px;
}

/* Hover effects */
.pt_vegamenu #pt_vmegamenu .parentMenu:hover,
.account-menu > a.active,
.account-menu > a:hover {
  background: #8401ff;
}

.pt_vegamenu #pt_vmegamenu .parentMenu:hover a,
.account-menu > a.active .link-item,
.account-menu > a.active .link-item i,
.account-menu > a:hover .link-item,
.account-menu > a:hover .link-item,
.account-menu > a:hover .link-item i,
.addresses__new-address i {
  color: #fff;
}

.pt_vegamenu #pt_vmegamenu .parentMenu:hover svg {
  rotate: 45deg;
}

.pt_vegamenu #pt_vmegamenu .parentMenu:hover svg path {
  fill: #fff;
}

.see-more-btn:hover,
.btn-primary:hover,
.pink-btn:hover,
.submit-btn:hover,
.btn-outline-primary:hover {
  background-image: linear-gradient(
    90deg,
    #7100af 0%,
    #fe9402 49%,
    #fd0150 80%,
    #7100af 100%
  );
  animation: slidebg 5s linear infinite;
  color: white !important;
  border: 0 !important;
}

.user-info:hover {
  background-image: linear-gradient(
    90deg,
    var(--orange) 0%,
    var(--purple-two) 30%,
    var(--orange) 100%
  );
  animation: slidebg 5s linear infinite;
  color: white;
}

.brand-list-wrapper .brand-item:hover a {
  text-decoration: none;
}

.brand-list-wrapper .brand-item svg {
  transition: transform 0.3s ease-in-out;
}

.brand-list-wrapper .brand-item:hover svg {
  transform: rotate(-30deg);
}

@keyframes slidebg {
  to {
    background-position: 20vw;
  }
}

/* scrollbar */
::-webkit-scrollbar {
  width: 7px;
  height: 7px;
  background-color: transparent;
}

::-webkit-scrollbar-thumb {
  border-radius: 2px;
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  background-color: var(--purple-three);
}

.brand-list-wrapper {
  max-width: 200px;
  margin: 0 auto;
}

.brand-list-wrapper h2 {
  font-family: "montserrat-bold";
  font-size: 25px;
  color: #6201bd;
}

.brand-list-wrapper .brand-item a {
  color: #6201bd;
  font-family: "kanit-medium";
  font-size: 18px;
  text-decoration: underline;
}

/* Responsive */

/* md screen */
@media (max-width: 991.98px) {
  .product-actions {
    gap: 8px;
  }

  #search_widget form {
    width: 340px;
  }

  .order-confirmation__table {
    padding: 0;
  }
}

/* sm screen */
@media (max-width: 767.98px) {
  .category-list-wrapper.row,
  .pt_vegamenu .pt_vmegamenu_title {
    display: none;
  }

  #search_widget form {
    width: 400px;
  }

  .main-menu__mobile .menu a {
    font-family: "rubik-medium";
    text-transform: uppercase;
    color: #8401ff;
    display: flex;
    gap: 10px;
    line-height: 1.5;
    font-size: 15px;
  }

  .main-menu__offcanvas {
    border: 1px solid #a415e2;
    background: #f7ebff;
    overflow-y: scroll;
  }

  .main-menu__offcanvas .material-icons,
  .main-menu__offcanvas hr {
    color: #8401ff !important;
  }

  .main-menu__title {
    font-family: "rubik-medium";
    font-weight: normal;
    text-transform: uppercase;
  }

  .main-menu__mobile {
    overflow: initial;
  }

  .brand-list-wrapper {
    max-width: 100%;
  }

  .brand-list-wrapper svg path {
    fill: #8401ff;
  }

  .header-bottom__links {
    flex-direction: column;
    align-items: start;
  }
}

/* xs screens */
@media (max-width: 575.98px) {
  .search-widgets {
    width: 80%;
    max-width: 320px;
  }

  #search_widget form {
    width: 100%;
  }

  .product-line {
    display: flex;
    flex-wrap: wrap;
  }

  .product-line .product-line__cell {
    padding: 10px;
  }

  .product-table__head {
    display: none;
  }

  .product-line__cell--img {
    order: -3;
    width: auto;
    flex: 0 0 5.625rem;
    max-width: 5.625rem;
  }

  .product-line__cell--prod {
    order: -2;
    flex: 0 0 calc(100% - 5.625rem);
    max-width: calc(100% - 5.625rem);
  }

  .product-line__cell--price,
  .product-line__cell--total,
  .product-line__cell--qty {
    flex: 0 0 33.33333333%;
    max-width: 33.33333333%;
  }
}
