/**
 * getSignupDashboard-tomselect.css
 *
 * Overrides locales de TomSelect para el formulario /signup. Scopeados a
 * `.signup-card .checkout-acc` para no afectar al resto de vistas.
 *
 * Cubre tres aspectos donde el bootstrap5 theme de tom-select choca con el
 * diseño del signup:
 *   1) Borde / focus / dropdown abierto: el borde lo lleva el WRAPPER
 *      cuando el <select> tiene clase .form-select (el .ts-control interno
 *      queda con border:none !important). Por eso apuntamos al wrapper.
 *   2) Estado deshabilitado: gris + flecha atenuada + cursor not-allowed,
 *      consistente con .form-select:disabled de Bootstrap.
 *   3) Autofill de Chrome/Edge: enmascara el fondo amarillo/azul nativos
 *      tanto en el wrapper como en el <input> interno de TomSelect.
 *
 * Si en el futuro se reutiliza en /account, /checkout, /quotes, /orders, etc.,
 * sustituir el scope por una clase utility (ej. `.address-form`) y promoverlo
 * a un partial CSS común.
 */

/* ── Borde en reposo ─────────────────────────────────────────────────── */
.signup-card .checkout-acc .ts-wrapper.form-select,
.signup-card .checkout-acc .ts-wrapper.form-control {
    border: 1px solid #e9ebec !important;
    border-radius: .375rem;
}

/* ── Focus / dropdown abierto / typing ───────────────────────────────── */
.signup-card .checkout-acc .ts-wrapper.form-select.focus,
.signup-card .checkout-acc .ts-wrapper.form-control.focus,
.signup-card .checkout-acc .ts-wrapper.form-select.dropdown-active,
.signup-card .checkout-acc .ts-wrapper.form-control.dropdown-active,
.signup-card .checkout-acc .ts-wrapper.form-select.input-active,
.signup-card .checkout-acc .ts-wrapper.form-control.input-active {
    border-color: #5b73e8 !important;
    box-shadow: 0 0 0 3px rgba(91, 115, 232, .1) !important;
    outline: 0 !important;
}

/* ── Deshabilitado: fondo gris + flecha atenuada + cursor ────────────── */
.signup-card .checkout-acc .ts-wrapper.form-select.disabled,
.signup-card .checkout-acc .ts-wrapper.form-control.disabled {
    background-color: #e9ecef !important;
    opacity: 1 !important;
    cursor: not-allowed !important;
}
.signup-card .checkout-acc .ts-wrapper.form-select.disabled .ts-control,
.signup-card .checkout-acc .ts-wrapper.form-control.disabled .ts-control {
    background-color: transparent !important;
    opacity: .65 !important;
    cursor: not-allowed !important;
}

/* ── Autofill dentro de TomSelect (Chrome/Edge) ──────────────────────── */
.signup-card .checkout-acc .ts-wrapper.form-select:-webkit-autofill,
.signup-card .checkout-acc .ts-wrapper.form-control:-webkit-autofill,
.signup-card .checkout-acc .ts-wrapper .ts-control input:-webkit-autofill,
.signup-card .checkout-acc .ts-wrapper .ts-control input:-webkit-autofill:hover,
.signup-card .checkout-acc .ts-wrapper .ts-control input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
    -webkit-text-fill-color: #495057 !important;
    background-color: #fff !important;
    transition: background-color 9999s ease-in-out 0s;
}
