
/*! tailwindcss v4.1.5 | MIT License | https://tailwindcss.com */
@layer properties {
    @supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))) {

        *,
        :before,
        :after,
        ::backdrop {
            --tw-translate-x: 0;
            --tw-translate-y: 0;
            --tw-translate-z: 0;
            --tw-rotate-x: initial;
            --tw-rotate-y: initial;
            --tw-rotate-z: initial;
            --tw-skew-x: initial;
            --tw-skew-y: initial;
            --tw-space-y-reverse: 0;
            --tw-space-x-reverse: 0;
            --tw-border-style: solid;
            --tw-leading: initial;
            --tw-font-weight: initial;
            --tw-outline-style: solid;
            --tw-blur: initial;
            --tw-brightness: initial;
            --tw-contrast: initial;
            --tw-grayscale: initial;
            --tw-hue-rotate: initial;
            --tw-invert: initial;
            --tw-opacity: initial;
            --tw-saturate: initial;
            --tw-sepia: initial;
            --tw-drop-shadow: initial;
            --tw-drop-shadow-color: initial;
            --tw-drop-shadow-alpha: 100%;
            --tw-drop-shadow-size: initial;
            --tw-backdrop-blur: initial;
            --tw-backdrop-brightness: initial;
            --tw-backdrop-contrast: initial;
            --tw-backdrop-grayscale: initial;
            --tw-backdrop-hue-rotate: initial;
            --tw-backdrop-invert: initial;
            --tw-backdrop-opacity: initial;
            --tw-backdrop-saturate: initial;
            --tw-backdrop-sepia: initial;
            --tw-duration: initial;
            --tw-ease: initial
        }
    }
}

@layer theme,
base,
components,
utilities;

:root,
:host {
    --container-md: 28rem;
    --container-lg: 32rem;
    --container-xl: 36rem;
    --blur-sm: 8px;
    --default-transition-duration: .15s;
    --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}

:root {
    --border-radius-0: 0;
    --border-radius-1: 8px;
    --border-radius-2: 16px;
    --border-radius-3: 24px;
    --border-radius-4: 32px;
    --border-radius-5: 40px;
    --border-radius-0-25: 2px;
    --border-radius-0-5: 4px;
    --border-radius-1-5: 12px;
    --border-width-0: 0;
    --border-width-1: 8px;
    --border-width-0-1: 1px;
    --border-width-0-25: 2px;
    --border-width-0-5: 4px;
    --media-query-sm: 360px;
    --media-query-md: 840px;
    --media-query-lg: 1200px;
    --media-query-xl: 1500px;
    --media-query-xxl: 1720px;
    --color-neutral-70: #fff;
    --color-neutral-80: #f5f6f7;
    --color-neutral-90: #cfd4dd;
    --color-neutral-100: #8994a9;
    --color-neutral-110: #5e6a82;
    --color-neutral-120: #3c4453;
    --color-neutral-130: #1a1d23;
    --color-feedback-success-80: #def9cc;
    --color-feedback-success-90: #8ce563;
    --color-feedback-success-100: #24a148;
    --color-feedback-success-110: #197b35;
    --color-feedback-success-120: #105323;
    --color-feedback-error-80: #fff5f5;
    --color-feedback-error-90: #f48787;
    --color-feedback-error-100: #e22828;
    --color-feedback-error-110: #901111;
    --color-feedback-error-120: #3b0505;
    --color-feedback-attention-80: #fff7e0;
    --color-feedback-attention-90: #ffe19a;
    --color-feedback-attention-100: #f9af27;
    --color-feedback-attention-110: #7b5613;
    --color-feedback-attention-120: #3c2a09;
    --color-feedback-info-80: #e1f9ff;
    --color-feedback-info-90: #9ce6f9;
    --color-feedback-info-100: #28b5d9;
    --color-feedback-info-110: #14596b;
    --color-feedback-info-120: #0a2b34;
    --color-primary-70: #fff3e6;
    --color-primary-80: #ffe1bf;
    --color-primary-90: #ffbb73;
    --color-primary-100: #f28000;
    --color-primary-110: #df7400;
    --color-primary-120: #cb6700;
    --color-primary-130: #b35a00;
    --color-secondary-70: #f0e6ff;
    --color-secondary-80: #c599ff;
    --color-secondary-90: #994dfa;
    --color-secondary-100: #6e0ad6;
    --color-secondary-110: #5c08b2;
    --color-secondary-120: #49078f;
    --color-secondary-130: #37056b;
    --color-gradient-pro: linear-gradient(90deg, #37056b, #6e0ad6);
    --elevation-1: 8;
    --elevation-2: 16;
    --elevation-3: 24;
    --elevation-4: 32;
    --elevation-5: 40;
    --elevation-deep: -9999;
    --font-size-2: 16px;
    --font-size-3: 24px;
    --font-size-4: 32px;
    --font-size-5: 40px;
    --font-size-6: 48px;
    --font-size-7: 56px;
    --font-size-8: 64px;
    --font-size-1-25: 10px;
    --font-size-1-5: 12px;
    --font-size-1-75: 14px;
    --font-size-2-25: 18px;
    --font-size-2-5: 20px;
    --font-weight-bold: 700;
    --font-weight-semibold: 600;
    --font-weight-medium: 500;
    --font-weight-regular: 400;
    --font-weight-light: 300;
    --line-height-supertight: 1;
    --line-height-tight: 1.15;
    --line-height-medium: 1.32;
    --line-height-distant: 1.4;
    --line-height-superdistant: 1.5;
    --opacity-0: 0;
    --opacity-8: .08;
    --opacity-16: .16;
    --opacity-32: .32;
    --opacity-64: .64;
    --opacity-80: .8;
    --opacity-100: 1;
    --shadow-none: 0;
    --shadow-top-1: 0px -1px 1px #00000029;
    --shadow-top-3: 0px -3px 4px #00000029;
    --shadow-top-6: 0px -6px 10px #00000029;
    --shadow-top-9: 0px -9px 12px #00000029;
    --shadow-top-12: 0px -12px 17px #00000029;
    --shadow-bottom-1: 0px 1px 1px #00000029;
    --shadow-bottom-3: 0px 3px 4px #00000029;
    --shadow-bottom-6: 0px 6px 10px #00000029;
    --shadow-bottom-9: 0px 9px 12px #00000029;
    --shadow-bottom-12: 0px 12px 17px #00000029;
    --spacing-1: 8px;
    --spacing-2: 16px;
    --spacing-3: 24px;
    --spacing-4: 32px;
    --spacing-5: 40px;
    --spacing-6: 48px;
    --spacing-7: 56px;
    --spacing-8: 64px;
    --spacing-9: 72px;
    --spacing-10: 80px;
    --spacing-0-25: 2px;
    --spacing-0-5: 4px;
    --spacing-1-5: 12px;
    --spots-background-circle: var(--color-secondary-70);
    --spots-background-triangle: var(--color-feedback-success-120);
    --spots-background-square: var(--color-primary-70);
    --spots-background-neutral: var(--color-neutral-70);
    --spots-color-circle: var(--color-secondary-100);
    --spots-color-triangle: var(--color-feedback-success-90);
    --spots-color-square: var(--color-primary-100);
    --spots-color-neutral: var(--color-neutral-90);
    --spots-border-color-default: var(--color-neutral-130);
    --spots-border-color-neutral: var(--color-neutral-100);
    --tab-font-color-default: #1a1d23;
    --tab-font-color-hover: #5c08b2;
    --tab-font-color-pressed: #37056b;
    --tab-font-color-disabled: #8994a9;
    --tab-border-color-default: #cfd4dd;
    --tab-border-color-hover: #5c08b2;
    --tab-border-color-pressed: #37056b;
    --tab-border-color-disabled: #f5f6f7;
    --tab-background-color-disabled: #f5f6f7;
    --transition-delay-1: .1s;
    --transition-delay-2: .2s;
    --transition-delay-3: .3s;
    --transition-delay-4: .4s;
    --transition-delay-5: .5s;
    --transition-timing-ease: cubic-bezier(.25, .1, .25, 1);
    --transition-timing-ease-in: cubic-bezier(.42, 0, 1, 1);
    --transition-timing-ease-out: cubic-bezier(0, 0, .58, 1);
    --transition-timing-ease-in-out: cubic-bezier(.42, 0, .58, 1);
    --transition-duration-1: .1s;
    --transition-duration-2: .2s;
    --transition-duration-3: .3s;
    --transition-duration-4: .4s;
    --transition-duration-5: .5s;
    --transition-repetition-2: 2;
    --transition-repetition-3: 3;
    --transition-repetition-infinite: infinite;
    --button-primary-font-color-default: #fff;
    --button-primary-background-color-default: #f28000;
    --button-primary-background-color-hover: #df7400;
    --button-primary-background-color-pressed: #cb6700;
    --button-primary-border-color-default: #f28000;
    --button-primary-border-color-hover: #df7400;
    --button-primary-border-color-pressed: #cb6700;
    --button-secondary-font-color-default: #cb6700;
    --button-secondary-background-color-default: #fff3e6;
    --button-secondary-background-color-hover: #ffe1bf;
    --button-secondary-background-color-pressed: #ffbb73;
    --button-secondary-border-color-default: #fff3e6;
    --button-secondary-border-color-hover: #ffe1bf;
    --button-secondary-border-color-pressed: #ffbb73;
    --button-tertiary-font-color-default: #f28000;
    --button-tertiary-background-color-default: #fff;
    --button-tertiary-background-color-hover: #fff3e6;
    --button-tertiary-background-color-pressed: #ffe1bf;
    --button-tertiary-border-color-default: #f28000;
    --button-tertiary-border-color-hover: #fff3e6;
    --button-tertiary-border-color-pressed: #ffe1bf;
    --button-danger-font-color-default: #fff;
    --button-danger-background-color-default: #e22828;
    --button-danger-background-color-hover: #901111;
    --button-danger-background-color-pressed: #3b0505;
    --button-danger-border-color-default: #e22828;
    --button-danger-border-color-hover: #901111;
    --button-danger-border-color-pressed: #3b0505;
    --button-neutral-font-color-default: #1a1d23;
    --button-neutral-background-color-default: #fff;
    --button-neutral-background-color-hover: #f5f6f7;
    --button-neutral-background-color-pressed: #cfd4dd;
    --button-neutral-border-color-default: #3c4453;
    --button-neutral-border-color-hover: #3c4453;
    --button-neutral-border-color-pressed: #3c4453;
    --button-link-font-color-default: #6e0ad6;
    --button-link-background-color-default: transparent;
    --button-link-background-color-hover: #f0e6ff;
    --button-link-background-color-pressed: #c599ff;
    --button-link-border-color-default: transparent;
    --button-link-border-color-hover: #f0e6ff;
    --button-link-border-color-pressed: #c599ff;
    --button-disabled-background-color-default: #f5f6f7;
    --button-disabled-font-color-default: #8994a9;
    --button-disabled-border-color-default: #f5f6f7;
    --button-border-radius: 40px;
    --checkbox-radiobutton-unchecked-border-color-hover: #f0e6ff;
    --checkbox-radiobutton-unchecked-background-color-hover: #f0e6ff;
    --checkbox-radiobutton-checked-border-color-default: #fff;
    --checkbox-radiobutton-checked-border-color-hover: #f0e6ff;
    --checkbox-radiobutton-checked-background-color-default: #fff;
    --checkbox-radiobutton-checked-background-color-hover: #f0e6ff;
    --checkbox-radiobutton-input-checked-border-color-default: #6e0ad6;
    --checkbox-radiobutton-input-checked-background-color-default: #6e0ad6;
    --checkbox-radiobutton-input-checked-background-color-hover: #5c08b2;
    --checkbox-radiobutton-border-radius: 8px;
    --chip-border-radius: 40px;
    --chip-border-color-default: #cfd4dd;
    --chip-border-color-hover: #6e0ad6;
    --chip-border-color-selected: #6e0ad6;
    --chip-border-color-disabled: #f5f6f7;
    --chip-background-color-default: #fff;
    --chip-background-color-hover: #f5f6f7;
    --chip-background-color-selected: #f0e6ff;
    --chip-background-color-disabled: #f5f6f7;
    --chip-font-color-default: #1a1d23;
    --chip-font-color-hover: #6e0ad6;
    --chip-font-color-selected: #6e0ad6;
    --chip-font-color-disabled: #8994a9;
    --input-textarea-border-color-selected: #6e0ad6;
    --input-textarea-border-radius: 8px;
    --link-main-color-default: #6e0ad6;
    --link-main-color-hover: #5c08b2;
    --link-main-color-active: #49078f;
    --link-grey-color-default: #1a1d23;
    --link-grey-color-hover: #6e0ad6;
    --link-grey-color-active: #5c08b2;
    --link-inverted-color-default: #fff;
    --link-inverted-color-hover: #c599ff;
    --link-inverted-color-active: #f0e6ff;
    --link-gap: 4px;
    --pagination-radius-default: 40px;
    --pagination-background-color-default: #fff;
    --pagination-background-color-selected: #6e0ad6;
    --pagination-background-color-hover: #f5f6f7;
    --pagination-background-color-pressed: #cfd4dd;
    --pagination-background-color-disabled: #f5f6f7;
    --pagination-font-color-default: #1a1d23;
    --pagination-font-color-selected: #fff3e6;
    --pagination-font-color-hover: #1a1d23;
    --pagination-font-color-pressed: #1a1d23;
    --pagination-font-color-disabled: #8994a9;
    --spinner-background-color-default: #6e0ad6;
    --toggleswitch-checked-background-color-default: #6e0ad6;
    --toggleswitch-checked-background-color-hover: #5c08b2;
    --font-family-primary: "Nunito Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    --font-family-secondary: "Nunito Sans", "Helvetica Neue", Helvetica, Arial, sans-serif
}

*,
:after,
:before,
::backdrop {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0
}

::file-selector-button {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0
}

html,
:host {
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    line-height: 1.5;
    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent
}

hr {
    height: 0;
    color: inherit;
    border-top-width: 1px
}

abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: inherit;
    font-weight: inherit
}

a {
    color: inherit;
    -webkit-text-decoration: inherit;
    -webkit-text-decoration: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit
}

b,
strong {
    font-weight: bolder
}

code,
kbd,
samp,
pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em
}

small {
    font-size: 80%
}

sub,
sup {
    vertical-align: baseline;
    font-size: 75%;
    line-height: 0;
    position: relative
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse
}

:-moz-focusring {
    outline: auto
}

progress {
    vertical-align: baseline
}

summary {
    display: list-item
}

ol,
ul,
menu {
    list-style: none
}

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
    vertical-align: middle;
    display: block
}

img,
video {
    max-width: 100%;
    height: auto
}

button,
input,
select,
optgroup,
textarea {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0
}

::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0
}

:where(select:is([multiple], [size])) optgroup {
    font-weight: bolder
}

:where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px
}

::file-selector-button {
    margin-inline-end: 4px
}

::placeholder {
    opacity: 1
}

@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px) {
    ::placeholder {
        color: currentColor
    }

    @supports (color:color-mix(in lab, red, red)) {
        ::placeholder {
            color: color-mix(in oklab, currentcolor 50%, transparent)
        }
    }
}

textarea {
    resize: vertical
}

::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit
}

::-webkit-datetime-edit {
    display: inline-flex
}

::-webkit-datetime-edit-fields-wrapper {
    padding: 0
}

::-webkit-datetime-edit {
    padding-block: 0
}

::-webkit-datetime-edit-year-field {
    padding-block: 0
}

::-webkit-datetime-edit-month-field {
    padding-block: 0
}

::-webkit-datetime-edit-day-field {
    padding-block: 0
}

::-webkit-datetime-edit-hour-field {
    padding-block: 0
}

::-webkit-datetime-edit-minute-field {
    padding-block: 0
}

::-webkit-datetime-edit-second-field {
    padding-block: 0
}

::-webkit-datetime-edit-millisecond-field {
    padding-block: 0
}

::-webkit-datetime-edit-meridiem-field {
    padding-block: 0
}

:-moz-ui-invalid {
    box-shadow: none
}

button,
input:where([type=button], [type=reset], [type=submit]) {
    appearance: button
}

::file-selector-button {
    appearance: button
}

::-webkit-inner-spin-button {
    height: auto
}

::-webkit-outer-spin-button {
    height: auto
}

[hidden]:where(:not([hidden=until-found])) {
    display: none !important
}

*,
:after,
:before {
    box-sizing: border-box;
    font-display: swap;
    font-family: var(--font-family-primary);
    -webkit-font-smoothing: antialiased
}

ol[class],
ul[class] {
    padding: 0
}

blockquote,
body,
dd,
dl,
figure,
h1,
h2,
h3,
h4,
p {
    margin: 0
}

ol[role=list],
ul[role=list] {
    list-style: none
}

html:focus-within {
    scroll-behavior: smooth
}

body {
    min-height: 100vh;
    text-rendering: optimizeSpeed;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.5
}

a:not([class]) {
    -webkit-text-decoration-skip: ink;
    -webkit-text-decoration-skip-ink: auto;
    text-decoration-skip-ink: auto
}

img,
picture {
    max-width: 100%;
    display: block
}

button,
input,
select,
textarea {
    font: inherit
}

[type=button],
[type=reset],
[type=submit],
button {
    -webkit-appearance: button
}

[type=button]::-moz-focus-inner {
    border-style: none;
    padding: 0
}

[type=reset]::-moz-focus-inner {
    border-style: none;
    padding: 0
}

[type=submit]::-moz-focus-inner {
    border-style: none;
    padding: 0
}

button::-moz-focus-inner {
    border-style: none;
    padding: 0
}

[type=button]:-moz-focusring {
    outline: 1px dotted buttontext
}

[type=reset]:-moz-focusring {
    outline: 1px dotted buttontext
}

[type=submit]:-moz-focusring {
    outline: 1px dotted buttontext
}

button:-moz-focusring {
    outline: 1px dotted buttontext
}

@media (prefers-reduced-motion:reduce) {
    html:focus-within {
        scroll-behavior: auto
    }

    *,
    :after,
    :before {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important
    }
}

legend {
    padding: 0;
    display: table
}

fieldset {
    border: 0;
    min-width: 0;
    margin: 0;
    padding: .01em 0 0
}

body:not(:-moz-handler-blocked) fieldset {
    display: table-cell
}

@media (min-width:360px) {
    .container {
        max-width: 360px
    }
}

@media (min-width:840px) {
    .container {
        max-width: 840px
    }
}

@media (min-width:1200px) {
    .container {
        max-width: 1200px
    }
}

@media (min-width:1500px) {
    .container {
        max-width: 1500px
    }
}

@media (min-width:1720px) {
    .container {
        max-width: 1720px
    }
}

.typo-display-large {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-5);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-tight)
}

@media (min-width:840px) {
    .typo-display-large {
        font-size: var(--font-size-8)
    }
}

.typo-display-medium {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-4);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-tight)
}

@media (min-width:840px) {
    .typo-display-medium {
        font-size: var(--font-size-6)
    }
}

.typo-title-large {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-3);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-medium)
}

@media (min-width:840px) {
    .typo-title-large {
        font-size: var(--font-size-5)
    }
}

.typo-title-medium {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-2-5);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-medium)
}

@media (min-width:840px) {
    .typo-title-medium {
        font-size: var(--font-size-3)
    }
}

.typo-title-small {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-2-25);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-medium)
}

@media (min-width:840px) {
    .typo-title-small {
        font-size: var(--font-size-2-5)
    }
}

.typo-subtitle-large {
    font-family: var(--font-family-secondary);
    font-size: var(--font-size-2-5);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-medium)
}

@media (min-width:840px) {
    .typo-subtitle-large {
        font-size: var(--font-size-3)
    }
}

.typo-subtitle-medium {
    font-family: var(--font-family-secondary);
    font-size: var(--font-size-2-25);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-medium)
}

@media (min-width:840px) {
    .typo-subtitle-medium {
        font-size: var(--font-size-2-5)
    }
}

.typo-body-large {
    font-size: var(--font-size-2-25)
}

.typo-body-large,
.typo-body-medium {
    font-family: var(--font-family-secondary);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-superdistant)
}

.typo-body-medium {
    font-size: var(--font-size-2)
}

.typo-body-small {
    font-size: var(--font-size-1-75);
    line-height: var(--line-height-distant)
}

.typo-body-small,
.typo-caption {
    font-family: var(--font-family-secondary);
    font-weight: var(--font-weight-regular)
}

.typo-caption {
    font-size: var(--font-size-1-5);
    line-height: var(--line-height-medium)
}

.typo-overline {
    font-family: var(--font-family-secondary);
    font-size: var(--font-size-1-25);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-supertight)
}

.olx-core-alertbox {
    background-color: var(--alertbox-background-color);
    border-radius: var(--alertbox-radius);
    color: var(--alertbox-font-color);
    align-items: flex-start;
    gap: var(--alertbox-gap);
    padding: var(--alertbox-padding-vertical)var(--alertbox-padding-horizontal);
    display: flex;
    overflow: hidden
}

.olx-core-alertbox__content {
    width: 100%
}

.olx-core-alertbox__link-title {
    margin-bottom: var(--spacing-2)
}

.olx-core-alertbox__link-container {
    margin-bottom: var(--spacing-1)
}

.olx-core-alertbox__link--default {
    color: var(--alertbox-default-font-color) !important
}

.olx-core-alertbox__link--error {
    color: var(--alertbox-error-font-color) !important
}

.olx-core-alertbox__link--success {
    color: var(--alertbox-success-font-color) !important
}

.olx-core-alertbox__link--warning {
    color: var(--alertbox-warning-font-color) !important
}

.olx-core-alertbox__link--information {
    color: var(--alertbox-information-font-color) !important
}

.olx-core-alertbox__message {
    margin-bottom: var(--spacing-0-5)
}

.olx-core-alertbox__time {
    width: 100%
}

.olx-core-alertbox--default {
    --alertbox-background-color: var(--color-neutral-80);
    --alertbox-font-color: var(--color-neutral-130)
}

.olx-core-alertbox--error {
    --alertbox-background-color: var(--color-feedback-error-80);
    --alertbox-font-color: var(--color-feedback-error-110)
}

.olx-core-alertbox--success {
    --alertbox-background-color: var(--color-feedback-success-80);
    --alertbox-font-color: var(--color-feedback-success-110)
}

.olx-core-alertbox--warning {
    --alertbox-background-color: var(--color-feedback-attention-80);
    --alertbox-font-color: var(--color-feedback-attention-110)
}

.olx-core-alertbox--information {
    --alertbox-background-color: var(--color-feedback-info-80);
    --alertbox-font-color: var(--color-feedback-info-110)
}

.olx-core-alertbox {
    --alertbox-padding-vertical: var(--spacing-2);
    --alertbox-padding-horizontal: var(--spacing-3);
    --alertbox-gap: var(--spacing-2);
    --alertbox-radius: var(--border-radius-1)
}

.olx-core-button {
    background-color: var(--button-background-color-default);
    border-radius: var(--button-border-radius);
    box-shadow: inset 0 0 0 var(--border-width-0-1)var(--button-border-color-default);
    color: var(--button-font-color-default);
    cursor: pointer;
    font-family: var(--font-family-secondary);
    font-size: var(--button-font-size);
    font-weight: var(--font-weight-semibold);
    gap: var(--spacing-1);
    line-height: var(--button-line-height);
    padding: var(--button-padding);
    white-space: nowrap;
    border: none;
    justify-content: center;
    place-items: center;
    text-decoration: none;
    display: inline-flex
}

.olx-core-button--primary {
    --button-background-color-default: var(--button-primary-background-color-default);
    --button-font-color-default: var(--button-primary-font-color-default);
    --button-border-color-default: var(--button-primary-border-color-default);
    --button-background-color-hover: var(--button-primary-background-color-hover);
    --button-border-color-hover: var(--button-primary-border-color-hover);
    --button-background-color-pressed: var(--button-primary-background-color-pressed);
    --button-border-color-pressed: var(--button-primary-border-color-pressed)
}

.olx-core-button--secondary {
    --button-background-color-default: var(--button-secondary-background-color-default);
    --button-font-color-default: var(--button-secondary-font-color-default);
    --button-border-color-default: var(--button-secondary-border-color-default);
    --button-background-color-hover: var(--button-secondary-background-color-hover);
    --button-border-color-hover: var(--button-secondary-border-color-hover);
    --button-background-color-pressed: var(--button-secondary-background-color-pressed);
    --button-border-color-pressed: var(--button-secondary-border-color-pressed)
}

.olx-core-button--tertiary {
    --button-background-color-default: var(--button-tertiary-background-color-default);
    --button-font-color-default: var(--button-tertiary-font-color-default);
    --button-border-color-default: var(--button-tertiary-border-color-default);
    --button-background-color-hover: var(--button-tertiary-background-color-hover);
    --button-border-color-hover: var(--button-tertiary-border-color-hover);
    --button-background-color-pressed: var(--button-tertiary-background-color-pressed);
    --button-border-color-pressed: var(--button-tertiary-border-color-pressed)
}

.olx-core-button--danger {
    --button-background-color-default: var(--button-danger-background-color-default);
    --button-font-color-default: var(--button-danger-font-color-default);
    --button-border-color-default: var(--button-danger-border-color-default);
    --button-background-color-hover: var(--button-danger-background-color-hover);
    --button-border-color-hover: var(--button-danger-border-color-hover);
    --button-background-color-pressed: var(--button-danger-background-color-pressed);
    --button-border-color-pressed: var(--button-danger-border-color-pressed)
}

.olx-core-button--neutral {
    --button-background-color-default: var(--button-neutral-background-color-default);
    --button-font-color-default: var(--button-neutral-font-color-default);
    --button-border-color-default: var(--button-neutral-border-color-default);
    --button-background-color-hover: var(--button-neutral-background-color-hover);
    --button-border-color-hover: var(--button-neutral-border-color-hover);
    --button-background-color-pressed: var(--button-neutral-background-color-pressed);
    --button-border-color-pressed: var(--button-neutral-border-color-pressed)
}

.olx-core-button--link {
    --button-background-color-default: var(--button-link-background-color-default);
    --button-font-color-default: var(--button-link-font-color-default);
    --button-border-color-default: var(--button-link-border-color-default);
    --button-background-color-hover: var(--button-link-background-color-hover);
    --button-border-color-hover: var(--button-link-border-color-hover);
    --button-background-color-pressed: var(--button-link-background-color-pressed);
    --button-border-color-pressed: var(--button-link-border-color-pressed)
}

.olx-core-button--small {
    --button-padding: var(--spacing-1)var(--spacing-2);
    --button-font-size: var(--font-size-1-75);
    --button-line-height: var(--line-height-distant);
    height: 32px
}

.olx-core-button--medium {
    --button-padding: var(--spacing-1-5)var(--spacing-3);
    --button-font-size: var(--font-size-2);
    --button-line-height: var(--line-height-superdistant);
    height: 48px
}

.olx-core-button--large {
    --button-padding: var(--spacing-2)var(--spacing-3);
    --button-font-size: var(--font-size-2);
    --button-line-height: var(--line-height-superdistant);
    height: 56px
}

.olx-core-button--only-icon.olx-core-button--small {
    --button-padding: var(--spacing-1)
}

.olx-core-button--only-icon.olx-core-button--medium {
    --button-padding: var(--spacing-1-5)
}

.olx-core-button--only-icon.olx-core-button--large {
    --button-padding: var(--spacing-2)
}

.olx-core-button:focus-visible {
    outline: solid 2px var(--color-neutral-130);
    outline-offset: 2px
}

.olx-core-button:not(:hover) {
    transition: transform var(--transition-duration-2)var(--transition-timing-ease-in), background-color var(--transition-duration-2)var(--transition-timing-ease-in)
}

.olx-core-button:active:not(.olx-core-button--disabled),
.olx-core-button:not(:active) {
    transition: transform var(--transition-duration-1)var(--transition-timing-ease-in), background-color var(--transition-duration-1)var(--transition-timing-ease-in)
}

.olx-core-button:active:not(.olx-core-button--disabled) {
    background-color: var(--button-background-color-pressed);
    box-shadow: inset 0 0 0 var(--border-width-0-1)var(--button-border-color-pressed);
    transform: scale(.96)
}

.olx-core-button:hover:not(:active, .olx-core-button--disabled) {
    background-color: var(--button-background-color-hover);
    box-shadow: inset 0 0 0 var(--border-width-0-1)var(--button-border-color-hover)
}

.olx-core-button--disabled,
.olx-core-button--disabled:active,
.olx-core-button--disabled:hover {
    background-color: var(--button-disabled-background-color-default);
    box-shadow: inset 0 0 0 2px var(--button-disabled-border-color-default);
    color: var(--button-disabled-font-color-default);
    cursor: not-allowed
}

.olx-core-spinner {
    color: var(--spinner-background-color-default);
    animation: 1s linear infinite spin
}

.olx-core-spinner--xsmall {
    height: var(--spacing-2);
    width: var(--spacing-2)
}

.olx-core-spinner--small {
    height: var(--spacing-3);
    width: var(--spacing-3)
}

.olx-core-spinner--medium {
    height: var(--spacing-4);
    width: var(--spacing-4)
}

.olx-core-spinner--large {
    height: var(--spacing-6);
    width: var(--spacing-6)
}

.olx-core-spinner--xlarge {
    height: var(--spacing-7);
    width: var(--spacing-7)
}

.olx-core-spinner--huge {
    height: var(--spacing-9);
    width: var(--spacing-9)
}

.olx-core-link {
    color: var(--link-color);
    cursor: pointer;
    font-family: var(--font-family-secondary);
    font-size: var(--font-size);
    font-weight: var(--font-weight-semibold);
    align-items: center;
    gap: var(--link-gap);
    line-height: var(--font-lineheight);
    transition: color var(--transition-duration-3)var(--transition-timing-ease);
    outline: none;
    justify-content: center;
    text-decoration: none;
    display: inline-flex
}

.olx-core-link--main {
    --link-color: var(--link-main-color-default);
    --link-color-hover: var(--link-main-color-hover);
    --link-color-active: var(--link-main-color-active)
}

.olx-core-link--grey {
    --link-color: var(--link-grey-color-default);
    --link-color-hover: var(--link-grey-color-hover);
    --link-color-active: var(--link-grey-color-active)
}

.olx-core-link--inverted {
    --link-color: var(--link-inverted-color-default);
    --link-color-hover: var(--link-inverted-color-hover);
    --link-color-active: var(--link-inverted-color-active)
}

.olx-core-link--caption {
    --font-size: var(--font-size-1-5);
    --font-lineheight: var(--line-height-medium)
}

.olx-core-link--small {
    --font-size: var(--font-size-1-75);
    --font-lineheight: var(--line-height-distant)
}

.olx-core-link--medium {
    --font-size: var(--font-size-2);
    --font-lineheight: var(--line-height-superdistant)
}

.olx-core-link--large {
    --font-size: var(--font-size-2-25);
    --font-lineheight: var(--line-height-superdistant)
}

.olx-core-link:hover {
    color: var(--link-color-hover);
    text-decoration: underline
}

.olx-core-link:focus-visible {
    border-radius: var(--border-radius-0-5);
    outline: solid 2px var(--color-neutral-130);
    outline-offset: 2px
}

.olx-core-link:active:not(:hover) {
    color: var(--link-color-active)
}

.olx-core-link--underline {
    text-decoration: underline
}

.olx-core-link--underline:hover {
    text-decoration: none
}

.olx-core-form-character-counter {
    margin-left: auto
}

.olx-core-form-caption,
.olx-core-form-character-counter,
.olx-core-form-error,
.olx-core-form-label {
    font-family: var(--font-family-secondary);
    font-size: var(--font-size-1-5);
    font-weight: var(--font-weight-regular)
}

.olx-core-form-label {
    font-size: var(--font-size-2)
}

.olx-core-form-label--disabled {
    opacity: var(--opacity-32)
}

.olx-core-form-error {
    color: var(--color-feedback-error-100);
    gap: var(--spacing-0-5);
    display: flex
}

.olx-core-form-caption,
.olx-core-form-character-counter {
    color: var(--color-neutral-120)
}

.olx-core-form-root {
    row-gap: var(--spacing-1);
    flex-direction: column;
    display: flex
}

.olx-core-toggle-switch {
    --toggleswitch-unchecked-background-color-default: var(--color-neutral-90);
    --toggleswitch-unchecked-background-color-hover: var(--color-neutral-100);
    appearance: none;
    background-color: var(--toggleswitch-unchecked-background-color-default);
    border-radius: var(--border-radius-4);
    cursor: pointer;
    min-width: 52px;
    height: 32px;
    padding: var(--spacing-0-5);
    transition: background-color .15s var(--transition-timing-ease-out), transform .15s var(--transition-timing-ease-out);
    outline: none;
    margin: 0;
    position: relative
}

.olx-core-toggle-switch:disabled {
    cursor: not-allowed;
    opacity: var(--opacity-32)
}

.olx-core-toggle-switch:focus-visible {
    outline: var(--border-width-0-25)solid var(--color-neutral-130);
    outline-offset: var(--border-width-0-25)
}

.olx-core-toggle-switch:before {
    background-color: var(--color-neutral-70);
    border-radius: var(--border-radius-4);
    content: "";
    width: 24px;
    height: 24px;
    transition: inherit;
    display: block
}

.olx-core-toggle-switch:after {
    content: "";
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M3.02 8.313a.5.5 0 0 0-.707.707l3.333 3.333a.5.5 0 0 0 .707 0l7.333-7.333a.5.5 0 0 0-.707-.707L6 11.293z'/%3E%3C/svg%3E"), url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='m8.707 8 3.646 3.646a.5.5 0 1 1-.707.707L8 8.707l-3.646 3.646a.5.5 0 1 1-.707-.707L7.293 8 3.646 4.354a.5.5 0 0 1 .707-.707L8 7.293l3.646-3.646a.5.5 0 1 1 .707.707z'/%3E%3C/svg%3E");
    background-position: 4px, right 4px center;
    background-repeat: no-repeat, no-repeat;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0
}

.olx-core-toggle-switch:checked {
    background-color: var(--toggleswitch-checked-background-color-default)
}

.olx-core-toggle-switch:checked:before {
    transform: translate(20px)
}

.olx-core-toggle-switch:not(:checked, :disabled):hover {
    background-color: var(--toggleswitch-unchecked-background-color-hover)
}

.olx-core-toggle-switch:checked:not(:disabled):hover {
    background-color: var(--toggleswitch-checked-background-color-hover)
}

.olx-core-loading-button {
    position: relative
}

.olx-core-loading-button__spinner-root {
    display: flex;
    position: absolute
}

.olx-core-loading-button__content--invisible {
    visibility: hidden
}

.olx-core-input-textarea-element {
    border-radius: var(--input-textarea-border-radius);
    box-shadow: var(--input-textarea-box-shadow);
    color: var(--color-neutral-130);
    font-family: var(--font-family-secondary);
    padding: var(--spacing-1-5)var(--spacing-2);
    transition: box-shadow var(--transition-duration-3)var(--transition-timing-ease);
    --input-textarea-box-shadow: inset 0 0 0 var(--border-width-0-1)var(--color-neutral-90);
    --input-textarea-box-shadow-hover: inset 0 0 0 var(--border-width-0-25)var(--color-neutral-90);
    --input-textarea-background-color: var(--color-neutral-70);
    background-color: var(--input-textarea-background-color);
    border: none;
    outline: none;
    width: 100%
}

.olx-core-input-textarea-element--filled {
    --input-textarea-box-shadow: inset 0 0 0 var(--border-width-0-1)var(--color-neutral-130);
    --input-textarea-box-shadow-hover: inset 0 0 0 var(--border-width-0-25)var(--color-neutral-130)
}

.olx-core-input-textarea-element--success {
    --input-textarea-box-shadow: inset 0 0 0 var(--border-width-0-1)var(--color-feedback-success-100);
    --input-textarea-box-shadow-hover: inset 0 0 0 var(--border-width-0-25)var(--color-feedback-success-100);
    --input-textarea-background-color: var(--color-neutral-70)
}

.olx-core-input-textarea-element--error {
    --input-textarea-box-shadow: inset 0 0 0 var(--border-width-0-1)var(--color-feedback-error-100);
    --input-textarea-box-shadow-hover: inset 0 0 0 var(--border-width-0-25)var(--color-feedback-error-100);
    --input-textarea-background-color: var(--color-feedback-error-80)
}

.olx-core-input-textarea-element::placeholder {
    color: var(--color-neutral-100)
}

.olx-core-input-textarea-element:disabled {
    --input-textarea-box-shadow: transparent;
    --input-textarea-box-shadow-hover: transparent;
    --input-textarea-background-color: var(--color-neutral-80)
}

.olx-core-input-textarea-element:hover {
    --input-textarea-box-shadow: var(--input-textarea-box-shadow-hover)
}

.olx-core-input-textarea-element:focus-within {
    --input-textarea-box-shadow: inset 0 0 0 var(--border-width-0-25)var(--input-textarea-border-color-selected)
}

.olx-core-input-textarea-root {
    align-items: center;
    width: 100%;
    display: flex;
    position: relative
}

.olx-core-input-textarea-root:has(.olx-core-input-textarea-left) .olx-core-input-textarea-element {
    padding-left: 40px
}

.olx-core-input-textarea-root:has(.olx-core-input-textarea-right) .olx-core-input-textarea-element {
    padding-right: 40px
}

.olx-core-input-textarea-left,
.olx-core-input-textarea-right {
    pointer-events: none;
    justify-content: center;
    align-items: center;
    width: 48px;
    height: 48px;
    display: flex;
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

.olx-core-input-textarea-left {
    left: 0
}

.olx-core-input-textarea-right {
    right: 0
}

.olx-core-input-password {
    color: var(--color-neutral-130);
    cursor: pointer;
    pointer-events: auto;
    background-color: #0000;
    border: none;
    justify-content: center;
    align-items: center;
    width: 44px;
    height: 44px;
    display: flex
}

.olx-core-input-password:focus-visible {
    border-radius: var(--border-radius-0-5);
    outline: solid 2px var(--color-neutral-130)
}

.olx-core-textarea-element {
    font-size: var(--font-size-2);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-distant);
    resize: none
}

.olx-core-checkbox-radio__input {
    appearance: none;
    cursor: pointer;
    min-width: 24px;
    height: 24px;
    transition: transform var(--transition-duration-2)var(--transition-timing-ease-in);
    width: 24px;
    margin: 0;
    position: relative
}

.olx-core-checkbox-radio__input:before {
    background-color: var(--checkbox-radiobutton-input-background-color);
    box-shadow: var(--checkbox-radiobutton-input-border);
    content: "";
    height: 20px;
    transition: background-color var(--transition-duration-2)var(--transition-timing-ease-in);
    width: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.olx-core-checkbox-radio__input:focus-visible {
    outline: solid 2px var(--color-neutral-130);
    outline-offset: 2px
}

.olx-core-checkbox-radio__input:not(:disabled):active {
    transform: scale(.96)
}

.olx-core-checkbox-radio__input:not(:disabled):checked:before {
    background: center no-repeat var(--checkbox-radiobutton-input-background-color)url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' fill='none'%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M11.709.79a.996.996 0 0 0-1.406 0L3.969 7.108 1.697 4.842a.996.996 0 0 0-1.406 0 .99.99 0 0 0 0 1.402L3.264 9.21a1 1 0 0 0 1.178.17 1 1 0 0 0 .237-.175l7.029-7.012a.99.99 0 0 0 0-1.402z'/%3E%3C/svg%3E")
}

.olx-core-checkbox-radio__root {
    background-color: var(--checkbox-radiobutton-background-color);
    border: 1px solid var(--checkbox-radiobutton-border-color);
    color: var(--color-neutral-130);
    cursor: pointer;
    font-family: var(--font-family-secondary);
    gap: var(--spacing-1);
    transition: opacity var(--transition-duration-2)var(--transition-timing-ease-in), background-color var(--transition-duration-2)var(--transition-timing-ease-in);
    --checkbox-radiobutton-input-border: inset 0 0 0 var(--border-width-0-1)var(--color-neutral-90);
    --checkbox-radiobutton-border-color: var(--color-neutral-70);
    --checkbox-radiobutton-input-background-color: var(--color-neutral-70);
    --checkbox-radiobutton-unchecked-background-color-default: var(--color-neutral-70);
    display: inline-flex
}

.olx-core-checkbox-radio__root--card {
    --checkbox-radiobutton-background-color: var(--checkbox-radiobutton-unchecked-background-color-default);
    border-radius: var(--checkbox-radiobutton-border-radius);
    padding: var(--spacing-1)var(--spacing-2)
}

.olx-core-checkbox-radio__root--card:hover {
    --checkbox-radiobutton-background-color: var(--checkbox-radiobutton-unchecked-background-color-hover)
}

.olx-core-checkbox-radio__root--card.olx-core-checkbox-radio__root--disabled {
    --checkbox-radiobutton-background-color: var(--color-neutral-80)
}

.olx-core-checkbox-radio__root--card.olx-core-checkbox-radio__root--error {
    --checkbox-radiobutton-border-color: var(--color-feedback-error-100);
    --checkbox-radiobutton-background-color: var(--checkbox-radiobutton-unchecked-background-color-default)
}

.olx-core-checkbox-radio__root--card:has(.olx-core-checkbox-radio__input:checked:not(:disabled)) {
    --checkbox-radiobutton-background-color: var(--checkbox-radiobutton-checked-background-color-default)
}

.olx-core-checkbox-radio__root--card:has(.olx-core-checkbox-radio__input:checked:not(:disabled)).olx-core-checkbox-radio__root--error {
    --checkbox-radiobutton-border-color: var(--checkbox-radiobutton-checked-border-color-default)
}

.olx-core-checkbox-radio__root--card:hover:has(.olx-core-checkbox-radio__input:checked:not(:disabled)) {
    --checkbox-radiobutton-background-color: var(--checkbox-radiobutton-checked-background-color-hover)
}

.olx-core-checkbox-radio__root--card:hover:has(.olx-core-checkbox-radio__input:checked:not(:disabled)).olx-core-checkbox-radio__root--error {
    --checkbox-radiobutton-background-color: var(--checkbox-radiobutton-checked-border-color-hover)
}

.olx-core-checkbox-radio__root:hover {
    --checkbox-radiobutton-input-background-color: var(--color-neutral-80)
}

.olx-core-checkbox-radio__root:has(.olx-core-checkbox-radio__input:checked:not(:disabled)) {
    --checkbox-radiobutton-input-border: inset 0 0 0 var(--border-width-0-1)var(--checkbox-radiobutton-input-checked-border-color-default);
    --checkbox-radiobutton-input-background-color: var(--checkbox-radiobutton-input-checked-background-color-default)
}

.olx-core-checkbox-radio__root.olx-core-checkbox-radio__root--error {
    --checkbox-radiobutton-input-background-color: var(--color-feedback-error-80);
    --checkbox-radiobutton-input-border: inset 0 0 0 var(--border-width-0-1)var(--color-feedback-error-100)
}

.olx-core-checkbox-radio__root--disabled {
    cursor: not-allowed;
    opacity: var(--opacity-64)
}

.olx-core-checkbox-radio__root:hover:has(.olx-core-checkbox-radio__input:checked:not(:disabled)) {
    --checkbox-radiobutton-input-background-color: var(--checkbox-radiobutton-input-checked-background-color-hover)
}

.olx-core-checkbox-radio__root:active .olx-core-checkbox-radio__input {
    transform: scale(.96)
}

.olx-core-checkbox__input:before,
.olx-core-checkbox__input:focus-visible {
    border-radius: var(--border-radius-0-25)
}

.olx-core-radio__input:before,
.olx-core-radio__input:focus-visible {
    border-radius: 50%
}

.olx-core-tooltip,
.olx-core-tooltip__reference-wrapper {
    width: auto
}

.olx-core-tooltip__content {
    background-color: var(--color-neutral-70);
    border-radius: var(--border-radius-1);
    box-shadow: var(--shadow-bottom-6);
    -moz-column-gap: var(--spacing-2);
    column-gap: var(--spacing-2);
    font-family: var(--font-family-secondary);
    padding: var(--spacing-2);
    transition-property: opacity;
    display: flex;
    position: relative
}

.olx-core-tooltip__content[data-status=close],
.olx-core-tooltip__content[data-status=open] {
    transition-duration: var(--transition-duration-3)
}

.olx-core-tooltip__content[data-status=close],
.olx-core-tooltip__content[data-status=initial] {
    opacity: var(--opacity-0)
}

.olx-core-tooltip__content--secondary {
    background-color: var(--color-neutral-120)
}

.olx-core-tooltip__title {
    font-weight: var(--font-weight-bold)
}

.olx-core-tooltip__arrow,
.olx-core-tooltip__close-button,
.olx-core-tooltip__content,
.olx-core-tooltip__content-wrapper,
.olx-core-tooltip__description,
.olx-core-tooltip__title {
    z-index: var(--elevation-4)
}

.olx-core-tooltip__content-wrapper {
    row-gap: var(--spacing-0-25)
}

.olx-core-tooltip__close-button {
    border-radius: var(--border-radius-1);
    color: var(--color-neutral-130);
    cursor: pointer;
    background-color: #0000;
    border: none;
    justify-content: center;
    align-items: center;
    width: 44px;
    height: 44px;
    margin-left: auto;
    padding: 0;
    display: flex
}

.olx-core-tooltip__close-button--secondary {
    color: var(--color-neutral-70)
}

.olx-core-tooltip__close-button:focus-visible {
    outline: var(--color-neutral-130)solid var(--border-width-0-25);
    outline-offset: var(--border-width-0-25)
}

.olx-core-tooltip__close-button--secondary:focus-visible {
    outline-color: var(--color-neutral-70)
}

.olx-core-tooltip__arrow {
    fill: var(--color-neutral-70)
}

.olx-core-tooltip__arrow--secondary {
    fill: var(--color-neutral-120)
}

.olx-core-tooltip__description,
.olx-core-tooltip__title {
    color: var(--color-neutral-130);
    font-size: var(--font-size-1-75);
    line-height: var(--line-height-distant)
}

.olx-core-tooltip__description--secondary,
.olx-core-tooltip__title--secondary {
    color: var(--color-neutral-70)
}

.olx-core-carousel {
    position: relative;
    overflow: visible
}

.olx-core-carousel__viewport {
    overflow: hidden
}

.olx-core-carousel__container {
    display: flex
}

.olx-core-carousel__item {
    margin: 0 var(--spacing-0-5);
    -webkit-user-select: none;
    user-select: none
}

.olx-core-carousel__next,
.olx-core-carousel__prev {
    width: 40px;
    height: 40px
}

.olx-core-carousel__next--hide[aria-disabled=true],
.olx-core-carousel__prev--hide[aria-disabled=true] {
    display: none
}

.olx-core-carousel__prev--floating {
    position: absolute;
    top: 50%;
    left: 0;
    translate: -50% -50%
}

.olx-core-carousel__next--floating {
    position: absolute;
    top: 50%;
    right: 0;
    translate: 50% -50%
}

.olx-core-carousel__progress {
    --olx-core-carousel-height: var(--spacing-1);
    --olx-core-carousel-width: var(--spacing-6);
    --olx-core-carousel-autoplay-delay: 0s;
    --olx-core-carousel-color: var(--color-primary-100);
    --olx-core-carousel-background: var(--color-neutral-90);
    padding: var(--spacing-1)0;
    flex-flow: row;
    justify-content: center;
    display: flex;
    overflow: hidden
}

.olx-core-carousel__progress-item {
    background-color: var(--olx-core-carousel-background);
    border-radius: var(--border-radius-0-5);
    box-sizing: border-box;
    height: var(--olx-core-carousel-height);
    margin: 0 var(--spacing-0-5);
    width: var(--olx-core-carousel-width);
    border: none;
    padding: 0;
    position: relative;
    overflow: hidden
}

.olx-core-carousel__progress-item[data-state=previous] {
    background-color: var(--olx-core-carousel-color)
}

.olx-core-carousel__progress-item[data-state=current]:after {
    animation: olx-core-carousel-grow var(--olx-core-carousel-autoplay-delay)both;
    background-color: var(--olx-core-carousel-color);
    content: "";
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.olx-core-carousel__progress button {
    cursor: pointer
}

.olx-core-carousel__progress[data-state=stoped] .olx-core-carousel__progress-item[data-state=current]:after {
    animation-duration: 0s
}

.olx-core-carousel__progress[data-state=paused] .olx-core-carousel__progress-item[data-state=current]:after {
    animation-play-state: paused
}

.olx-core-pagination {
    align-items: center;
    gap: var(--spacing-0-5);
    display: flex
}

.olx-core-pagination__button {
    background: var(--pagination-background-color-default);
    border-radius: var(--pagination-radius-default);
    color: var(--pagination-font-color-default);
    cursor: pointer;
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    height: 44px;
    line-height: var(--line-height-superdistant);
    transition: background var(--transition-duration-1)var(--transition-timing-ease-in);
    border: none;
    justify-content: center;
    align-items: center;
    width: 44px;
    display: flex
}

.olx-core-pagination__button:hover {
    background: var(--pagination-background-color-hover);
    color: var(--pagination-font-color-hover)
}

.olx-core-pagination__button:active {
    background: var(--pagination-background-color-pressed);
    color: var(--pagination-font-color-pressed)
}

.olx-core-pagination__button:focus-visible {
    border: var(--border-width-0-25)solid var(--color-neutral-130);
    border-radius: var(--pagination-radius-default);
    outline: none
}

.olx-core-pagination__button--active,
.olx-core-pagination__button--active:hover {
    background: var(--pagination-background-color-selected);
    color: var(--pagination-font-color-selected)
}

.olx-core-pagination__icon {
    background: var(--pagination-background-color-default);
    border-radius: var(--pagination-radius-default);
    color: var(--pagination-font-color-default);
    cursor: pointer;
    height: 44px;
    transition: color var(--transition-duration-1)var(--transition-timing-ease-in);
    border: none;
    justify-content: center;
    align-items: center;
    width: 44px;
    padding: 0;
    display: flex
}

.olx-core-pagination__icon:hover {
    background: var(--pagination-background-color-hover);
    color: var(--pagination-font-color-hover)
}

.olx-core-pagination__icon:active {
    background: var(--pagination-background-color-pressed);
    color: var(--pagination-font-color-pressed)
}

.olx-core-pagination__icon:focus-visible {
    border: var(--border-width-0-25)solid var(--color-neutral-130);
    border-radius: var(--pagination-radius-default);
    outline: none
}

.olx-core-pagination__icon--disappear {
    display: none
}

.olx-core-pagination--disabled .olx-core-pagination__button,
.olx-core-pagination--disabled .olx-core-pagination__icon,
.olx-core-pagination__icon--disabled {
    background-color: var(--pagination-background-color-disabled);
    color: var(--pagination-font-color-disabled);
    pointer-events: none
}

.olx-core-chip {
    background-color: var(--chip-background-color-default);
    border-radius: var(--chip-border-radius);
    box-shadow: inset 0 0 0 var(--border-width-0-1)var(--chip-border-color-default);
    color: var(--chip-font-color-default);
    cursor: pointer;
    font-family: var(--font-family-secondary);
    font-size: var(--font-size-1-75);
    font-weight: var(--font-weight-semibold);
    gap: var(--spacing-0-5);
    line-height: var(--line-height-distant);
    padding: var(--spacing-1);
    white-space: nowrap;
    border: none;
    justify-content: center;
    place-items: center;
    text-decoration: none;
    display: inline-flex
}

.olx-core-chip:focus-visible {
    outline: solid 2px var(--color-neutral-130);
    outline-offset: 2px
}

.olx-core-chip:not(:hover) {
    transition: transform var(--transition-duration-2)var(--transition-timing-ease-in), background-color var(--transition-duration-2)var(--transition-timing-ease-in)
}

.olx-core-chip:not(:active) {
    transition: transform var(--transition-duration-1)var(--transition-timing-ease-in), background-color var(--transition-duration-1)var(--transition-timing-ease-in)
}

.olx-core-chip--selected:not(.olx-core-chip--disabled) {
    background-color: var(--chip-background-color-selected);
    box-shadow: inset 0 0 0 var(--border-width-0-1)var(--chip-border-color-selected);
    color: var(--chip-font-color-selected)
}

.olx-core-chip:hover:not(:active, .olx-core-chip--disabled) {
    background-color: var(--chip-background-color-hover);
    box-shadow: inset 0 0 0 var(--border-width-0-1)var(--chip-border-color-hover);
    color: var(--chip-font-color-hover)
}

.olx-core-chip:active:not(.olx-core-chip--disabled) {
    transition: transform var(--transition-duration-1)var(--transition-timing-ease-in);
    transform: scale(.96)
}

.olx-core-chip--disabled,
.olx-core-chip--disabled:active,
.olx-core-chip--disabled:hover {
    background-color: var(--chip-background-color-disabled);
    box-shadow: inset 0 0 0 2px var(--chip-border-color-disabled);
    color: var(--chip-font-color-disabled);
    cursor: not-allowed
}

.olx-core-chip svg {
    max-width: 16px;
    max-height: 16px
}

.olx-core-visually-hidden {
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap;
    width: 1px;
    height: 1px;
    position: absolute;
    overflow: hidden
}

.olx-core-visually-hidden:focus {
    clip: auto;
    width: auto;
    height: auto;
    position: absolute;
    overflow: auto
}

.olx-core-skeleton {
    animation: olx-core-skeleton-loading var(--transition-duration-5)var(--transition-timing-ease)var(--transition-delay-1)infinite;
    background: linear-gradient(to right, var(--color-neutral-80)0, var(--color-neutral-90)50%, var(--color-neutral-80)100%);
    background-size: 200% 100%
}

@keyframes olx-core-skeleton-loading {
    0% {
        background-position: 100% 0
    }

    to {
        background-position: -100% 0
    }
}

@keyframes olx-core-carousel-grow {
    0% {
        width: 0
    }

    to {
        width: 100%
    }
}

@keyframes shine-animation {
    0% {
        left: -150%
    }

    50% {
        left: 100%
    }

    to {
        left: 100%
    }
}

.olx-core-badge {
    background: var(--badge-background-color);
    color: var(--badge-color);
    font-family: var(--font-family-primary);
    font-weight: var(--font-weight-semibold);
    align-items: center;
    gap: var(--spacing-0-5);
    white-space: nowrap;
    display: inline-flex;
    overflow: hidden
}

.olx-core-badge--small {
    padding: 0 var(--spacing-1)
}

.olx-core-badge--medium,
.olx-core-badge--small {
    border-radius: var(--border-radius-0-5);
    font-size: var(--font-size-1-5)
}

.olx-core-badge--medium {
    padding: var(--spacing-0-5)var(--spacing-1)
}

.olx-core-badge--large {
    border-radius: var(--border-radius-1);
    font-size: var(--font-size-1-75);
    padding: var(--spacing-1)var(--spacing-1-5)
}

.olx-core-badge--success {
    --badge-background-color: var(--color-feedback-success-80);
    --badge-color: var(--color-feedback-success-120)
}

.olx-core-badge--info {
    --badge-background-color: var(--color-feedback-info-80);
    --badge-color: var(--color-feedback-info-110)
}

.olx-core-badge--warning {
    --badge-background-color: var(--color-feedback-attention-80);
    --badge-color: var(--color-feedback-attention-110)
}

.olx-core-badge--neutral {
    --badge-background-color: var(--color-neutral-80);
    --badge-color: var(--color-neutral-130)
}

.olx-core-badge--secondary {
    --badge-background-color: var(--color-secondary-70);
    --badge-color: var(--color-secondary-100)
}

.olx-core-badge--error {
    --badge-background-color: var(--color-feedback-error-80);
    --badge-color: var(--color-feedback-error-110)
}

.olx-core-badge--gradient {
    --badge-background-color: linear-gradient(266.06deg, #f28000 3.22%, #e22828 38.77%, #6e0ad6 96.78%);
    --badge-color: #eee
}

.olx-core-badge.olx-core-badge--pro-default {
    --badge-background-color: var(--color-gradient-pro);
    --badge-color: var(--color-neutral-70);
    position: relative;
    overflow: hidden
}

.olx-core-badge.olx-core-badge--pro-default.olx-core-badge.olx-core-badge--pro-default:before {
    content: "";
    filter: blur(4px);
    background: linear-gradient(-50deg, #0000 40%, #f0e6ff99 50%, #0000 60%);
    width: 200%;
    height: 100%;
    animation: 2.5s ease-in-out .15s infinite shine-animation;
    position: absolute;
    top: 0;
    left: -150%
}

.olx-core-badge--white-border {
    outline: 1px solid #eee
}

.olx-core-badge--pill {
    border-radius: var(--border-radius-4)
}

.olx-core-badge svg {
    max-width: 16px;
    max-height: 16px
}

.olx-tabs {
    flex-direction: column;
    display: flex
}

.olx-tabs__navigation {
    border-bottom: 1px solid var(--tab-border-color-default);
    contain: layout style;
    align-items: center;
    width: 100%;
    display: flex;
    position: relative
}

.olx-tabs__scroll-button {
    background: var(--color-neutral-10);
    color: var(--tab-font-color-default);
    cursor: pointer;
    will-change: transform;
    z-index: 2;
    border: none;
    border-radius: 4px;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    padding: 0;
    transition: background-color .2s, border-color .2s, color .2s;
    display: flex;
    transform: translateZ(0)
}

.olx-tabs__scroll-button--left {
    background: linear-gradient(to right, var(--color-neutral-10)0, var(--color-neutral-10)60%, transparent 100%)
}

.olx-tabs__scroll-button--right {
    background: linear-gradient(to left, var(--color-neutral-10)0, var(--color-neutral-10)60%, transparent 100%)
}

.olx-tabs__scroll-button svg {
    pointer-events: none;
    width: 16px;
    height: 16px
}

.olx-tabs__scroll-container {
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    contain: layout style;
    will-change: scroll-position;
    flex: 1;
    overflow: auto hidden;
    transform: translateZ(0)
}

.olx-tabs__scroll-container::-webkit-scrollbar {
    display: none
}

.olx-tabs__scroll-container--scrollable {
    position: relative
}

.olx-tabs__scroll-container--scrollable:after,
.olx-tabs__scroll-container--scrollable:before {
    content: "";
    pointer-events: none;
    z-index: 1;
    width: 20px;
    transition: opacity .3s;
    position: absolute;
    top: 0;
    bottom: 0
}

.olx-tabs__tablist {
    contain: layout style;
    -webkit-overflow-scrolling: touch;
    flex-direction: row;
    gap: 0;
    min-width: min-content;
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex
}

.olx-tabs__tab {
    background: var(--tab-background-color-default, transparent);
    color: var(--tab-font-color-default);
    cursor: pointer;
    white-space: nowrap;
    will-change: background-color, border-color, color;
    border: none;
    border-bottom: 1px solid #0000;
    border-radius: 0;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    gap: .5rem;
    min-width: max-content;
    padding: .75rem 1rem;
    font-family: inherit;
    font-size: .875rem;
    font-weight: 500;
    line-height: 1.25rem;
    text-decoration: none;
    transition: background-color .2s, border-color .2s, color .2s;
    display: flex;
    transform: translateZ(0)
}

.olx-tabs__tab:focus {
    outline: 1px solid var(--tab-border-color-hover);
    outline-offset: 1px
}

.olx-tabs__tab:hover:not(.olx-tabs__tab--disabled) {
    background: var(--tab-background-color-hover);
    border-bottom-color: var(--tab-border-color-hover);
    color: var(--tab-font-color-hover)
}

.olx-tabs__tab:focus:not(:focus-visible) {
    outline: none
}

.olx-tabs__tab--active,
.olx-tabs__tab:active:not(.olx-tabs__tab--disabled) {
    background: var(--tab-background-color-pressed);
    border-bottom-color: var(--tab-border-color-pressed);
    color: var(--tab-font-color-pressed)
}

.olx-tabs__tab--active {
    font-weight: 600
}

.olx-tabs__tab--disabled {
    background: var(--tab-background-color-disabled);
    border-bottom-color: var(--tab-border-color-disabled);
    color: var(--tab-font-color-disabled);
    cursor: not-allowed;
    opacity: .6
}

.olx-tabs__tab-icon {
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    width: 1rem;
    height: 1rem;
    display: flex
}

.olx-tabs__tab-label {
    text-align: center;
    flex: 1
}

.olx-tabs__panels {
    contain: layout style;
    margin-top: 1rem
}

.olx-tabs__tabpanel {
    display: none
}

.olx-tabs__tabpanel--selected {
    display: block
}

@media (max-width:768px) {
    .olx-tabs__scroll-button {
        width: 36px;
        height: 36px
    }

    .olx-tabs__scroll-button--left {
        margin-right: 4px
    }

    .olx-tabs__scroll-button--right {
        margin-left: 4px
    }

    .olx-tabs__scroll-button svg {
        width: 14px;
        height: 14px
    }

    .olx-tabs__tab {
        gap: .375rem;
        padding: .5rem .75rem;
        font-size: .75rem
    }

    .olx-tabs__tablist {
        gap: 0;
        padding: 0
    }
}

@media (prefers-reduced-motion:reduce) {

    .olx-tabs__scroll-button,
    .olx-tabs__scroll-container,
    .olx-tabs__tab {
        scroll-behavior: auto;
        transition: none
    }

    .olx-tabs__scroll-button,
    .olx-tabs__tab {
        will-change: auto
    }
}

@media (prefers-contrast:high) {
    .olx-tabs__navigation {
        border-bottom-width: 1px
    }

    .olx-tabs__scroll-button {
        border-width: 1px
    }

    .olx-tabs__tab {
        border-bottom-width: 1px
    }
}

@media print {
    .olx-tabs__scroll-button {
        display: none
    }

    .olx-tabs__scroll-container {
        overflow: visible
    }

    .olx-tabs__tablist {
        flex-wrap: wrap
    }
}

.olx-button {
    background-color: var(--button-background-color);
    border-color: var(--button-border);
    border-radius: var(--border-radius-4);
    border-style: solid;
    border-width: var(--border-width-0-1);
    color: var(--button-color-font);
    cursor: pointer;
    font-family: var(--font-family-primary);
    font-size: var(--button-font-size);
    font-weight: var(--font-weight-semibold);
    height: var(--button-height);
    line-height: var(--button-line-height);
    min-width: 72px;
    padding: var(--button-padding);
    -webkit-text-decoration: initial;
    -webkit-text-decoration: initial;
    text-decoration: initial;
    outline: none;
    justify-content: center;
    align-items: center;
    width: fit-content;
    display: inline-flex;
    position: relative
}

.olx-button--fullwidth {
    width: 100%
}

.olx-button--a {
    text-decoration: none
}

.olx-button:active {
    transform: scale(.96)
}

.olx-button:active,
.olx-button:not(:active) {
    transition: all var(--transition-duration-1)var(--transition-timing-ease-in)0s, outline 0s, outline-offset 0s
}

.olx-button:not(:hover) {
    transition: all var(--transition-duration-2)var(--transition-timing-ease-in)0s, outline 0s, outline-offset 0s
}

.olx-button:focus {
    outline: var(--color-neutral-130)solid var(--border-width-0-25);
    outline-offset: var(--border-width-0-25);
    transition: outline, outline-offset
}

.olx-button:not(.olx-button--disabled):hover {
    background-color: var(--button-background-color-hover);
    border-color: var(--button-border-color-hover);
    transition: all var(--transition-duration-2)var(--transition-timing-ease-in)0s, outline 0s, outline-offset 0s
}

.olx-button:focus:not(:focus-visible) {
    outline-offset: 0;
    outline: none
}

.olx-button--small {
    --button-height: 32px;
    --button-padding: var(--spacing-1)var(--spacing-2);
    --button-font-size: var(--font-size-1-75);
    --button-line-height: var(--line-height-tight)
}

.olx-button--medium {
    --button-height: 40px;
    --button-padding: var(--spacing-1)var(--spacing-3);
    --button-font-size: var(--font-size-2);
    --button-line-height: var(--line-height-superdistant)
}

.olx-button--large {
    --button-height: 48px;
    --button-padding: var(--spacing-2)var(--spacing-3);
    --button-font-size: var(--font-size-2);
    --button-line-height: var(--line-height-supertight)
}

.olx-button--extra-large {
    --button-height: 64px;
    --button-padding: var(--spacing-3)var(--spacing-4);
    --button-font-size: var(--font-size-2);
    --button-line-height: var(--line-height-supertight)
}

.olx-button--primary {
    --button-background-color: var(--button-primary-background-color-base);
    --button-border: var(--button-primary-border-color-base);
    --button-color-font: var(--button-primary-color-font-base);
    --button-background-color-hover: var(--button-primary-background-color-hover);
    --button-border-color-hover: var(--button-primary-border-color-hover)
}

.olx-button--secondary {
    --button-background-color: var(--button-secondary-background-color-base);
    --button-border: var(--button-secondary-border-color-base);
    --button-color-font: var(--button-secondary-color-font-base);
    --button-background-color-hover: var(--button-secondary-background-color-hover);
    --button-border-color-hover: var(--button-secondary-border-color-hover)
}

.olx-button--secondary-inverted {
    --button-background-color: var(--button-secondary-inverted-background-color-base);
    --button-border: var(--button-secondary-inverted-border-color-base);
    --button-color-font: var(--button-secondary-inverted-color-font-base);
    --button-background-color-hover: var(--button-secondary-inverted-background-color-hover);
    --button-border-color-hover: var(--button-secondary-inverted-border-color-hover)
}

.olx-button--tertiary {
    --button-background-color: var(--button-tertiary-background-color-base);
    --button-border: var(--button-tertiary-border-color-base);
    --button-color-font: var(--button-tertiary-color-font-base);
    --button-background-color-hover: var(--button-tertiary-background-color-hover);
    --button-border-color-hover: var(--button-tertiary-border-color-hover)
}

.olx-button--link-button {
    --button-background-color: var(--button-link-button-background-color-base);
    --button-border: var(--button-link-button-border-color-base);
    --button-color-font: var(--button-link-button-color-font-base);
    --button-background-color-hover: var(--button-link-button-background-color-hover);
    --button-border-color-hover: var(--button-link-button-border-color-hover)
}

.olx-button--danger {
    --button-background-color: var(--button-danger-background-color-base);
    --button-border: var(--button-danger-border-color-base);
    --button-color-font: var(--button-danger-color-font-base);
    --button-background-color-hover: var(--button-danger-background-color-hover);
    --button-border-color-hover: var(--button-danger-border-color-hover)
}

.olx-button--neutral {
    --button-background-color: var(--button-neutral-background-color-base);
    --button-border: var(--button-neutral-border-color-base);
    --button-color-font: var(--button-neutral-color-font-base);
    --button-background-color-hover: var(--button-neutral-background-color-hover);
    --button-border-color-hover: var(--button-neutral-border-color-hover)
}

.olx-button--disabled {
    background-color: var(--button-disabled-background-color);
    border-color: var(--button-disabled-border-color);
    color: var(--button-disabled-color-font);
    cursor: not-allowed
}

.olx-button__content-wrapper {
    visibility: visible;
    justify-content: center;
    align-items: center;
    display: inline-flex
}

.olx-button__content-wrapper--loading {
    visibility: hidden
}

.olx-button__spinner {
    position: absolute
}

.olx-button__icon-wrapper {
    fill: currentColor;
    height: 24px;
    margin-right: var(--spacing-1);
    pointer-events: none;
    justify-content: center;
    align-items: center;
    width: 24px;
    display: inline-flex
}

.olx-button__icon-wrapper svg {
    width: 24px;
    height: 24px
}

.olx-button__icon-wrapper--small,
.olx-button__icon-wrapper--small svg {
    width: 16px;
    height: 16px
}

.olx-button-social--whatsapp {
    --button-background-color: var(--color-feedback-success-100);
    --button-background-color-hover: var(--color-feedback-success-110);
    --button-border: var(--color-feedback-success-100);
    --button-border-color-hover: var(--color-feedback-success-100)
}

.olx-button-social--secondary {
    --button-background-color: var(--button-secondary-background-color-base);
    --button-border: var(--color-feedback-success-100);
    --button-color-font: var(--color-feedback-success-100);
    --button-background-color-hover: var(--color-feedback-success-80);
    --button-border-color-hover: var(--color-feedback-success-80)
}

.olx-link {
    color: var(--link-color);
    cursor: pointer;
    font-family: var(--font-family-primary);
    font-size: var(--font-size);
    font-weight: var(--font-weight-semibold);
    line-height: var(--font-lineheight);
    transition: all var(--transition-duration-3)var(--transition-timing-ease);
    outline: none;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    display: inline-flex
}

.olx-link:active {
    color: var(--link-color-active)
}

.olx-link:focus {
    border-radius: var(--border-radius-0-25);
    outline: var(--border-width-0-25)solid var(--color-neutral-130)
}

.olx-link:hover {
    color: var(--link-color-hover);
    text-decoration: underline
}

.olx-link:focus:not(:focus-visible) {
    box-shadow: none;
    outline: 0
}

.olx-link--underline {
    text-decoration: underline
}

.olx-link--underline:hover {
    text-decoration: none
}

.olx-link--button {
    background: 0 0;
    border: none;
    padding: 0
}

.olx-link--caption {
    --font-size: var(--font-size-1-5);
    --font-lineheight: var(--line-height-medium)
}

.olx-link--small {
    --font-size: var(--font-size-1-75);
    --font-lineheight: var(--line-height-distant)
}

.olx-link--medium {
    --font-size: var(--font-size-2);
    --font-lineheight: var(--line-height-superdistant)
}

.olx-link--large {
    --font-size: var(--font-size-2-25);
    --font-lineheight: var(--line-height-superdistant)
}

.olx-link--main {
    --link-color: var(--link-color-main-base);
    --link-color-hover: var(--link-color-main-hover);
    --link-color-active: var(--link-color-main-active)
}

.olx-link--grey {
    --link-color: var(--link-color-grey-base);
    --link-color-hover: var(--link-color-grey-hover);
    --link-color-active: var(--link-color-grey-active)
}

.olx-link--inverted {
    --link-color: var(--link-color-inverted-base);
    --link-color-hover: var(--link-color-inverted-hover);
    --link-color-active: var(--link-color-inverted-active)
}

.olx-link__icon-wrapper {
    fill: currentColor;
    height: 24px;
    margin-left: 0;
    margin-right: var(--spacing-0-5);
    pointer-events: none;
    width: 24px
}

.olx-link__icon-wrapper--caption,
.olx-link__icon-wrapper--caption svg {
    width: 16px;
    height: 16px
}

.olx-link__icon-wrapper--right {
    margin-left: var(--spacing-0-5);
    margin-right: 0
}

.olx-link--disabled {
    color: var(--color-neutral-110);
    cursor: not-allowed;
    pointer-events: none
}

.olx-text {
    color: var(--text-color);
    font-family: var(--font-family-primary);
    font-style: normal;
    font-weight: var(--font-weight-regular);
    word-break: break-word;
    margin: 0;
    padding: 0;
    display: block
}

.olx-text--display-large {
    font-size: var(--font-size-5);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-tight)
}

@media screen and (min-width:840px) {
    .olx-text--display-large {
        font-size: var(--font-size-8)
    }
}

.olx-text--display-medium {
    font-size: var(--font-size-4);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-tight)
}

@media screen and (min-width:840px) {
    .olx-text--display-medium {
        font-size: var(--font-size-6)
    }
}

.olx-text--title-large {
    font-size: var(--font-size-3);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-medium)
}

@media screen and (min-width:840px) {
    .olx-text--title-large {
        font-size: var(--font-size-5)
    }
}

.olx-text--title-medium {
    font-size: var(--font-size-2-5);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-medium)
}

@media screen and (min-width:840px) {
    .olx-text--title-medium {
        font-size: var(--font-size-3)
    }
}

.olx-text--title-small {
    font-size: var(--font-size-2-25);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-medium)
}

@media screen and (min-width:840px) {
    .olx-text--title-small {
        font-size: var(--font-size-2-5)
    }
}

.olx-text--subtitle-large {
    font-size: var(--font-size-2-5);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-medium)
}

@media screen and (min-width:840px) {
    .olx-text--subtitle-large {
        font-size: var(--font-size-3)
    }
}

.olx-text--subtitle-medium {
    font-size: var(--font-size-2-25);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-medium)
}

@media screen and (min-width:840px) {
    .olx-text--subtitle-medium {
        font-size: var(--font-size-2-5)
    }
}

.olx-text--body-large {
    font-size: var(--font-size-2-25);
    line-height: var(--line-height-superdistant)
}

.olx-text--body-medium {
    font-size: var(--font-size-2);
    line-height: var(--line-height-superdistant)
}

.olx-text--body-small {
    font-size: var(--font-size-1-75);
    line-height: var(--line-height-distant)
}

.olx-text--caption {
    font-size: var(--font-size-1-5);
    line-height: var(--line-height-medium)
}

.olx-text--overline {
    font-size: var(--font-size-1-25);
    line-height: var(--line-height-supertight);
    text-transform: uppercase
}

.olx-text--light,
.olx-text--regular {
    font-weight: var(--font-weight-regular)
}

.olx-text--semibold {
    font-weight: var(--font-weight-semibold)
}

.olx-text--bold {
    font-weight: var(--font-weight-bold)
}

.olx-text--inline {
    display: inline
}

.olx-text--block {
    display: block
}

.olx-text--uppercase {
    text-transform: uppercase
}

.olx-text--capitalize {
    text-transform: capitalize
}

.olx-text--lowercase {
    text-transform: lowercase
}

.olx-text--italic {
    font-style: italic
}

.olx-spinner {
    color: var(--spinner-color);
    z-index: var(--elevation-4);
    animation: 1.4s linear infinite circle-spinner
}

.olx-spinner--extra-small {
    height: var(--spinner-extra-small-size);
    width: var(--spinner-extra-small-size)
}

.olx-spinner--small {
    height: var(--spinner-small-size);
    width: var(--spinner-small-size)
}

.olx-spinner--medium {
    height: var(--spinner-medium-size);
    width: var(--spinner-medium-size)
}

.olx-spinner--large {
    height: var(--spinner-large-size);
    width: var(--spinner-large-size)
}

.olx-spinner--extra-large {
    height: var(--spinner-extra-large-size);
    width: var(--spinner-extra-large-size)
}

.olx-spinner--huge {
    height: var(--spinner-huge-size);
    width: var(--spinner-huge-size)
}

@keyframes circle-spinner {
    0% {
        transform-origin: 50%
    }

    to {
        transform: rotate(1turn)
    }
}

.olx-spinner__animated {
    stroke: currentColor;
    stroke-dasharray: 80 200;
    stroke-dashoffset: 0;
    z-index: var(--elevation-4);
    animation: 1.4s ease-in-out infinite circle-stroke
}

@keyframes circle-stroke {
    0% {
        stroke-dasharray: 1 200;
        stroke-dashoffset: 0
    }

    50% {
        stroke-dasharray: 100 200;
        stroke-dashoffset: -15px
    }

    to {
        stroke-dasharray: 100 200;
        stroke-dashoffset: -125px
    }
}

.olx-chip {
    background: 0 0;
    border: 0;
    width: fit-content;
    margin: 0;
    padding: 0;
    text-decoration: none;
    display: inline-flex;
    position: relative
}

.olx-chip--input-wrapper {
    pointer-events: none
}

.olx-chip__content {
    background: var(--color-neutral-70);
    border: var(--border-width-0-1)solid var(--color-neutral-90);
    border-radius: var(--border-radius-1);
    color: var(--color-neutral-130);
    cursor: pointer;
    font-family: var(--font-family-primary);
    font-size: var(--font-size-1-75);
    font-weight: var(--font-weight-semibold);
    align-items: center;
    gap: var(--spacing-1);
    height: 36px;
    line-height: var(--line-height-distant);
    padding: var(--spacing-1);
    justify-content: center;
    display: flex
}

.olx-chip__native {
    appearance: none;
    cursor: pointer;
    opacity: 0;
    pointer-events: all;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    position: absolute
}

.olx-chip__native:disabled {
    cursor: not-allowed
}

.olx-chip:focus-visible,
input:focus-visible+.olx-chip__content {
    border-radius: var(--border-radius-1);
    outline: var(--color-neutral-130)solid var(--border-width-0-25);
    outline-offset: var(--border-width-0-25);
    transition: outline, outline-offset
}

.olx-chip__content--checked,
input:checked+.olx-chip__content {
    background-color: var(--color-secondary-70);
    border: 1px solid var(--color-secondary-130);
    color: var(--color-secondary-130)
}

.olx-chip__content:hover:not(.olx-chip__content--disabled) {
    border: var(--border-width-0-1)solid var(--color-neutral-130)
}

.olx-chip__content:active:not(.olx-chip__content--disabled),
input:active:not(:disabled)+.olx-chip__content {
    transition: all var(--transition-duration-1)var(--transition-timing-ease-in)0s, outline 0s, outline-offset 0s;
    transform: scale(.96)
}

input:hover:not(:disabled)+.olx-chip__content {
    border: var(--border-width-0-1)solid var(--color-neutral-130)
}

.olx-chip:focus {
    outline: none
}

.olx-chip__content--disabled {
    background: var(--color-neutral-80);
    border: var(--border-width-0-1)solid var(--color-neutral-80);
    color: var(--color-neutral-100);
    cursor: not-allowed
}

.olx-chip svg {
    min-width: 16px;
    max-width: 16px;
    min-height: 16px;
    max-height: 16px
}

.olx-text-input__input-container {
    background-color: var(--textinput-background-color-base);
    border-radius: var(--border-radius-0-5);
    box-shadow: 0 0 0 var(--border-width-0-1)var(--textinput-border-color-empty);
    color: var(--textinput-color-font);
    width: 100%;
    z-index: var(--elevation-1);
    border: none;
    align-items: center;
    display: inline-flex;
    position: relative
}

.olx-text-input__input-container:focus-within {
    outline: var(--border-width-0-25)solid var(--textinput-border-color-focus)
}

.olx-text-input__input-container:hover {
    box-shadow: 0 0 0 var(--border-width-0-25)var(--textinput-border-color-empty-hover)
}

.olx-text-input__input-container--hascontent {
    box-shadow: 0 0 0 var(--border-width-0-1)var(--textinput-border-color-filled)
}

.olx-text-input__input-container--hascontent:hover {
    box-shadow: 0 0 0 var(--border-width-0-25)var(--textinput-border-color-hover)
}

.olx-text-input__input-container--medium {
    border-radius: var(--border-radius-1)
}

.olx-text-input__input-container--error {
    background-color: var(--textinput-background-color-error);
    box-shadow: 0 0 0 var(--border-width-0-1)var(--textinput-border-color-error)
}

.olx-text-input__input-container--error:hover {
    box-shadow: 0 0 0 var(--border-width-0-25)var(--textinput-border-color-error)
}

.olx-text-input__input-container--success {
    background-color: var(--textinput-background-color-success);
    box-shadow: 0 0 0 var(--border-width-0-1)var(--textinput-border-color-success)
}

.olx-text-input__input-container--success:hover {
    box-shadow: 0 0 0 var(--border-width-0-25)var(--textinput-border-color-success)
}

.olx-text-input__input-container--disabled {
    background-color: var(--textinput-background-color-disabled);
    box-shadow: 0 0 0 var(--border-width-0-1)var(--textinput-border-color-disabled);
    color: var(--textinput-color-disabled);
    cursor: not-allowed
}

.olx-text-input__input-container--disabled:hover {
    box-shadow: none
}

.olx-text-input__input-field {
    background-color: inherit;
    border-radius: var(--border-radius-0-5);
    color: var(--color-neutral-130);
    font-family: var(--font-family-primary);
    font-size: var(--font-size-1-75);
    font-weight: var(--font-weight-regular);
    padding: var(--spacing-0-5)var(--spacing-1);
    border: none;
    outline: none;
    width: 100%;
    position: relative
}

.olx-text-input__input-field--medium {
    border-radius: var(--border-radius-1);
    font-size: var(--font-size-2);
    line-height: var(--line-height-distant);
    padding: var(--spacing-1-5)var(--spacing-2)
}

.olx-text-input__input-field::placeholder {
    color: var(--textinput-color-placeholder)
}

.olx-text-input__input-field :disabled {
    cursor: not-allowed
}

.olx-text-input__input-field ::-webkit-inner-spin-button {
    appearance: none
}

.olx-text-input__input-field ::-webkit-outer-spin-button {
    appearance: none
}

.olx-text-input__input-field[type=number] {
    appearance: textfield
}

.olx-text-input__input-field--disabled {
    cursor: not-allowed
}

.olx-text-input__button-password {
    color: var(--color-neutral-130);
    cursor: pointer;
    width: 44px;
    height: 44px;
    z-index: var(--elevation-1);
    background-color: #0000;
    border: none;
    justify-content: center;
    align-items: center;
    display: flex
}

.olx-text-input__button-password svg {
    width: 24px;
    height: 24px
}

.olx-text-input__button-password:focus {
    outline: none
}

.olx-text-input__button-password:focus-visible {
    border-radius: var(--border-radius-0-5);
    outline: var(--border-width-0-25)solid var(--color-neutral-130)
}

.olx-text-input__icon-wrapper {
    justify-content: center;
    align-items: center;
    min-width: 16px;
    min-height: 16px;
    display: inline-flex
}

.olx-text-input__icon-wrapper .olx-spinner {
    justify-content: center;
    align-items: center;
    display: flex
}

.olx-text-input__icon-wrapper svg {
    fill: var(--textinput-icon-color);
    width: 16px;
    height: 16px
}

.olx-text-input__icon-wrapper[data-size=medium] {
    min-width: 24px;
    min-height: 24px
}

.olx-text-input__icon-wrapper[data-size=medium] svg {
    width: 24px;
    height: 24px
}

.olx-text-input__icon-wrapper[data-position=left] {
    margin-left: var(--spacing-1)
}

.olx-text-input__icon-wrapper[data-position=left][data-size=medium] {
    margin-left: var(--spacing-2)
}

.olx-text-input__icon-wrapper[data-position=right] {
    margin-right: var(--spacing-1)
}

.olx-text-input__icon-wrapper[data-position=right][data-size=medium] {
    margin-right: var(--spacing-2)
}

.olx-text-input__icon-wrapper[data-position=right][data-type=password] {
    margin-right: var(--spacing-1)
}

.olx-text-input__limit-text {
    color: var(--color-neutral-120);
    font-size: var(--font-size-1-5);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-medium);
    margin-left: auto
}

.olx-container {
    background-color: var(--container-background-color);
    border-radius: var(--border-radius-1);
    padding: var(--spacing-2);
    overflow: hidden
}

.olx-container--outlined {
    border: var(--border-width-0-1)solid var(--container-border-color-outlined)
}

.olx-container--elevated {
    box-shadow: var(--shadow-bottom-3)
}

.olx-textarea {
    color: var(--color-neutral-130);
    position: relative
}

.olx-textarea__content {
    background-color: var(--textinput-background-color-base);
    border-radius: var(--border-radius-1);
    box-shadow: 0 0 0 var(--border-width-0-1)var(--textinput-border-color-empty);
    color: var(--textinput-color-font);
    padding: var(--spacing-1-5)var(--spacing-2);
    border: none;
    width: 100%;
    display: inline-flex
}

.olx-textarea__content:hover {
    box-shadow: 0 0 0 var(--border-width-0-25)var(--textinput-border-color-hover)
}

.olx-textarea__content:focus-within {
    outline: var(--border-width-0-25)solid var(--color-secondary-100)
}

.olx-textarea__content--hascontent {
    box-shadow: 0 0 0 var(--border-width-0-1)var(--textinput-border-color-filled)
}

.olx-textarea__content--success {
    background-color: var(--textinput-background-color-success);
    box-shadow: 0 0 0 var(--border-width-0-1)var(--textinput-border-color-success)
}

.olx-textarea__content--success:hover {
    box-shadow: 0 0 0 var(--border-width-0-25)var(--textinput-border-color-success)
}

.olx-textarea__content--success:focus-within {
    outline: var(--border-width-0-25)solid var(--textinput-border-color-success)
}

.olx-textarea__content--error {
    background-color: var(--textinput-background-color-error);
    box-shadow: 0 0 0 var(--border-width-0-1)var(--textinput-border-color-error)
}

.olx-textarea__content--error:hover {
    box-shadow: 0 0 0 var(--border-width-0-25)var(--textinput-border-color-error)
}

.olx-textarea__content--error:focus-within {
    outline: var(--border-width-0-25)solid var(--textinput-border-color-error)
}

.olx-textarea__content--disabled {
    background-color: var(--textinput-background-color-disabled);
    box-shadow: 0 0 0 var(--border-width-0-1)var(--textinput-border-color-disabled);
    cursor: not-allowed
}

.olx-textarea__content--disabled:hover {
    box-shadow: 0 0 0 var(--border-width-0-25)transparent
}

.olx-textarea__content--disabled:focus-within {
    outline: var(--border-width-0-25)solid transparent
}

.olx-textarea__content ::placeholder {
    color: var(--textinput-color-placeholder)
}

.olx-textarea__field {
    background-color: inherit;
    color: var(--textinput-color-font);
    font-family: var(--font-family-primary);
    font-size: var(--font-size-2);
    font-weight: var(--font-weight-regular);
    height: 72px;
    line-height: var(--line-height-distant);
    resize: none;
    border: none;
    outline: none;
    width: 100%;
    padding: 0
}

.olx-textarea__field--autosize {
    height: var(--spacing-3)
}

.olx-textarea__field :disabled {
    background-color: var(--textinput-background-color-disabled);
    color: var(--textinput-color-font-disabled);
    cursor: not-allowed
}

.olx-textarea__field ::-webkit-inner-spin-button {
    appearance: none
}

.olx-textarea__field ::-webkit-outer-spin-button {
    appearance: none
}

.olx-textarea__icon-wrapper {
    min-width: 24px;
    max-width: 24px;
    height: 24px;
    min-height: 24px;
    max-height: 24px;
    right: var(--spacing-1);
    justify-content: center;
    align-items: center;
    width: 24px;
    display: inline-flex;
    position: absolute
}

.olx-textarea__icon-wrapper svg {
    fill: var(--textinput-icon-color);
    width: 100%;
    height: 100%
}

.olx-textarea__limit-text {
    color: var(--color-neutral-120);
    font-size: var(--font-size-1-5);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-medium);
    padding-left: var(--spacing-1);
    margin-left: auto
}

.olx-checkbox__input-stylized {
    background-color: var(--checkbox-background-color-general);
    border-color: var(--checkbox-border-color-general);
    border-radius: var(--border-radius-0-25);
    border-style: solid;
    border-width: var(--border-width-0-1);
    color: var(--checkbox-color-icon);
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    display: flex
}

.olx-checkbox {
    --checkbox-background-color-general: transparent;
    --checkbox-border-color-general: var(--checkbox-border-color-base);
    border-radius: var(--border-radius-0-25);
    cursor: pointer;
    outline: none;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: fit-content;
    display: inline-flex
}

.olx-checkbox:active:not([aria-disabled=true]) .olx-checkbox__input-stylized {
    transform: scale(.92)
}

.olx-checkbox:hover {
    --checkbox-background-color-general: var(--checkbox-border-color-hover)
}

.olx-checkbox--checked {
    --checkbox-background-color-general: var(--checkbox-background-color-checked);
    --checkbox-border-color-general: transparent
}

.olx-checkbox--checked:hover {
    --checkbox-background-color-general: var(--checkbox-background-color-checked-hover);
    --checkbox-border-color-general: transparent
}

.olx-checkbox--checked-error,
.olx-checkbox--checked-error:hover {
    --checkbox-background-color-general: var(--checkbox-background-color-error)
}

.olx-checkbox--error,
.olx-checkbox--error:hover {
    --checkbox-border-color-general: var(--checkbox-border-color-error)
}

.olx-checkbox--error:hover,
.olx-checkbox[aria-disabled=true] {
    --checkbox-background-color-general: transparent
}

.olx-checkbox[aria-disabled=true] {
    --checkbox-border-color-general: var(--checkbox-border-color-base);
    cursor: not-allowed;
    opacity: var(--opacity-32)
}

.olx-checkbox__input-wrapper {
    border-radius: var(--border-radius-0-5);
    height: 24px;
    padding: var(--spacing-0-25);
    justify-content: center;
    align-self: flex-start;
    align-items: center;
    width: 24px;
    display: flex
}

.olx-checkbox__input-wrapper--small {
    width: 20px;
    height: 20px
}

.olx-checkbox__input-wrapper:focus-within {
    outline: var(--color-neutral-130)solid var(--border-width-0-25)
}

.olx-checkbox__label-wrapper {
    margin-left: var(--spacing-1)
}

.olx-checkbox__label-wrapper--small {
    margin-left: var(--spacing-0-5)
}

.olx-checkbox__label {
    flex: 1
}

.olx-checkbox__native-input {
    opacity: 0;
    width: 1px;
    height: 1px;
    position: absolute
}

.olx-checkbox__error-message {
    -moz-column-gap: 4px;
    margin-top: var(--spacing-0-5);
    grid-template-columns: 16px auto;
    column-gap: 4px;
    display: grid
}

.olx-checkbox__error-message,
.olx-checkbox__error-message p {
    color: var(--color-feedback-error-100)
}

.olx-checkbox__error-message--disabled,
.olx-checkbox__error-message--disabled p {
    color: var(--color-neutral-130);
    opacity: var(--opacity-32)
}

.olx-radio__stylized {
    border-color: var(--radio-border-color-general);
    border-radius: var(--border-radius-4);
    border-style: solid;
    border-width: var(--border-width-0-1);
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    display: flex
}

.olx-radio__stylized:after {
    background-color: var(--radio-background-color-general);
    border-radius: var(--border-radius-4);
    content: "";
    border-color: green;
    width: 12px;
    height: 12px
}

.olx-radio {
    --radio-background-color-general: transparent;
    --radio-border-color-general: var(--radio-border-color-base);
    cursor: pointer;
    outline: none;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: fit-content;
    display: inline-flex
}

.olx-radio:active:not([aria-disabled=true]) .olx-radio__stylized {
    transform: scale(.92)
}

.olx-radio--outline {
    border-color: var(--radio-border-color-general);
    border-radius: var(--border-radius-1);
    border-style: solid;
    border-width: var(--border-width-0-1);
    padding: var(--spacing-1)var(--spacing-2)
}

.olx-radio:hover {
    --radio-border-color-general: var(--radio-border-color-hover)
}

.olx-radio--checked {
    --radio-background-color-general: var(--radio-background-color-checked);
    --radio-border-color-general: var(--radio-border-color-checked)
}

.olx-radio--checked:hover {
    --radio-background-color-general: var(--radio-background-color-checked-hover);
    --radio-border-color-general: var(--radio-border-color-checked-hover)
}

.olx-radio--checked-error,
.olx-radio--checked-error:hover {
    --radio-background-color-general: var(--radio-background-color-error)
}

.olx-radio--error,
.olx-radio--error:hover {
    --radio-border-color-general: var(--radio-border-color-error)
}

.olx-radio[aria-disabled=true] {
    --radio-background-color-general: transparent;
    --radio-border-color-general: var(--radio-border-color-base);
    cursor: not-allowed;
    opacity: var(--opacity-32)
}

.olx-radio__content-wrapper {
    flex-direction: column;
    width: fit-content;
    display: flex
}

.olx-radio__content {
    display: flex
}

.olx-radio__input-wrapper {
    border-radius: var(--border-radius-4);
    min-width: 24px;
    max-width: 24px;
    height: 24px;
    min-height: 24px;
    max-height: 24px;
    padding: var(--spacing-0-25);
    width: 24px;
    position: relative
}

.olx-radio__input-wrapper:focus-within {
    outline: var(--color-neutral-130)solid var(--border-width-0-25)
}

.olx-radio__native {
    opacity: 0;
    width: 1px;
    height: 1px;
    position: absolute
}

.olx-radio__custom-icon {
    color: var(--color-secondary-130);
    margin-left: var(--spacing-1);
    display: flex
}

.olx-radio__custom-icon--checked svg {
    color: var(--color-secondary-100)
}

.olx-radio__error-message {
    color: var(--color-feedback-error-100);
    -moz-column-gap: 4px;
    margin-top: var(--spacing-0-5);
    align-items: center;
    column-gap: 4px;
    display: flex
}

.olx-radio__label-wrapper {
    margin-left: var(--spacing-1)
}

.olx-radio__label-text {
    color: var(--radio-font-color)
}

.olx-radio__label-text--checked {
    color: var(--color-secondary-100)
}

.olx-radio__label-text--checked:hover {
    color: var(--color-secondary-120)
}

.olx-help-text {
    color: var(--color-neutral-130);
    font-size: var(--font-size-1-5);
    justify-content: flex-start;
    align-items: center;
    display: inline-flex
}

.olx-help-text--error {
    color: var(--color-feedback-error-100)
}

.olx-help-text__icon {
    height: 16px;
    margin-right: var(--spacing-0-5);
    width: 16px
}

.olx-divider {
    background-color: var(--divider-default-background-color);
    border: none;
    height: 1px;
    margin: 0
}

.olx-divider--inverted {
    background-color: var(--divider-inverted-background-color)
}

.olx-visually-hidden {
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap;
    width: 1px;
    height: 1px;
    position: absolute;
    overflow: hidden
}

.olx-visually-hidden:focus {
    clip: auto;
    width: auto;
    height: auto;
    position: absolute;
    overflow: auto
}

.olx-dropdown__wrapper {
    --height: 28px;
    height: var(--height);
    width: 100%;
    position: relative
}

.olx-dropdown__wrapper--medium {
    --height: 48px
}

.olx-dropdown__native {
    --font-size: var(--font-size-1-75);
    --pading: var(--spacing-0-5)var(--spacing-1);
    --pading-right: var(--spacing-4);
    --border-radius: var(--border-radius-0-5);
    appearance: none;
    background-color: var(--dropdown-background-color-base);
    border-radius: var(--border-radius);
    box-shadow: 0 0 0 var(--border-width-0-1)var(--dropdown-border-color-base);
    color: var(--dropdown-color-font-base);
    cursor: pointer;
    font-family: var(--font-family-primary);
    font-size: var(--font-size);
    height: 100%;
    padding: var(--pading);
    padding-right: var(--pading-right);
    border: none;
    outline: none;
    width: 100%
}

.olx-dropdown__native--medium {
    --font-size: var(--font-size-2);
    --pading: var(--spacing-1-5)var(--spacing-2);
    --pading-right: var(--spacing-6);
    --border-radius: var(--border-radius-1)
}

.olx-dropdown__native option {
    background-color: var(--color-neutral-70)
}

.olx-dropdown__native--icon-left {
    padding-left: calc(var(--spacing-1)*2 + 16px)
}

.olx-dropdown__native--icon-left--medium {
    padding-left: calc(var(--spacing-1)*2 + 24px)
}

.olx-dropdown__native--selected {
    box-shadow: 0 0 0 var(--border-width-0-1)var(--dropdown-border-color-selected);
    color: var(--dropdown-color-font-selected)
}

.olx-dropdown__native--error {
    background-color: var(--dropdown-background-color-error);
    box-shadow: 0 0 0 var(--border-width-0-1)var(--dropdown-border-color-error)
}

.olx-dropdown__native option:not(:first-of-type) {
    color: var(--dropdown-color-font-selected)
}

.olx-dropdown__native:hover {
    box-shadow: 0 0 0 var(--border-width-0-25)var(--dropdown-border-color-hover)
}

.olx-dropdown__native:focus {
    outline: var(--border-width-0-25)solid var(--dropdown-border-color-focus)
}

.olx-dropdown__native:disabled {
    background-color: var(--dropdown-background-color-disabled);
    box-shadow: 0 0 0 var(--border-width-0-1)var(--dropdown-border-color-disabled);
    color: var(--dropdown-color-font-disabled);
    cursor: not-allowed
}

.olx-dropdown__icon-wrapper {
    --color: var(--dropdown-color-font-base);
    --size: 16px;
    --left-position: 8px;
    color: var(--color);
    height: var(--size);
    left: var(--left-position);
    max-height: var(--size);
    max-width: var(--size);
    min-height: var(--size);
    min-width: var(--size);
    pointer-events: none;
    width: var(--size);
    justify-content: center;
    align-items: center;
    display: inline-flex;
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

.olx-dropdown__icon-wrapper--selected {
    --color: var(--dropdown-color-font-selected)
}

.olx-dropdown__icon-wrapper--medium {
    --size: 24px;
    --left-position: 12px
}

.olx-dropdown__icon-wrapper svg {
    fill: var(--color);
    width: 100%;
    height: 100%
}

.olx-dropdown__loading-icon {
    --right-position: 10px;
    --top-position: 6px;
    pointer-events: none;
    right: var(--right-position);
    top: var(--top-position);
    position: absolute
}

.olx-dropdown__loading-icon--medium {
    --right-position: 16px;
    --top-position: 16px
}

.olx-dropdown__chevron-icon {
    --right-position: 8px;
    --color: var(--dropdown-icon-color-base);
    color: var(--color);
    pointer-events: none;
    right: var(--right-position);
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

.olx-dropdown__chevron-icon--medium {
    --right-position: 16px
}

.olx-dropdown__chevron-icon--disabled {
    --color: var(--dropdown-icon-color-disabled)
}

.olx-overflow {
    background-color: var(--color-neutral-70);
    border-radius: var(--border-radius-1);
    box-shadow: var(--shadow-bottom-6);
    z-index: var(--elevation-3)
}

.olx-skeleton {
    animation-duration: var(--transition-duration-5);
    animation-name: skeleton-loading;
    animation-iteration-count: infinite;
    animation-timing-function: var(--transition-timing-ease);
    height: var(--height);
    width: var(--width)
}

@keyframes skeleton-loading {
    0% {
        background: var(--skeleton-background-0)
    }

    20% {
        background: var(--skeleton-background-20)
    }

    40% {
        background: var(--skeleton-background-40)
    }

    60% {
        background: var(--skeleton-background-60)
    }

    80% {
        background: var(--skeleton-background-80)
    }

    to {
        background: var(--skeleton-background-100)
    }
}

.olx-accordion {
    background-color: var(--bg-color);
    flex-direction: column;
    width: 100%;
    display: flex
}

.olx-accordion--bordered {
    border: var(--border-width-0-1)solid var(--container-border-color-outlined);
    border-radius: var(--border-radius-1)
}

.olx-accordion__button {
    background-color: var(--bg-color);
    border-radius: var(--border-radius-0-5)0 0;
    border-width: var(--border-width-0);
    color: var(--text-color);
    cursor: pointer;
    align-items: center;
    gap: var(--spacing-1-5);
    padding: var(--spacing-1-5);
    outline: none;
    flex-direction: row;
    display: flex
}

@media screen and (min-width:840px) {
    .olx-accordion__button {
        gap: var(--spacing-2);
        padding: var(--spacing-2)
    }
}

.olx-accordion__button--bordered {
    border-radius: var(--border-radius-1)
}

.olx-accordion__button:disabled {
    background-color: var(--color-neutral-80)
}

.olx-accordion__button:disabled * {
    fill: currentColor;
    color: var(--color-neutral-100);
    cursor: not-allowed
}

.olx-accordion__button:focus {
    outline: none
}

.olx-accordion__button:focus-visible {
    border-radius: var(--border-radius-0-5);
    outline: var(--border-width-0-25)solid var(--color-neutral-130);
    outline-offset: var(--border-width-0-25);
    position: relative
}

.olx-accordion__button:hover:not(:disabled) {
    background-color: var(--color-neutral-80)
}

.olx-accordion__button-text {
    text-align: left;
    width: 100%
}

.olx-accordion__icon {
    width: 24px;
    height: 24px
}

.olx-accordion__content-wrapper {
    transition: grid-template-rows var(--transition-duration-3)var(--transition-timing-ease-in-out);
    grid-template-rows: 0fr;
    display: grid;
    overflow: hidden
}

.olx-accordion__content-wrapper>div {
    min-height: 0;
    transition: visibility var(--transition-duration-3)var(--transition-timing-ease-in-out);
    visibility: hidden
}

.olx-accordion__content-wrapper--show {
    grid-template-rows: 1fr
}

.olx-accordion__content-wrapper--show>div {
    visibility: visible
}

.olx-accordion__content {
    color: var(--color-neutral-130);
    font-size: var(--font-size-2);
    margin: var(--spacing-1-5)
}

@media screen and (min-width:840px) {
    .olx-accordion__content {
        margin: var(--spacing-2)
    }
}

.olx-arrow-button {
    --background-color: var(--color-neutral-130);
    --svg-color: var(--color-neutral-70);
    --hover-background-color: var(--color-neutral-130);
    --hover-svg-color: var(--color-neutral-70);
    --focus-background-color: var(--color-neutral-130);
    --focus-svg-color: var(--color-neutral-70);
    --disabled-background-color: var(--color-neutral-110);
    --disabled-svg-color: var(--color-neutral-120);
    --opacity: .8;
    background-color: var(--background-color);
    border-radius: var(--border-radius);
    cursor: pointer;
    height: var(--height);
    min-height: var(--min-height);
    min-width: var(--min-width);
    opacity: var(--opacity);
    width: var(--width);
    border: none;
    justify-content: center;
    align-items: center;
    padding: 0;
    display: inline-flex
}

.olx-arrow-button--inverted {
    --background-color: var(--color-neutral-70);
    --svg-color: var(--color-neutral-130);
    --hover-background-color: var(--color-neutral-90);
    --hover-svg-color: var(--color-secondary-100);
    --focus-background-color: var(--color-neutral-90);
    --focus-svg-color: var(--color-secondary-100);
    --disabled-background-color: var(--color-neutral-90);
    --disabled-svg-color: var(--color-neutral-110);
    --opacity: 1
}

.olx-arrow-button--left {
    --border-radius: 0px 4px 4px 0px
}

.olx-arrow-button--right {
    --border-radius: 4px 0px 0px 4px
}

.olx-arrow-button--up {
    --border-radius: 0px 0px 4px 4px
}

.olx-arrow-button--down {
    --border-radius: 4px 4px 0px 0px
}

@media only screen and (hover:none) and (pointer:coarse) {
    .olx-arrow-button--expand-clickable-area:after {
        content: "";
        width: 60px;
        height: 80px;
        position: absolute
    }
}

.olx-arrow-button--expand-clickable-area--right:after {
    right: 0
}

.olx-arrow-button--expand-clickable-area--left:after {
    left: 0
}

.olx-arrow-button svg {
    color: var(--svg-color);
    transform: rotate(var(--rotation))
}

.olx-arrow-button:hover {
    background-color: var(--hover-background-color);
    opacity: 1
}

.olx-arrow-button:hover svg {
    color: var(--hover-svg-color)
}

.olx-arrow-button:focus {
    background-color: var(--focus-background-color);
    opacity: 1;
    outline: 2px solid var(--color-neutral-130);
    outline-offset: 2px
}

.olx-arrow-button:focus svg {
    color: var(--focus-svg-color)
}

.olx-arrow-button:disabled {
    background-color: var(--disabled-background-color);
    cursor: default;
    pointer-events: none
}

.olx-arrow-button:disabled svg {
    color: var(--disabled-svg-color)
}

.olx-ad-media-counter {
    background: var(--color-neutral-130);
    opacity: .8;
    border-radius: 4px;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    height: 24px;
    padding: 4px 8px;
    display: inline-flex
}

.olx-ad-media-counter div {
    flex-direction: row;
    align-items: center;
    gap: 4px;
    height: 16px;
    padding: 0;
    display: flex
}

.olx-ad-media-counter div span,
.olx-ad-media-counter div svg {
    color: var(--color-neutral-70);
    width: 16px;
    height: 16px
}

.olx-ad-media-counter div span {
    font-family: Nunito Sans, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px;
    display: contents
}

.olx-ad-card-image-carousel {
    width: 100%;
    height: 100%;
    padding: 0;
    position: relative
}

.olx-ad-card-image-carousel span {
    height: 24px;
    position: absolute;
    top: 8px;
    left: 8px
}

@media screen and (min-width:566px) {
    .olx-ad-card-image-carousel span {
        top: 16px;
        left: 16px
    }
}

.olx-ad-card-image-carousel__items {
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    justify-content: flex-start;
    align-items: center;
    height: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    overflow: scroll hidden
}

.olx-ad-card-image-carousel__items::-webkit-scrollbar {
    display: none
}

.olx-ad-card-image-carousel__item {
    scroll-snap-align: start;
    scroll-snap-stop: always;
    justify-content: center;
    align-items: center;
    min-width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    overflow: hidden
}

.olx-ad-card-image-carousel__item img,
.olx-ad-card-image-carousel__item picture {
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
    height: 100%;
    display: block
}

.olx-ad-card-image-carousel__left-button-wrapper {
    left: 0
}

.olx-ad-card-image-carousel__left-button-wrapper,
.olx-ad-card-image-carousel__right-button-wrapper {
    width: 28px;
    height: 48px;
    z-index: var(--elevation-1);
    display: flex;
    position: absolute;
    top: calc(50% - 24px)
}

.olx-ad-card-image-carousel__right-button-wrapper {
    right: 0
}

.olx-ad-card-image-carousel__media-counter {
    position: absolute;
    bottom: 6px;
    right: 8px
}

.olx-image-carousel {
    background-color: var(--color-neutral-80);
    width: 100%;
    height: 100%;
    padding: 0;
    position: relative
}

.olx-image-carousel>span {
    max-width: calc(100% - 16px);
    height: 24px;
    z-index: var(--elevation-1);
    position: absolute;
    top: 8px;
    left: 8px
}

.olx-image-carousel span {
    text-overflow: ellipsis
}

@media screen and (min-width:566px) {
    .olx-image-carousel>span {
        top: 16px;
        left: 16px
    }
}

.olx-image-carousel__items {
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    justify-content: flex-start;
    align-items: center;
    height: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    overflow: scroll hidden
}

.olx-image-carousel__items::-webkit-scrollbar {
    display: none
}

.olx-image-carousel__blur {
    backface-visibility: hidden;
    filter: blur(32px);
    perspective: 1000px;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    transform: translateZ(0)
}

.olx-image-carousel__item {
    scroll-snap-align: start;
    scroll-snap-stop: always;
    justify-content: center;
    align-items: center;
    min-width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    position: relative;
    overflow: hidden
}

.olx-image-carousel__item-next {
    will-change: filter, opacity;
    animation: .2s ease-in blur-and-fade
}

@keyframes blur-and-fade {
    0% {
        filter: blur(4px);
        opacity: 0
    }

    to {
        filter: blur();
        opacity: 1
    }
}

.olx-image-carousel__item * {
    width: 100%;
    height: 100%
}

.olx-image-carousel__item img,
.olx-image-carousel__item picture {
    -o-object-fit: cover;
    object-fit: cover;
    display: block
}

.olx-image-carousel__item picture.olx-image-carousel__blur-image,
.olx-image-carousel__item picture.olx-image-carousel__gray-image {
    pointer-events: none;
    z-index: var(--elevation-1)
}

.olx-image-carousel__item picture.olx-image-carousel__blur-image img,
.olx-image-carousel__item picture.olx-image-carousel__gray-image img {
    -o-object-fit: contain;
    object-fit: contain;
    z-index: var(--elevation-1);
    background-color: #0000
}

.olx-image-carousel__left-button {
    left: 0
}

.olx-image-carousel__left-button,
.olx-image-carousel__right-button {
    width: 28px;
    height: 48px;
    z-index: var(--elevation-1);
    display: flex;
    position: absolute;
    top: calc(50% - 24px)
}

.olx-image-carousel__right-button {
    right: 0
}

.olx-image-carousel__bottom-badge,
.olx-image-carousel__counter-wrapper {
    z-index: var(--elevation-1);
    position: absolute;
    bottom: 6px;
    right: 8px
}

.olx-image-carousel__content-overlay {
    background-color: var(--color-neutral-130);
    opacity: 0;
    pointer-events: none;
    height: 100%;
    transition: opacity var(--transition-timing-ease)var(--transition-duration-3);
    justify-content: center;
    align-items: center;
    width: 100%;
    display: flex;
    position: absolute;
    top: 0
}

.olx-image-carousel__content-overlay--active {
    opacity: var(--opacity-80);
    pointer-events: all
}

.olx-image-carousel__content-overlay span {
    line-height: 50%;
    position: relative;
    top: 0;
    left: 0
}

.olx-media-counter {
    background: var(--color-neutral-130);
    opacity: .8;
    border-radius: 4px;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    height: 24px;
    padding: 4px 8px;
    display: inline-flex
}

.olx-media-counter div {
    flex-direction: row;
    align-items: center;
    gap: 4px;
    height: 16px;
    padding: 0;
    display: flex
}

.olx-media-counter div span,
.olx-media-counter div svg {
    color: var(--color-neutral-70);
    width: 16px;
    height: 16px
}

.olx-media-counter div span {
    font-family: Nunito Sans, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px;
    display: contents
}

.olx-ad-card {
    background: var(--color-neutral-70);
    border: 1px solid var(--color-neutral-90);
    border-radius: var(--border-radius-1);
    cursor: pointer;
    transition: box-shadow var(--transition-duration-2)var(--transition-timing-ease);
    position: relative
}

.olx-ad-card picture img {
    transition: scale var(--transition-duration-5)var(--transition-timing-ease)
}

.olx-ad-card:hover {
    box-shadow: var(--shadow-bottom-6)
}

.olx-ad-card:hover picture img {
    scale: 1.1
}

.olx-ad-card--horizontal {
    width: 100%;
    max-width: 1016px;
    height: 176px;
    display: flex
}

@media screen and (min-width:566px) {
    .olx-ad-card--horizontal {
        height: 240px
    }
}

.olx-ad-card--horizontal .olx-image-carousel {
    border-bottom-left-radius: var(--border-radius-1);
    border-top-left-radius: var(--border-radius-1);
    border-right: 0;
    width: 33%;
    height: 100%;
    overflow: hidden
}

@media screen and (min-width:566px) {
    .olx-ad-card--horizontal .olx-image-carousel {
        width: 39%;
        max-width: 360px
    }
}

.olx-ad-card--vertical {
    flex-direction: column;
    width: 100%;
    min-width: 180px;
    max-width: 400px;
    min-height: 100%;
    display: flex
}

.olx-ad-card--vertical .olx-image-carousel {
    border-top-left-radius: var(--border-radius-1);
    border-top-right-radius: var(--border-radius-1);
    border-bottom: 0;
    width: 100%;
    height: 180px;
    overflow: hidden
}

@media screen and (max-width:418px) {
    .olx-ad-card--vertical-slim {
        min-width: 135px;
        max-width: 195px
    }
}

.olx-ad-card--highlight {
    background-color: var(--color-neutral-80)
}

.olx-ad-card__link-wrapper {
    width: 100%;
    height: 100%;
    z-index: var(--elevation-1);
    outline: none;
    display: block;
    position: absolute;
    top: 0
}

.olx-ad-card__link-wrapper:focus {
    border-radius: var(--border-radius-1);
    outline: var(--border-width-0-1)solid var(--color-neutral-130);
    outline-offset: var(--border-width-0-1)
}

.olx-ad-card__content {
    border-radius: var(--border-radius-1);
    padding: var(--spacing-2);
    flex-direction: column;
    display: flex
}

.olx-ad-card__content--horizontal {
    gap: var(--spacing-0-5);
    width: 67%;
    min-width: 162px
}

@media screen and (min-width:566px) {
    .olx-ad-card__content--horizontal {
        width: calc(100% - 360px);
        min-width: 61%
    }
}

.olx-ad-card__content--vertical {
    --carousel-height: 180px;
    gap: var(--spacing-2);
    height: calc(100% - var(--carousel-height))
}

.olx-ad-card__content--vertical-slim {
    padding: var(--spacing-1)
}

.olx-ad-card__content--highlight {
    background-color: var(--color-neutral-80)
}

.olx-ad-card__top {
    flex-direction: column;
    width: 100%;
    height: 100%;
    display: flex
}

@media screen and (min-width:566px) {
    .olx-ad-card__top {
        gap: var(--spacing-2);
        flex-direction: row
    }
}

.olx-ad-card__top--vertical {
    gap: var(--spacing-2);
    flex-direction: column-reverse;
    justify-content: flex-end
}

@media screen and (min-width:566px) {
    .olx-ad-card__top--horizontal {
        justify-content: space-between
    }
}

.olx-ad-card__title {
    -webkit-line-clamp: 1;
    text-overflow: ellipsis;
    white-space: normal;
    -webkit-box-orient: vertical;
    font-size: 14px;
    font-weight: 400;
    display: -webkit-box;
    overflow: hidden
}

.olx-ad-card__title--vertical {
    -webkit-line-clamp: 2;
    --two-lines-height: 37px;
    height: var(--two-lines-height)
}

@media screen and (min-width:566px) {
    .olx-ad-card__title--horizontal {
        -webkit-line-clamp: 2;
        font-size: 16px
    }
}

.olx-ad-card__title-link {
    color: inherit;
    text-decoration: none
}

.olx-ad-card__labels-items {
    align-items: center;
    gap: var(--spacing-1);
    margin: 0;
    margin-top: var(--spacing-1);
    flex-direction: row;
    padding: 0;
    display: flex;
    position: relative;
    overflow: hidden
}

.olx-ad-card__labels-items[data-loading=true] {
    opacity: 0
}

.olx-ad-card__labels-items--fixed {
    height: 26px
}

.olx-ad-card__labels-item {
    list-style: none
}

.olx-ad-card__labels-item[data-visible=false] {
    visibility: hidden
}

.olx-ad-card__labels-item>span {
    color: var(--color-neutral-130);
    align-items: center;
    gap: var(--spacing-0-5);
    white-space: nowrap;
    font-family: Nunito Sans, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    display: flex
}

.olx-ad-card__badges-items {
    margin: 0;
    margin-top: var(--spacing-1);
    padding: 0;
    display: flex;
    position: relative;
    overflow: hidden
}

.olx-ad-card__badges-items[data-loading=true] {
    opacity: 0
}

.olx-ad-card__badges-items--fixed {
    height: 34px
}

.olx-ad-card__badges-item {
    list-style: none
}

.olx-ad-card__badges-item+.olx-ad-card__badges-item {
    padding-left: var(--spacing-1)
}

.olx-ad-card__badges-item>span {
    white-space: nowrap;
    display: flex
}

.olx-ad-card__old-price {
    color: var(--color-neutral-100);
    width: max-content;
    text-decoration-line: line-through
}

.olx-ad-card__old-price--horizontal {
    display: none
}

@media screen and (min-width:566px) {
    .olx-ad-card__old-price--horizontal {
        display: block
    }
}

.olx-ad-card__old-price--fixed {
    height: 16px;
    display: block
}

.olx-ad-card__price {
    width: max-content
}

.olx-ad-card__price--mobile {
    margin-top: var(--spacing-0-5)
}

@media screen and (min-width:566px) {
    .olx-ad-card__price--mobile {
        display: none
    }
}

.olx-ad-card__price--fixed {
    height: 27px;
    display: block
}

.olx-ad-card__priceinfo p,
.olx-ad-card__priceinfo span {
    font-size: var(--font-size-1-5)
}

.olx-ad-card__priceinfo--horizontal {
    margin-top: var(--spacing-1);
    display: none
}

@media screen and (min-width:566px) {
    .olx-ad-card__priceinfo--horizontal {
        flex-direction: column;
        align-items: flex-end;
        width: max-content;
        display: flex
    }
}

.olx-ad-card__priceinfo-text {
    color: var(--color-neutral-120)
}

.olx-ad-card__details-ads {
    flex-direction: column;
    display: flex
}

.olx-ad-card__details-ads--horizontal {
    left: calc(var(--spacing-0-5)*-1);
    padding: 0 var(--spacing-0-5);
    width: 100%;
    position: relative;
    overflow: hidden
}

.olx-ad-card__details-price--horizontal {
    display: none
}

@media screen and (min-width:566px) {
    .olx-ad-card__details-price--horizontal {
        flex-direction: column;
        align-items: flex-end;
        display: flex
    }
}

.olx-ad-card__bottom {
    justify-content: space-between;
    align-items: center;
    width: 100%;
    display: flex
}

.olx-ad-card__bottom-content {
    flex-direction: column;
    display: flex;
    overflow: hidden
}

.olx-ad-card__bottom-content-center {
    justify-content: center;
    align-items: center;
    width: 100%;
    display: flex
}

.olx-ad-card__bottom-details,
.olx-ad-card__seller-details {
    align-items: center;
    gap: var(--spacing-0-5);
    flex-direction: row;
    padding: 0;
    display: flex
}

.olx-ad-card__seller-details--fixed {
    height: 16px
}

.olx-ad-card__professional-text {
    color: var(--color-neutral-110)
}

.olx-ad-card__status {
    color: var(--color-feedback-success-110);
    text-transform: uppercase;
    font-size: 10px;
    line-height: 100%
}

.olx-ad-card__location {
    align-items: center;
    gap: var(--spacing-0-5);
    margin-right: var(--spacing-6);
    flex-direction: row;
    padding: 0;
    display: flex
}

.olx-ad-card__location--vertical {
    flex-direction: column;
    align-items: flex-start
}

.olx-ad-card__location svg {
    color: var(--color-neutral-120);
    min-width: 16px
}

.olx-ad-card__location p {
    color: var(--color-neutral-120);
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: normal;
    overflow: hidden
}

.olx-ad-card__location-date-container {
    align-items: flex-start;
    gap: var(--spacing-0-5);
    width: 100%;
    display: flex
}

@media screen and (min-width:566px) {
    .olx-ad-card__location-date-container--horizontal {
        max-width: calc(100% - var(--spacing-4))
    }

    .olx-ad-card__location-date-container--horizontal-long-date {
        max-width: calc(100% - 120px)
    }
}

.olx-ad-card__separator {
    color: var(--color-neutral-100)
}

.olx-ad-card__separator--horizontal {
    display: none
}

@media screen and (min-width:566px) {
    .olx-ad-card__separator--horizontal {
        display: block
    }
}

.olx-ad-card__date--horizontal {
    display: none
}

@media screen and (min-width:566px) {
    .olx-ad-card__date--horizontal {
        display: block
    }
}

.olx-ad-card__contact-container {
    bottom: var(--spacing-0-5);
    float: right;
    z-index: var(--elevation-1);
    flex-direction: column-reverse;
    display: flex;
    position: absolute;
    right: 0
}

.olx-ad-card__contact-container--vertical {
    z-index: var(--elevation-1)
}

.olx-ad-card__favorite-container {
    bottom: var(--spacing-0-5);
    align-items: center;
    gap: var(--spacing-0-25);
    right: var(--spacing-0-5);
    z-index: var(--elevation-1);
    flex-direction: row;
    justify-content: flex-end;
    display: flex;
    position: absolute
}

.olx-ad-card__favorite-container--vertical-slim {
    margin-top: calc(var(--spacing-2)*-1);
    position: inherit
}

.olx-ad-card__badges-favorite-button {
    cursor: pointer;
    background-color: #0000;
    border: none;
    justify-content: center;
    align-items: center;
    width: 44px;
    height: 44px;
    display: flex
}

.olx-ad-card__badges-favorite-button:focus {
    border-radius: var(--border-radius-5);
    outline: var(--color-neutral-130)solid var(--border-width-0-25)
}

.olx-ad-card__icon-heart-filled {
    animation: 1s infinite pulse
}

.olx-ad-card__icon-heart-filled:hover {
    transform: scale(1.5)
}

.olx-alertbox__link--error {
    color: var(--color-feedback-error-110)
}

.olx-alertbox__link--error:hover {
    color: var(--color-feedback-error-130)
}

.olx-alertbox__link--success {
    color: var(--color-feedback-success-110)
}

.olx-alertbox__link--success:hover {
    color: var(--color-feedback-success-130)
}

.olx-alertbox__link--warning {
    color: var(--color-feedback-attention-110)
}

.olx-alertbox__link--warning:hover {
    color: var(--color-feedback-attention-130)
}

.olx-alertbox__link--info {
    color: var(--color-feedback-info-110)
}

.olx-alertbox__link--info:hover {
    color: var(--color-feedback-info-130)
}

.olx-alertbox {
    --background-color: var(--color-neutral-80);
    --color: var(--color-neutral-130);
    --svg-color: var(--color-neutral-120);
    background-color: var(--background-color);
    border-radius: var(--border-radius-1);
    color: var(--color);
    font-family: var(--font-family-primary);
    padding: var(--spacing-2);
    flex-direction: column;
    display: flex
}

.olx-alertbox--error {
    --background-color: var(--color-feedback-error-80);
    --color: var(--color-feedback-error-110);
    --svg-color: var(--color-feedback-error-100)
}

.olx-alertbox--error span {
    color: var(--color-feedback-error-110)
}

.olx-alertbox--success {
    --background-color: var(--color-feedback-success-80);
    --color: var(--color-feedback-success-110);
    --svg-color: var(--color-feedback-success-100)
}

.olx-alertbox--success span {
    color: var(--color-feedback-success-110)
}

.olx-alertbox--attention {
    --background-color: var(--color-feedback-attention-80);
    --color: var(--color-feedback-attention-110);
    --svg-color: var(--color-feedback-attention-100)
}

.olx-alertbox--attention span {
    color: var(--color-feedback-attention-110)
}

.olx-alertbox--warning {
    --background-color: var(--color-feedback-attention-80);
    --color: var(--color-feedback-attention-110);
    --svg-color: var(--color-feedback-attention-100)
}

.olx-alertbox--warning span {
    color: var(--color-feedback-attention-110)
}

.olx-alertbox--information {
    --background-color: var(--color-feedback-info-80);
    --color: var(--color-feedback-info-110);
    --svg-color: var(--color-feedback-info-100)
}

.olx-alertbox--information span {
    color: var(--color-feedback-info-110)
}

.olx-alertbox svg {
    color: var(--svg-color)
}

.olx-alertbox__content-wrapper {
    display: flex
}

.olx-alertbox__time-wrapper {
    margin-top: var(--spacing-1);
    justify-content: flex-end;
    display: flex
}

.olx-alertbox__time-wrapper p {
    color: inherit
}

.olx-alertbox__icon-wrapper {
    width: 24px;
    height: 24px
}

.olx-alertbox__content {
    margin-left: var(--spacing-2);
    flex-direction: column;
    display: flex
}

.olx-alertbox__description {
    font-size: var(--font-size-1-75);
    font-weight: var(--font-weight-regular);
    display: inline
}

.olx-alertbox__description a {
    font-size: var(--font-size-1-75);
    font-weight: var(--font-weight-semibold);
    text-decoration: underline
}

@media screen and (min-width:840px) {

    .olx-alertbox__description,
    .olx-alertbox__description a {
        font-size: var(--font-size-2)
    }
}

.olx-alertbox__title {
    font-size: var(--font-size-1-75);
    font-weight: var(--font-weight-semibold);
    word-break: break-word;
    align-items: center;
    line-height: 24px;
    display: flex
}

@media screen and (min-width:840px) {
    .olx-alertbox__title {
        font-size: var(--font-size-2)
    }
}

.olx-avatar {
    background-color: var(--color-neutral-80);
    border-radius: var(--border-radius-circle, 50%)
}

.olx-badge {
    background: var(--badge-background-color);
    color: var(--badge-color);
    font-family: var(--font-family-primary);
    font-weight: var(--font-weight-semibold);
    white-space: nowrap;
    align-items: center;
    display: inline-flex;
    overflow: hidden
}

.olx-badge:not(.olx-badge--no-gap) {
    -moz-column-gap: var(--spacing-1);
    column-gap: var(--spacing-1)
}

.olx-badge--xsmall {
    padding: 0 var(--spacing-1)
}

.olx-badge--small,
.olx-badge--xsmall {
    border-radius: var(--border-radius-0-5);
    font-size: var(--font-size-1-5)
}

.olx-badge--small {
    padding: var(--spacing-0-5)var(--spacing-1)
}

.olx-badge--medium {
    border-radius: var(--border-radius-1);
    font-size: var(--font-size-1-75);
    padding: var(--spacing-1)var(--spacing-1-5)
}

.olx-badge--success {
    --badge-background-color: var(--color-feedback-success-80);
    --badge-color: var(--color-feedback-success-120)
}

.olx-badge--info {
    --badge-background-color: var(--color-feedback-info-80);
    --badge-color: var(--color-feedback-info-110)
}

.olx-badge--warning {
    --badge-background-color: var(--color-feedback-attention-80);
    --badge-color: var(--color-feedback-attention-110)
}

.olx-badge--neutral {
    --badge-background-color: var(--color-neutral-80);
    --badge-color: var(--color-neutral-130)
}

.olx-badge--secondary {
    --badge-background-color: var(--color-secondary-70);
    --badge-color: var(--color-secondary-100)
}

.olx-badge--error {
    --badge-background-color: var(--color-feedback-error-80);
    --badge-color: var(--color-feedback-error-110)
}

.olx-badge--gradient {
    --badge-background-color: linear-gradient(266.06deg, #f28000 3.22%, #e22828 38.77%, #6e0ad6 96.78%);
    --badge-color: #eee
}

.olx-badge--white-border {
    outline: 1px solid #eee
}

.olx-badge--pill {
    border-radius: var(--border-radius-4)
}

.olx-badge svg {
    max-width: 16px;
    max-height: 16px
}

.olx-autocomplete {
    position: relative
}

.olx-autocomplete__action {
    justify-content: flex-end;
    align-items: center;
    display: flex;
    position: absolute;
    top: 0;
    right: 0
}

.olx-autocomplete__list {
    background: var(--color-neutral-70);
    border-radius: var(--border-radius-1);
    width: 100%;
    z-index: var(--elevation-3);
    flex-direction: column;
    flex: none;
    order: 0;
    align-items: flex-start;
    list-style: none;
    display: flex;
    position: absolute;
    top: 40px;
    left: 0;
    overflow: auto
}

.olx-autocomplete__list--label {
    top: 72px
}

.olx-autocomplete__list--shadow {
    box-shadow: var(--shadow-bottom-9)
}

.olx-autocomplete__input--action {
    padding-right: 73px
}

.olx-autocomplete__item {
    width: 100%
}

.olx-breadcrumb__list {
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex
}

.olx-breadcrumb__item {
    padding: var(--spacing-0-5)0;
    align-items: center;
    display: flex
}

.olx-breadcrumb__item a {
    line-height: 1
}

.olx-breadcrumb__item[data-url=false] {
    padding-left: var(--spacing-0-25)
}

.olx-breadcrumb__item:not(:last-child) {
    margin-right: var(--spacing-0-5)
}

.olx-breadcrumb__arrow {
    color: var(--color-neutral-130);
    height: 16px;
    margin-left: var(--spacing-0-5);
    pointer-events: none;
    width: 16px;
    margin-right: 0
}

.olx-carousel {
    position: relative
}

.olx-carousel__viewport {
    overflow: hidden
}

.olx-carousel__content {
    display: flex
}

.olx-carousel__previous {
    left: -24px
}

.olx-carousel__next {
    right: -24px
}

.olx-carousel__next,
.olx-carousel__previous {
    border-radius: var(--border-radius-5);
    color: var(--carousel-arrow-color);
    cursor: pointer;
    height: 48px;
    padding: var(--spacing-0-5);
    width: 48px;
    z-index: var(--elevation-1);
    background-color: #0000;
    border: 0;
    outline: 0;
    justify-content: center;
    align-items: center;
    display: flex;
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

.olx-carousel__next:hover span,
.olx-carousel__previous:hover span {
    background-color: var(--carousel-arrow-background-color-hover)
}

.olx-carousel__next:focus-visible,
.olx-carousel__previous:focus-visible {
    outline: var(--carousel-focus)solid var(--border-width-0-25)
}

.olx-carousel__next--hide-on-mobile,
.olx-carousel__previous--hide-on-mobile {
    display: none
}

@media screen and (min-width:840px) {

    .olx-carousel__next--hide-on-mobile,
    .olx-carousel__previous--hide-on-mobile {
        display: flex
    }
}

.olx-carousel__arrow-icon {
    background-color: var(--carousel-arrow-background-color-base);
    border-radius: var(--border-radius-5);
    box-shadow: var(--shadow-bottom-1);
    align-items: center
}

.olx-carousel__arrow-icon,
.olx-modal {
    justify-content: center;
    width: 100%;
    height: 100%;
    display: flex
}

.olx-modal {
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--transition-timing-ease)var(--transition-duration-3);
    visibility: hidden;
    will-change: transform;
    z-index: var(--elevation-4);
    background-color: #0005;
    border: 0;
    align-items: flex-end;
    position: fixed;
    top: 0;
    right: 0
}

.olx-modal[aria-hidden=false] {
    opacity: 1;
    pointer-events: auto;
    visibility: visible
}

@media screen and (min-width:840px) {
    .olx-modal {
        align-items: center
    }
}

.olx-modal--filter {
    align-items: flex-end;
    transition: opacity .3s
}

.olx-modal--filter[aria-hidden=false] {
    align-items: center
}

.olx-modal--filter[data-show=true] {
    opacity: 1;
    pointer-events: auto;
    visibility: visible
}

@media screen and (max-width:481px) {
    .olx-modal--filter {
        align-items: flex-end
    }
}

.olx-modal__dialog {
    background-color: var(--modal-background-color);
    border-radius: var(--border-radius-2);
    max-height: var(--modal-max-height);
    opacity: 0;
    max-width: 100%;
    min-height: 200px;
    padding: var(--spacing-3)var(--spacing-4);
    transition: opacity var(--transition-timing-ease)var(--transition-duration-3), transform var(--transition-timing-ease)var(--transition-duration-3);
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    flex-direction: column;
    width: 100%;
    display: flex;
    position: relative;
    transform: translateY(100%)scale(.9)
}

.olx-modal__dialog[data-show=true] {
    opacity: 1;
    transform: translateY(0)
}

@media screen and (min-width:840px) {
    .olx-modal__dialog {
        border-radius: var(--border-radius-2);
        max-width: var(--modal-max-width);
        transform: translateY(10%)scale(.9)
    }

    .olx-modal__dialog[data-show=true] {
        opacity: 1;
        transform: scale(1)
    }
}

.olx-modal__dialog--filter,
.olx-modal__dialog--side-sheet {
    opacity: 0;
    height: 100%;
    max-height: 100%;
    transition: opacity var(--transition-timing-ease)var(--transition-duration-3), transform var(--transition-timing-ease)var(--transition-duration-3), visibility var(--transition-timing-ease)var(--transition-duration-3);
    background-color: #fff;
    border-radius: 0;
    flex-direction: column;
    width: 100%;
    padding: 0;
    display: flex;
    position: relative;
    transform: translate(-100%)
}

.olx-modal__dialog--filter[data-show=true],
.olx-modal__dialog--side-sheet[data-show=true] {
    opacity: 1;
    transform: translate(0)
}

.olx-modal__dialog--side-sheet {
    max-width: 380px;
    position: absolute;
    left: 0
}

.olx-modal__dialog--side-sheet--right {
    left: auto;
    right: 0;
    transform: translate(100%)
}

.olx-modal__content {
    background-color: var(--color-neutral-70);
    flex-direction: column;
    height: 100%;
    display: flex;
    overflow: hidden auto
}

.olx-modal__content--filter,
.olx-modal__content--side-sheet {
    padding: var(--spacing-3)
}

@media screen and (max-width:840px) {

    .olx-modal__content--filter,
    .olx-modal__content--side-sheet {
        padding: var(--spacing-2)
    }
}

.olx-modal__content--filter--bottombar,
.olx-modal__content--side-sheet--bottombar {
    padding-bottom: 0
}

.olx-modal__content::-webkit-scrollbar {
    width: 10px
}

.olx-modal__content::-webkit-scrollbar-track {
    background: var(--color-neutral-80);
    border-radius: var(--border-radius-2)
}

.olx-modal__content::-webkit-scrollbar-thumb {
    background: var(--color-neutral-90);
    border-radius: var(--border-radius-2)
}

.olx-modal__content::-webkit-scrollbar-thumb:hover {
    background: var(--color-neutral-110)
}

.olx-modal__close-button {
    border-radius: var(--border-radius-4);
    color: var(--modal-button-color);
    cursor: pointer;
    background-color: #0000;
    border: none;
    justify-content: center;
    align-self: flex-end;
    align-items: center;
    width: 48px;
    height: 48px;
    min-height: 48px;
    display: flex
}

.olx-modal__close-button:hover {
    background-color: var(--modal-button-background-color-hover)
}

.olx-modal__close-button:focus-visible {
    outline: var(--border-width-0-25)solid var(--modal-button-background-color-focus)
}

.olx-modal__topbar {
    border-bottom: 1px solid var(--color-neutral-90);
    box-sizing: border-box;
    gap: var(--spacing-1);
    padding: var(--spacing-1)var(--spacing-2);
    justify-content: space-between;
    margin-bottom: 1px;
    display: flex
}

.olx-modal__topbar,
.olx-modal__topbar-button {
    background-color: var(--color-neutral-70);
    align-items: center
}

.olx-modal__topbar-button {
    border-radius: var(--border-radius-5);
    cursor: pointer;
    border: none;
    outline: none;
    justify-content: center;
    width: 48px;
    height: 48px;
    display: inline-flex
}

.olx-modal__topbar-button:hover {
    background-color: var(--modal-button-topbar-background-color-hover)
}

.olx-modal__topbar-button:focus-visible {
    border-radius: var(--border-radius-5);
    outline: var(--border-width-0-25)solid var(--color-neutral-130)
}

.olx-modal__bottombar {
    background-color: var(--modal-background-color);
    border-top: 1px solid var(--color-neutral-90);
    padding: var(--spacing-1-5)var(--spacing-2)var(--spacing-2);
    z-index: var(--elevation-1);
    margin: 0 -16px;
    position: sticky;
    bottom: 0
}

.olx-logo-compra-segura {
    min-width: 12px;
    min-height: 12px
}

.olx-logo-compra-segura path {
    fill: var(--color-secondary-100)
}

.olx-logo-compra-segura--black path {
    fill: var(--color-neutral-130)
}

.olx-logo-olx {
    width: 100%;
    min-width: 12px;
    min-height: 12px
}

.olx-logo-olx--o {
    fill: var(--color-secondary-100)
}

.olx-logo-olx--l {
    fill: var(--color-feedback-success-90)
}

.olx-logo-olx--x {
    fill: var(--color-primary-100)
}

.olx-logo-olx--black path {
    fill: var(--color-neutral-130)
}

.olx-logo-olx--white path,
.olx-logo-olx--white-l .olx-logo-olx--l,
.olx-logo-olx--white-o .olx-logo-olx--o,
.olx-logo-olx--white-x .olx-logo-olx--x {
    fill: var(--color-neutral-70)
}

.dark .olx-logo-olx--o {
    fill: var(--color-neutral-130)
}

.dark .olx-logo-olx--l {
    fill: var(--color-feedback-success-110)
}

.dark .olx-logo-olx--x {
    fill: var(--color-primary-100)
}

.dark .olx-logo-olx--black path {
    fill: var(--color-neutral-130)
}

.dark .olx-logo-olx--white path,
.dark .olx-logo-olx--white-l .dark .olx-logo-olx--l,
.dark .olx-logo-olx--white-o .dark .olx-logo-olx--o,
.dark .olx-logo-olx--white-x .dark .olx-logo-olx--x {
    fill: var(--color-neutral-70)
}

.olx-logo-olx-pay {
    min-width: 12px;
    min-height: 12px
}

.olx-logo-olx-pay--o {
    fill: var(--color-secondary-100)
}

.olx-logo-olx-pay--l {
    fill: var(--color-feedback-success-90)
}

.olx-logo-olx-pay--x {
    fill: var(--color-primary-100)
}

.olx-logo-olx-pay--white path,
.olx-logo-olx-pay--white-l .olx-logo-olx-pay--a,
.olx-logo-olx-pay--white-l .olx-logo-olx-pay--l,
.olx-logo-olx-pay--white-l .olx-logo-olx-pay--p,
.olx-logo-olx-pay--white-l .olx-logo-olx-pay--y,
.olx-logo-olx-pay--white-o .olx-logo-olx-pay--a,
.olx-logo-olx-pay--white-o .olx-logo-olx-pay--o,
.olx-logo-olx-pay--white-o .olx-logo-olx-pay--p,
.olx-logo-olx-pay--white-o .olx-logo-olx-pay--y,
.olx-logo-olx-pay--white-x .olx-logo-olx-pay--a,
.olx-logo-olx-pay--white-x .olx-logo-olx-pay--p,
.olx-logo-olx-pay--white-x .olx-logo-olx-pay--x,
.olx-logo-olx-pay--white-x .olx-logo-olx-pay--y {
    fill: var(--color-neutral-80)
}

.olx-logo-olx-pay--black path {
    fill: var(--color-neutral-130)
}

.olx-logo-olx-pay-plus {
    flex-direction: row;
    align-items: flex-start;
    display: flex
}

.olx-logo-olx-pay-plus__sign {
    color: var(--color-secondary-100);
    width: 9px;
    height: 16px;
    margin: 0 6px 0 7px;
    font-family: Nunito Sans, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px
}

.olx-logo-olx-pay-plus__delivery {
    margin-top: 1px
}

.dark .olx-logo-olx-pay-plus__sign {
    color: var(--color-secondary-130)
}

.olx-multiselect {
    flex-direction: column;
    display: flex
}

.olx-multiselect__content {
    border-radius: var(--border-radius-1);
    box-shadow: 0 0 0 var(--border-width-0-1)var(--dropdown-border-color-base);
    color: var(--dropdown-color-font-base);
    height: 100%;
    min-height: 48px;
    padding-right: var(--spacing-4);
    width: 100%;
    display: flex;
    position: relative
}

.olx-multiselect__content:hover {
    box-shadow: 0 0 0 var(--border-width-0-25)var(--dropdown-border-color-hover)
}

.olx-multiselect__content--selected {
    box-shadow: 0 0 0 var(--border-width-0-1)var(--dropdown-border-color-selected);
    color: var(--dropdown-color-font-selected)
}

.olx-multiselect__content--error {
    background-color: var(--dropdown-background-color-error);
    box-shadow: 0 0 0 var(--border-width-0-1)var(--dropdown-border-color-error)
}

.olx-multiselect__content:focus-within {
    outline: var(--border-width-0-25)solid var(--dropdown-border-color-focus)
}

.olx-multiselect__content--disabled {
    background-color: var(--color-neutral-80);
    color: var(--color-neutral-100);
    cursor: not-allowed
}

.olx-multiselect__icon-left {
    left: var(--spacing-2);
    display: flex;
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

.olx-multiselect__icon-left--open {
    display: none
}

.olx-multiselect__icon-right {
    pointer-events: none;
    right: var(--spacing-2);
    display: flex;
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

.olx-multiselect__chips {
    padding: var(--spacing-1);
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
    display: flex
}

.olx-multiselect__chips--icon-left {
    padding-left: var(--spacing-6)
}

.olx-multiselect__chips>button {
    z-index: var(--elevation-1)
}

.olx-multiselect__chips>p {
    margin-left: 8px
}

.olx-multiselect__chips--open {
    gap: var(--spacing-1);
    padding: var(--spacing-0-5)var(--spacing-1)
}

.olx-multiselect__chips--size-max-container {
    -ms-overflow-style: none;
    scrollbar-width: none;
    overflow-y: scroll
}

.olx-multiselect__chips--size-max-container::-webkit-scrollbar {
    display: none
}

.olx-multiselect__button {
    border-radius: var(--border-radius-1);
    color: var(--dropdown-color-font-base);
    cursor: pointer;
    text-align: left;
    background-color: #0000;
    border: 0;
    width: 100%;
    height: 100%;
    min-height: 48px;
    position: absolute
}

.olx-multiselect__button--icon-left {
    padding-left: calc(var(--spacing-1)*2 + 24px)
}

.olx-multiselect__button:focus {
    outline: var(--border-width-0-25)solid var(--dropdown-border-color-focus)
}

.olx-multiselect__options {
    background-color: var(--dropdown-background-color-base);
    border-radius: var(--border-radius-1);
    box-shadow: var(--shadow-bottom-6);
    max-height: var(--size-max-overflow);
    width: 100%;
    z-index: var(--elevation-1);
    margin: 0;
    list-style-type: none;
    position: absolute;
    top: calc(100% + 2px);
    overflow-y: auto
}

.olx-multiselect__check-button {
    border-radius: var(--border-radius-1);
    color: var(--color-neutral-130);
    cursor: pointer;
    font-family: Nunito Sans, sans-serif;
    font-size: var(--font-size-2);
    font-weight: var(--font-weight-regular);
    align-items: center;
    gap: var(--spacing-1);
    line-height: var(--line-height-superdistant);
    padding: var(--spacing-1-5)var(--spacing-2);
    text-align: left;
    background-color: #0000;
    border: 0;
    width: 100%;
    display: flex
}

.olx-multiselect__check-button:disabled {
    cursor: not-allowed;
    opacity: .5
}

.olx-multiselect__check-button:hover {
    background-color: var(--color-neutral-80)
}

.olx-multiselect__check-button:focus {
    outline: var(--color-neutral-130)solid var(--border-width-0-1)
}

.olx-multiselect__check-icon {
    border: 1px solid var(--color-neutral-120);
    border-radius: 2px;
    align-items: center;
    width: 20px;
    height: 20px;
    display: flex
}

.olx-multiselect__check-icon--hidden svg {
    display: none
}

.olx-multiselect__check-icon--visible {
    background-color: var(--color-secondary-100);
    border: none;
    justify-content: center;
    display: flex
}

.olx-multiselect__check-icon--visible svg {
    stroke: #fff;
    stroke-width: 2px;
    color: #fff;
    width: 14px
}

.olx-multiselect__empty-text {
    padding: var(--spacing-1-5)var(--spacing-2)
}

.olx-multiselect__input {
    border-radius: var(--border-radius-1);
    color: var(--color-neutral-130);
    background-color: #0000;
    border: 0;
    outline: 0;
    flex: 1;
    width: 100%;
    min-width: 120px
}

.olx-multiselect__input--selected {
    box-shadow: 0 0 0 var(--border-width-0-1)var(--dropdown-border-color-selected);
    color: var(--dropdown-color-font-selected)
}

.olx-multiselect__input::selection {
    background-color: var(--color-secondary-70);
    color: var(--color-secondary-130)
}

.olx-multiselect__helptext {
    margin-top: var(--spacing-1)
}

.olx-multiselect__helptext:empty {
    display: none
}

.olx-slider {
    flex-direction: column;
    display: flex
}

.olx-slider__content {
    border-radius: var(--border-radius-4);
    height: var(--spacing-0-5);
    width: 100%;
    margin: 10px 0;
    display: inline-flex;
    position: relative
}

.olx-slider__track {
    background: var(--linear-gradient)
}

.olx-slider__track,
.olx-slider__track--disabled {
    border-radius: var(--border-radius-4);
    width: 100%;
    height: 100%;
    position: absolute
}

.olx-slider__track--disabled {
    background: linear-gradient(to right, var(--color-neutral-90)20%, var(--color-neutral-90)20%, var(--color-neutral-90)80%, var(--color-neutral-90)80%)
}

.olx-slider__input {
    --thumb-background: var(--color-neutral-70);
    --thumb-border-color: var(--color-neutral-110);
    appearance: none;
    pointer-events: none;
    background: 0 0;
    border: none;
    outline: none;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    position: absolute
}

.olx-slider__input::-webkit-slider-thumb {
    appearance: none;
    background: var(--thumb-background);
    border-color: var(--thumb-border-color);
    border-radius: var(--border-radius-5);
    border-style: solid;
    border-width: var(--border-width-0-25);
    cursor: pointer;
    pointer-events: all;
    width: 24px;
    height: 24px
}

.olx-slider__input::-webkit-slider-thumb:active {
    border-width: var(--border-width-0-25)
}

.olx-slider__input::-webkit-slider-thumb:hover {
    border-width: var(--border-width-0-25)
}

.olx-slider__input::-webkit-slider-thumb:active {
    --thumb-border-color: var(--color-secondary-100)
}

.olx-slider__input::-moz-range-thumb {
    appearance: none;
    background: var(--thumb-background);
    border-color: var(--color-neutral-110);
    border-radius: var(--border-radius-5);
    border-style: solid;
    border-width: var(--border-width-0-25);
    cursor: pointer;
    pointer-events: all;
    width: 20px;
    height: 20px
}

.olx-slider__input::-moz-range-thumb:active {
    border-width: var(--border-width-0-25)
}

.olx-slider__input::-moz-range-thumb:hover {
    border-width: var(--border-width-0-25)
}

.olx-slider__input::-moz-range-thumb:active {
    --thumb-border-color: var(--color-secondary-100)
}

.olx-slider__input::-ms-thumb {
    appearance: none;
    background: var(--thumb-background);
    border-color: var(--color-neutral-110);
    border-radius: var(--border-radius-5);
    border-style: solid;
    border-width: var(--border-width-0-25);
    cursor: pointer;
    pointer-events: all;
    width: 24px;
    height: 24px
}

.olx-slider__input::-ms-thumb:active {
    border-width: var(--border-width-0-25)
}

.olx-slider__input::-ms-thumb:hover {
    border-width: var(--border-width-0-25)
}

.olx-slider__input::-ms-thumb:active {
    --thumb-border-color: var(--color-secondary-100)
}

.olx-slider__input--error {
    --thumb-border-color: var(--color-feedback-error-100)
}

.olx-slider__input--error::-webkit-slider-thumb:active {
    --thumb-border-color: var(--color-feedback-error-100)
}

.olx-slider__input--error::-moz-range-thumb:active {
    --thumb-border-color: var(--color-feedback-error-100)
}

.olx-slider__input--error::-ms-thumb:active {
    --thumb-border-color: var(--color-feedback-error-100)
}

.olx-slider__input:disabled {
    --thumb-border-color: var(--color-neutral-90);
    border-width: var(--border-width-0-25);
    cursor: not-allowed
}

.olx-slider__input:disabled::-webkit-slider-thumb:active {
    --thumb-border-color: var(--color-neutral-90)
}

.olx-slider__input:disabled::-moz-range-thumb:active {
    --thumb-border-color: var(--color-neutral-90)
}

.olx-slider__input:disabled::-ms-thumb:active {
    --thumb-border-color: var(--color-neutral-90)
}

.olx-slider__overline {
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 8px;
    display: flex
}

.olx-slider__helptext {
    margin-top: var(--spacing-1)
}

.olx-tabs {
    flex-direction: column
}

.olx-tabs,
.olx-tabs__tab-button {
    color: var(--color-neutral-130);
    display: flex
}

.olx-tabs__tab-button {
    border: 0;
    border-bottom: 1px solid var(--color-neutral-90);
    -moz-column-gap: var(--spacing-1);
    align-items: center;
    column-gap: var(--spacing-1);
    cursor: pointer;
    padding: var(--spacing-1)var(--spacing-2);
    background-color: #0000;
    flex-direction: row;
    justify-content: center
}

.olx-tabs__tab-button:hover {
    border-bottom-color: var(--color-secondary-110);
    color: var(--color-secondary-110)
}

.olx-tabs__tab-button--selected {
    border-bottom-color: var(--color-secondary-100);
    color: var(--color-secondary-100)
}

.olx-tabs__tab-button--disabled {
    border-bottom-color: var(--color-neutral-110);
    color: var(--color-neutral-100)
}

.olx-tabs__tab-button:focus-visible {
    outline: var(--border-width-0-25)solid var(--color-neutral-130);
    outline-offset: 2px
}

.olx-tabs__tab-label {
    color: currentColor
}

.olx-tabs__tab-icon {
    width: 24px;
    height: 24px
}

.olx-tabs__tab-badge {
    height: auto
}

.olx-tabs__tablist {
    flex-direction: column;
    display: flex;
    position: relative
}

.olx-tabs__tablist-content {
    scroll-behavior: smooth;
    scrollbar-width: none;
    overflow: auto
}

.olx-tabs__tablist-content::-webkit-scrollbar {
    width: 0;
    display: none
}

.olx-tabs__tablist-buttons-wrapper {
    width: max-content;
    display: flex
}

.olx-tabs__tablist-button {
    color: var(--color-neutral-130);
    cursor: pointer;
    border: 0;
    justify-content: center;
    align-items: center;
    width: 48px;
    height: 48px;
    display: flex;
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

.olx-tabs__tablist-button:focus {
    outline: var(--border-width-0-25)solid var(--color-neutral-130);
    outline-offset: 2px
}

.olx-tabs__tablist-button--left {
    background: linear-gradient(270deg, #fff0 0, var(--color-neutral-70)51.04%);
    left: 0
}

.olx-tabs__tablist-button--right {
    background: linear-gradient(270deg, var(--color-neutral-70)51.04%, #fff0 100%);
    right: 0
}

.olx-tabs__tablist-button--hidden {
    display: none
}

.olx-tabs__tabpanel {
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap;
    width: 1px;
    height: 1px;
    position: absolute;
    overflow: hidden
}

.olx-tabs__tabpanel--selected {
    clip: auto;
    display: initial;
    height: auto;
    overflow: initial;
    white-space: normal;
    width: auto;
    position: static
}

.olx-toast__toast-wrapper {
    width: 100%;
    z-index: var(--elevation-3);
    position: fixed;
    bottom: 0;
    left: 0
}

.olx-toast__close-icon {
    color: var(--toast-close-icon-color);
    width: 24px;
    height: 24px
}

.olx-toast__close-button {
    cursor: pointer;
    margin-left: var(--spacing-1);
    background-color: #0000;
    border: none;
    padding: 0;
    display: flex
}

.olx-toast__icon-wrapper {
    height: 24px;
    margin-right: var(--spacing-1);
    pointer-events: none;
    width: 24px
}

.olx-toast__icon-wrapper svg {
    pointer-events: none;
    width: 100%;
    height: 100%
}

.olx-toast__text {
    color: var(--toast-font-color);
    flex: 1
}

.olx-toast__body {
    background-color: var(--toast-background-color);
    bottom: var(--spacing-3);
    opacity: 1;
    width: 288px;
    animation: .5s forwards fade-down;
    position: absolute;
    left: calc(50vw - 144px)
}

@media screen and (min-width:840px) {
    .olx-toast__body {
        left: var(--spacing-3);
        min-width: 568px
    }
}

.olx-toast__body--visible {
    animation: .5s fade-up
}

@keyframes fade-down {
    0% {
        opacity: 1;
        transform: none
    }

    to {
        opacity: 0;
        transform: translateY(100%)
    }
}

@keyframes fade-up {
    0% {
        opacity: 0;
        transform: translateY(100%)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.olx-toggle-switch__stylized {
    background-color: var(--toggleswitch-background-color-base);
    border-radius: var(--border-radius-4);
    border: none;
    flex-shrink: 0;
    width: 48px;
    height: 24px;
    padding: 2px;
    transition: all .15s ease-in-out;
    display: inline-block;
    position: relative
}

.olx-toggle-switch {
    cursor: pointer;
    justify-content: space-between;
    align-items: flex-start;
    width: fit-content;
    display: flex
}

.olx-toggle-switch--label-visible {
    width: 100%
}

.olx-toggle-switch__native:focus+.olx-toggle-switch__stylized {
    outline: var(--border-width-0-25)solid var(--color-neutral-130);
    outline-offset: var(--border-width-0-25)
}

.olx-toggle-switch__native:checked+.olx-toggle-switch__stylized {
    background-color: var(--toggleswitch-background-color-checked)
}

.olx-toggle-switch__native:not(:checked, :disabled):hover+.olx-toggle-switch__stylized {
    background-color: var(--toggleswitch-background-color-hover)
}

.olx-toggle-switch__native:checked:not(:disabled):hover+.olx-toggle-switch__stylized {
    background-color: var(--toggleswitch-background-color-checked-hover)
}

.olx-toggle-switch--disabled {
    cursor: not-allowed;
    opacity: var(--opacity-32)
}

.olx-toggle-switch__icon {
    background-color: var(--toggleswitch-icon-color);
    border-radius: var(--border-radius-4);
    width: 20px;
    height: 20px;
    transition: inherit;
    display: inline-block;
    position: absolute
}

.olx-toggle-switch__icon--checked {
    transform: translate(24px)
}

.olx-toggle-switch__native {
    opacity: 0;
    width: 1px;
    height: 1px;
    position: absolute
}

.olx-toggle-switch__checked-icon,
.olx-toggle-switch__unchecked-icon {
    color: var(--toggleswitch-icon-color);
    visibility: hidden;
    width: 16px;
    height: 16px;
    position: absolute;
    top: 4px
}

.olx-toggle-switch__checked-icon {
    left: 4px
}

.olx-toggle-switch__checked-icon--checked {
    visibility: visible
}

.olx-toggle-switch__unchecked-icon {
    right: 4px
}

.olx-toggle-switch__unchecked-icon--unchecked {
    visibility: visible
}

.olx-toggle-switch__label {
    margin-right: var(--spacing-1)
}

.olx-tooltip,
.olx-tooltip__reference-wrapper {
    width: auto
}

.olx-tooltip.full-width-child,
.olx-tooltip.full-width-child__reference-wrapper {
    width: 100%
}

.olx-tooltip__floating {
    background-color: var(--color-neutral-70);
    border-radius: var(--border-radius-1);
    box-shadow: var(--shadow-bottom-6);
    -moz-column-gap: var(--spacing-2);
    column-gap: var(--spacing-2);
    padding: var(--spacing-2);
    transition-property: opacity;
    position: relative
}

.olx-tooltip__floating[data-status=close],
.olx-tooltip__floating[data-status=open] {
    transition-duration: var(--transition-duration-3)
}

.olx-tooltip__floating[data-status=close],
.olx-tooltip__floating[data-status=initial] {
    opacity: var(--opacity-0)
}

.olx-tooltip__floating--secondary {
    background-color: var(--color-neutral-120)
}

.olx-tooltip__arrow,
.olx-tooltip__close-button,
.olx-tooltip__content-wrapper,
.olx-tooltip__description,
.olx-tooltip__floating,
.olx-tooltip__title {
    z-index: var(--tooltip-z-index)
}

.olx-tooltip__content-wrapper {
    row-gap: var(--spacing-0-25)
}

.olx-tooltip__close-button {
    border-radius: var(--border-radius-1);
    color: var(--color-neutral-130);
    cursor: pointer;
    background-color: #0000;
    border: none;
    width: fit-content;
    height: fit-content;
    margin-left: auto;
    padding: 0;
    display: flex
}

.olx-tooltip__close-button--secondary {
    color: var(--color-neutral-70)
}

.olx-tooltip:focus,
.olx-tooltip__close-button:focus {
    outline: var(--color-neutral-130)solid var(--border-width-0-25);
    outline-offset: var(--border-width-0-25)
}

.olx-tooltip__arrow {
    fill: var(--color-neutral-70)
}

.olx-tooltip__arrow--secondary {
    fill: var(--color-neutral-120)
}

.olx-tooltip__description,
.olx-tooltip__title {
    color: var(--color-neutral-130)
}

.olx-tooltip__description--secondary,
.olx-tooltip__title--secondary {
    color: var(--color-neutral-70)
}

.olx-progress-circle--internal-value {
    height: var(--size);
    width: var(--size);
    position: relative
}

.olx-progress-circle--internal-value:after {
    color: var(--internal-value-color);
    content: attr(data-internal-value);
    font-size: var(--font-size);
    text-align: center;
    margin: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.olx-progress-circle__svg {
    stroke-dashoffset: var(--dash-offset);
    fill: #0000;
    stroke: var(--stroke);
    stroke-width: var(--stroke-width);
    stroke-dasharray: var(--circumference)var(--circumference);
    transform-origin: 50%;
    transition: var(--transition-duration-4)stroke-dashoffset;
    transform: rotate(-90deg)
}

.olx-price-reference-ruler__full {
    width: 100%;
    max-width: 326px;
    display: flex
}

.olx-price-reference-ruler__flex {
    gap: var(--spacing-0-25);
    width: 100%;
    display: flex
}

.olx-price-reference-ruler__rect {
    background: var(--background-color);
    border-radius: var(--border-radius);
    height: 20px;
    width: var(--width);
    display: inline-block;
    position: relative
}

.olx-price-reference-ruler__pin-icon {
    bottom: calc(var(--spacing-1)*-1 + 1px);
    left: calc(50% - var(--spacing-1));
    position: absolute
}

.olx-price-reference-ruler__pin-icon--left {
    bottom: calc(var(--spacing-1)*-1 + 1px);
    position: absolute;
    left: 5%
}

.olx-price-reference-ruler__pin-icon--right {
    bottom: calc(var(--spacing-1)*-1 + 1px);
    position: absolute;
    right: 5%
}

.olx-price-reference-ruler__pin-icon--dynamic {
    filter: drop-shadow(var(--shadow-bottom-1));
    left: var(--left-dynamic);
    top: calc(var(--spacing-1)*-1 - 1px);
    position: absolute
}

.olx-price-reference-ruler__tooltip {
    background-color: var(--color-neutral-80);
    border-radius: var(--spacing-0-5);
    filter: drop-shadow(var(--shadow-bottom-1));
    margin-bottom: var(--spacing-1);
    padding: var(--spacing-0-5);
    text-align: center;
    display: flex;
    position: relative
}

.olx-input-chips__content {
    background-color: var(--textinput-background-color-base);
    border-radius: var(--border-radius-1);
    box-shadow: 0 0 0 var(--border-width-0-1)var(--textinput-border-color-empty);
    color: var(--textinput-color-font);
    align-items: center;
    gap: var(--spacing-1-5)var(--spacing-1);
    padding: var(--spacing-1-5)var(--spacing-2);
    z-index: var(--elevation-1);
    border: none;
    flex-wrap: wrap;
    display: flex;
    position: relative
}

.olx-input-chips__content:hover {
    box-shadow: 0 0 0 var(--border-width-0-25)var(--textinput-border-color-hover)
}

.olx-input-chips__content:focus-within {
    outline: var(--border-width-0-25)solid var(--color-neutral-130)
}

.olx-input-chips__content--has-content {
    box-shadow: 0 0 0 var(--border-width-0-1)var(--textinput-border-color-filled);
    padding: var(--spacing-1)var(--spacing-2)
}

.olx-input-chips__content--error {
    background-color: var(--textinput-background-color-error);
    box-shadow: 0 0 0 var(--border-width-0-1)var(--textinput-border-color-error)
}

.olx-input-chips__content--disabled {
    background-color: var(--textinput-background-color-disabled);
    box-shadow: 0 0 0 var(--border-width-0-1)var(--textinput-border-color-disabled);
    cursor: not-allowed
}

.olx-input-chips__content--disabled:focus-within,
.olx-input-chips__content--disabled:hover {
    box-shadow: 0 0 0 var(--border-width-0-1)var(--textinput-border-color-disabled)
}

.olx-input-chips__chip {
    animation: .2s pop-animation
}

@keyframes pop-animation {
    0% {
        opacity: 0;
        transform: scale(.9)
    }

    50% {
        opacity: 1;
        transform: scale(1.01)
    }

    to {
        transform: scale(1)
    }
}

.olx-input-chips__input {
    background-color: inherit;
    font-family: var(--font-family-primary);
    font-size: var(--font-size-2);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-distant);
    border: 0;
    outline: 0;
    flex: 1;
    min-width: 40%;
    padding: 0;
    position: relative
}

.olx-input-chips__input ::placeholder {
    color: var(--textinput-color-placeholder)
}

.olx-input-chips__input:disabled {
    cursor: not-allowed
}

.olx-input-chips__icon-wrapper {
    justify-content: center;
    align-items: center;
    width: 24px;
    min-width: 24px;
    max-width: 24px;
    display: inline-flex
}

.olx-input-chips__icon-wrapper svg {
    fill: var(--textinput-icon-color);
    width: 100%;
    height: 100%
}

.olx-layout-container {
    padding-left: var(--spacing-2, 16px);
    padding-right: var(--spacing-2, 16px);
    width: 100%;
    margin-left: auto;
    margin-right: auto
}

@media screen and (min-width:840px) {
    .olx-layout-container {
        padding-left: var(--spacing-4, 32px);
        padding-right: var(--spacing-4, 32px)
    }
}

@media screen and (min-width:1200px) {
    .olx-layout-container {
        padding-left: var(--spacing-9, 72px);
        padding-right: var(--spacing-9, 72px)
    }
}

@media screen and (min-width:1500px) {
    .olx-layout-container {
        padding-left: var(--spacing-9, 72px);
        padding-right: var(--spacing-9, 72px)
    }
}

@media screen and (min-width:1720px) {
    .olx-layout-container {
        max-width: 1576px;
        padding: 0
    }
}

.olx-icon-action__icon-wrapper {
    background-color: var(--background-color);
    border-radius: var(--border-radius-5);
    justify-content: center;
    align-items: center;
    display: inline-flex;
    position: relative
}

.olx-icon-action__icon-wrapper[data-notification]:before {
    box-sizing: content-box;
    color: var(--color-neutral-70);
    content: attr(data-notification);
    text-align: center;
    background: #f78323;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    width: 17px;
    height: 17px;
    padding: 1px;
    font-size: 10px;
    font-weight: 700;
    display: flex;
    position: absolute;
    top: 0;
    right: -4px
}

.olx-icon-action__icon-wrapper:after {
    border-radius: var(--border-radius-5);
    content: "";
    height: 100%;
    opacity: var(--opacity-8);
    background-color: #0000;
    width: 100%;
    display: block;
    position: absolute
}

.olx-icon-action__icon-wrapper--small {
    padding: var(--spacing-1)
}

.olx-icon-action__icon-wrapper--small svg {
    width: 16px;
    height: 16px
}

.olx-icon-action__icon-wrapper--medium {
    padding: var(--spacing-1)
}

.olx-icon-action__icon-wrapper--medium svg {
    width: 24px;
    height: 24px
}

.olx-icon-action__icon-wrapper--large {
    padding: var(--spacing-2)
}

.olx-icon-action__icon-wrapper--large svg {
    width: 24px;
    height: 24px
}

.olx-icon-action__icon-wrapper--extra-large {
    padding: var(--spacing-2)
}

.olx-icon-action__icon-wrapper--extra-large svg {
    width: 32px;
    height: 32px
}

.olx-icon-action__icon-wrapper--disabled {
    --background-color: var(--color-neutral-80);
    cursor: not-allowed
}

.olx-icon-action {
    background: 0 0;
    border: none;
    flex-direction: column;
    align-items: center;
    padding: 0;
    text-decoration: none;
    display: inline-flex
}

.olx-icon-action--interactive {
    cursor: pointer
}

.olx-icon-action--interactive:hover .olx-icon-action__icon-wrapper:after {
    background-color: var(--color-neutral-130)
}

.olx-icon-action:disabled svg {
    color: var(--color-neutral-100)
}

.olx-icon-action:focus-visible {
    border-radius: var(--border-radius-0-5);
    outline: var(--color-neutral-130)solid var(--border-width-0-25);
    transition: outline, outline-offset
}

.olx-icon-action__spinner {
    justify-content: center;
    align-items: center;
    display: flex
}

.olx-icon-action__label {
    text-align: center;
    word-break: break-word
}

.olx-icon-action__label--disabled {
    color: var(--color-neutral-100)
}

.olx-chips__icon-wrapper {
    justify-content: center;
    align-items: center;
    display: inline-flex
}

.olx-chips__icon-wrapper svg {
    fill: var(--textinput-icon-color);
    max-height: var(--spacing-2);
    max-width: var(--spacing-2)
}

.olx-chips__input-wrapper svg {
    fill: var(--textinput-icon-color);
    max-width: 16px;
    max-height: 16px
}

.olx-chips__input {
    clip: rect(1px, 1px, 1px, 1px);
    color: var(--color-neutral-130);
    border: 0;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    position: absolute;
    overflow: hidden
}

.olx-chips__input+label {
    border: var(--border-width-0-1)solid var(--color-neutral-110);
    border-radius: var(--border-radius-1);
    color: var(--color-neutral-130);
    cursor: pointer;
    font-family: var(--font-family-primary);
    font-size: var(--font-size-1-75);
    align-items: center;
    gap: var(--spacing-1);
    line-height: var(--line-height-distant);
    min-inline-size: max-content;
    max-inline-size: max-content;
    padding: var(--spacing-1);
    transition: all var(--transition-delay-2)var(--transition-timing-ease-in-out);
    -webkit-user-select: none;
    user-select: none;
    flex-direction: row;
    justify-content: center;
    display: inline-flex
}

.olx-chips__input+label--one-value {
    padding-left: var(--spacing-2);
    padding-right: var(--spacing-2)
}

.olx-chips__input:checked+label {
    background: var(--color-secondary-70);
    border-color: var(--color-secondary-100);
    border: 1px solid var(--color-secondary-100);
    color: var(--color-secondary-100);
    transition: all var(--transition-delay-2)var(--transition-timing-ease-in-out)
}

.olx-chips__input:focus+label {
    outline: none
}

.olx-chips__input:focus-visible+label {
    border-radius: var(--border-radius-1);
    outline: var(--color-neutral-130)solid var(--border-width-0-25);
    outline-offset: var(--border-width-0-25);
    transition: outline, outline-offset
}

.olx-chips__input:disabled+label {
    background-color: unset;
    border: 1px solid var(--color-neutral-100);
    color: var(--color-neutral-100);
    cursor: not-allowed;
    pointer-events: none
}

.olx-chips__input:hover:not(:checked, :disabled)+label {
    background-color: unset;
    border: 1px solid var(--color-secondary-120);
    color: var(--color-secondary-120)
}

.olx-chips__items {
    gap: var(--spacing-1);
    flex-wrap: wrap
}

.olx-chips__item,
.olx-chips__items {
    display: inline-flex
}

.olx-footer__wrapper {
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap;
    width: 1px;
    height: 1px;
    display: flex;
    position: absolute;
    overflow: hidden
}

.olx-default-footer {
    border-top: 1px solid var(--divider-default-background-color);
    padding: var(--spacing-2)var(--spacing-2)var(--spacing-8)
}

@media screen and (min-width:840px) {
    .olx-default-footer {
        padding: var(--spacing-2)var(--spacing-4)var(--spacing-3)
    }
}

@media screen and (min-width:1200px) {
    .olx-default-footer {
        padding: var(--spacing-2)var(--spacing-9)var(--spacing-3)
    }
}

@media screen and (min-width:1720px) {
    .olx-default-footer {
        grid-template-columns: 1576px;
        justify-content: center;
        display: grid
    }
}

.olx-default-footer__container {
    color: var(--footer-color);
    max-width: 1140px;
    margin: 0 auto
}

.olx-default-footer__links-container {
    gap: var(--spacing-2);
    padding-bottom: var(--spacing-2);
    flex-direction: column
}

@media screen and (min-width:840px) {
    .olx-default-footer__links-container {
        gap: var(--spacing-4);
        flex-direction: row
    }
}

.olx-default-footer__left-column {
    -moz-column-gap: var(--spacing-4);
    align-items: center;
    column-gap: var(--spacing-4);
    flex-direction: row;
    flex: 1;
    justify-content: flex-start;
    display: flex
}

@media screen and (max-width:1075px) {
    .olx-default-footer__left-column {
        row-gap: var(--spacing-2);
        flex-direction: column
    }
}

.olx-default-footer__right-column {
    -moz-column-gap: var(--spacing-4);
    column-gap: var(--spacing-4);
    flex-direction: row;
    justify-content: flex-end;
    display: flex
}

@media screen and (max-width:1075px) {
    .olx-default-footer__right-column {
        -moz-column-gap: var(--spacing-1);
        column-gap: var(--spacing-1);
        margin-top: var(--spacing-3);
        justify-content: center
    }
}

.olx-default-footer__address,
.olx-default-footer__legal-links {
    display: block
}

.olx-default-footer__icon-wrapper {
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    display: inline-flex
}

.olx-seo-footer {
    padding: 0 var(--spacing-2)var(--spacing-8);
    width: 100%;
    margin: 0 auto;
    position: relative
}

@media screen and (min-width:840px) {
    .olx-seo-footer {
        padding: 0 var(--spacing-4)var(--spacing-3)
    }
}

@media screen and (min-width:1200px) {
    .olx-seo-footer {
        padding: 0 72px var(--spacing-3)
    }
}

@media screen and (min-width:1720px) {
    .olx-seo-footer {
        grid-template-columns: 1576px;
        justify-content: center;
        display: grid
    }
}

.olx-seo-footer__links-container {
    gap: var(--spacing-2);
    padding: var(--spacing-3)var(--spacing-2);
    flex-direction: column;
    display: flex
}

@media screen and (min-width:840px) {
    .olx-seo-footer__links-container {
        gap: var(--spacing-3);
        grid-template-columns: 1fr auto;
        display: grid
    }
}

.olx-seo-footer__legal-container,
.olx-seo-footer__legal-links-container {
    justify-content: center;
    row-gap: var(--spacing-1);
    flex-direction: column;
    display: flex
}

@media screen and (min-width:600px) {
    .olx-seo-footer__legal-links-container {
        -moz-column-gap: var(--spacing-2);
        column-gap: var(--spacing-2);
        flex-direction: row
    }
}

@media screen and (min-width:840px) {
    .olx-seo-footer__legal-links-container {
        justify-content: flex-start
    }
}

.olx-seo-footer__social-container {
    gap: var(--spacing-1);
    grid-template-rows: repeat(2, 48px);
    grid-template-columns: repeat(3, 48px);
    justify-content: center;
    display: grid
}

@media screen and (min-width:600px) {
    .olx-seo-footer__social-container {
        grid-template-rows: 48px;
        grid-template-columns: repeat(6, 48px)
    }
}

@media screen and (min-width:840px) {
    .olx-seo-footer__social-container {
        justify-content: flex-end
    }
}

.olx-seo-footer__legal-links {
    display: block
}

.olx-seo-footer__address-container {
    text-align: center;
    display: block
}

@media screen and (min-width:840px) {
    .olx-seo-footer__address-container {
        text-align: left
    }
}

.olx-seo-footer__icon-wrapper {
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    display: inline-flex
}

.olx-seo-footer__tab-column {
    align-items: flex-start;
    row-gap: var(--spacing-1-5);
    flex-direction: column;
    display: flex
}

.olx-seo-footer__link {
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    display: flex
}

.olx-seo-footer__tab-content-wrapper {
    padding: var(--spacing-2)0
}

@media screen and (min-width:840px) {
    .olx-seo-footer__tab-content-wrapper {
        padding: var(--spacing-3)0
    }
}

.olx-seo-footer__tab-content {
    gap: 12px var(--spacing-3);
    grid-template-columns: 1fr;
    display: grid
}

@media screen and (min-width:840px) {
    .olx-seo-footer__tab-content {
        grid-template-columns: repeat(5, 1fr)
    }
}

@media screen and (max-width:840px) {
    .olx-seo-footer__tab-content {
        height: 173px;
        overflow: hidden
    }
}

.olx-seo-footer__tab-content--expanded {
    height: auto
}

.olx-seo-footer__more-button {
    margin-left: auto;
    margin-right: auto;
    margin-top: var(--spacing-1-5);
    display: flex
}

@media screen and (min-width:840px) {
    .olx-seo-footer__more-button {
        display: none
    }
}

.olx-seo-footer__tab-wrapper {
    padding: var(--spacing-2)0
}

@media screen and (min-width:840px) {
    .olx-seo-footer__tab-wrapper {
        padding: var(--spacing-3)0
    }
}

.olx-static-footer__links-container {
    align-items: center;
    gap: var(--spacing-3);
    padding: var(--spacing-3)0;
    flex-direction: column;
    justify-content: center;
    display: flex
}

@media screen and (min-width:1200px) {
    .olx-static-footer__links-container {
        grid-template-columns: auto;
        display: grid
    }
}

.olx-static-footer__legal-container,
.olx-static-footer__legal-container-links {
    justify-content: center;
    row-gap: var(--spacing-1-5);
    flex-direction: column;
    display: flex
}

@media screen and (min-width:840px) {
    .olx-static-footer__legal-container-links {
        -moz-column-gap: var(--spacing-2);
        column-gap: var(--spacing-2);
        flex-direction: row;
        justify-content: flex-start
    }
}

.olx-static-footer__address-social-container {
    padding-top: var(--spacing-3);
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    display: flex
}

.olx-static-footer__social-container {
    gap: var(--spacing-1);
    flex-wrap: wrap;
    justify-content: center;
    width: 175px;
    display: flex
}

@media screen and (min-width:840px) {
    .olx-static-footer__social-container {
        width: 100%
    }
}

.olx-static-footer__legal-container-address {
    text-align: center;
    display: block
}

@media screen and (min-width:840px) {
    .olx-static-footer__legal-container-address {
        text-align: left
    }
}

.olx-static-footer__icon-wrapper {
    justify-content: center;
    align-items: center;
    width: 48px;
    height: 48px;
    display: inline-flex
}

.olx-static-footer__social-link {
    border-radius: 100%;
    transition: all .3s
}

.olx-static-footer__social-link:active svg,
.olx-static-footer__social-link:hover svg {
    color: var(--color-neutral-70)
}

.olx-static-footer__facebook-link:active,
.olx-static-footer__facebook-link:hover {
    background-color: #3a5998
}

.olx-static-footer__youtube-link:active,
.olx-static-footer__youtube-link:hover {
    background-color: red
}

.olx-static-footer__tiktok-link:active,
.olx-static-footer__tiktok-link:hover {
    background-color: #040000
}

.olx-static-footer__linkedin-link:active,
.olx-static-footer__linkedin-link:hover {
    background-color: #0084bf
}

.olx-static-footer__instagram-link:active,
.olx-static-footer__instagram-link:hover {
    background-color: #e1306c
}

.olx-static-footer__twitter-link:active,
.olx-static-footer__twitter-link:hover {
    background-color: #040000
}

.olx-static-footer__icom-link:active,
.olx-static-footer__icom-link:hover {
    background-color: #19b2e8
}

.olx-old-static-footer__links-container {
    align-items: center;
    gap: var(--spacing-3);
    padding-top: var(--spacing-2);
    flex-direction: column;
    display: flex
}

@media screen and (min-width:1200px) {
    .olx-old-static-footer__links-container {
        grid-template-columns: 1fr auto;
        display: grid
    }
}

.olx-old-static-footer__legal-container,
.olx-old-static-footer__legal-container-links {
    justify-content: center;
    row-gap: var(--spacing-1-5);
    flex-direction: column;
    display: flex
}

@media screen and (min-width:840px) {
    .olx-old-static-footer__legal-container-links {
        -moz-column-gap: var(--spacing-2);
        column-gap: var(--spacing-2);
        flex-direction: row;
        justify-content: flex-start
    }
}

.olx-old-static-footer__social-container {
    gap: var(--spacing-1);
    flex-wrap: wrap;
    justify-content: center;
    display: flex
}

.olx-old-static-footer__legal-container-address {
    text-align: center;
    display: block
}

@media screen and (min-width:840px) {
    .olx-old-static-footer__legal-container-address {
        text-align: left
    }
}

.olx-old-static-footer__icon-wrapper {
    justify-content: center;
    align-items: center;
    width: 48px;
    height: 48px;
    display: inline-flex
}

.olx-old-static-footer__social-link {
    border-radius: 100%;
    transition: all .3s
}

.olx-old-static-footer__social-link:active svg,
.olx-old-static-footer__social-link:hover svg {
    color: var(--color-neutral-70)
}

.olx-old-static-footer__facebook-link:active,
.olx-old-static-footer__facebook-link:hover {
    background-color: #3a5998
}

.olx-old-static-footer__youtube-link:active,
.olx-old-static-footer__youtube-link:hover {
    background-color: red
}

.olx-old-static-footer__tiktok-link:active,
.olx-old-static-footer__tiktok-link:hover {
    background-color: #040000
}

.olx-old-static-footer__linkedin-link:active,
.olx-old-static-footer__linkedin-link:hover {
    background-color: #0084bf
}

.olx-old-static-footer__instagram-link:active,
.olx-old-static-footer__instagram-link:hover {
    background-color: #e1306c
}

.olx-old-static-footer__twitter-link:active,
.olx-old-static-footer__twitter-link:hover {
    background-color: #040000
}

.olx-old-static-footer__icom-link:active,
.olx-old-static-footer__icom-link:hover {
    background-color: #19b2e8
}

.dark .olx-static-footer__social-link {
    padding: var(--spacing-1);
    border-radius: 100%;
    transition: all .3s
}

.dark .olx-static-footer__social-link:active svg,
.dark .olx-static-footer__social-link:hover svg {
    color: var(--color-neutral-130)
}

.olx-card-suggestion {
    border-radius: var(--border-radius-1);
    padding: var(--spacing-4)var(--spacing-3);
    align-items: stretch
}

@media screen and (min-width:840px) {
    .olx-card-suggestion {
        padding: var(--spacing-4);
        flex: 1 0 0;
        align-self: stretch
    }
}

.olx-card-suggestion__content {
    align-content: center;
    align-items: center;
    gap: var(--spacing-3);
    flex-wrap: wrap;
    flex: 1 0 0;
    display: flex
}

.olx-card-suggestion__info-action {
    align-items: flex-start;
    gap: var(--spacing-2);
    flex-direction: column;
    display: flex
}

@media screen and (min-width:360px) {
    .olx-card-suggestion__info-action {
        flex: 1 0 0;
        min-width: 250px
    }
}

.olx-card-suggestion__info {
    align-self: stretch;
    align-items: flex-start;
    gap: var(--spacing-1);
    flex-direction: column;
    justify-content: center;
    display: flex
}

.olx-card {
    background-color: var(--color-neutral-70);
    border-radius: var(--border-radius-1);
    flex-direction: column
}

.olx-card--outlined {
    border: 1px solid var(--color-neutral-90)
}

.olx-card--elevated {
    box-shadow: var(--shadow-bottom-6)
}

.olx-card-image {
    overflow: hidden
}

.olx-card-image__img {
    transition: scale var(--transition-duration-5)var(--transition-timing-ease)
}

.olx-card:hover .olx-card-image__img {
    scale: 1.1
}

.olx-card-top-image {
    flex-direction: row;
    align-items: center
}

.olx-card-top-image__primary {
    width: 60%
}

.olx-card-top-image .olx-card-image {
    border-bottom-left-radius: var(--border-radius-1);
    border-top-left-radius: var(--border-radius-1)
}

.olx-card-top-image__secondary {
    gap: var(--spacing-0-5);
    padding: 0 var(--spacing-2);
    width: 40%
}

@media screen and (min-width:840px) {
    .olx-card-top-image {
        flex-direction: column
    }

    .olx-card-top-image .olx-card-image {
        border-radius: var(--border-radius-1)
    }

    .olx-card-top-image__primary,
    .olx-card-top-image__secondary {
        width: 100%
    }

    .olx-card-top-image__secondary {
        margin-top: var(--spacing-0-5);
        padding: 0
    }
}

.olx-card-cover-image {
    gap: var(--spacing-0-5)
}

.olx-card-cover-image--text-down {
    flex-direction: column-reverse
}

.olx-card-cover-image__primary {
    gap: var(--spacing-0-5);
    padding: var(--spacing-1)
}

.olx-progressbar {
    background-color: var(--background-fill);
    height: var(--bar-height);
    width: 100%;
    overflow: hidden
}

.olx-progressbar__bar {
    background-color: var(--bar-fill);
    height: 100%;
    transition: width var(--transition-duration-3)ease-in-out;
    width: var(--bar-width)
}

.olx-progressstepped {
    width: 100%
}

.olx-progressstepped__container-cta {
    background-color: var(--color-neutral-70);
    padding: var(--spacing-2);
    padding-top: var(--spacing-3)
}

@media screen and (max-width:360px) {
    .olx-progressstepped__container-cta {
        padding: var(--spacing-2)
    }
}

.olx-progressstepped__content-cta-left,
.olx-progressstepped__content-cta-right {
    width: 50%
}

.olx-form-control__bottom-left {
    align-items: center;
    gap: var(--spacing-0-5);
    display: flex
}

.olx-form-control__bottom-left svg {
    flex-shrink: 0
}

.olx-adbadge--highlight {
    --badge-background-color: var(--color-secondary-100);
    --badge-color: var(--color-neutral-70)
}

.olx-adbadge--boosted {
    --badge-background-color: var(--color-primary-100);
    --badge-color: var(--color-neutral-70)
}

.olx-adbadge--sponsored {
    --badge-background-color: var(--color-neutral-110);
    --badge-color: var(--color-neutral-70)
}

.olx-adbadge--vehicle_history {
    --badge-background-color: var(--color-feedback-success-100);
    --badge-color: var(--color-neutral-70)
}

.olx-navbar {
    background-color: var(--color-neutral-70);
    border-top: 1px solid var(--color-neutral-90);
    box-sizing: border-box;
    width: 100%;
    height: 60px;
    z-index: var(--elevation-2);
    padding: 0 4px;
    position: fixed;
    bottom: 0;
    left: 0
}

.olx-navbar svg {
    min-height: 24px
}

@media screen and (min-width:840px) {
    .olx-navbar {
        display: none
    }
}

.olx-navbar[data-open=true] {
    z-index: var(--elevation-3)
}

.olx-navbar__items {
    text-align: center;
    justify-content: space-around;
    margin: 0;
    padding: 0;
    list-style-type: none
}

.olx-navbar__items,
.olx-navbar__link {
    align-items: center;
    height: 100%;
    display: flex
}

.olx-navbar__link {
    color: var(--color-neutral-130);
    cursor: pointer;
    background-color: #0000;
    border: 0;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    padding: 8px 0
}

.olx-navbar__link :focus-visible:focus:not(:focus-visible),
.olx-navbar__link:focus {
    border-radius: var(--border-radius-0-25);
    box-shadow: none;
    outline: var(--border-width-0-25)solid var(--color-neutral-130);
    outline-offset: 0
}

.olx-navbar__link:hover:not(button) {
    color: var(--color-neutral-130);
    text-decoration: none
}

.olx-navbar__link:focus:not(:focus-visible) {
    box-shadow: none;
    outline: 0
}

.olx-navbar--active,
.olx-navbar__button--active {
    color: var(--color-primary-120)
}

.olx-navbar__caption {
    margin-top: var(--spacing-0-5);
    transition: transform .2s ease-out
}

@media screen and (max-width:318px) {
    .olx-navbar__caption {
        font-size: 10px
    }
}

.olx-navbar__item {
    text-overflow: ellipsis;
    white-space: nowrap;
    align-items: center;
    width: auto;
    min-width: 44px;
    height: 100%;
    display: flex
}

.olx-navbar__middle-item {
    min-width: 70px
}

@media screen and (min-width:300px) {
    .olx-navbar__middle-item {
        min-width: 85px
    }
}

.olx-navbar__icon-wrapper {
    width: 24px;
    height: 24px
}

.olx-navbar__notification-wrapper[data-counter]:not([data-counter="0"]) {
    max-width: 24px;
    display: inline-flex;
    position: relative
}

.olx-navbar__notification-wrapper[data-counter]:not([data-counter="0"]):after {
    box-sizing: content-box;
    color: var(--color-neutral-70);
    content: attr(data-counter);
    pointer-events: none;
    text-align: center;
    background: #f78323;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    width: 17px;
    height: 17px;
    padding: 1px;
    font-size: 10px;
    font-weight: 700;
    line-height: 19px;
    animation: 1s forwards pop;
    display: flex;
    position: absolute;
    top: -8px;
    left: 8px
}

.olx-header {
    font-family: var(--font-family-primary);
    z-index: var(--elevation-2);
    flex-direction: column;
    justify-content: center;
    display: flex;
    position: relative
}

.olx-header[data-fixed=true] {
    width: 100%;
    position: fixed;
    top: 0
}

.olx-header[data-open=true] {
    z-index: var(--elevation-3)
}

.olx-header[data-isloading=true] {
    opacity: 0
}

.olx-header__skip-links {
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap;
    width: 1px;
    height: 1px;
    position: absolute;
    overflow: hidden
}

.olx-header__skip-links:focus {
    clip: auto;
    background-color: var(--color-neutral-70);
    box-shadow: 0 0 0 2px var(--color-neutral-70);
    color: var(--color-neutral-130);
    outline: var(--border-width-0-25)solid var(--color-neutral-130);
    height: 50px;
    overflow: initial;
    white-space: normal;
    z-index: 2;
    width: 60px;
    transition: none;
    display: inline-block;
    top: 50%;
    left: 0;
    transform: translateY(-50%)
}

.olx-header__main-menu {
    background-color: var(--color-neutral-70);
    border-bottom: 1px solid var(--color-neutral-90);
    min-height: 80px;
    padding: var(--spacing-2)var(--spacing-2);
    flex-direction: column;
    justify-content: center;
    display: flex
}

@media screen and (min-width:840px) {
    .olx-header__main-menu {
        padding: var(--spacing-2)var(--spacing-4)
    }
}

@media screen and (min-width:1200px) {
    .olx-header__main-menu {
        padding: var(--spacing-2)var(--spacing-9)
    }
}

.olx-header__items {
    align-items: center;
    margin: 0;
    padding: 0;
    display: flex
}

@media screen and (min-width:1200px) {
    .olx-header__items {
        -moz-column-gap: var(--spacing-2);
        column-gap: var(--spacing-2)
    }
}

@media screen and (min-width:1500px) {
    .olx-header__items {
        -moz-column-gap: var(--spacing-3);
        column-gap: var(--spacing-3)
    }
}

.olx-header__icon-button {
    color: var(--color-neutral-130);
    cursor: pointer;
    background-color: #0000;
    border: none;
    outline: none;
    justify-content: center;
    align-items: center;
    width: 48px;
    height: 48px;
    margin: 0;
    padding: 0;
    display: flex
}

.olx-header__icon-button :hover {
    color: var(--link-color-main-hover)
}

.olx-header__icon-button :focus {
    border-radius: var(--border-radius-0-25);
    outline: var(--border-width-0-25)solid var(--color-neutral-130)
}

.olx-header__item {
    align-items: center;
    list-style: none;
    display: flex
}

.olx-header__item[data-variant=anunciar] {
    margin-left: var(--spacing-1-5)
}

@media screen and (max-width:840px) {

    .olx-header__item[data-hasnavbar=true],
    .olx-header__item[data-hidenotification=true] {
        display: none
    }
}

@media screen and (max-width:1200px) {

    .olx-header__item[data-myads=true],
    .olx-header__item[data-professional=true] {
        display: none
    }
}

@media screen and (min-width:1200px) {

    .olx-header__item[data-variant=anunciar],
    .olx-header__item[data-variant=profile] {
        margin-left: 0
    }
}

@media screen and (max-width:1200px) {
    .olx-header__link {
        padding: 12px
    }
}

.olx-header__link {
    -moz-column-gap: var(--spacing-1);
    column-gap: var(--spacing-1)
}

.olx-header__link:hover {
    text-decoration: none
}

.olx-header__primary-menu {
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    max-width: 1576px;
    margin: 0 auto;
    display: flex
}

.olx-header__burger-menu {
    justify-content: flex-start;
    width: 48px;
    height: 48px
}

.olx-header__burger-menu:focus {
    border-radius: var(--border-radius-0-25);
    outline: var(--color-neutral-130)solid var(--border-width-0-25)
}

@media screen and (max-width:360px) {
    .olx-header__burger-menu {
        width: 44px;
        height: 44px
    }
}

@media screen and (min-width:840px) {
    .olx-header__burger-menu {
        display: none
    }
}

.olx-header__back-button {
    margin-right: var(--spacing-1)
}

@media screen and (min-width:840px) {
    .olx-header__back-button {
        display: none
    }
}

.olx-header__column-left {
    flex: 1;
    align-items: center;
    display: flex;
    position: relative
}

.olx-header__column-right {
    display: flex
}

.olx-header__olx-container {
    color: var(--color-neutral-130);
    -moz-column-gap: 32px;
    font-size: var(--font-size-1-75);
    align-items: center;
    column-gap: 32px;
    width: 48px;
    height: 48px;
    display: flex
}

.olx-header__logo-wrapper {
    width: 24px;
    height: 24px
}

.olx-header__onboarding-tooltip>* {
    width: 100%;
    height: 100%
}

.olx-header__onboarding-tooltip--burger svg {
    display: block
}

.olx-header__onboarding-tooltip--navbar {
    margin: auto
}

.olx-header__banner {
    cursor: pointer;
    text-align: start;
    text-decoration: none
}

.olx-header__banner>svg {
    min-width: 64px
}

.olx-header__banner:hover {
    background: var(--color-neutral-80)
}

.olx-header__banner:active {
    background: var(--color-neutral-90)
}

.olx-header__banner:focus {
    border-radius: var(--border-radius-1);
    outline: var(--border-width-0-25)solid var(--color-neutral-130)
}

.olx-header__banner:focus:not(:focus-visible) {
    outline-offset: 0;
    outline: 0
}

.olx-header__notification-wrapper[data-counter]:not([data-counter="0"]) {
    max-width: 24px;
    display: inline-flex;
    position: relative
}

.olx-header__notification-wrapper[data-counter]:not([data-counter="0"]):after {
    box-sizing: content-box;
    color: var(--color-neutral-70);
    content: attr(data-counter);
    pointer-events: none;
    text-align: center;
    background: #f78323;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    width: 17px;
    height: 17px;
    padding: 1px;
    font-size: 10px;
    font-weight: 700;
    line-height: 19px;
    animation: 1s forwards pop;
    display: flex;
    position: absolute;
    top: -8px;
    left: -8px
}

.olx-header__notification-wrapper[data-counter]:not([data-counter="0"]) svg {
    backface-visibility: hidden;
    transform-origin: 100% 0;
    animation: 1.5s cubic-bezier(.25, .46, .45, .94) 1s 3 bell-shake
}

@keyframes bell-shake {
    0% {
        transform: rotate(0)
    }

    5% {
        transform: rotate(10deg)
    }

    10% {
        transform: rotate(-10deg)
    }

    15% {
        transform: rotate(10deg)
    }

    20% {
        transform: rotate(-10deg)
    }

    25% {
        transform: rotate(0)
    }

    75% {
        transform: rotate(0)
    }

    80% {
        transform: rotate(10deg)
    }

    85% {
        transform: rotate(-10deg)
    }

    90% {
        transform: rotate(10deg)
    }

    95% {
        transform: rotate(-10deg)
    }

    to {
        transform: rotate(0)
    }
}

@keyframes pop {
    0% {
        transform: scale(0)
    }

    25% {
        transform: scale(1.25)
    }

    50% {
        transform: scale(.8)
    }

    75% {
        transform: scale(1.25)
    }

    to {
        transform: scale(1)
    }
}

@media screen and (max-width:1200px) {
    .olx-header__label {
        clip: rect(1px, 1px, 1px, 1px);
        white-space: nowrap;
        width: 1px;
        height: 1px;
        display: flex;
        position: absolute;
        overflow: hidden
    }

    .olx-header__label[data-variant=chat],
    .olx-header__label[data-variant=notification] {
        clip: auto;
        display: initial;
        height: auto;
        overflow: initial;
        white-space: normal;
        width: auto;
        position: static
    }
}

@media screen and (max-width:840px) {

    .olx-header__label[data-variant=chat],
    .olx-header__label[data-variant=notification] {
        clip: rect(1px, 1px, 1px, 1px);
        white-space: nowrap;
        width: 1px;
        height: 1px;
        display: flex;
        position: absolute;
        overflow: hidden
    }
}

.olx-header__desapegar-button {
    font-size: var(--font-size-1-75);
    text-align: center;
    width: 135px
}

@media screen and (min-width:840px) {
    .olx-header__desapegar-button {
        width: 155px
    }
}

@media screen and (max-width:840px) {
    .olx-header__desapegar-button {
        height: 36px;
        padding: var(--spacing-1)var(--spacing-2)
    }
}

.olx-header__profile-nickname {
    font-size: var(--font-size-1-75);
    margin-left: var(--spacing-0-5);
    text-overflow: ellipsis;
    white-space: nowrap;
    justify-content: space-between;
    align-items: center;
    max-width: 80px;
    display: block;
    overflow: hidden
}

.olx-header__profile-item {
    align-items: center;
    list-style: none;
    display: flex
}

.olx-header__profile-skeleton {
    border: 1px solid var(--color-neutral-90);
    border-radius: var(--border-radius-4);
    display: none
}

@media screen and (min-width:840px) {
    .olx-header__profile-skeleton {
        display: block
    }
}

.olx-header__desapegar-skeleton {
    border: 1px solid var(--color-neutral-90);
    border-radius: var(--border-radius-4);
    width: 135px;
    height: 36px
}

@media screen and (min-width:840px) {
    .olx-header__desapegar-skeleton {
        width: 155px;
        height: 40px
    }
}

.olx-header__profile-link {
    border: 0;
    border: 1px solid var(--color-neutral-90);
    border-radius: var(--border-radius-4);
    color: var(--color-neutral-130);
    cursor: pointer;
    font-family: var(--font-family-primary);
    font-size: var(--font-size-1-75);
    font-weight: var(--font-weight-semibold);
    height: 40px;
    line-height: var(--line-height-medium);
    padding: var(--spacing-0-5);
    background-color: #0000;
    justify-content: center;
    align-items: center;
    width: 135px;
    display: flex
}

.olx-header__profile-link:hover {
    border-color: var(--color-secondary-100);
    color: var(--link-color-main-hover);
    text-decoration: none
}

.olx-header__profile-link:focus {
    border-radius: var(--border-radius-4);
    box-shadow: none;
    outline: var(--border-width-0-25)solid var(--color-neutral-130)
}

@media screen and (max-width:840px) {
    .olx-header__profile-link {
        display: none
    }
}

.olx-header__search {
    margin-left: var(--spacing-3);
    margin-right: var(--spacing-1-5);
    width: 100%
}

.olx-header__search[data-hasnavbar=true] {
    margin: 0 var(--spacing-2)
}

@media screen and (min-width:840px) {
    .olx-header__search {
        margin-right: var(--spacing-3)
    }
}

@media screen and (max-width:840px) {

    .olx-header__search[data-hasnavbar=false],
    .olx-header__search[data-hasnavbar=false] .olx-text-input__input-field {
        display: none
    }
}

.olx-header__search-fluid {
    padding-left: var(--spacing-3);
    padding-right: var(--spacing-3);
    padding-top: var(--spacing-2);
    width: 100%
}

@media screen and (min-width:840px) {

    .olx-header__search-fluid,
    .olx-header__search-fluid .olx-text-input__input-field {
        display: none
    }
}

@media screen and (max-width:840px) {
    .olx-header__search-fluid {
        padding-left: 0;
        padding-right: 0
    }
}

.olx-header__overlay {
    background: var(--color-neutral-130);
    opacity: 0;
    pointer-events: none;
    width: 100%;
    height: calc(100svh - 100%);
    transition: opacity 1s;
    position: absolute;
    top: 100%;
    left: 0
}

.olx-header__overlay[data-open=true] {
    opacity: var(--opacity-64);
    pointer-events: all;
    overflow-y: auto
}

@media screen and (min-width:840px) {
    .olx-header__overlay {
        display: none
    }
}

.olx-header__overflow {
    background-color: var(--color-neutral-70);
    box-shadow: var(--shadow-bottom-1);
    opacity: 0;
    pointer-events: none;
    scroll-behavior: smooth;
    height: 0;
    transition: transform ease var(--transition-duration-3), opacity ease var(--transition-duration-3);
    width: 280px;
    z-index: var(--elevation-3);
    padding-top: 2px;
    padding-bottom: 2px;
    list-style: none;
    position: absolute;
    top: 64px
}

.olx-header__overflow--no-border-top {
    border-radius: var(--border-radius-0) !important;
    border: none !important
}

.olx-header__overflow[aria-hidden=false] {
    border-top: 1px solid var(--color-neutral-90);
    height: auto
}

@media screen and (min-width:840px) {
    .olx-header__overflow {
        border-radius: var(--border-radius-1)
    }

    .olx-header__overflow[data-islogged=false] {
        display: none
    }

    .olx-header__overflow[data-fixed=true] {
        height: calc(100svh - 100%)
    }
}

@media screen and (max-width:840px) {
    .olx-header__overflow:not([data-hasnavbar=true]) {
        border-radius: 0;
        height: calc(100svh - 100%);
        padding-bottom: 50px;
        top: 100%;
        left: 0;
        overflow: hidden;
        transform: translate(100%)
    }

    .olx-header__overflow[data-expanded=true]:not([data-hasnavbar=true]) {
        height: calc(100svh - 100%);
        overflow: auto
    }

    .olx-header__overflow[data-hasnavbar=true] {
        width: 100%;
        height: calc(100% - 59px);
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        transform: translate(100%)
    }
}

.olx-header__overflow[data-expanded=true] {
    opacity: 1;
    pointer-events: all;
    overflow: auto;
    transform: translate(0)
}

.olx-header__overflow__loading {
    height: 100%;
    padding: var(--spacing-4);
    justify-content: center;
    align-items: center;
    width: 100%;
    display: flex;
    position: relative
}

.olx-header__overflow__loading .olx-logo-olx {
    width: 32px;
    height: 32px;
    position: absolute
}

.olx-header__overflow-logged-menu {
    background-color: var(--color-neutral-70);
    box-shadow: var(--shadow-level-2);
    opacity: 0;
    pointer-events: none;
    scroll-behavior: smooth;
    min-width: 300px;
    height: 0;
    transition: transform ease var(--transition-duration-3), opacity ease var(--transition-duration-3);
    width: 100%;
    z-index: var(--z-index-700-overlay);
    padding: 0;
    list-style: none;
    position: relative
}

.olx-header__overflow-logged-menu--no-border-top {
    border-radius: var(--border-radius-none) !important;
    border: none !important
}

.olx-header__overflow-logged-menu[aria-hidden=false] {
    border-top: 1px solid var(--color-neutral-90);
    height: auto
}

@media screen and (min-width:840px) {
    .olx-header__overflow-logged-menu {
        border-radius: var(--border-radius-sm)
    }

    .olx-header__overflow-logged-menu[data-islogged=false] {
        display: none
    }
}

@media screen and (max-width:840px) {
    .olx-header__overflow-logged-menu[data-hasnavbar=true] {
        width: 100%;
        height: calc(100% - 59px);
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        transform: translate(100%)
    }
}

.olx-header__overflow-logged-menu[data-expanded=true] {
    opacity: 1;
    pointer-events: all;
    overflow: auto;
    transform: translate(0)
}

.olx-header__overflow-logged-menu__loading {
    height: 100%;
    padding: var(--spacing-4);
    justify-content: center;
    align-items: center;
    width: 100%;
    display: flex;
    position: relative
}

.olx-header__overflow-logged-menu__loading .olx-logo-olx {
    width: 32px;
    height: 32px;
    position: absolute
}

.olx-header__overflow-drawer-header {
    background-color: var(--color-neutral-70);
    border-radius: 0 0 var(--border-radius-2)var(--border-radius-2)
}

.olx-header__overflow-drawer-header-text-container {
    min-width: 0
}

.olx-header__overflow-drawer-header-text-container>* {
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
    overflow: hidden
}

.olx-header__overflow-new-badge {
    font-weight: var(--font-weight-semibold);
    flex-shrink: 0;
    margin-left: auto
}

.olx-header__overflow-item[data-divider=true] {
    border-bottom: 1px solid var(--color-neutral-90);
    margin-bottom: var(--spacing-0-5)
}

.olx-header__overflow-item[data-haspos=true]:nth-child(2) {
    display: block
}

@media screen and (min-width:840px) {
    .olx-header__overflow-item[data-haspos=true]:nth-child(2) {
        display: none
    }
}

.olx-header__overflow-link {
    color: var(--color-neutral-130);
    -moz-column-gap: var(--spacing-2);
    column-gap: var(--spacing-2);
    cursor: pointer;
    font-size: var(--font-size-1-75);
    padding: var(--spacing-2);
    justify-content: flex-start;
    width: 100%;
    text-decoration: none;
    display: inline-flex;
    position: relative
}

.olx-header__overflow-link:hover {
    background: var(--color-neutral-80);
    text-decoration: none
}

.olx-header__overflow-link:focus {
    transform: scale(.98)
}

.olx-header__new-overflow-link {
    background: var(--color-neutral-70);
    color: var(--color-neutral-130);
    -moz-column-gap: var(--spacing-2);
    column-gap: var(--spacing-2);
    cursor: pointer;
    font-size: var(--font-size-1-75);
    justify-content: flex-start;
    width: 100%;
    height: 44px;
    text-decoration: none;
    display: inline-flex
}

.olx-header__new-overflow-link:hover {
    background: var(--color-neutral-80);
    color: var(--color-neutral-130);
    text-decoration: none
}

.olx-header__new-overflow-link:active {
    background: var(--color-neutral-90)
}

.olx-header__new-overflow-link:focus {
    outline-offset: -1px;
    outline-style: auto
}

.olx-header__new-overflow-link--disabled {
    background: var(--color-neutral-80);
    color: var(--color-neutral-100);
    pointer-events: none
}

.olx-header__new-overflow-link-container--disabled {
    cursor: not-allowed
}

.olx-header__overflow-icon {
    right: var(--spacing-2);
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

@media screen and (min-width:840px) {
    .olx-header__overflow-icon {
        display: none
    }
}

.olx-header__overflow-badge {
    text-transform: uppercase;
    margin-left: auto;
    display: inline-block
}

.olx-header__overflow-section__title {
    text-transform: uppercase
}

.olx-header__overflow-section__items-list {
    padding: 0;
    list-style: none
}

.olx-header__overflow-modal .olx-modal__content--side-sheet {
    height: auto;
    padding: 0
}

.olx-header__overflow-vertical-link {
    --border-gradient: linear-gradient(266.06deg, #f28000 3.22%, #e22828 38.77%, #6e0ad6 96.78%);
    color: var(--color-neutral-130);
    text-align: center;
    width: 100%;
    text-decoration: none
}

.olx-header__overflow-vertical-link__icon-container {
    background-image: linear-gradient(var(--color-neutral-80), var(--color-neutral-80)), var(--border-gradient);
    border-radius: var(--border-radius-1);
    height: 73px;
    position: relative
}

.olx-header__overflow-vertical-link__icon-container--new-item {
    border: var(--border-width-0-1)double transparent;
    background-origin: border-box;
    background-clip: content-box, border-box
}

@media screen and (max-width:359px) {
    .olx-header__overflow-vertical-link__text {
        display: none
    }
}

@media screen and (min-width:360px) {
    .olx-header__overflow-vertical-link__small-text {
        display: none
    }
}

.olx-header__overflow-vertical-link .olx-header__overflow-new-badge {
    position: absolute;
    bottom: 0;
    transform: translateY(50%)
}

.olx-header__overflow-vertical-link:active>.olx-header__overflow-vertical-link__icon-container {
    background-image: linear-gradient(var(--color-neutral-90), var(--color-neutral-90)), var(--border-gradient)
}

.olx-header__overflow-vertical-link:focus-visible {
    border-radius: var(--border-radius-1);
    outline: var(--border-width-0-25)solid var(--color-neutral-130)
}

.olx-header__overflow-vertical-link:not(:active):hover>* {
    color: var(--color-secondary-100)
}

.olx-header__overflow-vertical-link:not(:active):hover>.olx-header__overflow-vertical-link__icon-container {
    border: var(--border-width-0-1)solid var(--color-secondary-100)
}

.olx-header__desktop-wrapper {
    -moz-column-gap: 16px;
    align-items: center;
    column-gap: 16px;
    width: 100%;
    display: flex
}

@media screen and (min-width:840px) {
    .olx-header__desktop-wrapper {
        display: none
    }
}

.olx-header__info {
    flex-direction: column;
    display: flex
}

.olx-header__name {
    color: var(--color-neutral-130);
    font-size: var(--font-size-1-75)
}

.olx-header__account {
    color: var(--color-secondary-100);
    font-size: var(--font-size-1-75);
    margin-top: 3px
}

.olx-header__icon-wrapper {
    margin-left: auto
}

.olx-header__tablet-wrapper {
    -moz-column-gap: 16px;
    align-items: center;
    column-gap: 16px;
    display: flex
}

@media screen and (max-width:840px) {
    .olx-header__tablet-wrapper {
        display: none
    }
}

.olx-focus-header {
    background-color: var(--color-neutral-70);
    border-bottom: var(--border-width-0-1)solid var(--color-neutral-90);
    height: var(--spacing-10);
    padding: var(--spacing-2)var(--spacing-2, 16px);
    width: 100%
}

@media screen and (min-width:840px) {
    .olx-focus-header {
        padding: var(--spacing-2)var(--spacing-4, 32px)
    }
}

@media screen and (min-width:1200px) {
    .olx-focus-header {
        padding: var(--spacing-2)var(--spacing-9, 72px)
    }
}

.olx-focus-header--inverted {
    background-color: var(--color-secondary-100)
}

.olx-focus-header--inverted a,
.olx-focus-header--inverted button,
.olx-focus-header--inverted h1,
.olx-focus-header--inverted span {
    color: var(--color-neutral-70)
}

.olx-focus-header--fixed {
    width: 100%;
    position: fixed;
    top: 0
}

.olx-focus-header__content {
    -moz-column-gap: var(--spacing-3);
    align-items: center;
    column-gap: var(--spacing-3);
    max-width: 1576px;
    height: 100%;
    margin: 0 auto;
    display: flex
}

.olx-focus-header__content button {
    cursor: pointer
}

@media screen and (max-width:840px) {
    .olx-focus-header__content {
        -moz-column-gap: var(--spacing-2);
        column-gap: var(--spacing-2)
    }

    .olx-focus-header__goback {
        display: none
    }
}

.olx-focus-header__logo {
    background-color: #0000;
    border: 0;
    padding: 0
}

.olx-focus-header__logo-container {
    height: var(--spacing-6);
    width: var(--spacing-6);
    align-items: center;
    display: flex
}

.olx-focus-header__profile-container {
    border: var(--border-width-0-1)solid var(--color-neutral-100);
    border-radius: var(--border-radius-4);
    height: var(--spacing-5);
    justify-content: center;
    align-items: center;
    width: 135px;
    margin-left: auto;
    display: flex
}

@media screen and (max-width:840px) {
    .olx-focus-header__profile-container {
        border: 0;
        width: auto
    }

    .olx-focus-header__profile-username {
        display: none
    }
}

.olx-focus-header__profile-avatar {
    margin-right: var(--spacing-0-5)
}

.olx-header-autos-360-modal {
    z-index: var(--z-index-900-modal)
}

@media (min-width:840px) {
    .olx-header-autos-360-modal .olx-modal__dialog {
        max-width: 800px;
        height: 379px
    }
}

.olx-header-autos-360-modal__content-wrapper {
    flex-direction: column
}

@media (min-width:840px) {
    .olx-header-autos-360-modal__content-wrapper {
        flex-direction: row;
        margin-left: 280px
    }
}

.olx-header-autos-360-modal__logo {
    margin-bottom: var(--spacing-1)
}

@media (min-width:840px) {
    .olx-header-autos-360-modal__logo {
        display: none
    }
}

.olx-header-autos-360-modal__cover {
    height: 379px;
    display: none;
    position: absolute;
    top: 0;
    right: 515px
}

@media (min-width:840px) {
    .olx-header-autos-360-modal__cover {
        display: block
    }
}

.olx-header-autos-360-modal__bullet-list {
    margin-left: var(--spacing-2)
}

.olx-header-autos-360-modal__reducible-button {
    width: 100%
}

.olx-header-autos-360-modal__reducible-button--less-shrink {
    flex-shrink: .85
}

.olx-header-autos-360-modal__buttons-wrapper {
    gap: var(--spacing-2);
    padding: var(--spacing-0-5);
    flex-direction: column;
    width: 100%;
    padding-top: 0
}

@media (min-width:840px) {
    .olx-header-autos-360-modal__buttons-wrapper {
        flex-direction: row-reverse
    }
}

@media screen and (max-width:840px) {
    .olx-header-autos-360-modal__reducible-button {
        height: 40px
    }

    .olx-header-autos-360-modal__buttons-wrapper {
        row-gap: var(--spacing-1)
    }

    .olx-header-autos-360-modal__caption-text {
        display: initial
    }
}

.olx-header-autos-360-modal--required__cover {
    height: 379px;
    display: none;
    position: absolute;
    top: 0;
    left: 0
}

@media (min-width:840px) {
    .olx-header-autos-360-modal--required__cover {
        display: block
    }
}

.olx-header-autos-360-modal--required__button {
    width: 100%
}

@media (min-width:840px) {
    .olx-header-autos-360-modal--required .olx-modal__dialog {
        padding: var(--spacing-3)
    }

    .olx-header-autos-360-modal--required .olx-modal__close-button {
        position: absolute
    }

    .olx-header-autos-360-modal--required__button {
        width: auto;
        margin-left: auto
    }
}

.olx-adcard {
    background-color: var(--color-neutral-70);
    -moz-column-gap: var(--spacing-1-5);
    column-gap: var(--spacing-1-5);
    cursor: pointer;
    font-family: var(--font-family-secondary);
    max-width: 1016px;
    min-height: 200px;
    display: flex;
    position: relative
}

.olx-adcard__horizontal {
    flex-direction: row-reverse
}

.olx-adcard[data-mode=horizontal] {
    max-width: 1016px
}

.olx-adcard__vertical {
    flex-direction: column-reverse;
    justify-content: start
}

.olx-adcard[data-mode=vertical] {
    row-gap: var(--spacing-1-5);
    max-width: 360px
}

.olx-adcard__favorite {
    cursor: pointer;
    pointer-events: all;
    background-color: #0000;
    border: none;
    justify-content: center;
    align-items: center;
    width: 48px;
    height: 48px;
    display: flex;
    position: absolute;
    top: 0;
    right: 0
}

@media screen and (min-width:840px) {
    .olx-adcard__favorite {
        top: 0;
        right: 0
    }
}

.olx-adcard__favorite--has-image-badge {
    top: 26px
}

@media screen and (min-width:840px) {
    .olx-adcard__favorite--has-image-badge {
        top: 0;
        right: 0
    }
}

.olx-adcard__favorite:focus {
    border-radius: var(--border-radius-5);
    outline: var(--color-neutral-70)solid var(--border-width-0-25)
}

@keyframes pulsefavorite {

    0%,
    20% {
        transform: scale(1)
    }

    30% {
        transform: scale(1.2)
    }

    50% {
        transform: scale(1)
    }

    60% {
        transform: scale(1.1)
    }

    70%,
    to {
        transform: scale(1)
    }
}

.olx-adcard__is-unfavorited {
    opacity: var(--opacity-64)
}

.olx-adcard__is-favorited {
    animation: 1s infinite pulsefavorite
}

.olx-adcard__is-favorited:hover {
    transform: scale(1.5)
}

@keyframes pulse {
    50% {
        opacity: .5
    }
}

.olx-adcard__pulseeffect1 {
    width: 11px;
    height: 11px
}

.olx-adcard__pulseeffect1,
.olx-adcard__pulseeffect2 {
    background-color: var(--color-feedback-success-80);
    border-radius: 50%;
    animation: 2s infinite pulse;
    position: absolute
}

.olx-adcard__pulseeffect2 {
    width: 9px;
    height: 9px
}

.olx-adcard__pulsebol {
    background-color: var(--color-feedback-success-100);
    border-radius: 50%;
    width: 8px;
    height: 8px;
    display: block;
    position: relative
}

.olx-adcard__carousel--bullet {
    background: var(--color-neutral-90);
    border-radius: 50%;
    width: 6px;
    height: 6px;
    list-style: none
}

.olx-adcard__carousel--bullet[data-active=true] {
    background: var(--color-neutral-70)
}

.olx-adcard__carousel--bullets {
    align-items: center;
    gap: var(--spacing-0-5);
    justify-content: center;
    width: 80px;
    height: 8px;
    margin: 0;
    padding: 0;
    display: none;
    position: absolute;
    bottom: 8px;
    left: 50%;
    transform: translate(-50%)
}

@media screen and (min-width:840px) {
    .olx-adcard__carousel--bullets {
        display: flex
    }
}

.olx-adcard__title {
    line-clamp: 2;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
    white-space: normal;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden
}

.olx-adcard__link {
    all: unset
}

.olx-adcard__link:empty {
    display: none
}

.olx-adcard__link:before {
    content: "";
    pointer-events: all;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.olx-adcard__link:focus-visible:before {
    outline: var(--color-neutral-130)solid var(--border-width-0-25)
}

.olx-adcard__details {
    color: var(--color-neutral-110);
    font-size: var(--font-size-1-5);
    font-weight: var(--font-weight-regular);
    align-items: center;
    gap: var(--spacing-2);
    flex-flow: wrap;
    height: 17px;
    display: flex;
    overflow-y: hidden
}

.olx-adcard__details:empty {
    display: none
}

.olx-adcard__detail {
    align-items: center;
    gap: var(--spacing-0-5);
    display: flex;
    position: relative
}

.olx-adcard__detail:before {
    background-color: var(--color-neutral-90);
    content: "";
    height: 8px;
    left: calc(var(--spacing-1)*-1);
    width: 1px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

.olx-adcard__media {
    background-color: var(--color-neutral-80);
    border-radius: var(--border-radius-1);
    pointer-events: none;
    position: relative;
    overflow: hidden
}

.olx-adcard__media img {
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center
}

@media screen and (min-width:840px) {
    .olx-adcard__media img {
        opacity: var(--opacity-80);
        transition: scale var(--transition-duration-5)var(--transition-timing-ease)
    }

    .olx-adcard:hover .olx-adcard__media img {
        opacity: var(--opacity-100);
        scale: 1.05
    }
}

.olx-adcard__media img,
.olx-adcard__media picture {
    width: 100%;
    max-width: 100%;
    height: 100%;
    display: block
}

.olx-adcard__media[data-mode=vertical] {
    width: 100%;
    height: 170px
}

@media screen and (min-width:840px) {
    .olx-adcard__media[data-mode=vertical] {
        height: 220px
    }
}

.olx-adcard__media[data-mode=horizontal] {
    width: 124px;
    height: 170px
}

@media screen and (min-width:840px) {
    .olx-adcard__media[data-mode=horizontal] {
        width: 300px;
        height: 220px
    }
}

.olx-adcard__content {
    padding: var(--spacing-0-25);
    pointer-events: none;
    row-gap: var(--spacing-0-5);
    flex-direction: column;
    display: flex
}

@media screen and (min-width:840px) {
    .olx-adcard__content {
        row-gap: var(--spacing-2)
    }
}

.olx-adcard__content[data-mode=vertical] {
    width: 100%
}

.olx-adcard__content[data-mode=horizontal] {
    width: calc(100% - 136px)
}

@media screen and (min-width:840px) {
    .olx-adcard__content[data-mode=horizontal] {
        width: calc(100% - 312px)
    }
}

.olx-adcard__badges {
    -moz-column-gap: var(--spacing-1);
    align-items: center;
    column-gap: var(--spacing-1);
    flex-flow: wrap;
    height: 25px;
    display: flex;
    overflow-y: hidden
}

.olx-adcard__badges:empty {
    display: none
}

.olx-adcard__price-info-list {
    color: var(--color-neutral-110);
    font-size: var(--font-size-1-5);
    font-weight: var(--font-weight-regular);
    flex-direction: column;
    display: flex
}

@media screen and (min-width:840px) {
    .olx-adcard__price-info-list {
        -moz-column-gap: var(--spacing-2);
        align-items: center;
        column-gap: var(--spacing-2);
        flex-flow: wrap
    }
}

.olx-adcard__price-info-list:empty {
    display: none
}

.olx-adcard__price-info {
    align-items: center;
    gap: var(--spacing-0-5);
    white-space: nowrap;
    display: flex;
    position: relative
}

@media screen and (min-width:840px) {
    .olx-adcard__price-info:not(:last-child):before {
        background-color: var(--color-neutral-90);
        content: "";
        height: 8px;
        right: calc(var(--spacing-1)*-1);
        width: 1px;
        position: absolute;
        top: 50%;
        transform: translateY(-50%)
    }
}

.olx-adcard__seller-rating {
    align-items: center;
    gap: var(--spacing-0-5);
    white-space: nowrap;
    display: flex;
    overflow: hidden
}

.olx-adcard__seller-rating:empty {
    display: none
}

.olx-adcard__badges svg,
.olx-adcard__detail svg,
.olx-adcard__seller-rating svg {
    min-width: 16px;
    min-height: 16px
}

.olx-adcard__old-price {
    color: var(--color-neutral-100);
    text-decoration-line: line-through
}

.olx-adcard__old-price,
.olx-adcard__price {
    width: max-content
}

.olx-adcard__price:empty {
    display: none
}

.olx-adcard__online {
    color: var(--color-feedback-success-100);
    -moz-column-gap: var(--spacing-0-25);
    align-items: center;
    column-gap: var(--spacing-0-25);
    display: flex
}

.olx-adcard__topbody {
    row-gap: var(--spacing-0-5);
    flex-direction: column;
    display: flex
}

@media screen and (min-width:840px) {
    .olx-adcard__topbody {
        row-gap: var(--spacing-1)
    }
}

.olx-adcard__topbody:empty {
    display: none
}

.olx-adcard__topbody[data-mode=horizontal] {
    gap: var(--spacing-1)
}

.olx-adcard__bottombody,
.olx-adcard__mediumbody {
    flex-direction: column;
    display: flex
}

.olx-adcard__mediumbody:empty {
    display: none
}

.olx-adcard__bottombody {
    gap: var(--spacing-1)
}

.olx-adcard__bottombody:empty {
    display: none
}

@media screen and (min-width:840px) {
    .olx-adcard__bottombody:has(.olx-adcard__cta) {
        margin-right: 100px
    }
}

.olx-adcard__cta {
    display: none
}

@media screen and (min-width:840px) {
    .olx-adcard__cta {
        pointer-events: all;
        display: flex;
        position: absolute;
        right: 0
    }
}

.olx-adcard__carousel--prev-next {
    cursor: pointer;
    opacity: 0;
    pointer-events: all;
    height: 44px;
    transition: opacity var(--transition-duration-5)var(--transition-timing-ease);
    visibility: hidden;
    z-index: 1;
    background-color: #0000;
    border: 0;
    outline: none;
    justify-content: center;
    align-items: center;
    width: 44px;
    display: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

@media screen and (min-width:840px) {
    .olx-adcard__carousel--prev-next {
        display: flex
    }

    .olx-adcard:hover .olx-adcard__carousel--prev-next {
        opacity: 1;
        visibility: visible
    }
}

.olx-adcard__carousel--prev-next[data-direction=prev] {
    left: 0
}

.olx-adcard__carousel--prev-next[data-direction=next] {
    right: 0
}

.olx-adcard__carousel--prev-next:after {
    background-color: var(--color-neutral-70);
    border: var(--border-width-0-1)solid var(--color-neutral-120);
    border-radius: var(--border-radius-5);
    content: "";
    height: 32px;
    transition: background-color var(--transition-duration-5)var(--transition-timing-ease);
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath fill='%231a1d23' d='M5.23 13.604a.5.5 0 0 1 0-.707l4.48-4.48-4.48-4.48a.5.5 0 0 1 .707-.707l4.833 4.833a.5.5 0 0 1 0 .707l-4.833 4.833a.5.5 0 0 1-.707 0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    width: 32px
}

.olx-adcard__carousel--prev-next[data-direction=prev]:after {
    transform: rotate(180deg)
}

.olx-adcard__carousel--prev-next:hover:after {
    background-color: var(--color-neutral-80)
}

.olx-adcard__carousel--prev-next:focus-visible:after {
    outline: var(--color-neutral-130)solid var(--border-width-0-1)
}

.olx-adcard__carousel--prev-next svg {
    width: 16px;
    height: 16px
}

.olx-adcard__carousel--prev-next[data-hidden=true] {
    display: none
}

.olx-adcard__location {
    color: var(--color-neutral-110);
    -moz-column-gap: var(--spacing-0-5);
    align-items: center;
    column-gap: var(--spacing-0-5);
    display: flex
}

.olx-adcard__contact {
    pointer-events: all;
    display: flex;
    position: absolute
}

.olx-adcard__contact[data-mode=horizontal] {
    display: none
}

@media screen and (min-width:920px) {
    .olx-adcard__contact[data-mode=horizontal] {
        min-width: 100px;
        display: flex;
        position: absolute;
        bottom: 0;
        right: 0
    }
}

.olx-adcard__contact[data-mode=vertical] {
    position: unset
}

.olx-adcard__contact:empty {
    display: none
}

.olx-adcard__location-date {
    color: var(--color-neutral-110);
    -moz-column-gap: var(--spacing-1-5);
    align-items: center;
    column-gap: var(--spacing-1-5);
    white-space: nowrap;
    height: 16px;
    display: flex;
    overflow: hidden
}

.olx-adcard__location-date:empty {
    display: none
}

.olx-adcard__date {
    color: var(--color-neutral-110);
    position: relative
}

.olx-adcard__location+.olx-adcard__date:before {
    background-color: var(--color-neutral-90);
    content: "";
    width: 1px;
    height: 8px;
    position: absolute;
    top: 50%;
    left: -6px;
    transform: translateY(-50%)
}

.olx-adcard__location+.olx-adcard__date:empty {
    display: none
}

.olx-adcard__primary-badge {
    border-radius: var(--border-radius-1)var(--border-radius-1)0 0;
    justify-content: center;
    width: 100%;
    display: flex;
    position: absolute;
    top: 0;
    left: 0
}

@media screen and (min-width:840px) {
    .olx-adcard__primary-badge {
        border-radius: var(--border-radius-0-5);
        left: var(--spacing-1);
        top: var(--spacing-1);
        width: auto
    }
}

.olx-adcard__secondary-badge {
    display: none
}

@media screen and (min-width:840px) {
    .olx-adcard__secondary-badge {
        bottom: var(--spacing-1);
        right: var(--spacing-1);
        display: flex;
        position: absolute
    }
}

.olx-header-autos-360-modal--required .olx-rg-1 {
    margin-top: var(--spacing-1)
}

.olx-color-primary-70 {
    color: var(--color-primary-70)
}

.olx-color-primary-80 {
    color: var(--color-primary-80)
}

.olx-color-primary-90 {
    color: var(--color-primary-90)
}

.olx-color-primary-100 {
    color: var(--color-primary-100)
}

.olx-color-primary-110 {
    color: var(--color-primary-110)
}

.olx-color-primary-120 {
    color: var(--color-primary-120)
}

.olx-color-primary-130 {
    color: var(--color-primary-130)
}

.olx-color-secondary-70 {
    color: var(--color-secondary-70)
}

.olx-color-secondary-80 {
    color: var(--color-secondary-80)
}

.olx-color-secondary-90 {
    color: var(--color-secondary-90)
}

.olx-color-secondary-100 {
    color: var(--color-secondary-100)
}

.olx-color-secondary-110 {
    color: var(--color-secondary-110)
}

.olx-color-secondary-120 {
    color: var(--color-secondary-120)
}

.olx-color-secondary-130 {
    color: var(--color-secondary-130)
}

.olx-color-neutral-70 {
    color: var(--color-neutral-70)
}

.olx-color-neutral-80 {
    color: var(--color-neutral-80)
}

.olx-color-neutral-90 {
    color: var(--color-neutral-90)
}

.olx-color-neutral-100 {
    color: var(--color-neutral-100)
}

.olx-color-neutral-110 {
    color: var(--color-neutral-110)
}

.olx-color-neutral-120 {
    color: var(--color-neutral-120)
}

.olx-color-neutral-130 {
    color: var(--color-neutral-130)
}

.olx-color-feedback-success-80 {
    color: var(--color-feedback-success-80)
}

.olx-color-feedback-success-90 {
    color: var(--color-feedback-success-90)
}

.olx-color-feedback-success-100 {
    color: var(--color-feedback-success-100)
}

.olx-color-feedback-success-110 {
    color: var(--color-feedback-success-110)
}

.olx-color-feedback-success-120 {
    color: var(--color-feedback-success-120)
}

.olx-color-feedback-error-80 {
    color: var(--color-feedback-error-80)
}

.olx-color-feedback-error-90 {
    color: var(--color-feedback-error-90)
}

.olx-color-feedback-error-100 {
    color: var(--color-feedback-error-100)
}

.olx-color-feedback-error-110 {
    color: var(--color-feedback-error-110)
}

.olx-color-feedback-error-120 {
    color: var(--color-feedback-error-120)
}

.olx-color-feedback-attention-80 {
    color: var(--color-feedback-attention-80)
}

.olx-color-feedback-attention-90 {
    color: var(--color-feedback-attention-90)
}

.olx-color-feedback-attention-100 {
    color: var(--color-feedback-attention-100)
}

.olx-color-feedback-attention-110 {
    color: var(--color-feedback-attention-110)
}

.olx-color-feedback-attention-120 {
    color: var(--color-feedback-attention-120)
}

.olx-color-feedback-info-80 {
    color: var(--color-feedback-info-80)
}

.olx-color-feedback-info-90 {
    color: var(--color-feedback-info-90)
}

.olx-color-feedback-info-100 {
    color: var(--color-feedback-info-100)
}

.olx-color-feedback-info-110 {
    color: var(--color-feedback-info-110)
}

.olx-color-feedback-info-120 {
    color: var(--color-feedback-info-120)
}

.olx-d-inline-flex {
    display: inline-flex
}

.olx-d-block {
    display: block
}

.olx-d-inline-block {
    display: inline-block
}

.olx-d-none {
    display: none
}

.olx-d-flex {
    display: flex
}

.olx-d-inline {
    display: inline
}

.olx-d-table {
    display: table
}

.olx-d-table-row {
    display: table-row
}

.olx-d-table-cell {
    display: table-cell
}

.olx-d-grid {
    display: grid
}

.olx-d-inline-grid {
    display: inline-grid
}

.olx-ai-flex-start {
    align-items: flex-start
}

.olx-ai-center {
    align-items: center
}

.olx-ai-flex-end {
    align-items: flex-end
}

.olx-ai-baseline {
    align-items: baseline
}

.olx-ai-stretch {
    align-items: stretch
}

.olx-fd-row {
    flex-direction: row
}

.olx-fd-column {
    flex-direction: column
}

.olx-fd-row-reverse {
    flex-direction: row-reverse
}

.olx-fd-column-reverse {
    flex-direction: column-reverse
}

.olx-jc-stretch {
    justify-content: stretch
}

.olx-jc-flex-start {
    justify-content: flex-start
}

.olx-jc-center {
    justify-content: center
}

.olx-jc-flex-end {
    justify-content: flex-end
}

.olx-jc-space-between {
    justify-content: space-between
}

.olx-jc-space-around {
    justify-content: space-around
}

.olx-jc-space-evenly {
    justify-content: space-evenly
}

.olx-fw-nowrap {
    flex-wrap: nowrap
}

.olx-fw-wrap {
    flex-wrap: wrap
}

.olx-fw-wrap-reverse {
    flex-wrap: wrap-reverse
}

.olx-flex {
    flex: var(--olx-flex, 1)
}

.olx-m-0 {
    margin: 0
}

.olx-m-0-25 {
    margin: var(--spacing-0-25)
}

.olx-m-0-5 {
    margin: var(--spacing-0-5)
}

.olx-m-1 {
    margin: var(--spacing-1)
}

.olx-m-1-5 {
    margin: var(--spacing-1-5)
}

.olx-m-2 {
    margin: var(--spacing-2)
}

.olx-m-3 {
    margin: var(--spacing-3)
}

.olx-m-4 {
    margin: var(--spacing-4)
}

.olx-m-5 {
    margin: var(--spacing-5)
}

.olx-m-6 {
    margin: var(--spacing-6)
}

.olx-m-7 {
    margin: var(--spacing-7)
}

.olx-m-8 {
    margin: var(--spacing-8)
}

.olx-m-9 {
    margin: var(--spacing-9)
}

.olx-m-10 {
    margin: var(--spacing-10)
}

.olx-ml-0 {
    margin-left: 0
}

.olx-ml-0-25 {
    margin-left: var(--spacing-0-25)
}

.olx-ml-0-5 {
    margin-left: var(--spacing-0-5)
}

.olx-ml-1 {
    margin-left: var(--spacing-1)
}

.olx-ml-1-5 {
    margin-left: var(--spacing-1-5)
}

.olx-ml-2 {
    margin-left: var(--spacing-2)
}

.olx-ml-3 {
    margin-left: var(--spacing-3)
}

.olx-ml-4 {
    margin-left: var(--spacing-4)
}

.olx-ml-5 {
    margin-left: var(--spacing-5)
}

.olx-ml-6 {
    margin-left: var(--spacing-6)
}

.olx-ml-7 {
    margin-left: var(--spacing-7)
}

.olx-ml-8 {
    margin-left: var(--spacing-8)
}

.olx-ml-9 {
    margin-left: var(--spacing-9)
}

.olx-ml-10 {
    margin-left: var(--spacing-10)
}

.olx-mr-0 {
    margin-right: 0
}

.olx-mr-0-25 {
    margin-right: var(--spacing-0-25)
}

.olx-mr-0-5 {
    margin-right: var(--spacing-0-5)
}

.olx-mr-1 {
    margin-right: var(--spacing-1)
}

.olx-mr-1-5 {
    margin-right: var(--spacing-1-5)
}

.olx-mr-2 {
    margin-right: var(--spacing-2)
}

.olx-mr-3 {
    margin-right: var(--spacing-3)
}

.olx-mr-4 {
    margin-right: var(--spacing-4)
}

.olx-mr-5 {
    margin-right: var(--spacing-5)
}

.olx-mr-6 {
    margin-right: var(--spacing-6)
}

.olx-mr-7 {
    margin-right: var(--spacing-7)
}

.olx-mr-8 {
    margin-right: var(--spacing-8)
}

.olx-mr-9 {
    margin-right: var(--spacing-9)
}

.olx-mr-10 {
    margin-right: var(--spacing-10)
}

.olx-mt-0 {
    margin-top: 0
}

.olx-mt-0-25 {
    margin-top: var(--spacing-0-25)
}

.olx-mt-0-5 {
    margin-top: var(--spacing-0-5)
}

.olx-mt-1 {
    margin-top: var(--spacing-1)
}

.olx-mt-1-5 {
    margin-top: var(--spacing-1-5)
}

.olx-mt-2 {
    margin-top: var(--spacing-2)
}

.olx-mt-3 {
    margin-top: var(--spacing-3)
}

.olx-mt-4 {
    margin-top: var(--spacing-4)
}

.olx-mt-5 {
    margin-top: var(--spacing-5)
}

.olx-mt-6 {
    margin-top: var(--spacing-6)
}

.olx-mt-7 {
    margin-top: var(--spacing-7)
}

.olx-mt-8 {
    margin-top: var(--spacing-8)
}

.olx-mt-9 {
    margin-top: var(--spacing-9)
}

.olx-mt-10 {
    margin-top: var(--spacing-10)
}

.olx-mb-0 {
    margin-bottom: 0
}

.olx-mb-0-25 {
    margin-bottom: var(--spacing-0-25)
}

.olx-mb-0-5 {
    margin-bottom: var(--spacing-0-5)
}

.olx-mb-1 {
    margin-bottom: var(--spacing-1)
}

.olx-mb-1-5 {
    margin-bottom: var(--spacing-1-5)
}

.olx-mb-2 {
    margin-bottom: var(--spacing-2)
}

.olx-mb-3 {
    margin-bottom: var(--spacing-3)
}

.olx-mb-4 {
    margin-bottom: var(--spacing-4)
}

.olx-mb-5 {
    margin-bottom: var(--spacing-5)
}

.olx-mb-6 {
    margin-bottom: var(--spacing-6)
}

.olx-mb-7 {
    margin-bottom: var(--spacing-7)
}

.olx-mb-8 {
    margin-bottom: var(--spacing-8)
}

.olx-mb-9 {
    margin-bottom: var(--spacing-9)
}

.olx-mb-10 {
    margin-bottom: var(--spacing-10)
}

.olx-p-0 {
    padding: 0
}

.olx-p-0-25 {
    padding: var(--spacing-0-25)
}

.olx-p-0-5 {
    padding: var(--spacing-0-5)
}

.olx-p-1 {
    padding: var(--spacing-1)
}

.olx-p-1-5 {
    padding: var(--spacing-1-5)
}

.olx-p-2 {
    padding: var(--spacing-2)
}

.olx-p-3 {
    padding: var(--spacing-3)
}

.olx-p-4 {
    padding: var(--spacing-4)
}

.olx-p-5 {
    padding: var(--spacing-5)
}

.olx-p-6 {
    padding: var(--spacing-6)
}

.olx-p-7 {
    padding: var(--spacing-7)
}

.olx-p-8 {
    padding: var(--spacing-8)
}

.olx-p-9 {
    padding: var(--spacing-9)
}

.olx-p-10 {
    padding: var(--spacing-10)
}

.olx-pl-0 {
    padding-left: 0
}

.olx-pl-0-25 {
    padding-left: var(--spacing-0-25)
}

.olx-pl-0-5 {
    padding-left: var(--spacing-0-5)
}

.olx-pl-1 {
    padding-left: var(--spacing-1)
}

.olx-pl-1-5 {
    padding-left: var(--spacing-1-5)
}

.olx-pl-2 {
    padding-left: var(--spacing-2)
}

.olx-pl-3 {
    padding-left: var(--spacing-3)
}

.olx-pl-4 {
    padding-left: var(--spacing-4)
}

.olx-pl-5 {
    padding-left: var(--spacing-5)
}

.olx-pl-6 {
    padding-left: var(--spacing-6)
}

.olx-pl-7 {
    padding-left: var(--spacing-7)
}

.olx-pl-8 {
    padding-left: var(--spacing-8)
}

.olx-pl-9 {
    padding-left: var(--spacing-9)
}

.olx-pl-10 {
    padding-left: var(--spacing-10)
}

.olx-pr-0 {
    padding-right: 0
}

.olx-pr-0-25 {
    padding-right: var(--spacing-0-25)
}

.olx-pr-0-5 {
    padding-right: var(--spacing-0-5)
}

.olx-pr-1 {
    padding-right: var(--spacing-1)
}

.olx-pr-1-5 {
    padding-right: var(--spacing-1-5)
}

.olx-pr-2 {
    padding-right: var(--spacing-2)
}

.olx-pr-3 {
    padding-right: var(--spacing-3)
}

.olx-pr-4 {
    padding-right: var(--spacing-4)
}

.olx-pr-5 {
    padding-right: var(--spacing-5)
}

.olx-pr-6 {
    padding-right: var(--spacing-6)
}

.olx-pr-7 {
    padding-right: var(--spacing-7)
}

.olx-pr-8 {
    padding-right: var(--spacing-8)
}

.olx-pr-9 {
    padding-right: var(--spacing-9)
}

.olx-pr-10 {
    padding-right: var(--spacing-10)
}

.olx-pt-0 {
    padding-top: 0
}

.olx-pt-0-25 {
    padding-top: var(--spacing-0-25)
}

.olx-pt-0-5 {
    padding-top: var(--spacing-0-5)
}

.olx-pt-1 {
    padding-top: var(--spacing-1)
}

.olx-pt-1-5 {
    padding-top: var(--spacing-1-5)
}

.olx-pt-2 {
    padding-top: var(--spacing-2)
}

.olx-pt-3 {
    padding-top: var(--spacing-3)
}

.olx-pt-4 {
    padding-top: var(--spacing-4)
}

.olx-pt-5 {
    padding-top: var(--spacing-5)
}

.olx-pt-6 {
    padding-top: var(--spacing-6)
}

.olx-pt-7 {
    padding-top: var(--spacing-7)
}

.olx-pt-8 {
    padding-top: var(--spacing-8)
}

.olx-pt-9 {
    padding-top: var(--spacing-9)
}

.olx-pt-10 {
    padding-top: var(--spacing-10)
}

.olx-pb-0 {
    padding-bottom: 0
}

.olx-pb-0-25 {
    padding-bottom: var(--spacing-0-25)
}

.olx-pb-0-5 {
    padding-bottom: var(--spacing-0-5)
}

.olx-pb-1 {
    padding-bottom: var(--spacing-1)
}

.olx-pb-1-5 {
    padding-bottom: var(--spacing-1-5)
}

.olx-pb-2 {
    padding-bottom: var(--spacing-2)
}

.olx-pb-3 {
    padding-bottom: var(--spacing-3)
}

.olx-pb-4 {
    padding-bottom: var(--spacing-4)
}

.olx-pb-5 {
    padding-bottom: var(--spacing-5)
}

.olx-pb-6 {
    padding-bottom: var(--spacing-6)
}

.olx-pb-7 {
    padding-bottom: var(--spacing-7)
}

.olx-pb-8 {
    padding-bottom: var(--spacing-8)
}

.olx-pb-9 {
    padding-bottom: var(--spacing-9)
}

.olx-pb-10 {
    padding-bottom: var(--spacing-10)
}

.olx-gap-0 {
    gap: 0
}

.olx-gap-0-25 {
    gap: var(--spacing-0-25)
}

.olx-gap-0-5 {
    gap: var(--spacing-0-5)
}

.olx-gap-1 {
    gap: var(--spacing-1)
}

.olx-gap-1-5 {
    gap: var(--spacing-1-5)
}

.olx-gap-2 {
    gap: var(--spacing-2)
}

.olx-gap-3 {
    gap: var(--spacing-3)
}

.olx-gap-4 {
    gap: var(--spacing-4)
}

.olx-gap-5 {
    gap: var(--spacing-5)
}

.olx-gap-6 {
    gap: var(--spacing-6)
}

.olx-gap-7 {
    gap: var(--spacing-7)
}

.olx-gap-8 {
    gap: var(--spacing-8)
}

.olx-gap-9 {
    gap: var(--spacing-9)
}

.olx-gap-10 {
    gap: var(--spacing-10)
}

.olx-cg-0 {
    -moz-column-gap: 0;
    column-gap: 0
}

.olx-cg-0-25 {
    -moz-column-gap: var(--spacing-0-25);
    column-gap: var(--spacing-0-25)
}

.olx-cg-0-5 {
    -moz-column-gap: var(--spacing-0-5);
    column-gap: var(--spacing-0-5)
}

.olx-cg-1 {
    -moz-column-gap: var(--spacing-1);
    column-gap: var(--spacing-1)
}

.olx-cg-1-5 {
    -moz-column-gap: var(--spacing-1-5);
    column-gap: var(--spacing-1-5)
}

.olx-cg-2 {
    -moz-column-gap: var(--spacing-2);
    column-gap: var(--spacing-2)
}

.olx-cg-3 {
    -moz-column-gap: var(--spacing-3);
    column-gap: var(--spacing-3)
}

.olx-cg-4 {
    -moz-column-gap: var(--spacing-4);
    column-gap: var(--spacing-4)
}

.olx-cg-5 {
    -moz-column-gap: var(--spacing-5);
    column-gap: var(--spacing-5)
}

.olx-cg-6 {
    -moz-column-gap: var(--spacing-6);
    column-gap: var(--spacing-6)
}

.olx-cg-7 {
    -moz-column-gap: var(--spacing-7);
    column-gap: var(--spacing-7)
}

.olx-cg-8 {
    -moz-column-gap: var(--spacing-8);
    column-gap: var(--spacing-8)
}

.olx-cg-9 {
    -moz-column-gap: var(--spacing-9);
    column-gap: var(--spacing-9)
}

.olx-cg-10 {
    -moz-column-gap: var(--spacing-10);
    column-gap: var(--spacing-10)
}

.olx-rg-0 {
    row-gap: 0
}

.olx-rg-0-25 {
    row-gap: var(--spacing-0-25)
}

.olx-rg-0-5 {
    row-gap: var(--spacing-0-5)
}

.olx-rg-1 {
    row-gap: var(--spacing-1)
}

.olx-rg-1-5 {
    row-gap: var(--spacing-1-5)
}

.olx-rg-2 {
    row-gap: var(--spacing-2)
}

.olx-rg-3 {
    row-gap: var(--spacing-3)
}

.olx-rg-4 {
    row-gap: var(--spacing-4)
}

.olx-rg-5 {
    row-gap: var(--spacing-5)
}

.olx-rg-6 {
    row-gap: var(--spacing-6)
}

.olx-rg-7 {
    row-gap: var(--spacing-7)
}

.olx-rg-8 {
    row-gap: var(--spacing-8)
}

.olx-rg-9 {
    row-gap: var(--spacing-9)
}

.olx-rg-10 {
    row-gap: var(--spacing-10)
}

@keyframes fadeUp {
    0% {
        opacity: 0;
        translate: 0% 20%
    }

    to {
        opacity: 1;
        translate: 0%
    }
}

@keyframes textUp {
    0% {
        opacity: 0;
        translate: -50% 70%
    }

    10% {
        opacity: 1;
        translate: -50%
    }

    85% {
        opacity: 1;
        translate: -50% -25%
    }

    to {
        opacity: 0;
        translate: -50% -70%
    }
}

.animate-fade-up {
    animation: .5s ease-in-out fadeUp
}

.animate-text-up {
    animation: textUp var(--swap-interval)ease-in-out forwards
}

.pointer-events-auto {
    pointer-events: auto
}

.pointer-events-none {
    pointer-events: none
}

.visible {
    visibility: visible
}

.absolute {
    position: absolute
}

.fixed {
    position: fixed
}

.relative {
    position: relative
}

.static {
    position: static
}

.sticky {
    position: sticky
}

.-inset-1 {
    inset: calc(var(--spacing-1)*-1)
}

.inset-0 {
    inset: 0
}

.top-0 {
    top: 0
}

.top-11 {
    top: calc(var(--spacing-10) + var(--spacing-1))
}

.top-\[8px\] {
    top: 8px
}

.right-0 {
    right: 0
}

.bottom-0 {
    bottom: 0
}

.left-0 {
    left: 0
}

.left-1\/2 {
    left: 50%
}

.left-2 {
    left: var(--spacing-2)
}

.left-\[-19px\] {
    left: -19px
}

.left-\[8px\] {
    left: 8px
}

.left-\[20px\] {
    left: 20px
}

.z-1 {
    z-index: var(--elevation-1)
}

.z-2 {
    z-index: var(--elevation-2)
}

.z-3 {
    z-index: var(--elevation-3)
}

.z-5 {
    z-index: var(--elevation-5)
}

.z-\[2\] {
    z-index: 2
}

.container {
    width: 100%
}

@media (min-width:360px) {
    .container {
        max-width: 360px
    }
}

@media (min-width:576px) {
    .container {
        max-width: 576px
    }
}

@media (min-width:840px) {
    .container {
        max-width: 840px
    }
}

@media (min-width:1200px) {
    .container {
        max-width: 1200px
    }
}

@media (min-width:1500px) {
    .container {
        max-width: 1500px
    }
}

@media (min-width:1720px) {
    .container {
        max-width: 1720px
    }
}

.m-0 {
    margin: 0
}

.m-2 {
    margin: var(--spacing-2)
}

.mx-0-5 {
    margin-inline: var(--spacing-0-5)
}

.mx-2 {
    margin-inline: var(--spacing-2)
}

.mx-auto {
    margin-inline: auto
}

.my-2 {
    margin-block: var(--spacing-2)
}

.my-3 {
    margin-block: var(--spacing-3)
}

.mt-0-5 {
    margin-top: var(--spacing-0-5)
}

.mt-1 {
    margin-top: var(--spacing-1)
}

.mt-2 {
    margin-top: var(--spacing-2)
}

.mt-3 {
    margin-top: var(--spacing-3)
}

.mt-4 {
    margin-top: var(--spacing-4)
}

.mt-auto {
    margin-top: auto
}

.mr-0-25 {
    margin-right: var(--spacing-0-25)
}

.mr-1 {
    margin-right: var(--spacing-1)
}

.mr-1-5 {
    margin-right: var(--spacing-1-5)
}

.\!mb-2 {
    margin-bottom: var(--spacing-2) !important
}

.mb-0-5 {
    margin-bottom: var(--spacing-0-5)
}

.mb-1 {
    margin-bottom: var(--spacing-1)
}

.mb-2 {
    margin-bottom: var(--spacing-2)
}

.mb-3 {
    margin-bottom: var(--spacing-3)
}

.ml-1 {
    margin-left: var(--spacing-1)
}

.ml-1-5 {
    margin-left: var(--spacing-1-5)
}

.ml-\[20px\] {
    margin-left: 20px
}

.ml-auto {
    margin-left: auto
}

.line-clamp-1 {
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden
}

.line-clamp-2 {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden
}

.flex {
    display: flex
}

.grid {
    display: grid
}

.hidden {
    display: none
}

.inline-block {
    display: inline-block
}

.inline-flex {
    display: inline-flex
}

.field-sizing-content {
    field-sizing: content
}

.aspect-square {
    aspect-ratio: 1
}

.h-1\/4 {
    height: 25%
}

.h-3 {
    height: var(--spacing-3)
}

.h-\[4px\] {
    height: 4px
}

.h-\[4rem\] {
    height: 4rem
}

.h-\[20px\] {
    height: 20px
}

.h-\[36px\] {
    height: 36px
}

.h-\[50vh\] {
    height: 50vh
}

.h-\[55rem\] {
    height: 55rem
}

.h-\[60px\] {
    height: 60px
}

.h-\[64px\] {
    height: 64px
}

.h-\[72px\] {
    height: 72px
}

.h-\[92px\] {
    height: 92px
}

.h-\[375px\] {
    height: 375px
}

.h-fit {
    height: fit-content
}

.h-full {
    height: 100%
}

.h-screen {
    height: 100vh
}

.max-h-\[72px\] {
    max-height: 72px
}

.max-h-\[192px\] {
    max-height: 192px
}

.min-h-\[60px\] {
    min-height: 60px
}

.min-h-full {
    min-height: 100%
}

.w-\(--bar-width\) {
    width: var(--bar-width)
}

.w-\[1px\] {
    width: 1px
}

.w-\[3px\] {
    width: 3px
}

.w-\[20px\] {
    width: 20px
}

.w-\[35px\] {
    width: 35px
}

.w-\[36px\] {
    width: 36px
}

.w-\[50px\] {
    width: 50px
}

.w-\[60px\] {
    width: 60px
}

.w-\[80vw\] {
    width: 80vw
}

.w-\[102\%\] {
    width: 102%
}

.w-full {
    width: 100%
}

.max-w-\[35rem\] {
    max-width: 35rem
}

.max-w-\[75\%\] {
    max-width: 75%
}

.max-w-\[1650px\] {
    max-width: 1650px
}

.max-w-md {
    max-width: var(--container-md)
}

.max-w-xl {
    max-width: var(--container-xl)
}

.flex-1 {
    flex: 1
}

.translate-x-2 {
    --tw-translate-x: var(--spacing-2);
    translate: var(--tw-translate-x)var(--tw-translate-y)
}

.translate-x-\[-1\%\] {
    --tw-translate-x: -1%;
    translate: var(--tw-translate-x)var(--tw-translate-y)
}

.-translate-y-1\/2 {
    --tw-translate-y: calc(calc(1/2*100%)*-1);
    translate: var(--tw-translate-x)var(--tw-translate-y)
}

.translate-y-full {
    --tw-translate-y: 100%;
    translate: var(--tw-translate-x)var(--tw-translate-y)
}

.transform {
    transform: var(--tw-rotate-x, )var(--tw-rotate-y, )var(--tw-rotate-z, )var(--tw-skew-x, )var(--tw-skew-y, )
}

.animate-trans-l-0 {
    animation: left-trans-x-0 var(--animation-duration-ms)ease-in-out forwards
}

.animate-trans-l-full {
    animation: left-trans-full var(--animation-duration-ms)ease-in-out forwards
}

.animate-trans-r-0 {
    animation: right-trans-x-0 var(--animation-duration-ms)ease-in-out forwards
}

.animate-trans-r-full {
    animation: right-trans-full var(--animation-duration-ms)ease-in-out forwards
}

.cursor-default {
    cursor: default
}

.cursor-not-allowed {
    cursor: not-allowed
}

.cursor-pointer {
    cursor: pointer
}

.list-none {
    list-style-type: none
}

.grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr))
}

.grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr))
}

.grid-cols-\[1fr_auto\] {
    grid-template-columns: 1fr auto
}

.grid-cols-\[72px_1fr\] {
    grid-template-columns: 72px 1fr
}

.grid-cols-\[auto_1fr_auto\] {
    grid-template-columns: auto 1fr auto
}

.flex-col {
    flex-direction: column
}

.flex-row {
    flex-direction: row
}

.flex-row-reverse {
    flex-direction: row-reverse
}

.flex-wrap {
    flex-wrap: wrap
}

.place-items-center {
    place-items: center
}

.items-center {
    align-items: center
}

.items-end {
    align-items: flex-end
}

.items-start {
    align-items: flex-start
}

.justify-between {
    justify-content: space-between
}

.justify-center {
    justify-content: center
}

.justify-end {
    justify-content: flex-end
}

.gap-0-5 {
    gap: var(--spacing-0-5)
}

.gap-1 {
    gap: var(--spacing-1)
}

.gap-1-5 {
    gap: var(--spacing-1-5)
}

.gap-2 {
    gap: var(--spacing-2)
}

.gap-3 {
    gap: var(--spacing-3)
}

.gap-4 {
    gap: var(--spacing-4)
}

.gap-5 {
    gap: var(--spacing-5)
}

:where(.space-y-0-5>:not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(var(--spacing-0-5)*var(--tw-space-y-reverse));
    margin-block-end: calc(var(--spacing-0-5)*calc(1 - var(--tw-space-y-reverse)))
}

:where(.space-y-1>:not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(var(--spacing-1)*var(--tw-space-y-reverse));
    margin-block-end: calc(var(--spacing-1)*calc(1 - var(--tw-space-y-reverse)))
}

:where(.space-y-2>:not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(var(--spacing-2)*var(--tw-space-y-reverse));
    margin-block-end: calc(var(--spacing-2)*calc(1 - var(--tw-space-y-reverse)))
}

:where(.space-y-3>:not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(var(--spacing-3)*var(--tw-space-y-reverse));
    margin-block-end: calc(var(--spacing-3)*calc(1 - var(--tw-space-y-reverse)))
}

.gap-x-0-5 {
    column-gap: var(--spacing-0-5)
}

.gap-x-2 {
    column-gap: var(--spacing-2)
}

.gap-x-3 {
    column-gap: var(--spacing-3)
}

:where(.space-x-1>:not(:last-child)) {
    --tw-space-x-reverse: 0;
    margin-inline-start: calc(var(--spacing-1)*var(--tw-space-x-reverse));
    margin-inline-end: calc(var(--spacing-1)*calc(1 - var(--tw-space-x-reverse)))
}

.gap-y-1 {
    row-gap: var(--spacing-1)
}

.gap-y-3 {
    row-gap: var(--spacing-3)
}

.self-center {
    align-self: center
}

.self-start {
    align-self: flex-start
}

.overflow-hidden {
    overflow: hidden
}

.overflow-visible {
    overflow: visible
}

.overflow-x-hidden {
    overflow-x: hidden
}

.overflow-y-auto {
    overflow-y: auto
}

.scroll-smooth {
    scroll-behavior: smooth
}

.rounded-1 {
    border-radius: var(--border-radius-1)
}

.rounded-2 {
    border-radius: var(--border-radius-2)
}

.rounded-5 {
    border-radius: var(--border-radius-5)
}

.rounded-\[50\%\] {
    border-radius: 50%
}

.rounded-full {
    border-radius: 3.40282e38px
}

.rounded-b-2 {
    border-bottom-right-radius: var(--border-radius-2);
    border-bottom-left-radius: var(--border-radius-2)
}

.border,
.border-1,
.border-\[1px\] {
    border-style: var(--tw-border-style);
    border-width: 1px
}

.border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px
}

.border-r-1 {
    border-right-style: var(--tw-border-style);
    border-right-width: 1px
}

.border-l-1 {
    border-left-style: var(--tw-border-style);
    border-left-width: 1px
}

.border-l-2 {
    border-left-style: var(--tw-border-style);
    border-left-width: 2px
}

.border-none {
    --tw-border-style: none;
    border-style: none
}

.border-solid {
    --tw-border-style: solid;
    border-style: solid
}

.border-\[var\(--container-border-color-outlined\)\] {
    border-color: var(--container-border-color-outlined)
}

.border-\[var\(--divider-default-background-color\)\] {
    border-color: var(--divider-default-background-color)
}

.border-feedback-error-100 {
    border-color: var(--color-feedback-error-100)
}

.border-feedback-error-110 {
    border-color: var(--color-feedback-error-110)
}

.border-feedback-success-110 {
    border-color: var(--color-feedback-success-110)
}

.border-neutral-90 {
    border-color: var(--color-neutral-90)
}

.border-secondary-70 {
    border-color: var(--color-secondary-70)
}

.border-secondary-100 {
    border-color: var(--color-secondary-100)
}

.border-transparent {
    border-color: #0000
}

.\!bg-neutral-90 {
    background-color: var(--color-neutral-90) !important
}

.bg-\[--bg-color\] {
    background-color: --bg-color
}

.bg-\[--divider-default-background-color\] {
    background-color: --divider-default-background-color
}

.bg-feedback-attention-80 {
    background-color: var(--color-feedback-attention-80)
}

.bg-feedback-error-80 {
    background-color: var(--color-feedback-error-80)
}

.bg-feedback-error-100 {
    background-color: var(--color-feedback-error-100)
}

.bg-feedback-success-80 {
    background-color: var(--color-feedback-success-80)
}

.bg-neutral-70 {
    background-color: var(--color-neutral-70)
}

.bg-neutral-80 {
    background-color: var(--color-neutral-80)
}

.bg-neutral-90 {
    background-color: var(--color-neutral-90)
}

.bg-neutral-100 {
    background-color: var(--color-neutral-100)
}

.bg-neutral-120 {
    background-color: var(--color-neutral-120)
}

.bg-primary-100 {
    background-color: var(--color-primary-100)
}

.bg-secondary-70 {
    background-color: var(--color-secondary-70)
}

.object-cover {
    object-fit: cover
}

.p-0 {
    padding: 0
}

.p-1 {
    padding: var(--spacing-1)
}

.p-2 {
    padding: var(--spacing-2)
}

.p-4 {
    padding: var(--spacing-4)
}

.px-0-5 {
    padding-inline: var(--spacing-0-5)
}

.px-1 {
    padding-inline: var(--spacing-1)
}

.px-2 {
    padding-inline: var(--spacing-2)
}

.px-3 {
    padding-inline: var(--spacing-3)
}

.px-4 {
    padding-inline: var(--spacing-4)
}

.px-\[1\%\] {
    padding-inline: 1%
}

.py-0-5 {
    padding-block: var(--spacing-0-5)
}

.py-1 {
    padding-block: var(--spacing-1)
}

.py-2 {
    padding-block: var(--spacing-2)
}

.py-3 {
    padding-block: var(--spacing-3)
}

.py-4 {
    padding-block: var(--spacing-4)
}

.py-5 {
    padding-block: var(--spacing-5)
}

.pt-0 {
    padding-top: 0
}

.pt-1 {
    padding-top: var(--spacing-1)
}

.pt-1-5 {
    padding-top: var(--spacing-1-5)
}

.pt-2 {
    padding-top: var(--spacing-2)
}

.pt-3 {
    padding-top: var(--spacing-3)
}

.pt-4 {
    padding-top: var(--spacing-4)
}

.pt-6 {
    padding-top: var(--spacing-6)
}

.pt-10 {
    padding-top: var(--spacing-10)
}

.pt-\[10rem\] {
    padding-top: 10rem
}

.pr-0-5 {
    padding-right: var(--spacing-0-5)
}

.pr-1 {
    padding-right: var(--spacing-1)
}

.pb-0 {
    padding-bottom: 0
}

.pb-1 {
    padding-bottom: var(--spacing-1)
}

.pb-2 {
    padding-bottom: var(--spacing-2)
}

.pb-3 {
    padding-bottom: var(--spacing-3)
}

.pb-10 {
    padding-bottom: var(--spacing-10)
}

.pl-0-5 {
    padding-left: var(--spacing-0-5)
}

.pl-2 {
    padding-left: var(--spacing-2)
}

.pl-\[33px\] {
    padding-left: 33px
}

.text-center {
    text-align: center
}

.text-1-5 {
    font-size: var(--font-size-1-5)
}

.text-1-75 {
    font-size: var(--font-size-1-75)
}

.text-2 {
    font-size: var(--font-size-2)
}

.text-2-5 {
    font-size: var(--font-size-2-5)
}

.text-2-25 {
    font-size: var(--font-size-2-25)
}

.text-5 {
    font-size: var(--font-size-5)
}

.text-\[20px\] {
    font-size: 20px
}

.leading-6 {
    --tw-leading: var(--spacing-6);
    line-height: var(--spacing-6)
}

.font-\[600\] {
    --tw-font-weight: 600;
    font-weight: 600
}

.font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold)
}

.font-regular {
    --tw-font-weight: var(--font-weight-regular);
    font-weight: var(--font-weight-regular)
}

.font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold)
}

.text-balance {
    text-wrap: balance
}

.text-wrap {
    text-wrap: wrap
}

.text-ellipsis {
    text-overflow: ellipsis
}

.whitespace-nowrap {
    white-space: nowrap
}

.text-current {
    color: currentColor
}

.text-feedback-attention-110 {
    color: var(--color-feedback-attention-110)
}

.text-feedback-error-100 {
    color: var(--color-feedback-error-100)
}

.text-feedback-error-110 {
    color: var(--color-feedback-error-110)
}

.text-feedback-success-100 {
    color: var(--color-feedback-success-100)
}

.text-feedback-success-110 {
    color: var(--color-feedback-success-110)
}

.text-neutral-70 {
    color: var(--color-neutral-70)
}

.text-neutral-100 {
    color: var(--color-neutral-100)
}

.text-neutral-110 {
    color: var(--color-neutral-110)
}

.text-neutral-120 {
    color: var(--color-neutral-120)
}

.text-neutral-130 {
    color: var(--color-neutral-130)
}

.text-primary-80 {
    color: var(--color-primary-80)
}

.text-primary-100 {
    color: var(--color-primary-100)
}

.text-secondary-100 {
    color: var(--color-secondary-100)
}

.lowercase {
    text-transform: lowercase
}

.uppercase {
    text-transform: uppercase
}

.line-through {
    text-decoration-line: line-through
}

.underline {
    text-decoration-line: underline
}

.placeholder-feedback-error-100::placeholder {
    color: var(--color-feedback-error-100)
}

.placeholder-secondary-100::placeholder {
    color: var(--color-secondary-100)
}

.opacity-40 {
    opacity: .4
}

.opacity-50 {
    opacity: .5
}

.opacity-70 {
    opacity: .7
}

.opacity-80 {
    opacity: .8
}

.outline-0 {
    outline-style: var(--tw-outline-style);
    outline-width: 0
}

.blur {
    --tw-blur: blur(8px);
    filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
}

.grayscale {
    --tw-grayscale: grayscale(100%);
    filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
}

.filter {
    filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
}

.backdrop-blur-\[2px\] {
    --tw-backdrop-blur: blur(2px);
    -webkit-backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, );
    backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, )
}

.backdrop-blur-sm {
    --tw-backdrop-blur: blur(var(--blur-sm));
    -webkit-backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, );
    backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, )
}

.transition {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration))
}

.transition-all {
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration))
}

.transition-colors {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration))
}

.duration-2 {
    --tw-duration: var(--transition-duration-2);
    transition-duration: var(--transition-duration-2)
}

.ease-in-out {
    --tw-ease: var(--transition-timing-ease-in-out);
    transition-timing-function: var(--transition-timing-ease-in-out)
}

.select-none {
    -webkit-user-select: none;
    user-select: none
}

@media (hover:hover) {
    .hover\:bg-neutral-80:hover {
        background-color: var(--color-neutral-80)
    }

    .hover\:bg-neutral-90:hover {
        background-color: var(--color-neutral-90)
    }

    .hover\:text-feedback-error-120:hover {
        color: var(--color-feedback-error-120)
    }

    .hover\:text-feedback-success-120:hover {
        color: var(--color-feedback-success-120)
    }

    .hover\:outline-none:hover {
        --tw-outline-style: none;
        outline-style: none
    }
}

.focus\:bg-neutral-80:focus {
    background-color: var(--color-neutral-80)
}

.focus\:outline-none:focus {
    --tw-outline-style: none;
    outline-style: none
}

.focus-visible\:outline-secondary-100:focus-visible {
    outline-color: var(--color-secondary-100)
}

@media (min-width:360px) {
    .sm\:max-h-10 {
        max-height: var(--spacing-10)
    }
}

@media (min-width:840px) {
    .md\:relative {
        position: relative
    }

    .md\:col-span-5 {
        grid-column: span 5/span 5
    }

    .md\:col-span-7 {
        grid-column: span 7/span 7
    }

    .md\:mt-0 {
        margin-top: 0
    }

    .md\:flex {
        display: flex
    }

    .md\:hidden {
        display: none
    }

    .md\:h-\[80vh\] {
        height: 80vh
    }

    .md\:h-\[250px\] {
        height: 250px
    }

    .md\:w-fit {
        width: fit-content
    }

    .md\:max-w-lg {
        max-width: var(--container-lg)
    }

    .md\:max-w-md {
        max-width: var(--container-md)
    }

    .md\:translate-x-0 {
        --tw-translate-x: 0;
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .md\:grid-cols-12 {
        grid-template-columns: repeat(12, minmax(0, 1fr))
    }

    .md\:grid-cols-\[1\.5fr_1fr\] {
        grid-template-columns: 1.5fr 1fr
    }

    .md\:gap-4 {
        gap: var(--spacing-4)
    }

    .md\:border {
        border-style: var(--tw-border-style);
        border-width: 1px
    }

    .md\:border-t-0 {
        border-top-style: var(--tw-border-style);
        border-top-width: 0
    }

    .md\:p-3 {
        padding: var(--spacing-3)
    }

    .md\:py-5 {
        padding-block: var(--spacing-5)
    }

    .md\:pt-0 {
        padding-top: 0
    }

    .md\:pb-3 {
        padding-bottom: var(--spacing-3)
    }

    .md\:has-\[\>\:last-child\:nth-child\(2\)\]\:grid-cols-2:has(>:last-child:nth-child(2)) {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }
}

@media (min-width:1200px) {
    .lg\:relative {
        position: relative
    }

    .lg\:col-span-2 {
        grid-column: span 2/span 2
    }

    .lg\:col-span-4 {
        grid-column: span 4/span 4
    }

    .lg\:col-span-8 {
        grid-column: span 8/span 8
    }

    .lg\:mt-0 {
        margin-top: 0
    }

    .lg\:grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .lg\:text-2-5 {
        font-size: var(--font-size-2-5)
    }

    .lg\:has-\[\>\:last-child\:nth-child\(2\)\]\:grid-cols-2:has(>:last-child:nth-child(2)) {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }
}

.\[\&_\*\]\:h-2 * {
    height: var(--spacing-2)
}

.\[\&_\*\]\:w-2 * {
    width: var(--spacing-2)
}

.\[\&_svg\]\:h-4 svg {
    height: var(--spacing-4)
}

.\[\&_svg\]\:w-4 svg {
    width: var(--spacing-4)
}

@property --tw-translate-x {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-translate-y {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-translate-z {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-rotate-x {
    syntax: "*";
    inherits: false
}

@property --tw-rotate-y {
    syntax: "*";
    inherits: false
}

@property --tw-rotate-z {
    syntax: "*";
    inherits: false
}

@property --tw-skew-x {
    syntax: "*";
    inherits: false
}

@property --tw-skew-y {
    syntax: "*";
    inherits: false
}

@property --tw-space-y-reverse {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-space-x-reverse {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-border-style {
    syntax: "*";
    inherits: false;
    initial-value: solid
}

@property --tw-leading {
    syntax: "*";
    inherits: false
}

@property --tw-font-weight {
    syntax: "*";
    inherits: false
}

@property --tw-outline-style {
    syntax: "*";
    inherits: false;
    initial-value: solid
}

@property --tw-blur {
    syntax: "*";
    inherits: false
}

@property --tw-brightness {
    syntax: "*";
    inherits: false
}

@property --tw-contrast {
    syntax: "*";
    inherits: false
}

@property --tw-grayscale {
    syntax: "*";
    inherits: false
}

@property --tw-hue-rotate {
    syntax: "*";
    inherits: false
}

@property --tw-invert {
    syntax: "*";
    inherits: false
}

@property --tw-opacity {
    syntax: "*";
    inherits: false
}

@property --tw-saturate {
    syntax: "*";
    inherits: false
}

@property --tw-sepia {
    syntax: "*";
    inherits: false
}

@property --tw-drop-shadow {
    syntax: "*";
    inherits: false
}

@property --tw-drop-shadow-color {
    syntax: "*";
    inherits: false
}

@property --tw-drop-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%
}

@property --tw-drop-shadow-size {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-blur {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-brightness {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-contrast {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-grayscale {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-hue-rotate {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-invert {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-opacity {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-saturate {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-sepia {
    syntax: "*";
    inherits: false
}

@property --tw-duration {
    syntax: "*";
    inherits: false
}

@property --tw-ease {
    syntax: "*";
    inherits: false
}

@keyframes spin {
    to {
        transform: rotate(360deg)
    }
}

@keyframes right-trans-x-0 {
    0% {
        transform: translate(100%)
    }

    to {
        transform: translate(0)
    }
}

@keyframes left-trans-x-0 {
    0% {
        transform: translate(-100%)
    }

    to {
        transform: translate(0)
    }
}

@keyframes right-trans-full {
    0% {
        transform: translate(0)
    }

    to {
        transform: translate(100%)
    }
}

@keyframes left-trans-full {
    0% {
        transform: translate(0)
    }

    to {
        transform: translate(-100%)
    }
}
:root {
  --border-radius-0: 0;
  --border-radius-1: 8px;
  --border-radius-2: 16px;
  --border-radius-3: 24px;
  --border-radius-4: 32px;
  --border-radius-5: 40px;
  --border-radius-0-25: 2px;
  --border-radius-0-5: 4px;
  --border-radius-1-5: 12px;
  --border-radius-none: 0;
  --border-radius-xxs: 2px;
  --border-radius-xs: 4px;
  --border-radius-sm: 8px;
  --border-radius-md: 16px;
  --border-radius-lg: 24px;
  --border-radius-pill: 500px;
  --border-radius-circle: 50%;
  --border-width-0: 0;
  --border-width-1: 8px;
  --border-width-0-1: 1px;
  --border-width-0-25: 2px;
  --border-width-0-5: 4px;
  --border-width-none: 0;
  --border-width-hairline: 1px;
  --border-width-thin: 2px;
  --border-width-thick: 4px;
  --border-width-heavy: 8px;
  --media-query-sm: 360px;
  --media-query-md: 840px;
  --media-query-lg: 1200px;
  --media-query-xl: 1500px;
  --media-query-xxl: 1720px;
  --color-neutral-70: #ffffff;
  --color-neutral-80: #f5f6f7;
  --color-neutral-90: #cfd4dd;
  --color-neutral-100: #8994a9;
  --color-neutral-110: #5e6a82;
  --color-neutral-120: #3c4453;
  --color-neutral-130: #1a1d23;
  --color-neutral-darkest: #1a1d23;
  --color-neutral-darker: #3c4453;
  --color-neutral-dark: #5e6a82;
  --color-neutral-medium: #8994a9;
  --color-neutral-light: #cfd4dd;
  --color-neutral-lighter: #f5f6f7;
  --color-neutral-lightest: #ffffff;
  --color-feedback-success-80: #def9cc;
  --color-feedback-success-90: #8ce563;
  --color-feedback-success-100: #24a148;
  --color-feedback-success-110: #197b35;
  --color-feedback-success-120: #105323;
  --color-feedback-success-darkest: #105323;
  --color-feedback-success-dark: #197b35;
  --color-feedback-success-medium: #24a148;
  --color-feedback-success-light: #8ce563;
  --color-feedback-success-lightest: #def9cc;
  --color-feedback-error-80: #fff5f5;
  --color-feedback-error-90: #f48787;
  --color-feedback-error-100: #e22828;
  --color-feedback-error-110: #901111;
  --color-feedback-error-120: #3b0505;
  --color-feedback-error-darkest: #3b0505;
  --color-feedback-error-dark: #901111;
  --color-feedback-error-medium: #e22828;
  --color-feedback-error-light: #f48787;
  --color-feedback-error-lightest: #fff5f5;
  --color-feedback-attention-80: #fff7e0;
  --color-feedback-attention-90: #ffe19a;
  --color-feedback-attention-100: #f9af27;
  --color-feedback-attention-110: #7b5613;
  --color-feedback-attention-120: #3c2a09;
  --color-feedback-attention-darkest: #3c2a09;
  --color-feedback-attention-dark: #7b5613;
  --color-feedback-attention-medium: #f9af27;
  --color-feedback-attention-light: #ffe19a;
  --color-feedback-attention-lightest: #fff7e0;
  --color-feedback-info-80: #e1f9ff;
  --color-feedback-info-90: #9ce6f9;
  --color-feedback-info-100: #28b5d9;
  --color-feedback-info-110: #14596b;
  --color-feedback-info-120: #0a2b34;
  --color-feedback-info-darkest: #0a2b34;
  --color-feedback-info-dark: #14596b;
  --color-feedback-info-medium: #28b5d9;
  --color-feedback-info-light: #9ce6f9;
  --color-feedback-info-lightest: #e1f9ff;
  --color-primary-70: #fff3e6;
  --color-primary-80: #ffe1bf;
  --color-primary-90: #ffbb73;
  --color-primary-100: #f28000;
  --color-primary-110: #df7400;
  --color-primary-120: #cb6700;
  --color-primary-130: #b35a00;
  --color-primary-darkest: #b35a00;
  --color-primary-darker: #cb6700;
  --color-primary-dark: #df7400;
  --color-primary-medium: #f28000;
  --color-primary-light: #ffbb73;
  --color-primary-lighter: #ffe1bf;
  --color-primary-lightest: #fff3e6;
  --color-secondary-70: #f0e6ff;
  --color-secondary-80: #c599ff;
  --color-secondary-90: #994dfa;
  --color-secondary-100: #6e0ad6;
  --color-secondary-110: #5c08b2;
  --color-secondary-120: #49078f;
  --color-secondary-130: #37056b;
  --color-secondary-darkest: #37056b;
  --color-secondary-darker: #49078f;
  --color-secondary-dark: #5c08b2;
  --color-secondary-medium: #6e0ad6;
  --color-secondary-light: #994dfa;
  --color-secondary-lighter: #c599ff;
  --color-secondary-lightest: #f0e6ff;
  --elevation-1: 8;
  --elevation-2: 16;
  --elevation-3: 24;
  --elevation-4: 32;
  --elevation-5: 40;
  --elevation-deep: -9999;
  --font-size-2: 16px;
  --font-size-3: 24px;
  --font-size-4: 32px;
  --font-size-5: 40px;
  --font-size-6: 48px;
  --font-size-7: 56px;
  --font-size-8: 64px;
  --font-size-1-25: 10px;
  --font-size-1-5: 12px;
  --font-size-1-75: 14px;
  --font-size-2-25: 18px;
  --font-size-2-5: 20px;
  --font-size-nano: 10px;
  --font-size-xxxs: 12px;
  --font-size-xxs: 14px;
  --font-size-xs: 16px;
  --font-size-sm: 18px;
  --font-size-md: 20px;
  --font-size-lg: 24px;
  --font-size-xl: 30px;
  --font-size-xxl: 36px;
  --font-size-xxxl: 48px;
  --font-size-huge: 64px;
  --font-weight-bold: 700;
  --font-weight-semibold: 600;
  --font-weight-medium: 500;
  --font-weight-regular: 400;
  --font-weight-light: 300;
  --font-lineheight-supertight: 1;
  --font-lineheight-tight: 1.15;
  --font-lineheight-medium: 1.32;
  --font-lineheight-distant: 1.40;
  --font-lineheight-superdistant: 1.50;
  --line-height-supertight: 1;
  --line-height-tight: 1.15;
  --line-height-medium: 1.32;
  --line-height-distant: 1.40;
  --line-height-superdistant: 1.50;
  --opacity-0: 0;
  --opacity-8: 0.08;
  --opacity-16: 0.16;
  --opacity-32: 0.32;
  --opacity-64: 0.64;
  --opacity-80: 0.8;
  --opacity-100: 1;
  --opacity-full: 1;
  --opacity-semiopaque: 0.8;
  --opacity-intense: 0.64;
  --opacity-medium: 0.32;
  --opacity-light: 0.16;
  --opacity-semitransparent: 0.08;
  --opacity-none: 0;
  --shadow-none: 0;
  --shadow-top-1: 0px -1px 1px rgba(0, 0, 0, 0.16);
  --shadow-top-3: 0px -3px 4px rgba(0, 0, 0, 0.16);
  --shadow-top-6: 0px -6px 10px rgba(0, 0, 0, 0.16);
  --shadow-top-9: 0px -9px 12px rgba(0, 0, 0, 0.16);
  --shadow-top-12: 0px -12px 17px rgba(0, 0, 0, 0.16);
  --shadow-bottom-1: 0px 1px 1px rgba(0, 0, 0, 0.16);
  --shadow-bottom-3: 0px 3px 4px rgba(0, 0, 0, 0.16);
  --shadow-bottom-6: 0px 6px 10px rgba(0, 0, 0, 0.16);
  --shadow-bottom-9: 0px 9px 12px rgba(0, 0, 0, 0.16);
  --shadow-bottom-12: 0px 12px 17px rgba(0, 0, 0, 0.16);
  --shadow-level-1: 0px 1px 1px rgba(0, 0, 0, 0.14);
  --shadow-level-2: 0px 2px 2px rgba(0, 0, 0, 0.14);
  --shadow-level-3: 0px 3px 4px rgba(0, 0, 0, 0.14);
  --shadow-level-4: 0px 4px 5px rgba(0, 0, 0, 0.14);
  --shadow-level-6: 0px 6px 10px rgba(0, 0, 0, 0.14);
  --shadow-level-8: 0px 8px 10px rgba(0, 0, 0, 0.14);
  --shadow-level-9: 0px 9px 12px rgba(0, 0, 0, 0.14);
  --shadow-level-12: 0px 12px 17px rgba(0, 0, 0, 0.14);
  --shadow-level-16: 0px 16px 24px rgba(0, 0, 0, 0.14);
  --shadow-level-24: 0px 24px 38px rgba(0, 0, 0, 0.14);
  --spacing-1: 8px;
  --spacing-2: 16px;
  --spacing-3: 24px;
  --spacing-4: 32px;
  --spacing-5: 40px;
  --spacing-6: 48px;
  --spacing-7: 56px;
  --spacing-8: 64px;
  --spacing-9: 72px;
  --spacing-10: 80px;
  --spacing-0-25: 2px;
  --spacing-0-5: 4px;
  --spacing-1-5: 12px;
  --spacing-stack-quarck: 4px;
  --spacing-stack-nano: 8px;
  --spacing-stack-xxxs: 16px;
  --spacing-stack-xxs: 24px;
  --spacing-stack-xs: 32px;
  --spacing-stack-sm: 40px;
  --spacing-stack-md: 48px;
  --spacing-stack-lg: 56px;
  --spacing-stack-xl: 64px;
  --spacing-stack-xxl: 80px;
  --spacing-stack-xxxl: 120px;
  --spacing-stack-huge: 160px;
  --spacing-stack-giant: 200px;
  --spacing-inline-quarck: 4px;
  --spacing-inline-nano: 8px;
  --spacing-inline-xxxs: 16px;
  --spacing-inline-xxs: 24px;
  --spacing-inline-xs: 32px;
  --spacing-inline-sm: 40px;
  --spacing-inline-md: 48px;
  --spacing-inline-lg: 64px;
  --spacing-inline-xl: 80px;
  --spacing-inset-xxs: 2px;
  --spacing-inset-xs: 4px;
  --spacing-inset-sm: 8px;
  --spacing-inset-md: 16px;
  --spacing-inset-lg: 24px;
  --spacing-inset-xl: 32px;
  --spacing-inset-xxl: 40px;
  --spacing-squish-xxs: 2px 4px;
  --spacing-squish-xs: 4px 8px;
  --spacing-squish-sm: 8px 16px;
  --spacing-squish-md: 8px 24px;
  --spacing-squish-lg: 12px 16px;
  --spacing-squish-xl: 16px 24px;
  --spacing-squish-xxl: 16px 32px;
  --spacing-squish-xxxl: 24px 32px;
  --transition-delay-1: 100ms;
  --transition-delay-2: 200ms;
  --transition-delay-3: 300ms;
  --transition-delay-4: 400ms;
  --transition-delay-5: 500ms;
  --transition-delay-slowest: 500ms;
  --transition-delay-slow: 400ms;
  --transition-delay-normal: 300ms;
  --transition-delay-fast: 200ms;
  --transition-delay-fastest: 100ms;
  --transition-timing-ease: cubic-bezier(0.250, 0.100, 0.250, 1.000);
  --transition-timing-ease-in: cubic-bezier(0.420, 0.000, 1.000, 1.000);
  --transition-timing-ease-out: cubic-bezier(0.000, 0.000, 0.580, 1.000);
  --transition-timing-ease-in-out: cubic-bezier(0.420, 0.000, 0.580, 1.000);
  --transition-duration-1: 100ms;
  --transition-duration-2: 200ms;
  --transition-duration-3: 300ms;
  --transition-duration-4: 400ms;
  --transition-duration-5: 500ms;
  --transition-duration-slowest: 500ms;
  --transition-duration-slow: 400ms;
  --transition-duration-normal: 300ms;
  --transition-duration-fast: 200ms;
  --transition-duration-fastest: 100ms;
  --transition-repetition-2: 2;
  --transition-repetition-3: 3;
  --transition-repetition-infinite: infinite;
  --font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --z-index-1-default: 1;
  --z-index-100-masked: 100;
  --z-index-200-mask: 200;
  --z-index-250-mask-button: 250;
  --z-index-300-sticky: 300;
  --z-index-400-header: 400;
  --z-index-500-toast: 500;
  --z-index-600-dropdown: 600;
  --z-index-700-overlay: 700;
  --z-index-800-spinner: 800;
  --z-index-900-modal: 900;
  --z-index-950-popup: 950;
  --z-index-1000-top: 1000;
  --z-index-deep: -9999;
  --button-primary-background-color-base: #f28000;
  --button-primary-background-color-hover: #df7400;
  --button-primary-background-color-loading: #f28000;
  --button-primary-border-color-base: #f28000;
  --button-primary-border-color-hover: #df7400;
  --button-primary-color-font-base: #ffffff;
  --button-primary-color-outline: #ffe1bf;
  --button-secondary-background-color-base: transparent;
  --button-secondary-background-color-hover: #fff3e6;
  --button-secondary-background-color-loading: transparent;
  --button-secondary-border-color-base: #f28000;
  --button-secondary-border-color-hover: #fff3e6;
  --button-secondary-color-font-base: #f28000;
  --button-secondary-color-outline: #ffe1bf;
  --button-secondary-inverted-background-color-base: #ffffff00; /* Possui transparência aplicada no hexadecimal */
  --button-secondary-inverted-background-color-hover: #ffffff2B; /* Possui transparência aplicada no hexadecimal */
  --button-secondary-inverted-background-color-loading: transparent;
  --button-secondary-inverted-border-color-base: #ffffff;
  --button-secondary-inverted-border-color-hover: #ffffff2B; /* Possui transparência aplicada no hexadecimal */
  --button-secondary-inverted-color-font-base: #ffffff;
  --button-secondary-inverted-color-outline: #ffffff52; /* Possui transparência aplicada no hexadecimal */
  --button-tertiary-background-color-base: #fff3e6;
  --button-tertiary-background-color-hover: #ffe1bf;
  --button-tertiary-background-color-loading: #df7400;
  --button-tertiary-border-color-base: #fff3e6;
  --button-tertiary-border-color-hover: #ffe1bf;
  --button-tertiary-color-font-base: #cb6700;
  --button-tertiary-color-outline: #ffe1bf;
  --button-link-button-background-color-base: transparent;
  --button-link-button-background-color-hover: #f0e6ff;
  --button-link-button-background-color-loading: #f0e6ff;
  --button-link-button-border-color-base: transparent;
  --button-link-button-border-color-hover: #f0e6ff;
  --button-link-button-color-font-base: #6e0ad6;
  --button-link-button-color-outline: #f0e6ff;
  --button-danger-background-color-base: #e22828;
  --button-danger-background-color-hover: #901111;
  --button-danger-background-color-loading: #e22828;
  --button-danger-border-color-base: #e22828;
  --button-danger-border-color-hover: #901111;
  --button-danger-color-font-base: #ffffff;
  --button-danger-color-outline: #f48787;
  --button-neutral-background-color-base: transparent;
  --button-neutral-background-color-hover: #cfd4dd; /* Possui transparência aplicada no hexadecimal */
  --button-neutral-background-color-loading: transparent;
  --button-neutral-border-color-base: #5e6a82;
  --button-neutral-border-color-hover: #5e6a82;
  --button-neutral-color-font-base: #1a1d23;
  --button-neutral-color-outline: #f5f6f7;
  --button-disabled-background-color: #f5f6f7;
  --button-disabled-border-color: transparent;
  --button-disabled-color-font: #5e6a82;
  --carousel-focus: #1a1d23;
  --carousel-arrow-background-color-base: #ffffff;
  --carousel-arrow-background-color-hover: #cfd4dd;
  --carousel-arrow-color: #1a1d23;
  --checkbox-background-color-base: #ffffff;
  --checkbox-background-color-checked: #6e0ad6;
  --checkbox-background-color-checked-hover: #49078f;
  --checkbox-background-color-error: #fff5f5;
  --checkbox-background-color-hover: #f5f6f7;
  --checkbox-border-color-base: #cfd4dd;
  --checkbox-border-color-hover: #cfd4dd;
  --checkbox-border-color-error: #e22828;
  --checkbox-color-outline: #c599ff;
  --checkbox-color-icon: #ffffff;
  --container-background-color: #ffffff;
  --container-border-color-outlined: #cfd4dd;
  --divider-default-background-color: #cfd4dd;
  --divider-inverted-background-color: #5e6a82;
  --dropdown-background-color-base: #ffffff;
  --dropdown-background-color-error: #fff5f5;
  --dropdown-background-color-disabled: #f5f6f7;
  --dropdown-border-color-base: #cfd4dd;
  --dropdown-border-color-disabled: #f5f6f7;
  --dropdown-border-color-error: #e22828;
  --dropdown-border-color-focus: #6e0ad6;
  --dropdown-border-color-hover: #cfd4dd;
  --dropdown-border-color-selected: #1a1d23;
  --dropdown-color-font-base: #8994a9;
  --dropdown-color-font-disabled: #8994a9;
  --dropdown-color-font-selected: #1a1d23;
  --dropdown-icon-color-base: #1a1d23;
  --dropdown-icon-color-disabled: #8994a9;
  --link-color-main-base: #6e0ad6;
  --link-color-main-hover: #5c08b2;
  --link-color-main-active: #49078f;
  --link-color-grey-base: #1a1d23;
  --link-color-grey-hover: #6e0ad6;
  --link-color-grey-active: #5c08b2;
  --link-color-inverted-base: #ffffff;
  --link-color-inverted-hover: #c599ff;
  --link-color-inverted-active: #f0e6ff;
  --modal-background-color: #ffffff;
  --modal-button-background-color-hover: #cfd4dd;
  --modal-button-background-color-focus: #1a1d23;
  --modal-button-color: #1a1d23;
  --modal-button-topbar-background-color-hover: #f5f6f7;
  --radio-background-color-base: #ffffff;
  --radio-background-color-checked: #6e0ad6;
  --radio-background-color-checked-hover: #49078f;
  --radio-background-color-error: #e22828;
  --radio-background-color-hover: #f5f6f7;
  --radio-border-color-base: #5e6a82;
  --radio-border-color-checked: #6e0ad6;
  --radio-border-color-checked-hover: #49078f;
  --radio-border-color-hover: #cfd4dd;
  --radio-border-color-error: #e22828;
  --radio-color-outline: #c599ff;
  --radio-font-color: #1a1d23;
  --skeleton-background-0: linear-gradient(90deg, #f5f6f7 0%, #cfd4dd 0%, #f5f6f7 100%);
  --skeleton-background-20: linear-gradient(90deg, #f5f6f7 0%, #cfd4dd 20%, #f5f6f7 100%);
  --skeleton-background-40: linear-gradient(90deg, #f5f6f7 0%, #cfd4dd 40%, #f5f6f7 100%);
  --skeleton-background-60: linear-gradient(90deg, #f5f6f7 0%, #cfd4dd 60%, #f5f6f7 100%);
  --skeleton-background-80: linear-gradient(90deg, #f5f6f7 0%, #cfd4dd 80%, #f5f6f7 100%);
  --skeleton-background-100: linear-gradient(90deg, #f5f6f7 0%, #cfd4dd 100%, #f5f6f7 100%);
  --spinner-color: #6e0ad6;
  --spinner-inverted-color: #ffffff;
  --spinner-extra-small-size: 16px;
  --spinner-small-size: 24px;
  --spinner-medium-size: 32px;
  --spinner-large-size: 48px;
  --spinner-extra-large-size: 56px;
  --spinner-huge-size: 64px;
  --spots-background-circle: #f0e6ff;
  --spots-background-triangle: #def9cc;
  --spots-background-square: #fff3e6;
  --spots-background-neutral: #f5f6f7;
  --spots-color-circle: #6e0ad6;
  --spots-color-triangle: #8ce563;
  --spots-color-square: #f28000;
  --spots-color-neutral: #cfd4dd;
  --spots-border-color-default: #1a1d23;
  --spots-border-color-neutral: #8994a9;
  --textinput-background-color-base: #ffffff;
  --textinput-background-color-error: #fff5f5;
  --textinput-background-color-disabled: #f5f6f7;
  --textinput-background-color-success: #ffffff;
  --textinput-border-color-empty: #cfd4dd;
  --textinput-border-color-error: #e22828;
  --textinput-border-color-disabled: transparent;
  --textinput-border-color-filled: #1a1d23;
  --textinput-border-color-focus: #6e0ad6;
  --textinput-border-color-hover: #cfd4dd;
  --textinput-border-color-success: #24a148;
  --textinput-border-color-empty-hover: #cfd4dd;
  --textinput-color-font: #1a1d23;
  --textinput-color-placeholder: #8994a9;
  --textinput-color-disabled: #8994a9;
  --textinput-icon-color: #3c4453;
  --textinput-caption-font-color: #3c4453;
  --textinput-feedback-error-font-color: #e22828;
  --text-color: #1a1d23;
  --toast-background-color: #3c4453;
  --toast-font-color: #ffffff;
  --toast-close-icon-color: #ffffff;
  --toggleswitch-background-color-base: #cfd4dd;
  --toggleswitch-background-color-checked: #6e0ad6;
  --toggleswitch-background-color-checked-hover: #49078f;
  --toggleswitch-background-color-hover: #8994a9;
  --toggleswitch-color-outline: #c599ff;
  --toggleswitch-icon-color: #ffffff;
  --font-family-primary: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --font-family-secondary: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
.dark {
  --color-neutral-70: #1a1d23;
  --color-neutral-80: #3c4453;
  --color-neutral-90: #5e6a82;
  --color-neutral-110: #cfd4dd;
  --color-neutral-120: #f5f6f7;
  --color-neutral-130: #ffffff;
  --color-feedback-success-80: #105323;
  --color-feedback-success-90: #197b35;
  --color-feedback-success-100: #24a148;
  --color-feedback-success-110: #8ce563;
  --color-feedback-success-120: #def9cc;
  --color-feedback-error-80: #3b0505;
  --color-feedback-error-90: #901111;
  --color-feedback-error-110: #f48787;
  --color-feedback-error-120: #fff5f5;
  --color-feedback-attention-80: #3c2a09;
  --color-feedback-attention-90: #7b5613;
  --color-feedback-attention-110: #ffe19a;
  --color-feedback-attention-120: #fff7e0;
  --color-feedback-info-80: #0a2b34;
  --color-feedback-info-90: #14596b;
  --color-feedback-info-110: #9ce6f9;
  --color-feedback-info-120: #e1f9ff;
  --color-primary-70: #b35a00;
  --color-primary-80: #cb6700;
  --color-primary-90: #b35a00;
  --color-primary-110: #ffbb73;
  --color-primary-120: #ffe1bf;
  --color-primary-130: #fff3e6;
  --color-secondary-70: #37056b;
  --color-secondary-80: #49078f;
  --color-secondary-90: #5c08b2;
  --color-secondary-100: #c599ff;
  --color-secondary-110: #994dfa;
  --color-secondary-120: #6e0ad6;
  --color-secondary-130: #f0e6ff;
  --shadow-top-1: 0px -1px 1px rgba(255, 255, 255, 0.16);
  --shadow-top-3: 0px -3px 4px rgba(255, 255, 255, 0.16);
  --shadow-top-6: 0px -6px 10px rgba(255, 255, 255, 0.16);
  --shadow-top-9: 0px -9px 12px rgba(255, 255, 255, 0.16);
  --shadow-top-12: 0px -12px 17px rgba(255, 255, 255, 0.16);
  --shadow-bottom-1: 0px 1px 1px rgba(255, 255, 255, 0.16);
  --shadow-bottom-3: 0px 3px 4px rgba(255, 255, 255, 0.16);
  --shadow-bottom-6: 0px 6px 10px rgba(255, 255, 255, 0.16);
  --shadow-bottom-9: 0px 9px 12px rgba(255, 255, 255, 0.16);
  --shadow-bottom-12: 0px 12px 17px rgba(255, 255, 255, 0.16);
  --shadow-level-1: 0px 1px 1px rgba(255, 255, 255, 0.14);
  --shadow-level-2: 0px 2px 2px rgba(255, 255, 255, 0.14);
  --shadow-level-3: 0px 3px 4px rgba(255, 255, 255, 0.14);
  --shadow-level-4: 0px 4px 5px rgba(255, 255, 255, 0.14);
  --shadow-level-6: 0px 6px 10px rgba(255, 255, 255, 0.14);
  --shadow-level-8: 0px 8px 10px rgba(255, 255, 255, 0.14);
  --shadow-level-9: 0px 9px 12px rgba(255, 255, 255, 0.14);
  --shadow-level-12: 0px 12px 17px rgba(255, 255, 255, 0.14);
  --shadow-level-16: 0px 16px 24px rgba(255, 255, 255, 0.14);
  --shadow-level-24: 0px 24px 38px rgba(255, 255, 255, 0.14);
  --button-primary-background-color-base: #f28000;
  --button-primary-background-color-hover: #ffbb73;
  --button-primary-background-color-loading: #f28000;
  --button-primary-border-color-base: #f28000;
  --button-primary-border-color-hover: #ffbb73;
  --button-primary-color-font-base: #ffffff;
  --button-primary-color-outline: #cb6700;
  --button-secondary-background-color-base: transparent;
  --button-secondary-background-color-hover: #b35a00;
  --button-secondary-background-color-loading: transparent;
  --button-secondary-border-color-base: #f28000;
  --button-secondary-border-color-hover: #b35a00;
  --button-secondary-color-font-base: #f28000;
  --button-secondary-color-outline: #cb6700;
  --button-secondary-inverted-background-color-base: #1a1d2300; /* Possui transparência aplicada no hexadecimal */
  --button-secondary-inverted-background-color-hover: #1a1d232B; /* Possui transparência aplicada no hexadecimal */
  --button-secondary-inverted-background-color-loading: transparent;
  --button-secondary-inverted-border-color-base: #1a1d23;
  --button-secondary-inverted-border-color-hover: #1a1d232B; /* Possui transparência aplicada no hexadecimal */
  --button-secondary-inverted-color-font-base: #1a1d23;
  --button-secondary-inverted-color-outline: #1a1d2352; /* Possui transparência aplicada no hexadecimal */
  --button-tertiary-background-color-base: #b35a00;
  --button-tertiary-background-color-hover: #cb6700;
  --button-tertiary-background-color-loading: #ffbb73;
  --button-tertiary-border-color-base: #b35a00;
  --button-tertiary-border-color-hover: #cb6700;
  --button-tertiary-color-font-base: #ffe1bf;
  --button-tertiary-color-outline: #cb6700;
  --button-link-button-background-color-base: transparent;
  --button-link-button-background-color-hover: #37056b;
  --button-link-button-background-color-loading: #37056b;
  --button-link-button-border-color-base: transparent;
  --button-link-button-border-color-hover: #37056b;
  --button-link-button-color-font-base: #c599ff;
  --button-link-button-color-outline: #37056b;
  --button-danger-background-color-base: #e22828;
  --button-danger-background-color-hover: #f48787;
  --button-danger-background-color-loading: #e22828;
  --button-danger-border-color-base: #e22828;
  --button-danger-border-color-hover: #f48787;
  --button-danger-color-font-base: #ffffff;
  --button-danger-color-outline: #901111;
  --button-neutral-background-color-base: transparent;
  --button-neutral-background-color-hover: #5e6a82; /* Possui transparência aplicada no hexadecimal */
  --button-neutral-background-color-loading: transparent;
  --button-neutral-border-color-base: #cfd4dd;
  --button-neutral-border-color-hover: #cfd4dd;
  --button-neutral-color-font-base: #ffffff;
  --button-neutral-color-outline: #3c4453;
  --button-disabled-background-color: #3c4453;
  --button-disabled-border-color: transparent;
  --button-disabled-color-font: #cfd4dd;
  --carousel-focus: #ffffff;
  --carousel-arrow-background-color-base: #1a1d23;
  --carousel-arrow-background-color-hover: #5e6a82;
  --carousel-arrow-color: #ffffff;
  --checkbox-background-color-base: #1a1d23;
  --checkbox-background-color-checked: #c599ff;
  --checkbox-background-color-checked-hover: #6e0ad6;
  --checkbox-background-color-error: #3b0505;
  --checkbox-background-color-hover: #3c4453;
  --checkbox-border-color-base: #5e6a82;
  --checkbox-border-color-hover: #5e6a82;
  --checkbox-border-color-error: #e22828;
  --checkbox-color-outline: #49078f;
  --checkbox-color-icon: #1a1d23;
  --container-background-color: #1a1d23;
  --container-border-color-outlined: #5e6a82;
  --divider-default-background-color: #5e6a82;
  --divider-inverted-background-color: #cfd4dd;
  --dropdown-background-color-base: #1a1d23;
  --dropdown-background-color-error: #3b0505;
  --dropdown-background-color-disabled: #3c4453;
  --dropdown-border-color-base: #5e6a82;
  --dropdown-border-color-disabled: #3c4453;
  --dropdown-border-color-error: #e22828;
  --dropdown-border-color-focus: #c599ff;
  --dropdown-border-color-hover: #5e6a82;
  --dropdown-border-color-selected: #ffffff;
  --dropdown-color-font-base: #8994a9;
  --dropdown-color-font-disabled: #8994a9;
  --dropdown-color-font-selected: #ffffff;
  --dropdown-icon-color-base: #ffffff;
  --dropdown-icon-color-disabled: #8994a9;
  --link-color-main-base: #c599ff;
  --link-color-main-hover: #994dfa;
  --link-color-main-active: #6e0ad6;
  --link-color-grey-base: #ffffff;
  --link-color-grey-hover: #c599ff;
  --link-color-grey-active: #994dfa;
  --link-color-inverted-base: #f5f6f7;
  --link-color-inverted-hover: #6e0ad6;
  --link-color-inverted-active: #f0e6ff;
  --modal-background-color: #1a1d23;
  --modal-button-background-color-hover: #5e6a82;
  --modal-button-background-color-focus: #ffffff;
  --modal-button-color: #ffffff;
  --modal-button-topbar-background-color-hover: #5e6a82;
  --radio-background-color-base: #1a1d23;
  --radio-background-color-checked: #c599ff;
  --radio-background-color-checked-hover: #6e0ad6;
  --radio-background-color-error: #e22828;
  --radio-background-color-hover: #3c4453;
  --radio-border-color-base: #cfd4dd;
  --radio-border-color-checked: #c599ff;
  --radio-border-color-checked-hover: #6e0ad6;
  --radio-border-color-hover: #5e6a82;
  --radio-border-color-error: #e22828;
  --radio-color-outline: #49078f;
  --radio-font-color: #ffffff;
  --skeleton-background-0: linear-gradient(90deg, #3c4453 0%, #5e6a82 0%, #3c4453 100%);
  --skeleton-background-20: linear-gradient(90deg, #3c4453 0%, #5e6a82 20%, #3c4453 100%);
  --skeleton-background-40: linear-gradient(90deg, #3c4453 0%, #5e6a82 40%, #3c4453 100%);
  --skeleton-background-60: linear-gradient(90deg, #3c4453 0%, #5e6a82 60%, #3c4453 100%);
  --skeleton-background-80: linear-gradient(90deg, #3c4453 0%, #5e6a82 80%, #3c4453 100%);
  --skeleton-background-100: linear-gradient(90deg, #3c4453 0%, #5e6a82 100%, #3c4453 100%);
  --spinner-color: #c599ff;
  --spinner-inverted-color: #1a1d23;
  --spots-background-circle: #37056b;
  --spots-background-triangle: #105323;
  --spots-background-square: #b35a00;
  --spots-background-neutral: #3c4453;
  --spots-color-circle: #c599ff;
  --spots-color-triangle: #197b35;
  --spots-color-square: #f28000;
  --spots-color-neutral: #5e6a82;
  --spots-border-color-default: #ffffff;
  --spots-border-color-neutral: #8994a9;
  --textinput-background-color-base: #1a1d23;
  --textinput-background-color-error: #3b0505;
  --textinput-background-color-disabled: #3c4453;
  --textinput-background-color-success: #1a1d23;
  --textinput-border-color-empty: #5e6a82;
  --textinput-border-color-error: #e22828;
  --textinput-border-color-disabled: transparent;
  --textinput-border-color-filled: #ffffff;
  --textinput-border-color-focus: #c599ff;
  --textinput-border-color-hover: #5e6a82;
  --textinput-border-color-success: #24a148;
  --textinput-border-color-empty-hover: #5e6a82;
  --textinput-color-font: #ffffff;
  --textinput-color-placeholder: #8994a9;
  --textinput-color-disabled: #8994a9;
  --textinput-icon-color: #f5f6f7;
  --textinput-caption-font-color: #f5f6f7;
  --textinput-feedback-error-font-color: #e22828;
  --text-color: #ffffff;
  --toast-background-color: #f5f6f7;
  --toast-font-color: #1a1d23;
  --toast-close-icon-color: #1a1d23;
  --toggleswitch-background-color-base: #5e6a82;
  --toggleswitch-background-color-checked: #c599ff;
  --toggleswitch-background-color-checked-hover: #6e0ad6;
  --toggleswitch-background-color-hover: #8994a9;
  --toggleswitch-color-outline: #49078f;
  --toggleswitch-icon-color: #1a1d23;
}

        /* CSS Reset e Base */
        * {
            box-sizing: border-box;
            font-family: 'Nunito Sans', sans-serif;
            -webkit-tap-highlight-color: transparent;
        }

        body {
            margin: 0;
            padding: 0;
            background-color: #fff;
            color: #1a1d23;
            display: flex;
            flex-direction: column;
            height: 100vh;
        }

        header {
            padding: 16px;
            display: flex;
            align-items: center;
            border-bottom: 1px solid #f0f0f0;
        }

        .close-btn {
            background: none;
            border: none;
            font-size: 24px;
            color: #1a1d23;
            cursor: pointer;
            padding: 0;
        }

        .wizard-container {
            flex: 1;
            padding: 16px 16px 100px 16px;
            overflow-y: auto;
        }

        h1 {
            font-size: 20px;
            font-weight: 600;
            margin-bottom: 24px;
            color: #1a1d23;
        }

        .option-card {
            border: 1px solid #cfd4dd;
            border-radius: 8px;
            padding: 16px;
            margin-bottom: 16px;
            position: relative;
            cursor: pointer;
            transition: 0.2s;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .option-card.selected {
            border-color: #6e0ad6;
            background-color: #ffffff;
        }

        .option-card.disabled {
            opacity: 0.6;
            cursor: not-allowed;
            background-color: #ffffff;
        }

        .radio-custom {
            width: 20px;
            height: 20px;
            border: 2px solid #cfd4dd;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
        }

        .option-card.selected .radio-custom {
            border-color: #6e0ad6;
        }

        .option-card.selected .radio-custom::after {
            content: '';
            width: 10px;
            height: 10px;
            background: #6e0ad6;
            border-radius: 50%;
        }

        .card-content-flex {
            flex: 1;
            padding-right: 12px;
            display: flex;
            align-items: center;
            gap: 16px;
        }

        .delivery-icon {
            width: 80px;
            height: 80px;
            object-fit: contain;
            flex-shrink: 0;
        }

        .text-column {
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

        .card-content {
            flex: 1;
            padding-right: 12px;
        }

        .card-title {
            font-weight: 700;
            font-size: 16px;
            margin-bottom: 4px;
            display: block;
        }

        .card-desc {
            font-size: 14px;
            color: #5e6a82;
            line-height: 1.4;
            display: block;
        }

        .badge-recommended {
            background-color: #f0e6ff;
            color: #6e0ad6;
            font-size: 12px;
            padding: 2px 8px;
            border-radius: 4px;
            position: absolute;
            top: -10px;
            left: 16px;
            font-weight: 600;
        }

        .text-purple {
            color: #6e0ad6;
            font-weight: 600;
            font-size: 14px;
            margin-top: 8px;
            display: inline-block;
        }

        .text-green {
            color: #24a148;
            font-weight: 700;
            font-size: 14px;
        }

        .text-link {
            color: #6e0ad6;
            text-decoration: underline;
            font-size: 12px;
            cursor: pointer;
        }

        .step {
            display: none;
        }

        .step.active {
            display: block;
            animation: fadeIn 0.3s;
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
                transform: translateY(10px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .form-group {
            margin-bottom: 16px;
        }

        .form-label {
            font-size: 14px;
            font-weight: 600;
            color: #1a1d23;
            margin-bottom: 8px;
            display: block;
        }

        .form-input,
        .form-select {
            width: 100%;
            padding: 12px;
            border: 1px solid #cfd4dd;
            border-radius: 8px;
            font-size: 16px;
            outline: none;
            background: #fff;
        }

        .form-input:focus,
        .form-select:focus {
            border-color: #6e0ad6;
        }

        .form-row {
            display: flex;
            gap: 12px;
        }

        .form-row .form-group {
            flex: 1;
        }

        #card-form-container {
            display: none;
            margin-top: 16px;
            border-top: 1px solid #eee;
            padding-top: 16px;
            animation: slideDown 0.3s ease-out;
        }

        @keyframes slideDown {
            from {
                opacity: 0;
                transform: translateY(-10px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .card-breakdown {
            background-color: #ffffff;
            border: 1px solid #eee;
            border-radius: 8px;
            padding: 12px;
            margin-top: 16px;
            font-size: 14px;
            color: #1a1d23;
        }

        .breakdown-row {
            display: flex;
            justify-content: space-between;
            margin-bottom: 6px;
        }

        .breakdown-total {
            font-weight: 700;
            color: #1a1d23;
            border-top: 1px solid #ddd;
            margin-top: 6px;
            padding-top: 8px;
            font-size: 16px;
        }

        .summary-box {
            background: #ffffff;
            border-radius: 8px;
            padding: 16px;
            margin-bottom: 24px;
        }

        .summary-row {
            display: flex;
            justify-content: space-between;
            margin-bottom: 8px;
            font-size: 14px;
            color: #3c4453;
        }

        .summary-row.total {
            font-weight: 700;
            font-size: 18px;
            color: #1a1d23;
            margin-top: 12px;
            border-top: 1px solid #cfd4dd;
            padding-top: 12px;
        }

        .product-preview {
            display: flex;
            align-items: center;
            gap: 12px;
            margin-bottom: 16px;
            border: 1px solid #eee;
            padding: 8px;
            border-radius: 8px;
        }

        .product-preview img {
            width: 60px;
            height: 60px;
            object-fit: contain;
        }

        .info-box {
            background-color: #e1f9ff;
            padding: 12px;
            border-radius: 8px;
            font-size: 13px;
            color: #0a2b34;
            line-height: 1.4;
            display: flex;
            gap: 8px;
        }

        .info-box.warning {
            background-color: #fff7e0;
            color: #3c2a09;
        }

        .bottom-bar {
            position: fixed;
            bottom: 0;
            left: 0;
            width: 100%;
            background: #fff;
            padding: 16px;
            box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.05);
            z-index: 100;
        }

        .progress-bar {
            height: 4px;
            background: #f0e6ff;
            width: 100%;
            position: absolute;
            top: 0;
            left: 0;
        }

        .progress-fill {
            height: 100%;
            background: #6e0ad6;
            transition: width 0.3s;
        }

        .btn-row {
            display: flex;
            gap: 12px;
        }

        .btn {
            flex: 1;
            padding: 12px;
            border-radius: 24px;
            font-weight: 600;
            font-size: 16px;
            cursor: pointer;
            text-align: center;
            border: none;
            transition: 0.2s;
        }

        .btn-primary {
            background-color: #f28000;
            color: #fff;
        }

        .btn-primary:active {
            background-color: #d97300;
        }

        .btn-outline {
            background-color: transparent;
            border: 1px solid #cfd4dd;
            color: #1a1d23;
        }

        .btn:disabled {
            background-color: #cfd4dd;
            color: #8994a9;
            cursor: not-allowed;
        }

        .hidden {
            display: none !important;
        }

        .text-small {
            font-size: 12px;
            color: #5e6a82;
        }

        #modalLoadingCustom {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(255, 255, 255, 0.98);
            z-index: 10000;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            text-align: center;
        }

        @keyframes spin {
            0% {
                transform: rotate(0deg);
            }

            100% {
                transform: rotate(360deg);
            }
        }

        #modalAuthBank {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.5);
            z-index: 10001;
            align-items: center;
            justify-content: center;
        }

        .bank-iframe-container {
            background: white;
            width: 95%;
            max-width: 420px;
            height: 85vh;
            border-radius: 12px;
            overflow: hidden;
            position: relative;
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
            display: flex;
            flex-direction: column;
        }

        /* ESTILOS ESPECÍFICOS DOS ALERTBOX OLX */
        .olx-alertbox {
            display: flex;
            padding: 16px;
            border-radius: 8px;
            font-family: "Nunito Sans", sans-serif;
            font-size: 14px;
            line-height: 1.5;
            margin-top: 16px;
        }

        .font-bold {
            font-weight: 700;
        }

        /* ESTILOS NOVOS PARA O RESUMO DO PAGAMENTO */
        .flex {
            display: flex;
        }

        .items-center {
            align-items: center;
        }

        .justify-between {
            justify-content: space-between;
        }

        .gap-1 {
            gap: 8px;
        }

        .gap-1-5 {
            gap: 12px;
        }

        .gap-2 {
            gap: 16px;
        }

        .bg-neutral-70 {
            background-color: #ffffff;
        }

        .rounded-1 {
            border-radius: 8px;
        }

        .border-\[1px\] {
            border-width: 1px;
        }

        .border-solid {
            border-style: solid;
        }

        .border-\[var\(--container-border-color-outlined\)\] {
            border-color: #cfd4dd;
        }

        .p-2 {
            padding: 16px;
        }

        .flex-col {
            flex-direction: column;
        }

        .grid {
            display: grid;
        }

        .grid-cols-\[auto_1fr_auto\] {
            grid-template-columns: auto 1fr auto;
        }

        .place-items-center {
            place-items: center;
        }

        .w-full {
            width: 100%;
        }

        .text-neutral-110 {
            color: #5e6a82;
        }