@charset "UTF-8";
.mini-basket {
  z-index: 201;
  position: absolute;
  top: calc(100% + 3rem);
  right: 0;
  width: 100%;
  max-width: 75rem;
  display: flex;
  flex-direction: column;
  visibility: hidden;
  opacity: 0;
  transition: all 0.3s ease;
  cursor: default; }
  @media (max-width: 1023px) {
    .mini-basket {
      display: none; } }
  .mini-basket__inner {
    background: #F8F8F8;
    max-height: calc(100vh - 25rem);
    border-radius: 1rem;
    position: relative;
    z-index: 2;
    padding: 3.4rem 2.4rem 3.4rem 3.4rem;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.13); }
  .mini-basket:before {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 100%;
    height: 3rem; }
  .mini-basket--empty {
    max-height: none; }
    .mini-basket--empty .mini-basket__inner {
      padding: 4rem;
      padding-top: 6rem; }
  .mini-basket.active {
    top: calc(100% + 20px);
    opacity: 1;
    visibility: visible; }
  .mini-basket__inner {
    display: flex;
    flex-direction: column; }
  .mini-basket__body {
    flex-grow: 1;
    overflow: auto;
    padding-right: 2.6rem; }
    .mini-basket__body::-webkit-scrollbar {
      width: 3px;
      /* ширина для вертикального скролла */
      height: 3px;
      /* высота для горизонтального скролла */
      border-radius: 0px;
      background-color: #D8D8D8; }
    .mini-basket__body::-webkit-scrollbar-thumb {
      background-color: #6F7682;
      border-radius: 10em; }
      .mini-basket__body::-webkit-scrollbar-thumb:hover {
        background-color: #6F7682; }
  .mini-basket__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 1.6rem;
    margin-bottom: 2.7rem; }
  .mini-basket__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-right: 2.6rem;
    padding-top: 3rem; }
  .mini-basket__total {
    display: flex;
    align-items: baseline; }
    .mini-basket__total-title {
      color: #6F7682;
      margin-right: 1rem; }
    .mini-basket__total-sum {
      color: #353535; }
  .mini-basket__control {
    display: flex;
    align-items: center;
    gap: 2.4rem; }
  .mini-basket__clear {
    display: flex;
    align-items: center;
    gap: 4px;
    color: #6F7682;
    fill: #6F7682;
    transition: all ease .3s; }
    @media (min-width: 1024px) {
      .mini-basket__clear {
        cursor: pointer; }
        .mini-basket__clear:hover {
          color: #353535;
          fill: #353535; } }
    .mini-basket__clear:active {
      transform: translateY(2px); }
  .mini-basket__link {
    margin-left: 2rem; }
  .mini-basket__empty-image {
    margin-bottom: 3.6rem; }
  .mini-basket__empty-title {
    margin-bottom: 1.6rem;
    text-align: center; }
  .mini-basket__empty-descr {
    text-align: center;
    max-width: 46rem;
    margin: auto;
    margin-bottom: 3.6rem; }
  .mini-basket__empty-control {
    display: flex;
    justify-content: center;
    margin-top: 3rem; }
  .mini-basket__messages {
    position: absolute;
    right: 0; }
  .mini-basket__message {
    max-width: 63rem;
    padding: 3rem;
    background-color: #fff;
    border-radius: 1rem;
    margin-left: auto;
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.13); }
    .mini-basket__message--warning {
      background-color: #FFDBD2; }
    .mini-basket__message--product .mini-basket__message-body {
      display: flex;
      gap: 1rem;
      align-items: center; }
    .mini-basket__message-title {
      margin-bottom: 1.8rem; }
    .mini-basket__message-img {
      width: 6rem;
      height: 4rem;
      flex-shrink: 0; }
      .mini-basket__message-img img {
        width: 100%;
        height: 100%;
        object-fit: contain; }
    .mini-basket__message-name {
      font-weight: 500; }
  @media (min-width: 1024px) {
    .mini-basket .header-notification__control:hover {
      cursor: pointer;
      color: #00A19B; }
      .mini-basket .header-notification__control:hover .icon {
        fill: #00A19B; } }
  @media (max-width: 767px) {
    .mini-basket {
      display: none; } }

@media (max-width: 1023px) {
  .header-status-bar__icon.js-show-mini-basket {
    display: none; } }

.search-active .mini-basket-container {
  z-index: 200; }