/* ============================================================
   VENTA AUTO — form.css  v1.9.6
   Step-specific styles. All scoped to .va-card to beat theme CSS.
   ============================================================ */

/* ── Step 1: plate row ── */
.va-card .va-patente-row {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 14px !important;
}

.va-card .va-btn-group {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  align-items: flex-start !important;
}

/* Continuar sin patente — outlined blue, hover fills */
/* Continuar sin patente — link style, azul fuerte */
.va-card #va-btn-sin-patente {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  cursor: pointer !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #1A3F7B !important;
  font-family: 'Manrope', system-ui, sans-serif !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: opacity 0.15s !important;
}
.va-card #va-btn-sin-patente:hover { opacity: 0.7 !important; }

/* ── Licence plate widget — Chilean style ── */
.va-card .va-plate {
  display: inline-flex !important;
  align-items: stretch !important;
  border: 2.5px solid #1A3F7B !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  background: #fff !important;
  cursor: text !important;
  position: relative !important;
  min-width: 230px !important;
  min-height: 64px !important;
  flex-shrink: 0 !important;
  box-shadow: 0 2px 10px rgba(13,45,107,0.10) !important;
  transition: box-shadow 0.15s !important;
}
.va-card .va-plate.focused {
  box-shadow: 0 0 0 3px rgba(26,63,123,0.15) !important;
}
.va-card .va-plate.valid {
  border-color: #1A8C4E !important;
}

/* Blue band left */
.va-card .va-plate-band {
  background: #1A3F7B !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 8px 9px !important;
  gap: 5px !important;
  min-width: 34px !important;
}
.va-card .va-plate-star {
  width: 16px !important;
  height: 16px !important;
  fill: #fff !important;
}
.va-card .va-plate-cl {
  font-size: 10px !important;
  font-weight: 800 !important;
  color: #fff !important;
  letter-spacing: 0.05em !important;
  font-family: 'Manrope', system-ui, sans-serif !important;
  line-height: 1 !important;
}

/* Plate body */
.va-card .va-plate-body {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 10px 14px !important;
  flex: 1 !important;
}
.va-card .va-plate-fields {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 3px !important;
}
.va-card .va-plate-dot {
  font-size: 20px !important;
  font-weight: 900 !important;
  color: #94A3B8 !important;
  line-height: 1 !important;
  margin: 0 1px !important;
}
.va-card .va-plate-input {
  position: fixed !important;
  top: 0 !important; left: 0 !important;
  opacity: 0 !important;
  width: 1px !important; height: 1px !important;
  pointer-events: none !important;
}
.va-card .va-slot-group {
  display: flex !important;
  flex-direction: row !important;
  gap: 1px !important;
}
.va-card .va-slot {
  width: 22px !important;
  height: 36px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 26px !important;
  font-weight: 800 !important;
  color: #C0CADE !important;
  font-family: 'Manrope', system-ui, sans-serif !important;
  border-bottom: 2px solid transparent !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-radius: 0 !important;
  transition: border-color .1s, color .1s !important;
  line-height: 1 !important;
  background: transparent !important;
  padding: 0 !important;
}
.va-card .va-slot.active-cursor {
  border-bottom-color: #E63946 !important;
  animation: va-blink 1s step-end infinite !important;
}
.va-card .va-slot.filled {
  color: #0D1F3C !important;
  border-bottom-color: #1A3F7B !important;
}

/* ── Step 3: asymmetric shape button ── */
.va-card .va-btn-shape {
  position: relative !important;
  width: 51px !important;
  height: 48px !important;
  background: none !important;
  border: none !important;
  padding: 0 !important;
  cursor: pointer;
  flex-shrink: 0;
  transition: opacity 0.15s, transform 0.1s;
  opacity: 0.4;
  pointer-events: none;
  box-shadow: none !important;
}

.va-card .va-btn-shape.enabled {
  opacity: 1 !important;
  pointer-events: all !important;
}

.va-card .va-btn-shape.enabled:hover  { opacity: 0.88 !important; }
.va-card .va-btn-shape.enabled:active { transform: scale(0.96) !important; }

.va-card .va-btn-shape svg.shape {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

.va-card .va-btn-shape svg.arrow {
  position: absolute !important;
  inset: 0 !important;
  margin: auto !important;
  width: 22px !important;
  height: 22px !important;
  stroke: #fff !important;
  stroke-width: 2.5 !important;
  fill: none !important;
  left: 4px !important;
}

/* ── Step 3: terms checkbox ── */
.va-card .va-terms {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 12px !important;
  margin-top: 4px !important;
  padding: 4px !important;
  border-radius: 6px;
}

.va-card .va-terms-checkbox {
  -webkit-appearance: none !important;
  appearance: none !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  border: 2px solid #1A3F7B !important;
  border-radius: 5px !important;
  background: #fff !important;
  cursor: pointer;
  flex-shrink: 0;
  position: relative !important;
  transition: background 0.15s, border-color 0.15s;
}

.va-card .va-terms-checkbox:checked {
  background: #1A3F7B !important;
  border-color: #1A3F7B !important;
}

.va-card .va-terms-checkbox:checked::after {
  content: '' !important;
  position: absolute !important;
  left: 4px !important;
  top: 1px !important;
  width: 6px !important;
  height: 11px !important;
  border: 2px solid #fff !important;
  border-top: none !important;
  border-left: none !important;
  transform: rotate(45deg) !important;
}

.va-card .va-terms-label {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #1A3F7B !important;
  cursor: pointer;
  line-height: 1.3 !important;
  font-family: 'Manrope', system-ui, sans-serif !important;
}

/* ── Step 4: success box ── */
.va-card .va-success-box {
  background: #fff !important;
  border-radius: 16px !important;
  padding: 28px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 20px !important;
}

.va-card .va-success-text { flex: 1; }

.va-card .va-success-title {
  font-size: 26px !important;
  font-weight: 700 !important;
  color: #0D2D6B !important;
  line-height: 1.25 !important;
  margin: 0 0 14px !important;
  font-family: 'Manrope', system-ui, sans-serif !important;
  border: none !important;
  padding: 0 !important;
}

.va-card .va-success-title span { display: block !important; }

.va-card .va-success-body {
  font-size: 14px !important;
  color: #5C6B87 !important;
  line-height: 1.6 !important;
  margin: 0 !important;
  font-family: 'Manrope', system-ui, sans-serif !important;
}

.va-card .va-success-body strong {
  color: #0D2D6B !important;
  font-weight: 600 !important;
}

.va-card .va-success-icon {
  flex-shrink: 0;
  width: 105px !important;
  height: 105px !important;
}

.va-card .va-success-icon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

/* ── Step 4: channels ── */
.va-card .va-channels-section {
  background: #fff !important;
  border-radius: 16px !important;
  padding: 24px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 20px !important;
}

.va-card .va-channels-title {
  font-size: 20px !important;
  font-weight: 600 !important;
  color: #0D2D6B !important;
  margin: 0 !important;
  font-family: 'Manrope', system-ui, sans-serif !important;
}

.va-card .va-channels-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 12px !important;
}

.va-card .va-channel-card {
  background: #F6F8FC !important;
  border-radius: 12px !important;
  padding: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  border: 1.5px solid #E8EDF5 !important;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.va-card .va-channel-card:hover {
  border-color: #B8D6FF !important;
  box-shadow: 0 2px 12px rgba(13,45,107,.07) !important;
}

.va-card .va-channel-top {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.va-card .va-channel-icon {
  width: 44px !important;
  height: 44px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0;
}

.va-card .va-channel-icon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

.va-card .va-channel-btn {
  position: relative !important;
  width: 40px !important;
  height: 38px !important;
  background: none !important;
  border: none !important;
  padding: 0 !important;
  cursor: pointer;
  flex-shrink: 0;
  box-shadow: none !important;
  transition: opacity 0.15s, transform 0.1s;
}

.va-card .va-channel-btn:hover  { opacity: 0.85 !important; }
.va-card .va-channel-btn:active { transform: scale(0.95) !important; }

.va-card .va-channel-btn img.btn-shape {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: fill !important;
}

.va-card .va-channel-btn svg.btn-arrow {
  position: absolute !important;
  inset: 0 !important;
  margin: auto !important;
  width: 16px !important;
  height: 16px !important;
  stroke: #fff !important;
  stroke-width: 2.5 !important;
  fill: none !important;
  left: 3px !important;
}

.va-card .va-channel-name {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #1A3F7B !important;
  margin: 0 0 4px !important;
  font-family: 'Manrope', system-ui, sans-serif !important;
}

.va-card .va-channel-desc {
  font-size: 12px !important;
  color: #5C6B87 !important;
  line-height: 1.45 !important;
  margin: 0 !important;
  font-family: 'Manrope', system-ui, sans-serif !important;
}

.va-card .va-content-box.va-step4-content {
  gap: 16px !important;
  padding: 24px !important;
}

/* ── Photo upload: spinner overlay ── */
.va-card .va-thumb [id^="va-spin"] {
  position: absolute !important;
  inset: 0 !important;
  display: none;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(240,243,250,0.9) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #1A3F7B !important;
  font-family: 'Manrope', system-ui, sans-serif !important;
  border-radius: 8px !important;
}

/* ── Font weight 400 everywhere ── */
.va-wrapper,
.va-wrapper * {
  font-weight: 400 !important;
}
/* Exceptions that need emphasis */
.va-card .va-title,
.va-card .va-content-title,
.va-card .va-success-title,
.va-card .va-channels-title,
.va-card .va-channel-name,
.va-card .va-photos-label,
.va-card .va-btn-label,
.va-card .va-terms-label,
.va-card .va-marcas-loading {
  font-weight: 400 !important;
}

/* ── Panel 1b: brand grid ── */
.va-card .va-marcas-grid {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 10px !important;
}

.va-card .va-marcas-loading {
  grid-column: 1/-1;
  font-size: 13px !important;
  color: #8A9AB8 !important;
  padding: 20px 0 !important;
  text-align: center !important;
}

.va-card .va-marca-card {
  background: #fff !important;
  border: 1.5px solid #E8EDF5 !important;
  border-radius: 12px !important;
  padding: 12px 8px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  cursor: pointer !important;
  transition: border-color 0.15s, box-shadow 0.15s !important;
  min-height: 72px !important;
  box-shadow: none !important;
}

.va-card .va-marca-card:hover {
  border-color: #B8D6FF !important;
  box-shadow: 0 2px 8px rgba(13,45,107,0.08) !important;
}

.va-card .va-marca-card--selected {
  border-color: #1A3F7B !important;
  box-shadow: 0 0 0 3px rgba(13,45,107,0.12) !important;
}

.va-card .va-marca-card img {
  width: 100% !important;
  height: 40px !important;
  object-fit: contain !important;
  display: block !important;
}

.va-card .va-marca-text {
  font-size: 11px !important;
  font-weight: 400 !important;
  color: #0D2D6B !important;
  text-align: center !important;
  line-height: 1.3 !important;
  word-break: break-word !important;
}

/* ── "Otras marcas" button ── */
.va-card .va-otras-marcas-btn {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: none !important;
  border: none !important;
  padding: 4px 0 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  color: #0D2D6B !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  font-family: 'Manrope', system-ui, sans-serif !important;
  transition: opacity 0.15s !important;
  box-shadow: none !important;
  margin: 0 auto !important;
}
.va-card .va-otras-marcas-btn:hover { opacity: 0.7 !important; }
.va-card .va-otras-marcas-btn svg { transition: transform 0.2s; }

.va-card .va-otras-marcas-list {
  display: none;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 10px !important;
  margin-top: 4px !important;
}

/* ── Input validation states ── */
.va-card .va-input.va-input--ok {
  border-color: #1A8C4E !important;
  box-shadow: 0 0 0 3px rgba(26,140,78,0.07) !important;
}

.va-card .va-input.va-input--error {
  border-color: #C0202E !important;
  box-shadow: 0 0 0 3px rgba(192,32,46,0.08) !important;
}

/* ── Validation hint texts ── */
.va-card .va-field-hints {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  margin-top: -8px !important;
}

.va-card .va-hint {
  font-size: 11px !important;
  font-weight: 400 !important;
  color: #C0202E !important;
  font-family: 'Manrope', system-ui, sans-serif !important;
  min-height: 14px !important;
  line-height: 1.2 !important;
}

/* ============================================================
   RESPONSIVE — Mobile first  (breakpoint: 480px)
   ============================================================ */

@media (max-width: 600px) {

  /* ── Wrapper: sin padding en mobile ── */
  .va-wrapper {
    padding: 0 !important;
  }

  /* ── Card: reduce padding ── */
  .va-card {
    padding: 24px 20px 28px !important;
    min-height: unset !important;
    border-radius: 16px !important;
  }

  /* ── Title: smaller ── */
  .va-card .va-title {
    font-size: 26px !important;
    margin: 0 0 16px !important;
  }

  /* ── Steps: caben todos sin scroll ── */
  .va-card .va-steps {
    gap: 4px !important;
    margin-bottom: 20px !important;
    flex-wrap: nowrap !important;
    overflow: visible !important;
  }

  .va-card .va-step {
    padding: 5px 8px !important;
    font-size: 10px !important;
    flex-shrink: 1 !important;
    white-space: nowrap !important;
    letter-spacing: 0.03em !important;
  }

  /* Step activo un poco más destacado pero sin crecer demasiado */
  .va-card .va-step.va-step--active {
    padding: 5px 10px !important;
  }

  /* ── Content box: less padding ── */
  .va-card .va-content-box {
    padding: 20px 16px 24px !important;
    gap: 16px !important;
  }

  .va-card .va-content-title {
    font-size: 18px !important;
  }

  /* ── STEP 1: plate row → stack vertical ── */
  .va-card .va-patente-row {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 16px !important;
  }

  .va-card .va-plate {
    width: 100% !important;
    height: 80px !important;
  }

  .va-card .va-btn-group {
    align-items: stretch !important;
    gap: 10px !important;
  }

  .va-card .va-btn-primary {
    width: 100% !important;
    justify-content: space-between !important;
  }

  .va-card .va-btn-label {
    flex: 1 !important;
    justify-content: center !important;
  }

  /* ── Features strip: 2x2 grid ── */
  .va-card .va-features {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 16px 8px !important;
    padding-top: 16px !important;
  }

  .va-card .va-feature {
    flex: unset !important;
  }

  /* ── STEP 1b: brand grid → 3 columns ── */
  .va-card .va-marcas-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
  }

  .va-card .va-otras-marcas-list {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
  }

  .va-card .va-marca-card {
    min-height: 64px !important;
    padding: 10px 6px !important;
  }

  .va-card .va-marca-card img {
    height: 32px !important;
  }

  /* ── STEPS 2 & 3: inputs → 1 column ── */
  .va-card .va-input-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  /* Correo full width override no longer needed in 1-col */
  .va-card #va-f-correo {
    max-width: 100% !important;
    grid-column: auto !important;
  }

  /* ── Photos box ── */
  .va-card .va-photos-box {
    padding: 14px !important;
    gap: 10px !important;
  }

  /* 3 columns on mobile */
  .va-card .va-thumbs-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 6px !important;
  }

  /* ── STEP 4: success box → stack vertical ── */
  .va-card .va-success-box {
    flex-direction: column-reverse !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 20px !important;
  }

  .va-card .va-success-icon {
    width: 80px !important;
    height: 80px !important;
  }

  .va-card .va-success-title {
    font-size: 22px !important;
  }

  /* ── Step 4: channels → 1 column ── */
  .va-card .va-channels-grid {
    grid-template-columns: 1fr !important;
  }

  .va-card .va-step4-content {
    padding: 16px !important;
    gap: 12px !important;
  }

  /* ── Bottom nav ── */
  .va-card .va-bottom-nav {
    padding-top: 16px !important;
  }
}

/* ── Tablet: 601–900px → minor tweaks ── */
@media (min-width: 601px) and (max-width: 900px) {

  .va-card {
    padding: 28px 28px 32px !important;
  }

  .va-card .va-title {
    font-size: 30px !important;
  }

  /* Plate row stays horizontal but plate is narrower */
  .va-card .va-plate {
    width: 200px !important;
  }

  /* Features: 2x2 */
  .va-card .va-features {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 16px 8px !important;
  }

  .va-card .va-feature { flex: unset !important; }

  /* Brand grid: 4 cols */
  .va-card .va-marcas-grid,
  .va-card .va-otras-marcas-list {
    grid-template-columns: repeat(4, 1fr) !important;
  }

  /* Thumbs: 4 cols on tablet */
  .va-card .va-thumbs-grid {
    grid-template-columns: repeat(4, 1fr) !important;
  }

  /* Channels: 1 col on narrow tablet */
  @media (max-width: 700px) {
    .va-card .va-channels-grid {
      grid-template-columns: 1fr !important;
    }
  }
}

/* ── Steps scroll fade — fallback para pantallas muy pequeñas (<360px) ── */
@media (max-width: 359px) {
  .va-card .va-steps-wrap {
    position: relative !important;
  }

  .va-card .va-steps {
    overflow-x: auto !important;
    scrollbar-width: none !important;
    padding-right: 24px !important;
  }

  .va-card .va-steps::-webkit-scrollbar { display: none !important; }

  /* Fade derecho indica que hay más contenido */
  .va-card .va-steps-wrap::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: 32px !important;
    height: 100% !important;
    background: linear-gradient(to right, transparent, #fff) !important;
    pointer-events: none !important;
  }
}

/* ============================================================
   v1.9.6 — COMPACT LAYOUT (se carga al final: gana sobre reglas previas)
   ============================================================ */
.va-wrapper { padding: 0 !important; }

.va-card {
  max-width: 560px !important;
  min-height: unset !important;
  padding: 22px 20px 24px !important;
}
.va-card .va-content-box { padding: 20px 18px 22px !important; }
.va-card .va-content-title { font-size: 15px !important; line-height: 1.4 !important; }

/* Paso 1: patente + buscar en 2 columnas iguales, mismo alto */
.va-card .va-patente-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px !important;
  align-items: stretch !important;
}
.va-card .va-patente-row .va-plate {
  width: 100% !important;
  min-width: 0 !important;
  height: 56px !important;
  min-height: 0 !important;
}
.va-card .va-patente-row .va-plate-body { padding: 0 8px !important; }
.va-card .va-patente-row .va-slot { width: 18px !important; height: 32px !important; font-size: 21px !important; }
.va-card .va-patente-row .va-plate-dot { font-size: 16px !important; }
.va-card .va-patente-row .va-plate-band { padding: 6px 7px !important; min-width: 30px !important; }

.va-card #va-btn-buscar {
  width: 100% !important;
  height: 56px !important;
  justify-content: space-between !important;
}
.va-card #va-btn-buscar .va-btn-label { flex: 1 !important; padding: 0 14px !important; }
.va-card #va-btn-buscar .va-btn-arrow { height: 100% !important; width: 50px !important; }

.va-card #va-status:empty { display: none !important; }
.va-card #va-status { margin-top: 8px !important; }
.va-card #va-btn-sin-patente { margin-top: 12px !important; align-self: flex-start !important; }

/* Mobile: mantener 2 columnas, reducir slots */
@media (max-width: 480px) {
  .va-card { padding: 18px 14px 20px !important; }
  .va-card .va-content-box { padding: 16px 12px 18px !important; }
  .va-card .va-content-title { font-size: 15px !important; }
  .va-card .va-patente-row { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .va-card .va-patente-row .va-plate { height: 52px !important; }
  .va-card #va-btn-buscar { height: 52px !important; }
  .va-card .va-patente-row .va-slot { width: 14px !important; font-size: 17px !important; height: 28px !important; }
  .va-card .va-patente-row .va-plate-dot { font-size: 13px !important; margin: 0 !important; }
  .va-card .va-patente-row .va-plate-band { padding: 4px 5px !important; min-width: 24px !important; }
  .va-card .va-patente-row .va-plate-star { width: 12px !important; height: 12px !important; }
  .va-card .va-patente-row .va-plate-cl { font-size: 9px !important; }
  .va-card #va-btn-buscar .va-btn-label { font-size: 11px !important; padding: 0 8px !important; }
  .va-card #va-btn-buscar .va-btn-arrow { width: 38px !important; }
}
/* Pantallas muy angostas: apilar */
@media (max-width: 340px) {
  .va-card .va-patente-row { grid-template-columns: 1fr !important; }
}

/* v1.9.6 — Título principal + fuente global */
.va-card .va-title { font-size: 22px !important; margin: 0 0 14px !important; line-height: 1.25 !important; }
.va-wrapper, .va-wrapper input, .va-wrapper button, .va-wrapper select, .va-wrapper textarea {
  font-family: 'Manrope', system-ui, sans-serif !important;
}
@media (max-width: 480px) { .va-card .va-title { font-size: 22px !important; } }

/* v1.9.6 — Tarjetas de canal: toda la tarjeta es clickeable */
.va-card .va-channel-card { cursor: pointer !important; user-select: none !important; outline: none !important; }
.va-card .va-channel-card:hover {
  border-color: #1A3F7B !important;
  box-shadow: 0 4px 14px rgba(13,45,107,.10) !important;
  transform: translateY(-1px);
}
.va-card .va-channel-card:focus-visible { box-shadow: 0 0 0 3px rgba(26,63,123,.25) !important; }
.va-card .va-channel-card.va-channel-card--selected {
  border: 2px solid #1A3F7B !important;
  padding: 15.5px !important; /* compensa el borde +0.5px y evita salto de layout */
  background: #fff !important;
  box-shadow: 0 4px 14px rgba(13,45,107,.10) !important;
}