/* Autos Esquivel — Vende tu auto / Consignación
 * Paso 03: condición + resumen en vivo.
 * Esta hoja se carga al final de la vista y reconstruye estos dos bloques
 * para aislarlos de estilos globales/legacy del sitio.
 */

/* --------------------------------------------------------------------------
   Workspace
   -------------------------------------------------------------------------- */
body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__workspace {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(350px, 380px) !important;
    gap: 26px !important;
    align-items: start !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__form-card,
body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__fields,
body .ae-sell-modal.ae-sell-page .ae-sell-modal__content form {
    min-width: 0 !important;
}

/* --------------------------------------------------------------------------
   Paso 03 — Estado general
   -------------------------------------------------------------------------- */
body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__choice-block {
    grid-column: 1 / -1 !important;
    display: grid !important;
    gap: 12px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__choice-block > span {
    position: static !important;
    inset: auto !important;
    display: block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #252b31 !important;
    font: inherit !important;
    font-size: 14px !important;
    font-weight: 750 !important;
    line-height: 1.35 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    white-space: normal !important;
    transform: none !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__choice-grid {
    position: static !important;
    inset: auto !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-flow: row !important;
    gap: 12px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    transform: none !important;
}

/*
 * Reset intencional: había reglas globales de button/span/svg deformando el
 * bloque. ChoiceGrid sólo existe en este paso, por lo que podemos reconstruir
 * su geometría sin afectar otras experiencias.
 */
body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice {
    all: unset !important;
    box-sizing: border-box !important;
    position: relative !important;
    display: grid !important;
    grid-template-columns: 56px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 14px !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 100px !important;
    padding: 14px 16px !important;
    overflow: hidden !important;
    border: 1px solid #d9dee4 !important;
    border-radius: 16px !important;
    background: #fff !important;
    color: #171a1f !important;
    box-shadow: 0 2px 8px rgba(15, 23, 42, .035) !important;
    font-family: inherit !important;
    text-align: left !important;
    cursor: pointer !important;
    transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease, transform .16s ease !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice:hover {
    border-color: #9ca5af !important;
    background: #fbfcfd !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .08) !important;
    transform: translateY(-1px) !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice:focus-visible {
    border-color: #5e6873 !important;
    outline: 3px solid rgba(17, 24, 39, .10) !important;
    outline-offset: 2px !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice.is-active {
    border-color: #171a1f !important;
    background: #171a1f !important;
    color: #fff !important;
    box-shadow: 0 12px 28px rgba(17, 19, 24, .18) !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice > .ae-sell__choice-icon {
    all: unset !important;
    box-sizing: border-box !important;
    display: grid !important;
    place-items: center !important;
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    min-height: 56px !important;
    border: 1px solid #e0e4e8 !important;
    border-radius: 14px !important;
    background: #f4f6f7 !important;
    color: #343a41 !important;
    line-height: 0 !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice > .ae-sell__choice-icon > svg {
    all: unset !important;
    box-sizing: border-box !important;
    display: block !important;
    width: 30px !important;
    height: 30px !important;
    color: inherit !important;
    overflow: visible !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice.is-active > .ae-sell__choice-icon {
    border-color: rgba(255, 255, 255, .18) !important;
    background: rgba(255, 255, 255, .09) !important;
    color: #fff !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice > .ae-sell__choice-copy {
    all: unset !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 4px !important;
    width: 100% !important;
    min-width: 0 !important;
    color: inherit !important;
    font-family: inherit !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice .ae-sell__choice-copy > strong,
body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice .ae-sell__choice-copy > small {
    all: unset !important;
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
    color: inherit !important;
    font-family: inherit !important;
    text-align: left !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice .ae-sell__choice-copy > strong {
    font-size: 15px !important;
    font-weight: 780 !important;
    line-height: 1.22 !important;
    letter-spacing: -.012em !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice .ae-sell__choice-copy > small {
    color: #68737e !important;
    font-size: 12.5px !important;
    font-weight: 520 !important;
    line-height: 1.35 !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice.is-active .ae-sell__choice-copy > small {
    color: #dfe3e7 !important;
}

/* --------------------------------------------------------------------------
   Resumen en vivo — escala legible
   -------------------------------------------------------------------------- */
body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary {
    box-sizing: border-box !important;
    position: sticky !important;
    top: 88px !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 24px !important;
    overflow: hidden !important;
    border: 1px solid #d8dde3 !important;
    border-radius: 22px !important;
    background: #fff !important;
    color: #171a1f !important;
    box-shadow: 0 20px 50px rgba(15, 23, 42, .10) !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary::before,
body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary::after {
    content: none !important;
    display: none !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__summary-head {
    position: static !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin: 0 0 18px !important;
    color: #67727d !important;
    font-size: 11px !important;
    font-weight: 820 !important;
    line-height: 1.25 !important;
    letter-spacing: .10em !important;
    text-transform: uppercase !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__summary-head > span {
    position: static !important;
    display: inline !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    color: inherit !important;
    font: inherit !important;
    letter-spacing: inherit !important;
    text-transform: inherit !important;
    transform: none !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__summary-head > i {
    position: static !important;
    display: block !important;
    width: 9px !important;
    height: 9px !important;
    flex: 0 0 9px !important;
    margin: 0 !important;
    border: 2px solid #fff !important;
    border-radius: 50% !important;
    background: #171a1f !important;
    box-shadow: 0 0 0 4px rgba(17, 24, 39, .08) !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary > h3 {
    position: static !important;
    margin: 0 !important;
    color: #171a1f !important;
    font-size: 23px !important;
    font-weight: 790 !important;
    line-height: 1.12 !important;
    letter-spacing: -.03em !important;
    text-wrap: balance !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary > p {
    position: static !important;
    margin: 9px 0 20px !important;
    color: #66717c !important;
    font-size: 13px !important;
    font-weight: 520 !important;
    line-height: 1.5 !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary > dl {
    display: grid !important;
    gap: 0 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border-top: 1px solid #dde2e7 !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary > dl > div {
    display: grid !important;
    grid-template-columns: minmax(105px, .9fr) minmax(0, 1.1fr) !important;
    align-items: center !important;
    gap: 14px !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 10px 0 !important;
    border-bottom: 1px solid #e1e5e9 !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary dt,
body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary dd {
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    font-family: inherit !important;
    font-size: 12.5px !important;
    line-height: 1.38 !important;
    transform: none !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary dt {
    color: #66717c !important;
    font-weight: 560 !important;
    text-align: left !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary dd {
    color: #171a1f !important;
    font-weight: 740 !important;
    text-align: right !important;
    overflow-wrap: anywhere !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__summary-note {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: 22px minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 11px !important;
    width: 100% !important;
    margin: 18px 0 0 !important;
    padding: 14px !important;
    border: 1px solid #e0e4e8 !important;
    border-radius: 14px !important;
    background: #f5f6f7 !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__summary-note > svg {
    position: static !important;
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    margin: 0 !important;
    color: #343a41 !important;
    transform: none !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__summary-note > span {
    position: static !important;
    display: block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #5d6873 !important;
    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;
    transform: none !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__summary-note b {
    color: #171a1f !important;
    font-size: 12.25px !important;
    font-weight: 760 !important;
}

body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary > small {
    position: static !important;
    display: block !important;
    margin: 14px 0 0 !important;
    padding: 0 !important;
    color: #717c87 !important;
    font-family: inherit !important;
    font-size: 10.75px !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;
    transform: none !important;
}

/* --------------------------------------------------------------------------
   Dark mode
   -------------------------------------------------------------------------- */
html[data-theme="dark"] body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice,
html.dark body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice {
    border-color: #303841 !important;
    background: #151a20 !important;
    color: #f3f5f7 !important;
}

html[data-theme="dark"] body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice > .ae-sell__choice-icon,
html.dark body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice > .ae-sell__choice-icon {
    border-color: #35404a !important;
    background: #20272e !important;
    color: #dfe4e8 !important;
}

html[data-theme="dark"] body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice .ae-sell__choice-copy > small,
html.dark body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice .ae-sell__choice-copy > small {
    color: #a9b2bc !important;
}

html[data-theme="dark"] body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice.is-active,
html.dark body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice.is-active {
    border-color: #f1f3f5 !important;
    background: #f1f3f5 !important;
    color: #15181c !important;
}

html[data-theme="dark"] body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice.is-active > .ae-sell__choice-icon,
html.dark body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice.is-active > .ae-sell__choice-icon {
    border-color: #d5dae0 !important;
    background: #fff !important;
    color: #15181c !important;
}

html[data-theme="dark"] body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice.is-active .ae-sell__choice-copy > small,
html.dark body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice.is-active .ae-sell__choice-copy > small {
    color: #606a75 !important;
}

html[data-theme="dark"] body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary,
html.dark body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary {
    border-color: #303841 !important;
    background: #11161b !important;
    color: #f4f6f8 !important;
    box-shadow: 0 22px 56px rgba(0, 0, 0, .38) !important;
}

html[data-theme="dark"] body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__summary-head,
html.dark body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__summary-head,
html[data-theme="dark"] body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary > p,
html.dark body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary > p,
html[data-theme="dark"] body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary dt,
html.dark body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary dt,
html[data-theme="dark"] body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary > small,
html.dark body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary > small {
    color: #a8b2bd !important;
}

html[data-theme="dark"] body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary > h3,
html.dark body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary > h3,
html[data-theme="dark"] body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary dd,
html.dark body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary dd,
html[data-theme="dark"] body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__summary-note b,
html.dark body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__summary-note b {
    color: #f4f6f8 !important;
}

html[data-theme="dark"] body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__summary-note,
html.dark body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__summary-note {
    border-color: #303841 !important;
    background: #191f25 !important;
}

html[data-theme="dark"] body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__summary-note > span,
html.dark body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__summary-note > span {
    color: #a9b2bc !important;
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 1240px) {
    body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__workspace {
        grid-template-columns: minmax(0, 1fr) 330px !important;
        gap: 20px !important;
    }
}

@media (max-width: 1040px) {
    body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__workspace {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary {
        position: static !important;
        order: 2 !important;
    }
}

@media (max-width: 720px) {
    body .ae-sell-modal.ae-sell-page .ae-sell-modal__content .ae-sell__choice-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice {
        grid-template-columns: 50px minmax(0, 1fr) !important;
        min-height: 90px !important;
        padding: 12px 13px !important;
    }

    body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice > .ae-sell__choice-icon {
        width: 50px !important;
        height: 50px !important;
        min-width: 50px !important;
        min-height: 50px !important;
    }

    body .ae-sell-modal.ae-sell-page .ae-sell-modal__content aside.ae-sell__summary {
        padding: 20px !important;
        border-radius: 18px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    body .ae-sell-modal.ae-sell-page .ae-sell-modal__content button.ae-sell__choice {
        transition: none !important;
    }
}
