@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  @font-face {
    font-family: 'Rubik';
    src:
      url('../fonts/full/subset-Rubik-Regular.woff') format('woff'),
      url('../fonts/full/subset-Rubik-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
  }
  @font-face {
    font-family: 'Rubik';
    src:
      url('../fonts/full/subset-Rubik-Medium.woff') format('woff'),
      url('../fonts/full/subset-Rubik-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
  }
  @font-face {
    font-family: 'Rubik';
    src:
      url('../fonts/full/subset-Rubik-SemiBold.woff') format('woff'),
      url('../fonts/full/subset-Rubik-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
  }
  @font-face {
    font-family: 'Rubik';
    src:
      url('../fonts/full/subset-Rubik-Bold.woff') format('woff'),
      url('../fonts/full/subset-Rubik-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
  }
  @font-face {
    font-family: 'Raleway';
    src:
      url('../fonts/full/Raleway-Black.woff') format('woff'),
      url('../fonts/full/Raleway-Black.woff2') format('woff2');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
  }
  @font-face {
    font-family: 'w8';
    src:
      url('../icons/fonts/w8.woff') format('woff'),
      url('../icons/fonts/w8.svg') format('svg'),
      url('../icons/fonts/w8.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
  }

  :root {
    --ts-pr-caret: 0.75rem;
    --twcb-scrollbar-width: 0px;
  }

  body {
    @apply relative font-rubik;
  }

  html {
    @apply selection:bg-brand-lighter selection:text-brand-dark;
  }
  img {
    @apply select-none;
  }

  /* Прижимаємо футер до низу */
  body,
  html {
    @apply min-h-[100vh] text-steel-base select-text;
  }
  main {
    @apply flex-auto;
  }
  /* end Прижимаємо футер до низу */

  ::placeholder {
    @apply font-normal truncate;
  }

  [type='search'] {
    &::-webkit-search-decoration,
    &::-webkit-search-cancel-button,
    &::-webkit-search-results-button,
    &::-webkit-search-results-decoration {
      @apply hidden;
    }
  }

  [type='number'] {
    &::-webkit-outer-spin-button,
    &::-webkit-inner-spin-button {
      -webkit-appearance: none;
      margin: 0;
    }
  }

  summary {
    -webkit-tap-highlight-color: transparent;
  }
  summary::-webkit-details-marker {
    display: none;
  }

  /* video, */
  iframe {
    @apply rounded;
  }

  pre {
    @apply rounded-sm bg-[#eee] px-3 py-2 text-sm;
  }

  figcaption {
    @apply mt-2 text-center text-gray-500 sm:text-sm;
  }

  textarea {
    @apply flex;
  }

  iframe,
  video {
    @apply aspect-video h-auto max-w-full;
  }

  section {
    @apply py-10 sm:py-12 md:py-[70px];
  }

  button {
    @apply focus-visible:outline-none;
  }

  .sidebar {
    will-change: min-height;
  }

  .sidebar__inner {
    transform: translate(0, 0); /* For browsers don't support translate3d. */
    transform: translate3d(0, 0, 0);
    will-change: position, transform;
  }

  .section-bg {
    @apply shadow-theme-grey-main md:shadow-none lg:shadow-theme-grey-main;
  }

  .style-svg.fill-current path {
    fill: currentColor;
  }
}
@layer components {
  .card {
    @apply bg-mist-light border border-mist-dark shadow-theme-grey-main rounded-xl md:rounded-2xl;
  }
  /* FORMS */
  .input label {
    pointer-events: none;
  }
  .input.required label {
    @apply after:content-['*'] after:text-brand-darker;
  }
  .input [type='text'],
  .input [type='email'],
  .input [type='url'],
  .input [type='password'],
  .input [type='number'],
  .input [type='date'],
  .input [type='datetime-local'],
  .input [type='month'],
  .input [type='search'],
  .input [type='tel'],
  .input [type='time'],
  .input [type='week'],
  .input [multiple],
  .input textarea,
  .input select,
  .input .ts-control,
  .fs-wrap .fs-label-wrap .fs-label {
    @apply w-full rounded-xl border border-mist-base py-[5px] pl-3.5 pr-2 text-base leading-tight ring-0 transition-shadow
			text-raven-base
			placeholder:text-raven-light
			hover:border-raven-dark
			focus:ring-0;
    &:disabled:not(.readonly) {
      @apply pointer-events-none text-mist-base placeholder:text-mist-base;
    }
    &[readonly],
    &.readonly {
      @apply border-none bg-transparent bg-none !p-0 opacity-100 shadow-none;
    }
  }

  .input {
    @apply relative w-full;
    textarea {
      @apply min-h-[100px] sm:min-h-[140px] max-h-52;
    }

    option[default] {
      @apply text-raven-light;
      display: none;
    }
    .ts-hidden-accessible {
      @apply inset-0 !h-full !w-full;
    }
  }
}
/* BTNS */
@layer components {
  .btn {
    @apply relative inline-flex select-none items-center
		justify-center gap-2 overflow-hidden whitespace-nowrap
		rounded-xl border
	  	disabled:pointer-events-none
		w-full sm:w-auto transition-[color,background-color,border-color,text-decoration-color,fill,stroke,box-shadow];
  }
  .btn.loading {
    @apply pointer-events-none text-transparent before:font-icon before:absolute before:left-1/2 before:-ml-[10px] before:inline-block before:animate-spin before:text-xl before:font-normal before:content-['\e922'];
  }
  .btn svg {
    @apply fill-current size-5 flex-none;
  }

  .btn-square {
    @apply btn aspect-square rounded-md;
  }

  .style-accent {
    @apply /* default  */ border-brand-base bg-brand-base text-mist-lighter shadow-theme-red-main
		/* hover    */ hover:border-brand-dark hover:bg-brand-dark hover:shadow-theme-red-hover
		/* focus    */ focus:border-brand-darker
		/* active   */ active:border-brand-darker active:bg-brand-darker
		/* disabled */ disabled:border-raven-lighter disabled:bg-raven-lighter disabled:shadow-theme-grey-main
		/* loading  */ loading:before:text-mist-lighter;
  }

  .style-secondary {
    @apply /* default  */ border-mist-darker bg-mist-light text-steel-base shadow-theme-grey-main
		/* hover    */ hover:bg-mist-lighter hover:shadow-theme-grey-hover
		/* focus    */ focus:border-steel-lighter focus:bg-steel-lighter focus:outline-raven-lighter
		/* active   */ active:border-[#fff2f7] active:bg-[#fff2f7]
		/* disabled */ disabled:border-raven-lighter disabled:text-raven-lighter
		/* loading  */ loading:before:text-raven-base;
    svg {
      @apply text-steel-dark;
    }
  }

  .style-shadow {
    @apply /* default  */ border-brand-base bg-transparent text-raven-base shadow-theme-grey-main
		/* hover    */ hover:ring-brand-dark hover:bg-transparent hover:shadow-theme-grey-hover
		/* focus    */ focus:border-raven-base focus:bg-transparent
		/* active   */ active:border-brand-darker active:bg-transparent
		/* disabled */ disabled:border-raven-lighter disabled:bg-transparent disabled:text-raven-lighter
		/* loading  */ loading:before:text-raven-base;
  }

  .style-tertiary {
    @apply /* default  */ text-raven-base border-current
		/* hover    */ hover:text-brand-darker
		/* focus    */
		/* active   */ active:border-transparent
		/* disabled */ disabled:text-raven-lighter
		/* loading  */ loading:before:text-raven-base loading:border-transparent;
  }

  .btn-text-mobile {
    @apply text-base font-normal leading-[18px];
  }
  .btn-text-desktop {
    @apply text-[18px] font-medium leading-[28px];
  }

  .size-sm {
    @apply btn-text-mobile px-4 py-1.5;
    svg {
      @apply size-4;
    }
  }

  .size-base {
    @apply btn-text-mobile leading-5 px-4 py-2 h-9;
  }

  .size-lg {
    @apply btn-text-desktop rounded-2xl px-6 py-2 h-11;
  }

  /* accent */
  .btn-accent-sm {
    @apply btn style-accent size-sm;
  }
  .btn-accent-base,
  .lots-1 .facetwp-load-more,
  .lots-2 .facetwp-load-more {
    @apply btn style-accent size-base;
  }
  .btn-accent-lg {
    @apply btn style-accent size-lg;
  }

  /* secondary */
  .btn-secondary-sm {
    @apply btn style-secondary size-sm font-semibold;
  }

  .btn-secondary-base {
    @apply btn style-secondary size-base font-semibold;
  }
  .btn-secondary-lg {
    @apply btn style-secondary size-lg font-semibold;
  }

  /* shadow */
  .btn-shadow-sm {
    @apply btn style-shadow size-sm font-semibold border-2;
  }
  .lots-3 .facetwp-load-more,
  .btn-shadow-base {
    @apply btn style-shadow size-base font-semibold border-2;
  }
  .btn-shadow-lg {
    @apply btn style-shadow size-lg font-semibold border-2;
  }

  /* tertiary */
  .btn-tertiary-base {
    @apply btn size-base w-auto font-medium h-auto p-0 border-t-0 border-b border-x-0 rounded-none style-tertiary;
  }

  /* square */
  .btn-square-sm {
    @apply btn-square p-0 w-fit style-accent size-sm border-2;
  }
  .btn-square-base {
    @apply btn-square p-0 w-fit style-accent size-base border-2;
  }
  .btn-square-lg {
    @apply btn-square p-0 w-fit style-accent size-lg border-2;
  }

  /* square-shadow */
  .btn-square-shadow-sm {
    @apply btn-square p-0 w-fit style-shadow size-sm border-2;
  }
  .btn-square-shadow-base {
    @apply btn-square p-0 w-fit style-shadow size-base border-2;
  }
  .btn-square-shadow-lg {
    @apply btn-square p-0 w-fit style-shadow size-lg border-2;
  }

  /* circle */
  .btn-circle-sm {
    @apply btn-square p-0 w-fit style-accent size-sm rounded-full border-2;
  }
  .btn-circle-base {
    @apply btn-square p-0 w-fit style-accent size-base rounded-full border-2;
  }
  .btn-circle-lg {
    @apply btn-square p-0 w-fit style-accent size-lg rounded-full border-2;
  }

  /* social */
  .btn-social-sm {
    @apply btn size-sm h-auto text-mist-lighter;
  }
  .btn-social-base {
    @apply btn size-base h-auto text-mist-lighter;
    svg {
      @apply size-7;
    }
  }
  .btn-social-lg {
    @apply btn size-lg h-auto text-mist-lighter;
  }
}
@layer utilities {
  .offer-gradient-mobile {
    background: linear-gradient(
        83deg,
        #f4f9fc -4.27%,
        rgba(244, 249, 252, 0) 25.69%
      ),
      linear-gradient(0deg, #f4f9fc 0%, rgba(244, 249, 252, 0) 21.91%),
      linear-gradient(180deg, #f4f9fc 0%, rgba(244, 249, 252, 0) 10.31%),
      linear-gradient(270deg, #f4f9fc 0%, rgba(244, 249, 252, 0) 11.04%),
      linear-gradient(90deg, #f4f9fc 0%, rgba(244, 249, 252, 0) 12.23%);
  }

  .offer-gradient-desktop {
    background: linear-gradient(
        65deg,
        #f4f9fc -13%,
        rgba(244, 249, 252, 0) 50.36%
      ),
      linear-gradient(95deg, #f4f9fc 29.8%, rgba(244, 249, 252, 0) 57.88%),
      linear-gradient(0deg, #f4f9fc 1.75%, rgba(244, 249, 252, 0) 31.31%),
      linear-gradient(90deg, #f4f9fc 29.05%, rgba(244, 249, 252, 0) 54.75%);
  }

  @keyframes offer-values-stagger {
    from {
      opacity: 0;
      transform: translateY(6px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  .offer-value-item {
    opacity: 0;
    animation: offer-values-stagger 320ms ease-out forwards;
    will-change: opacity, transform;
  }
}
.select-landing-1 {
  /* Hide default select chevron */
  select {
    background-image: none !important;
    padding-right: 1rem;
  }

  select::-ms-expand {
    display: none;
  }
}
.wp-element-button {
  @apply btn-accent-base;
}
.wp-block-columns {
  @apply mb-0;
}
.lots-3 .facetwp-load-more {
  @apply min-w-72;
}

/* Iti */
.iti__selected-flag {
  @apply pl-5 pr-1.5 relative;
  &::after {
    @apply content-[''] h-[18px] bg-mist-base w-[1px] mx-3;
  }
}
.iti__flag-container {
  @apply -my-2 p-0 self-stretch;
}
.iti__selected-dial-code {
  @apply order-1 !m-0 text-[15px] leading-5 text-steel-dark;
}
.iti input.iti__tel-input,
.iti input.iti__tel-input[type='text'],
.iti input.iti__tel-input[type='tel'] {
  @apply flex-1 !p-0 border-0 focus:ring-0 rounded-none focus:outline-none text-[15px] leading-5 placeholder:text-steel-dark rounded-r-md;
}
.iti__arrow {
  @apply ml-2 border-none size-3 rotate-180 transition-transform;
  background-image: url('../img/iti-arrow.svg');
  &--up {
    @apply rotate-0;
  }
}
.iti__flag {
  @apply shadow-none;
}
.iti--show-selected-dial-code .iti__selected-flag,
.iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag {
  @apply !bg-transparent;
}
.iti--inline-dropdown .iti__dropdown-content {
  @apply mt-0 rounded-t-none pt-3 px-3 max-w-60 !w-11/12 border border-mist-darker shadow-theme-grey-main;
}
.iti__search-input {
  @apply mb-3 border-mist-darker focus:ring-0 focus:outline-none focus:border-mist-darker rounded-md text-[15px] leading-5 py-1.5 pr-8 pl-3 bg-[right_6px_center] bg-no-repeat;
  background-image: url('../img/iti-search.svg');
}
.iti--inline-dropdown .iti__country-list {
  @apply -mx-3 scrollbar-thin scrollbar-track-transparent scrollbar-thumb-mist-darker;
}
.iti__country {
  @apply px-3 py-1 text-sm;
}
.iti__dial-code {
  @apply hidden;
}
.iti__country-name {
  @apply text-raven-base;
}
.iti {
  @apply w-full flex items-center py-[5px] border border-mist-base bg-white rounded-xl relative hover:border-raven-dark;
  &.open {
    @apply rounded-bl-none border-inherit;
  }
}
.iti__flag-container {
  @apply [position:unset];
}

.input.pay-attention {
  .iti,
  input:not(.iti__tel-input),
  textarea {
    box-shadow: 0px 0px 4px 0px #00a7ff99;
    @apply border border-[#00A7FF];
  }
}

.input.valid {
  input,
  textarea {
    @apply border-green-base pr-10;
  }
  &::before {
    @apply content-['\e906'] font-icon text-green-base block absolute bottom-1 right-3 text-2xl leading-6;
  }
}
.iti.valid {
  @apply border-green-base pr-10;
  &::before {
    @apply content-['\e906'] font-icon text-green-base block absolute bottom-1 right-3 text-2xl leading-6;
  }
}

.fs-label {
  @apply !text-steel-light hover:border-raven-dark;
}

.input label,
.radio .label {
  @apply pl-0.5 text-sm lg:text-base text-steel-darker mb-0.5;
  span[class^='icon-'] {
    @apply text-base leading-none;
  }
  span[class^='icon-'],
  svg {
    @apply mt-1 mr-2;
  }
  &.lg {
    @apply lg:text-lg text-steel-base;
  }
}
.ts-control {
  @apply flex-nowrap items-center;
  .item {
    @apply truncate;
  }
}
.ts-control > input {
  @apply min-w-0 !rounded-none;
}
.fs-wrap .fs-label-wrap .fs-label,
.ts-control:not(.rtl),
select {
  @apply !pr-8;
}

.fs-label-wrap {
  @apply !bg-transparent;
}
.fs-label {
  @apply bg-white;
}

.fs-wrap .fs-label-wrap {
  @apply border-none;
}
.fs-arrow {
  @apply hidden;
}

.fs-wrap .fs-label-wrap .fs-label,
.ts-control,
.ts-wrapper.single.input-active .ts-control,
select {
  background-image: url('../img/arrow-select.svg');
  @apply bg-[length:1rem] bg-[right_8px_center] bg-no-repeat;
}

.input.disabled label {
  @apply text-mist-base;
}
.disabled .ts-control {
  @apply bg-white border-mist-dark opacity-100;
}
.input.disabled {
  @apply pointer-events-none opacity-50;
}

select.readonly ~ .ts-wrapper {
  @apply hidden;
}

.ts-control input {
  @apply placeholder:text-raven-dark disabled:text-raven-lighter disabled:placeholder:text-raven-lighter;
}

.ts-control, .ts-wrapper.single.input-active .ts-control {
  @apply !cursor-pointer;
}
.ts-control, .ts-wrapper.single.input-active .ts-control input {
  @apply !cursor-text;
}

.fs-dropdown {
  @apply !relative lg:!absolute;
}

.has-items .ts-control {
  @apply flex-nowrap;
  input {
    @apply !hidden min-w-0;
  }
}

.ts-dropdown,
.fs-dropdown {
  box-shadow:
    0px 4px 4px rgba(51, 51, 51, 0.04),
    0px 14px 24px rgba(51, 51, 51, 0.12);
  @apply rounded-xl !border-none overflow-hidden;
}
.ts-dropdown .option.active,
.fs-option:hover {
  @apply bg-[#F8F8F8] text-inherit;
}
.ts-dropdown .selected {
  background-image: url('../img/ts-selected.svg');
  @apply bg-[#f0f0f0] pr-10 text-inherit;
}

.ts-dropdown .option,
.ts-dropdown .optgroup-header,
.ts-dropdown .no-results,
.ts-dropdown .create {
  @apply bg-[length:1.25rem] bg-[right_4px_center] bg-no-repeat px-4 py-2.5 text-base leading-tight;
}
.ts-dropdown.plugin-search_meta {
  .ts-dropdown-wrap {
    @apply overflow-y-auto flex flex-col sm:flex-row md:p-3 md:pr-0 h-full lg:max-h-[50vh];
    max-height: calc(
      100vh - var(--header-mobile-bottom-height) - var(--header-height)
    );
  }
  .ts-dropdown-content {
    @apply space-y-3 md:pl-5 w-full md:pr-6 max-h-full;
  }
}
.ts-dropdown [data-selectable] .highlight {
  @apply bg-brand-lighter text-brand-base;
}
.ts-dropdown-wrap {
  @apply pt-4 md:pt-0;
}
.ts-dropdown-right {
  @apply w-full flex flex-col pt-3 sm:pl-2.5 pb-[calc(var(--header-mobile-bottom-height)+10px)] sm:pt-0;
}
.ts-control-wrap {
  @apply flex gap-2;
}
.ts-control-close {
  @apply flex items-center justify-center size-8 flex-none rounded-xl bg-brand-base;
  box-shadow:
    0px 4px 4px 0px rgba(252, 19, 19, 0.08),
    0px 4px 16px 0px rgba(237, 34, 34, 0.08);
  svg {
    transform: translateX(-1px);
  }
}
.ts-dropdown.plugin-search_meta .no-results {
  @apply px-0;
}

.radio-checkbox-state {
  @apply border-raven-lighter bg-[length:20px_20px] ring-0 ring-offset-0
        checked:border-brand-base checked:bg-brand-base
        invalid:border-brand-lighter invalid:bg-brand-lighter
        hover:border-raven-lighter hover:bg-[#FAFAFA] checked:hover:border-brand-dark
        checked:hover:bg-brand-dark focus:bg-white focus:outline-offset-[-2px] focus:outline-[#828282]     checked:focus:bg-brand-base checked:focus:focus:outline-[#6a0b08]
        active:border-raven-lighter active:bg-[#F1F1F1]
        checked:active:border-brand-darker checked:active:bg-brand-darker
        disabled:border-raven-lighter disabled:bg-white
        checked:disabled:!border-raven-lighter checked:disabled:bg-raven-lighter;
  &:invalid {
    ~ span {
      @apply text-brand-base;
    }
  }
  &:disabled:hover,
  &:disabled {
    ~ span {
      @apply text-raven-lighter;
    }
  }
  /* &:hover {
			~ span {
				@apply text-raven-base;
			}
		} */
}

.checkbox {
  @apply flex gap-x-3;
  > span {
    @apply pt-0.5;
  }
  [type='checkbox'] {
    @apply radio-checkbox-state size-6 rounded-[4px];
  }
  [type='radio'] {
    @apply h-5 w-5;
  }
}
.radio {
  @apply flex gap-x-3;
  > span {
    @apply pt-0.5;
  }
  [type='radio'] {
    @apply radio-checkbox-state h-5 w-5;
  }
}

.wp-block-buttons {
  @apply mb-5;
}
.wp-block-video {
  @apply m-0;
}
.wp-block-image {
  @apply max-w-full flex-none;
  &.size-thumbnail {
    @apply max-w-[40%];
  }
  &.size-large {
    @apply max-w-[80%];
  }
  &.size-medium {
    @apply max-w-[60%];
  }
  &.size-full {
    @apply max-w-full;
  }
  img {
    @apply w-full;
  }
}
.wp-block-columns {
  @apply w-full gap-5;
}

.block-loading {
  @apply relative;
  &:after {
    @apply absolute left-1/2 top-1/2 z-[2] -ml-3 -mt-3 size-6 animate-spin font-icon text-2xl leading-6 text-brand-darker content-['\e922'];
  }
  &:before {
    @apply absolute inset-0 z-[1] block h-full w-full bg-mist-lighter/80 content-[''];
  }
}

/* Breadcrumbs */
.aioseo-breadcrumbs {
  @apply space-x-1 leading-[22px] sm:leading-5 text-raven-lighter sm:text-steel-dark;
}

.aioseo-breadcrumbs a {
  @apply hover:text-brand-base active:text-brand-base;
}
.aioseo-breadcrumbs a,
.aioseo-breadcrumb-separator {
  @apply text-raven-light sm:text-steel-light;
}

.breadcrumbs-light {
  .aioseo-breadcrumbs {
    @apply text-mist-light;
  }
  .aioseo-breadcrumbs a {
    @apply hover:text-brand-base active:text-brand-base;
  }
  .aioseo-breadcrumbs a,
  .aioseo-breadcrumb-separator {
    @apply text-mist-light;
  }
}

.breadcrumbs-light-dark {
  .aioseo-breadcrumbs {
    @apply text-mist-light xl:text-steel-dark;
  }
  .aioseo-breadcrumbs a {
    @apply hover:text-brand-base active:text-brand-base;
  }
  .aioseo-breadcrumbs a,
  .aioseo-breadcrumb-separator {
    @apply text-mist-light xl:text-steel-light;
  }
}

.aioseo-breadcrumb:first-child {
  a {
    @apply inline-flex gap-1;
    &:before {
      content: '\e94c';
      font-family: 'w8' !important;
      font-size: 20px;
      line-height: 16px;
    }
  }
}

/* FacetWP */
.fs-wrap.single .fs-option.selected {
  @apply bg-brand-base/10;
}
.data-cell-bid {
  @apply hidden;
}
.facetwp-slider-reset {
  @apply text-xs rounded-md px-2 py-1 border transition-[color,background-color,border-color,text-decoration-color,fill,stroke,box-shadow]
		/* default  */ border-mist-darker bg-mist-light text-steel-base shadow-theme-grey-main
		/* hover    */ hover:bg-mist-lighter hover:shadow-theme-grey-hover
		/* focus    */ focus:border-steel-lighter focus:bg-steel-lighter focus:outline-raven-lighter
		/* active   */ active:border-[#fff2f7] active:bg-[#fff2f7];
}
.facetwp-facet .fs-wrap.disabled {
  @apply pointer-events-none relative text-raven-lighter;
  &:after {
    @apply absolute inset-0 h-full w-full bg-white/40  content-[''];
  }
}
.tax-lot_cat .facetwp-facet.facetwp-facet-reset {
  @apply !block;
}
.eridanfacet-selections ul,
.facetwp-selections ul {
  @apply flex flex-wrap items-center gap-x-2 gap-y-1.5;
}
.fs-wrap.multiple .fs-option.selected .fs-checkbox i {
  @apply !bg-brand-base;
}
.eridanfacet-selections li a,
.facetwp-selections li {
  @apply flex flex-wrap items-center gap-x-2 gap-y-1.5;
}
.eridanfacet-selection-label {
  @apply hidden;
}
.eridanfacet-selection-value,
.facetwp-selection-value {
  @apply flex min-h-[26px] cursor-pointer leading-none py-1 select-none items-center gap-1 rounded-xl bg-brand-base px-3 text-sm text-white after:font-icon after:content-["\e901"] hover:bg-brand-base active:bg-brand-darker;
}
.facetwp-depth {
  @apply hidden pl-5 sm:pl-8;
  &.visible {
    @apply block;
  }
}

.facetwp-facet {
  .fs-wrap {
    @apply w-full;
  }
}

.facetwp-facet {
  @apply !mb-0;
}
.facetwp-type-fselect {
  @apply flex;
}

.facetwp-checkbox {
  /* bg-[left_3px] */
  @apply bg-no-repeat pl-9 [background-size:1.5rem] leading-6;
  background-image: url('../img/checkbox.svg');
  &:hover {
    @apply cursor-pointer;
    background-image: url('../img/checkbox-hover.svg');
  }

  &.checked {
    background-image: url('../img/checkbox-checked.svg');
    &:hover {
      background-image: url('../img/checkbox-checked-hover.svg');
    }
  }
}

.facetwp-reset {
  @apply text-sm font-medium leading-5 text-raven-dark underline hover:text-brand-dark active:text-brand-darker sm:text-base;
}

.facetwp-facet-reset:not(.single-hot-offer-filter .facetwp-facet-reset):not(.lots-3 .facetwp-facet-reset) {
  @apply !mb-6 border-b border-[#D8D8D8] pb-6 mt-1.5 text-center font-medium lg:text-left lg:!mb-10;
}

.facet-label {
  @apply text-[15px] leading-[21px] text-raven-darker mb-0.5 lg:text-base;
}

.facet-wrap-checkboxes {
  .facet-label {
    @apply hidden;
  }
}

.facetwp-counter {
  @apply ml-1.5 text-xs text-[#b5a2a2];
}

.facetwp-hidden {
  @apply !hidden;
}

.facetwp-type-slider {
  @apply flex flex-wrap justify-between;
}

.facetwp-slider-wrap {
  @apply w-full;
}
.facetwp-pager {
  @apply flex items-center gap-1.5;
}
.facetwp-page {
  @apply flex h-8 min-w-[34px] cursor-pointer items-center justify-center rounded-xl bg-steel-lighter px-1 text-xl font-semibold leading-[28px] shadow-theme-grey-main hover:bg-mist-lighter hover:shadow-theme-grey-hover
	disabled:opacity-50;
  &.active {
    @apply pointer-events-none bg-brand-base text-mist-lighter;
  }
  &[disabled],
  &.disabled {
    opacity: 0.5;
    pointer-events: none;
  }
}
.facetwp-page.prev {
  @apply text-[0px] after:font-icon after:text-base after:content-["\e91d"];
}
.facetwp-page.next {
  @apply text-[0px] after:font-icon after:text-base after:content-["\e924"];
}
.facetwp-page.dots {
  @apply pointer-events-none bg-transparent text-[26px] text-raven-lighter shadow-none;
}

.facetwp-facet.is-loading {
  opacity: 0.6;
}

.facetwp-overlay {
  position: absolute;
}
.facetwp-type-fselect.is-loading {
  opacity: 1; /* prevent stack order issues */
}

.facetwp-type-fselect.is-loading .fs-label-wrap,
.facetwp-type-fselect.is-loading .fs-search,
.facetwp-type-fselect.is-loading .fs-no-results,
.facetwp-type-fselect.is-loading .fs-options {
  opacity: 0.6;
}

.facetwp-type-fselect.is-loading .fs-option {
  cursor: wait;
}

.facetwp-type-fselect .fs-wrap.fs-disabled .fs-option {
  opacity: 0.4;
  cursor: wait;
}
.facetwp-selection-label {
  @apply hidden;
}
.fs-label,
.facetwp-type-fselect .fs-option .fs-option-label {
  white-space: nowrap;
  &:first-letter {
    text-transform: uppercase;
  }
}
.fs-label {
  @apply truncate block;
}
.fs-option-label {
  @apply flex items-center;
}
.facetwp-type-fselect .single .fs-option:first-child {
  @apply hidden;
}

/* KK-Star rating */
.kk-star-ratings .kksr-stars .kksr-star .kksr-icon,
.kk-star-ratings:not(.kksr-disabled)
  .kksr-stars
  .kksr-star:hover
  ~ .kksr-star
  .kksr-icon {
  background-image: url('../img/inactive.svg') !important;
}

.kk-star-ratings .kksr-stars .kksr-stars-active .kksr-star .kksr-icon {
  background-image: url('../img/active.svg') !important;
}

.kk-star-ratings.kksr-disabled
  .kksr-stars
  .kksr-stars-active
  .kksr-star
  .kksr-icon,
.kk-star-ratings:not(.kksr-disabled) .kksr-stars:hover .kksr-star .kksr-icon {
  background-image: url('../img/selected.svg') !important;
}
.kk-star-ratings .kksr-legend {
  margin-left: 0;
  margin-right: 0;
  font-size: inherit !important;
}

.kk-star-ratings {
  @apply flex-col items-start gap-3 lg:flex-row lg:items-center;
}
.kk-star-ratings .kksr-stars .kksr-stars-active,
.kk-star-ratings .kksr-stars .kksr-stars-inactive,
.kk-star-ratings > * {
  @apply flex h-8 items-center md:h-auto;
}

/* noUi */
.noUi-touch-area {
  @apply h-3 w-3 cursor-pointer rounded-full bg-brand-base;
}
.noUi-handle {
  @apply rounded-full;
  &.noUi-active {
    @apply ring-2 ring-brand-base;
  }
}
.noUi-connect {
  @apply bg-raven-light;
}
.noUi-connects {
  @apply bg-mist-base;
}

/* Binotel, Dialong, Cookie bot and other staff */
html #bingc-phone-button {
  display: none !important;
  z-index: 40 !important;
}
html #bingc-phone-button.binotel-widget-visible {
  display: block !important;
}
circle.bingc-phone-button-circle-outside {
  display: none;
}
a#bingc-phone-button {
  /* right: 14px !important; */
  transform: scale(0.8);
  bottom: 84px !important;
  right: 8px !important;
}
html
  #bingc-phone-button:hover
  svg.bingc-phone-button-circle
  circle.bingc-phone-button-circle-inside {
  fill: #a40b34 !important;
}
html #bingc-phone-button div.bingc-phone-button-tooltip {
  background: #d42e5b !important;
}
html
  #bingc-phone-button
  svg.bingc-phone-button-circle
  circle.bingc-phone-button-circle-inside,
html
  #bingc-phone-button
  div.bingc-phone-button-tooltip
  svg.bingc-phone-button-arrow
  polyline {
  fill: #d42e5b !important;
}
#dialong-webchat {
  @apply hidden z-50;
  &.chat-widget-visible {
    @apply block;
  }
}
body .rngst_phone_button {
  margin: 0;
  bottom: 0;
  right: 0;
  width: 156px;
  height: 156px;
  z-index: 30 !important;
}
@media (max-width: 600px) {
  #CookiebotWidget {
    @apply bottom-14;
  }
  .modal-active,
  .burger-opened,
  .filter-opened {
    .rngst_phone_button,
    #dialong-webchat.chat-widget-visible,
    .bingc-phone-button,
    #CookiebotWidget {
      @apply !hidden;
    }
  }
  body #CookiebotWidget:not(.CookiebotWidget-inactive) {
    bottom: calc(60px + env(safe-area-inset-bottom)) !important;
  }
  body.single-hot-offer #CookiebotWidget:not(.CookiebotWidget-inactive) {
    bottom: calc(60px + env(safe-area-inset-bottom) + 138px) !important;
  }
}
@media (max-width: 640px) {
  a#bingc-phone-button {
    bottom: calc(124px + env(safe-area-inset-bottom)) !important;
  }
  body .rngst_phone_button {
    bottom: calc(32px + env(safe-area-inset-bottom));
  }
}
@media (max-width: 979px) {
  body div#bingc-passive {
    height: 100%;
  }

  body #bingc-passive div.bingc-passive-overlay {
    top: 50% !important;
    transform: translateY(-50%);
  }

  @media (max-height: 600px) {
    body #bingc-passive div.bingc-passive-overlay {
      top: 10px !important;
      transform: translateY(0);
    }
  }
}

/* Modal */
.modal-active {
  @apply mr-[var(--twcb-scrollbar-width)];
}
.modal__overlay {
  @apply fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-60;
}
.micromodal-slide {
  @apply z-50;
}
.modal__container {
  @apply fixed left-[calc(50%-var(--twcb-scrollbar-width)/2)] top-1/2 z-[100] h-fit w-full -translate-x-1/2 -translate-y-1/2 px-4 transition-transform sm:w-max sm:min-w-[534px] sm:max-w-[600px] lg:max-w-[640px];
  &.watchlist {
    @apply left-[unset] top-[unset] right-0 bottom-0 p-0 flex h-[90%] w-full sm:max-w-xl transform-none rounded-t-xl sm:rounded-none sm:h-full sm:w-[90%] flex-col bg-[#FBFBFB];
  }
  &_general {
    @apply lg:max-w-[624px];
  }
  &_place-bid {
    @apply lg:max-w-[874px];
  }
  &_await {
    @apply lg:max-w-[874px];
  }
  &_await-promo {
    @apply sm:max-w-full md:max-w-3xl lg:max-w-4xl xl:max-w-[1132px] lg:aspect-[1100/680];
  }
  &_review {
    @apply lg:max-w-[832px] w-full;
  }
  &_thankyou {
    @apply sm:max-w-[542px];
  }
  &_last-hope {
    @apply sm:max-w-[554px];
  }
  &_landing {
    @apply sm:max-w-[373px] sm:min-w-[373px];
  }
}
.modal-active_modal-search {
  #header,
  #header-mobile-bottom {
    @apply z-[51] md:z-40;
  }
}
.modal__overlay_search {
  @apply bg-white md:bg-black md:bg-opacity-20;
}
.modal__container_search {
  @apply px-0 top-[calc(var(--header-height)+10px)] md:top-5 lg:top-[14px] w-full left-0 translate-x-0 translate-y-0 lg:px-0 max-w-full overflow-y-hidden flex;
  form {
    @apply relative container lg:px-0 lg:mx-0;
  }
}

.fs-dropdown .fs-options,
.ts-dropdown-content {
  @apply scrollbar-thin scrollbar-track-transparent scrollbar-thumb-raven-lighter scrollbar-thumb-rounded-xl hover:scrollbar-thumb-raven-dark;
}
.wp-element-caption {
  @apply text-raven-base;
}
.lots-1 .is-loading .facetwp-load-more,
.lots-2 .is-loading .facetwp-load-more {
  @apply after:animate-spin;
}
.is-loading {
  @apply pointer-events-none;
}
.lots-1 .facetwp-load-more,
.lots-2 .facetwp-load-more {
  @apply after:font-icon after:content-["\e94d"];
}
.facetwp-facet:has(.selected) .fs-label {
  @apply !text-raven-base;
}

[data-for="buy_it_now"] {
  @apply items-center;
}

/* Toastify */
.toastify {
  max-width: calc(100% - 40px);
  @apply flex items-center gap-3 bg-white rounded-xl z-30 shadow-theme-grey-hover border bg-gradient-to-r text-steel-darker pr-9 lg:max-w-[50%] to-40% to-white;
  &.warning {
    @apply border-[#FFF4C8] from-yellow-warning/20;
  }
  &.success {
    @apply border-[#95D8B2] from-green-base/20;
  }
  &.error {
    @apply border-[#E18E8A] from-red-error/20;
  }
  &.info {
    @apply border-mist-dark bg-mist-lighter;
  }
}
.toastify-avatar {
  @apply m-0;
}
.toast-close {
  @apply text-steel-dark p-0 absolute top-0.5 right-0.5 cursor-pointer size-6 text-[12px] leading-none hover:text-steel-darker active:text-steel-base;
}

/* Swiper */
.swiper-slide.draggable-mirror {
  @apply z-50;
}
.swiper-button-prev:after,
.swiper-button-next:after {
  @apply font-icon;
}
.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after {
  @apply content-['\e91d'] translate-x-[-0.5px];
}
.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
  @apply content-['\e924'] translate-x-[0.5px];
}
.swiper-lot-arrow {
  @apply size-6 border border-white text-white rounded-lg bg-black/50 hover:bg-black active:bg-brand-base/50;
  &.swiper-button-disabled {
    @apply !pointer-events-auto;
  }
}
.swiper-lots-arrow {
  @apply relative z-10 h-[38px] w-[38px] bg-mist-lighter rounded-md border border-[#EEEEEE] shadow-theme-grey-main after:text-lg leading-none text-raven-base hover:text-brand-dark active:text-brand-darker disabled:text-raven-lighter disabled:pointer-events-none;
}
.swiper-lots-arrow-prev {
  @apply left-[unset] transform-none;
}
.swiper-lots-arrow-next {
  @apply right-[unset] transform-none;
}
.swiper-pagination-fraction {
  @apply relative w-fit bottom-[unset] top-[unset] left-[unset] right-[unset] text-brand-base text-[15px] leading-[28px] font-bold;
  .swiper-pagination-current {
    @apply text-steel-darker text-[24px] leading-[35px];
  }
}
.single-lot-swiper-pagination-fraction:not(
    .single-hot-offer .single-lot-swiper-pagination-fraction
  ) {
  .swiper-pagination-current {
    @apply text-[24px] leading-[35px];
  }
}
.swiper-button-lock {
  @apply !flex pointer-events-none;
}
.swiper-pagination-lock {
  @apply !block pointer-events-none;
}
.swiper-lots:not(.swiper-lots-offer) {
  > .swiper-wrapper {
    @apply gap-3 lg:gap-4;
    > .swiper-slide {
      @apply flex-shrink;
    }
  }
  &.swiper-initialized {
    > .swiper-wrapper {
      @apply gap-0;
      > .swiper-slide {
        @apply lg:opacity-0 transition-opacity duration-300 flex-shrink-0;
        &.swiper-slide-visible {
          @apply opacity-100 transition-opacity duration-300;
        }
      }
    }
  }
}

.swiper-lots-offer {
  &.swiper-initialized {
    .swiper-slide {
      @apply lg:opacity-0 transition-opacity duration-300;
      &.swiper-slide-visible,
      &.swiper-slide-visible ~ .swiper-slide {
        @apply opacity-100 transition-opacity duration-300;
      }
    }
    .swiper-wrapper {
      @apply gap-0;
    }
  }
}

.swiper-autos-compare {
  .swiper-slide {
    @apply xl:w-[37.96%];
    &.swiper-slide-next {
      @apply xl:w-[47.99%];
    }
  }
}

.navigation-slider-2 {
  --swiper-pagination-bullet-inactive-color: #EAF0F3;
  --swiper-pagination-color: #0E598A;
  --swiper-pagination-bullet-width: 6px;
  --swiper-pagination-bullet-height: 6px;
  --swiper-pagination-bullet-border-radius: 20px;
}

.navigation-slider-2-arrow {
  filter: drop-shadow(0 4px 13px rgba(51, 51, 51, 0.05));
  @apply size-[38px] flex-none flex items-center justify-center rounded-full bg-[#0E598B];
  &.swiper-button-disabled {
    @apply !pointer-events-auto bg-mist-dark;
  }
}
/* .navigation-slider-2-arrow-prev {} */
.navigation-slider-2-pagination {
  @apply !w-auto;
}
/* .navigation-slider-2-arrow-next {} */

.swiper-pagination {
  @apply relative;
}
.in-compare .swiper-pagination {
    @apply absolute;
}
/* LightGallery */
.lg-sub-html {
  @apply text-raven-base;
}
.lg-backdrop,
.lg-outer .lg-thumb-outer {
  @apply bg-steel-lighter;
}
.lg-toolbar .lg-icon,
.lg-next,
.lg-prev {
  @apply text-brand-base;
}

.lg-toolbar .lg-icon:hover,
.lg-next:hover,
.lg-prev:hover {
  @apply !text-brand-dark;
}
.lg-toolbar .lg-icon:active,
.lg-next:active,
.lg-prev:active {
  @apply !text-brand-darker;
}

.lg-counter {
  @apply text-raven-base;
}

.lg-image {
  @apply rounded-md;
}
.lg-outer .lg-thumb-item.active,
.lg-outer .lg-thumb-item:hover {
  @apply border-brand-base;
}
.lg-next,
.lg-prev {
  @apply bg-transparent;
}


/* Zoomist */
.zoomist-container {
  --zoomist-zoomer-icon-color: rgb(212 46 91);
  --zoomist-zoomer-icon-color-hover: rgb(163 0 57);
  --zoomist-slider-bar-color: rgb(163 0 57);
  --zoomist-slider-track-color: #f584ab;
  --zoomist-slider-track-color-hover: #f584ab;
  --zoomist-slider-bar-color-hover: rgb(163 0 57);
  --zoomist-zoomer-button-size: 36px;
}
@media (min-width: 640px) {
  .zoomist-container {
    --zoomist-zoomer-button-size: 48px;
  }
}

.zoomist-slider {
  @apply py-3 rounded-br-xl bg-transparent;
}

.zoomist-zoomer {
  @apply rounded-bl-xl;
}

.css-tippy-shipping {
  [data-tippy-root] {
    @apply !bottom-5 sm:!bottom-8 w-full;
  }
}
.tippy-box {
  @apply text-steel-darker text-base bg-mist-light rounded-2xl px-5 py-3 border border-mist-darker shadow-theme-grey-main;
}

.apexcharts-series {
  @apply pointer-events-none;
}

.autocompleate.width-icon.auction img {
  @apply w-auto h-7;
}

.login-errors {
  @apply p-4 bg-red-100 rounded-lg md:rounded-xl text-red-700 mb-5;
}

.login-error_incorrect_password {
  a {
    @apply hidden;
  }
}

#search-form {
  @apply w-full;
  .ts-control {
    @apply text-[13px] leading-[22px] bg-white rounded-xl pl-3 pr-9 py-1 border-brand-base;
    background-image: none;
  }
  .ts-control > input {
    @apply placeholder:text-steel-base focus:placeholder:text-transparent;
  }
  .ts-wrapper {
    @apply w-full;
  }
  .ts-dropdown {
    @apply shadow-none md:shadow-theme-grey-main relative rounded-none md:rounded-xl;
  }
  button[type='submit'] {
    @apply absolute top-4 left-[calc(100%-52px)] -translate-y-1/2 z-10 text-steel-dark hover:text-steel-darker active:text-steel-base;
  }
}

#search.tomselected.ts-hidden-accessible {
  @apply !absolute !top-0 !left-0 !right-0;
}

.searchwp-revised-search-notice {
  @apply hidden;
}

#search-meta-all-results {
  @apply md:px-5 underline underline-offset-2 font-medium mb-2 block text-brand-base hover:text-brand-dark active:text-brand-darker text-base;
}

#search-meta-last li:not(:last-child) {
  @apply pb-2 border-b border-mist-dark;
}

.searchwp-highlight {
  @apply bg-brand-lighter text-brand-base;
}

.burger-opened {
  #dialong-webchat,
  #bingc-phone-button {
    @apply !z-0;
  }
}

.lot-gallery-thumb .swiper-slide {
  width: 25%;
}

.invoice.zero,
.payment.zero {
  @apply hidden opacity-30;
}

.notice.initial_registration {
  @apply text-red-700;
}

.hero-bg {
  --hero-offset-down: -40px;
  --hero-url: url('../img/landing-hero.jpg');
  --hero-linear-gradient: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0) 58.15%,
    #fff 85.9%
  );
  background-image: var(--hero-linear-gradient), var(--hero-url);
  background-position:
    center,
    center var(--hero-offset-down);
  background-repeat: no-repeat;
  background-size: contain, cover;
}
@media (min-resolution: 192dpi) {
  .hero-bg {
    --hero-url: url('../img/landing-hero@2x.jpg');
  }
}
@media screen and (min-width: 640px) {
  .hero-bg {
    --hero-url: url('../img/landing-hero-lg.jpg');
    --hero-offset-down: -30px;
  }
}
@media screen and (min-width: 640px) and (min-resolution: 192dpi) {
  .hero-bg {
    --hero-url: url('../img/landing-hero-lg@2x.jpg');
  }
}
@media screen and (min-width: 640px) {
  .hero-bg {
    --hero-offset-down: center;
  }
}
@media screen and (min-width: 1280px) {
  .hero-bg {
    --hero-offset-down: 30%;
  }
}

.single-hot-offer {
  padding-bottom: 132px;
}

main:has(aside.transition-all) {
  @apply lg:z-auto;
}

aside.transition-all {
  @apply lg:z-50;
}

.wp-caption {
  width: 100% !important;
}

.retro-car-page .acf-description,
.retro-car-page .acf-retro-cars {
  @apply 2xl:px-7;
}

#modal-form-await .input textarea {
  @apply h-24;
}

/* TODO: remove to HTML/Tailwind */
.btn-need-pass {
  font-size: 1rem;
  line-height: 1.25rem;
  height: auto;
  width: auto;
  border-radius: 0;
  text-decoration: underline;
  padding: 0;
  font-weight: 500
}

@media (max-width: 1023px) {
  .password-req-content {
    margin-top: -50px;
  }
}

.form_process-item {
    width: 100%;
    padding: 12px 16px;
    position: relative;
    background: #F3F3F3;
    color: #4D4D4D;
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    border: 1px solid #D6D6D6;
    border-radius: 65px;
    outline: none;
    @apply placeholder:text-[#9E9E9E] placeholder-shown:border-[#E7E7E7] focus:ring-0;
}
.form_process-item.white {
    background-color: #fff;
}

    /* Hover */
.form_process-item:hover {
    background-color: #fff;
    border-color: #CFCFCF;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.08);
}

/* Focus */
.form_process-item:focus {
    border: 1px dashed #D42E5B;
}


.text-bold-red--custom span[style*="font-weight: bold"] {
    color:#FA1654;
}


.page-template-page-landing .btn-accent-lg:focus {
    border-color: #FF5180;
    border-width: 2px;
}

.btn-accent-land {
  @apply flex gap-2.5 justify-center items-center px-8 pt-2.5 pb-3 bg-[#ca3363] shadow-[0_2px_8px_0_rgba(0,0,0,.12)] rounded-full text-[15px] text-white uppercase font-medium transition;
  &.loading {
    @apply pointer-events-none text-transparent before:text-white before:font-icon before:absolute before:left-1/2 before:-ml-[10px] before:inline-block before:animate-spin before:text-xl before:font-normal before:content-['\e922'];
  }
}


.btn-accent-land:hover {
  box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.25);
}

.btn-white-land {
  @apply flex gap-2.5 justify-center items-center px-8 pt-2.5 pb-3 bg-white shadow-[0_2px_8px_0_rgba(0,0,0,.12)] rounded-full text-[15px] text-[#ca3363] uppercase font-medium transition;
  &.loading {
    @apply pointer-events-none text-transparent before:text-white before:font-icon before:absolute before:left-1/2 before:-ml-[10px] before:inline-block before:animate-spin before:text-xl before:font-normal before:content-['\e922'];
  }
}

.btn-white-land:hover {
  box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.25), 0px 2px 8px rgba(0, 0, 0, 0.12);
}
.btn-white-land svg {
  transition: 500ms ease-in width;
}
.btn-white-land:hover svg{
  width: 0px;
}

/* .btn-accent-land:active {
  border: 2px solid #FF5180;
} */


/* ===============================
   СООБЩЕНИЕ ПОД ПОЛЕМ (динамически добавляется JS)
================================ */
.description {
    display: none;
    font-size: 0.875rem;
    margin-top: 4px;
    transition: color 0.3s ease;
}

/* при ошибке */
.form_process-item.error {
    background: linear-gradient(
            135deg,
            rgba(139, 0, 0, 0.25) 0%,
            rgba(139, 0, 0, 0.15) 100%
    );
    border: 1px solid rgba(139, 0, 0, 0.3);
    box-shadow:
            inset 0 1px 1px rgba(139, 0, 0, 0.2),
            0 4px 20px rgba(0, 0, 0, 0.15);
}

/* при успехе */
.form_process-item.success {
    background: linear-gradient(
            135deg,
            rgba(0, 128, 0, 0.25) 0%,
            rgba(0, 128, 0, 0.15) 100%
    );
    border: 1px solid rgba(0, 128, 0, 0.3);
    box-shadow:
            inset 0 1px 1px rgba(0, 128, 0, 0.2),
            0 4px 20px rgba(0, 0, 0, 0.15);
}

/* Цвет текста описания в зависимости от состояния */
.description.error {
    display: block;
    color: rgb(255, 0, 0);
}

.description.success {
    display: block;
    color: rgb(0, 200, 0);
}


@media screen and (min-width: 768px) {
    .banner-section-wrap--modified::before {
        background-color: transparent;
        z-index: -2;
    }

    .banner-section-wrap--modified:after {
       content: "";
        z-index: -1;
        @apply absolute top-0 left-0 w-screen h-full;
        margin-left: calc(-50vw + 50%);
    }
    .section-main:before {
        display: none;
    }
    .banner-section-wrap:before {
        @apply relative z-0;
        content: "";
        @apply absolute top-0 left-0 h-full;
        width: 73vw;
        margin-left: calc(-50vw + 50%);
        z-index: -1;
        background-color: #D42E5B;
    }

    .section-main:before {
        width: 88vw;
    }
}



@media screen and (min-width: 768px) {

    .form-process {
        background: linear-gradient(87.17deg, rgba(255, 255, 255, 0.25) 3.24%, rgba(255, 255, 255, 0.1) 67.11%);
        backdrop-filter: blur(12px) saturate(180%);
        -webkit-backdrop-filter: blur(12px) saturate(180%);
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
        border: 1px solid rgba(255, 255, 255, 0.3);
    }
}

.car {
  @apply w-80 relative mb-5 md:ml-7;
}

.car.car-rev-active {
  animation: car-rev 1.5s ease-in-out;
}

.car.car-rev-active .tire {
  animation: tire-spin 1.5s ease-in-out;
}

@keyframes car-rev {
  0%, 100% {
    transform: translateY(0) rotate(0deg);
  }
  25% {
    transform: translateY(0) rotate(-0.5deg);
  }
  50% {
    transform: translateY(1px) rotate(-0.8deg);
  }
  75% {
    transform: translateY(0) rotate(-0.5deg);
  }
}

.tire-wrap {
  @apply flex justify-between pr-[38px] pl-[35px] -mt-10;
}

.tire {
  @apply w-12;
  transform-origin: center;
}

@keyframes tire-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.VideoAutoplay iframe {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Partners listing category buttons - hover only on non-touch devices */
@media (hover: hover) and (pointer: fine) {
  .partner-category-btn:not([data-active="true"]):hover {
    @apply border-blue-base text-blue-base;
  }
}

/* Google Maps InfoWindow - compact styling */
.gm-style-iw-c {
  padding: 0 !important;
}
.gm-style-iw-d {
  overflow: hidden !important;
}
.gm-style-iw-chr {
	z-index: 999;
	position: relative;
	height: 14px;
}
.gm-style-iw-chr button {
	position: absolute;
	z-index: 9999 !important;
	overflow: visible;
	right: -8px;
	top: -4px;
	display: flex;
	align-items: center;
	justify-content: center;
	height: fit-content !important;
	width: fit-content !important;
}
.gm-style-iw-chr button span {
  width: 14px !important;
  height: 14px !important;
}

/* Truncate with hover expand overlay */
.truncate-hover {
  position: relative;
}
.truncate-hover__text {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
@media (min-width: 768px) {
  .truncate-hover {
    min-height: 1lh;
  }
  .truncate-hover__text {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
  }
  .truncate-hover:hover .truncate-hover__text {
    overflow: visible;
    white-space: normal;
    text-overflow: unset;
    z-index: 10;
    background: white;
    padding-bottom: 8px;
    border-radius: 4px;
    mask-image: linear-gradient(to bottom, black calc(100% - 12px), transparent);
    -webkit-mask-image: linear-gradient(to bottom, black calc(100% - 12px), transparent);
  }
}

.lots-3 {
  .facetwp-selections ul {
    @apply gap-2;
  }
  .facetwp-selection-value {
    @apply py-[5px] px-4 text-[18px];
  }
}