/* Iconos de la barra de estado compartida por ambas pantallas. */
.system-status-icon {
  width: var(--s-7);
  height: var(--s-3);
}

/* Home del móvil. */
.ios-home {
  background: var(--ios-home-gradient);
  color: var(--white);
}

.ios-home__status {
  color: var(--white);
}

.ios-home__apps {
  min-width: var(--s-0);
  flex: 1;
  padding: var(--s-3) var(--pad-wide);
}

.app-link {
  width: var(--ios-app-size);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--s-1);
  border-radius: var(--ios-app-radius);
  outline-offset: var(--s-1);
}

.app-icon {
  width: var(--ios-app-size);
  height: var(--ios-app-size);
  display: grid;
  place-items: center;
  border-radius: var(--ios-app-radius);
  background: var(--white);
  box-shadow: var(--ios-app-shadow);
  transition: opacity var(--transition-fast), transform var(--transition-fast);
}

.app-icon img {
  width: var(--ios-app-mark-size);
  height: var(--ios-app-mark-size);
}

.app-label {
  color: var(--white);
  font-family: var(--font);
  font-size: var(--ios-app-label-size);
  font-weight: var(--fw-medium);
  line-height: var(--ios-app-label-lh);
  text-align: center;
  text-shadow: var(--ios-label-shadow);
}

.app-link:hover .app-icon { opacity: var(--opacity-pressed); }
.app-link:active .app-icon { transform: scale(var(--press-scale)); }
.app-link:focus-visible { outline: var(--focus-ring) solid var(--white); }
.ios-home__indicator::before { background: var(--white); }

/* Portada vacía de Plaude. */
.plaude-cover__body {
  display: flex;
  flex-direction: column;
}

.plaude-cover__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.plaude-cover__menu-icon {
  width: var(--header-icon-size);
  height: var(--header-icon-size);
}

.plaude-cover__close {
  width: var(--pl-header-control);
  height: var(--pl-header-control);
  display: grid;
  place-items: center;
  border: var(--s-0);
  border-radius: var(--pl-r-pill);
  background: transparent;
  color: var(--pl-ink);
  cursor: pointer;
  transition: opacity var(--transition-fast), transform var(--transition-fast);
}

.plaude-cover__close-icon {
  width: var(--header-close-size);
  height: var(--header-close-size);
}

.plaude-cover__close:hover { opacity: var(--opacity-pressed); }
.plaude-cover__close:active { transform: scale(var(--press-scale)); }
.plaude-cover__close:focus-visible {
  outline: var(--focus-ring) solid var(--pl-btn-dark);
  outline-offset: var(--s-1);
}

.plaude-cover__hero {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: var(--s-4);
  text-align: center;
}

.plaude-cover__hero img {
  width: var(--s-7);
  height: var(--s-7);
}

.plaude-cover__composer {
  display: grid;
  grid-template-columns: auto auto 1fr auto;
  grid-template-rows: auto auto;
  column-gap: var(--s-2);
  row-gap: var(--s-3);
  margin-bottom: var(--s-3);
  padding: var(--pl-cover-composer-pad-block) var(--s-3);
  border-radius: var(--pl-cover-composer-radius);
}

.plaude-cover__composer .composer__add {
  grid-column: 1;
  grid-row: 2;
  width: var(--pl-cover-add-size);
  height: var(--pl-cover-add-size);
  border: var(--s-0);
  background: var(--pl-btn-light);
}

.plaude-cover__composer .composer__chip {
  grid-column: 2;
  grid-row: 2;
  height: var(--pl-cover-chip-height);
  display: flex;
  align-items: center;
  padding: var(--s-0) var(--s-3);
}

.plaude-cover__composer .composer__mic {
  grid-column: 4;
  grid-row: 2;
  width: var(--pl-cover-mic-size);
  height: var(--pl-cover-mic-size);
}

.composer__message-link {
  grid-column: 1 / -1;
  grid-row: 1;
  min-width: var(--s-0);
  align-self: stretch;
  display: flex;
  align-items: center;
  flex: 1;
  border-radius: var(--pl-r-pill);
}

.composer__message-link:hover .composer__placeholder { color: var(--pl-ink-soft); }
.composer__message-link:active { opacity: var(--opacity-pressed); }
.composer__message-link:focus-visible,
.composer__mic:focus-visible {
  outline: var(--focus-ring) solid var(--pl-btn-dark);
  outline-offset: var(--s-1);
}

/* Conversación: cabecera y composer fijos, historial desplazable. */
.plaude-conversation {
  height: min(var(--device-h), var(--viewport-height));
  min-height: min(var(--device-h), var(--viewport-height));
}

.conversation-shell {
  min-height: var(--s-0);
  display: flex;
  flex: 1;
  flex-direction: column;
  overflow: hidden;
}

.conversation-header {
  min-height: var(--pl-chat-header-height);
  display: flex;
  flex: 0 0 auto;
  align-items: flex-start;
  justify-content: space-between;
  padding: var(--s-1) var(--pad-content) var(--s-3);
}

.conversation-header__icon {
  width: var(--icon-sm);
  height: var(--icon-sm);
}

.search-row__icon {
  width: var(--icon-xs);
  height: var(--icon-xs);
}

.composer__add-icon,
.composer__send-icon {
  width: var(--pl-composer-action-icon);
  height: var(--pl-composer-action-icon);
}

.composer__mic-icon,
.composer__pause-icon {
  width: 100%;
  height: 100%;
  color: var(--pl-btn-dark);
}

.composer__send-icon {
  color: var(--pl-on-dark);
}

.conversation-scroll {
  min-width: var(--s-0);
  min-height: var(--s-0);
  flex: 1;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: none;
  overscroll-behavior: contain;
}

.conversation-scroll::-webkit-scrollbar {
  width: var(--pl-chat-scrollbar-width);
  height: var(--pl-chat-scrollbar-width);
}

.conversation-history {
  min-height: 100%;
  justify-content: flex-end;
  gap: var(--s-4);
  padding-top: var(--s-3);
  padding-bottom: var(--s-4);
}

/* Estado compartido mientras Plaude prepara su respuesta. */
.thinking-indicator {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--s-2);
  color: var(--pl-ink-soft);
  font-size: var(--pl-fs-body);
  line-height: var(--pl-lh-body);
}

.thinking-indicator[hidden] {
  display: none;
}

.thinking-indicator__label {
  display: inline-flex;
  align-items: center;
  gap: var(--s-1);
}

.thinking-indicator__chevron {
  color: var(--pl-ink-faint);
}

.thinking-indicator__flower {
  width: var(--pl-thinking-flower-size);
  height: var(--pl-thinking-flower-size);
  animation: plaude-thinking-spin var(--pl-thinking-spin-duration) linear infinite;
  transform-origin: center;
}

.conversation-response {
  display: none;
  flex-direction: column;
  gap: var(--s-4);
  opacity: var(--s-0);
  transform: translateY(var(--pl-thinking-offset));
  transition: opacity var(--pl-thinking-reveal-duration) ease,
    transform var(--pl-thinking-reveal-duration) ease;
}

.conversation-response--revealing {
  display: flex;
}

.conversation-response--visible {
  opacity: 1;
  transform: translateY(var(--s-0));
}

.conversation-tail-space {
  min-height: var(--s-0);
  flex: 0 0 auto;
}

@keyframes plaude-thinking-spin {
  to { transform: rotate(1turn); }
}

@media (prefers-reduced-motion: reduce) {
  .thinking-indicator__flower { animation: none; }
  .conversation-response { transition: none; transform: none; }
}

.msg-agent {
  display: flex;
  flex-direction: column;
  gap: var(--s-3);
}

.search-row {
  width: 100%;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: var(--s-2);
  padding: var(--s-3) var(--s-0);
  border-top: var(--line-hairline) solid var(--pl-line);
  border-bottom: var(--line-hairline) solid var(--pl-line);
  color: var(--pl-ink-soft);
  font-size: var(--pl-fs-card-text);
  line-height: var(--pl-lh-body);
}

.search-row__chevron {
  width: var(--pl-search-chevron-size);
  color: var(--pl-ink-faint);
  font-size: var(--pl-fs-card-title);
  text-align: right;
}

/* Resultados de producto dentro del historial. */
.product-results {
  display: flex;
  flex-direction: column;
  gap: var(--s-3);
}

.product-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--s-2);
  padding: var(--s-3);
}

.product-card__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--s-2);
  color: var(--pl-ink);
  font-size: var(--pl-fs-card-title);
  font-weight: var(--fw-semibold);
  line-height: var(--pl-lh-body);
}

.product-card__price {
  flex: 0 0 auto;
}

.product-card__seller,
.product-card__delivery {
  color: var(--pl-ink-soft);
  font-size: var(--pl-fs-card-text);
  font-weight: var(--fw-regular);
  line-height: var(--pl-lh-body);
}

.product-card__warning {
  color: var(--pl-warn);
  font-weight: var(--fw-semibold);
}

.product-card__actions {
  display: flex;
  align-items: center;
  gap: var(--s-2);
  padding: var(--s-2) var(--s-3) var(--s-3);
}

.product-card__action {
  min-width: var(--s-0);
  gap: var(--s-1);
  padding: var(--s-1) var(--s-3);
  font-size: var(--pl-fs-card-text);
}

.product-card__checkout {
  border: var(--s-0);
  background: var(--pl-btn-light);
  color: var(--pl-ink-soft);
}

.product-card__action-icon,
.product-card__website-icon {
  width: var(--icon-xs);
  height: var(--icon-xs);
  flex: 0 0 auto;
}

.product-card__website {
  min-width: var(--s-0);
  display: inline-flex;
  align-items: center;
  gap: var(--s-1);
  margin-left: auto;
  color: var(--pl-ink-soft);
  font-size: var(--pl-fs-card-text);
  line-height: var(--pl-lh-body);
}

/* Timeline compartido del trabajo previo a una compra. */
.purchase-progress-card {
  overflow: hidden;
}

.purchase-progress-card__header {
  display: flex;
  align-items: center;
  gap: var(--s-2);
  padding: var(--s-3);
  border-bottom: var(--line-hairline) solid var(--pl-line);
}

.purchase-progress-card__header strong {
  font-size: var(--pl-fs-card-title);
}

.purchase-progress-card__header .badge {
  margin-left: auto;
}

.purchase-progress-card__clock {
  width: var(--icon-sm);
  height: var(--icon-sm);
  flex: 0 0 auto;
  color: var(--pl-ink-soft);
}

.purchase-progress-card__step {
  display: grid;
  grid-template-columns: var(--icon-sm) minmax(var(--s-0), 1fr);
  align-items: start;
  gap: var(--s-2);
  padding: var(--s-3);
  border-bottom: var(--line-hairline) solid var(--pl-line);
}

.purchase-progress-card__step:last-child {
  border-bottom: var(--s-0);
}

.purchase-progress-card__step p {
  min-width: var(--s-0);
  color: var(--pl-ink);
  font-size: var(--pl-fs-card-text);
  line-height: var(--pl-lh-body);
}

.purchase-progress-card__step small {
  display: block;
  margin-top: var(--s-1);
  color: var(--pl-ink-faint);
  font-size: var(--pl-fs-card-text);
}

.purchase-progress-card__status {
  width: var(--icon-sm);
  height: var(--icon-sm);
  display: grid;
  place-items: center;
  border: var(--line-hairline) solid var(--pl-line);
  border-radius: var(--pl-r-pill);
  color: var(--pl-verified);
  font-size: var(--pl-fs-badge);
  font-weight: var(--fw-bold);
}

.purchase-progress-card__step--done .purchase-progress-card__status {
  border-color: var(--pl-tint-ok);
  background: var(--pl-tint-ok);
}

.purchase-progress-card__step--active .purchase-progress-card__status {
  border-color: var(--pl-line);
  border-top-color: var(--pl-ink-soft);
  animation: progress-step-spin var(--pl-thinking-spin-duration) linear infinite;
}

.purchase-progress-card__step--blocked p { color: var(--pl-warn); }

.purchase-progress-card__step--blocked .purchase-progress-card__status {
  border-color: var(--pl-btn-light);
  background: var(--pl-btn-light);
  color: var(--pl-warn);
}

.purchase-progress-card__step:not(.purchase-progress-card__step--done):not(.purchase-progress-card__step--active):not(.purchase-progress-card__step--blocked) p {
  color: var(--pl-ink-faint);
}

@keyframes progress-step-spin {
  to { transform: rotate(1turn); }
}

@media (prefers-reduced-motion: reduce) {
  .purchase-progress-card__step--active .purchase-progress-card__status {
    animation: none;
  }
}

.conversation-composer-wrap {
  flex: 0 0 auto;
  padding: var(--s-0) var(--pad-content) var(--s-3);
}

.conversation-composer,
.plaude-cover__composer {
  min-height: var(--pl-chat-composer-height);
  display: grid;
  grid-template-columns: auto auto 1fr auto;
  grid-template-rows: 1fr auto;
  column-gap: var(--s-2);
  row-gap: var(--s-2);
  padding: var(--pl-chat-composer-pad-block) var(--s-3);
  cursor: text;
}

.conversation-composer .composer__text,
.plaude-cover__composer .composer__text {
  min-width: var(--s-0);
  grid-column: 1 / -1;
  grid-row: 1;
  color: var(--pl-ink-faint);
  font-size: var(--pl-fs-body);
  line-height: var(--pl-lh-body);
}

.composer--written .composer__text {
  color: var(--pl-ink);
}

.composer:focus-visible {
  outline: var(--focus-ring) solid var(--pl-btn-dark);
  outline-offset: var(--s-1);
}

.composer[data-mensaje] {
  transition: border-color var(--transition-fast), opacity var(--transition-fast);
}

.composer[data-mensaje]:hover {
  border-color: var(--pl-ink-faint);
}

.composer[data-mensaje]:active {
  opacity: var(--opacity-pressed);
}

.conversation-composer .composer__add,
.plaude-cover__composer .composer__add {
  grid-column: 1;
  grid-row: 2;
  width: var(--pl-cover-add-size);
  height: var(--pl-cover-add-size);
  border: var(--s-0);
  background: var(--pl-btn-light);
}

.conversation-composer .composer__chip,
.plaude-cover__composer .composer__chip {
  grid-column: 2;
  grid-row: 2;
  height: var(--pl-cover-chip-height);
  display: flex;
  align-items: center;
  padding: var(--s-0) var(--s-3);
}

.conversation-composer .composer__mic,
.plaude-cover__composer .composer__mic {
  grid-column: 4;
  grid-row: 2;
  width: var(--pl-cover-mic-size);
  height: var(--pl-cover-mic-size);
  padding: var(--s-0);
  color: var(--pl-on-dark);
}

.composer__send-icon[hidden],
.composer__mic-icon[hidden],
.composer__pause-icon[hidden] {
  display: none;
}

.btn.btn--usado,
.btn.btn--usado:hover,
.btn.btn--usado:active {
  pointer-events: none;
  cursor: default;
  opacity: var(--opacity-disabled);
  transform: none;
}

/* Solicitudes de compra y selector del método de pago. */
.purchase-card__icon,
.purchase-card__action-icon,
.purchase-card__edit,
.purchase-card__verified-icon {
  width: var(--icon-xs);
  height: var(--icon-xs);
  flex: 0 0 auto;
}

.purchase-card__icon--verified,
.purchase-card__verified {
  color: var(--pl-verified);
}

.purchase-card__top {
  border-bottom: var(--line-hairline) solid var(--pl-line);
}

.purchase-card__section {
  padding-top: var(--s-3);
}

.purchase-card__row {
  min-height: var(--s-7);
  align-items: center;
  border-bottom: var(--line-hairline) solid var(--pl-line);
}

.purchase-card__row .card-row__value {
  text-align: left;
}

.purchase-card__row > .purchase-card__edit {
  margin-left: auto;
  color: var(--pl-ink-faint);
}

.purchase-card__footer-link .purchase-card__edit {
  color: var(--pl-ink-faint);
}

.purchase-card__resolved > summary {
  list-style: none;
}

.purchase-card__resolved > summary::-webkit-details-marker {
  display: none;
}

.purchase-card__summary {
  min-height: var(--s-7);
  display: flex;
  align-items: center;
  gap: var(--s-2);
  padding: var(--s-2) var(--s-3);
  color: var(--pl-ink);
  cursor: pointer;
  font-size: var(--pl-fs-card-text);
  font-weight: var(--fw-semibold);
  line-height: var(--pl-lh-body);
  transition: background var(--transition-fast), opacity var(--transition-fast);
}

.purchase-card__summary-title,
.purchase-card__summary-badge,
.purchase-card__summary-chevron {
  flex: 0 0 auto;
}

.purchase-card__summary-title {
  white-space: nowrap;
}

.purchase-card__summary-detail {
  min-width: var(--s-0);
  flex: 1;
  overflow: hidden;
  color: var(--pl-ink-soft);
  font-size: var(--pl-fs-badge);
  font-weight: var(--fw-regular);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.purchase-card__summary-badge {
  padding-right: var(--s-1);
  padding-left: var(--s-1);
}

.purchase-card__summary-chevron {
  width: var(--icon-xs);
  height: var(--icon-xs);
  color: var(--pl-ink-faint);
  transition: transform var(--transition-fast);
}

.purchase-card__resolved[open] .purchase-card__summary-chevron {
  transform: rotate(90deg);
}

.purchase-card__summary:hover { background: var(--pl-btn-light); }
.purchase-card__summary:active { opacity: var(--opacity-pressed); }
.purchase-card__summary:focus-visible {
  outline: var(--focus-ring) solid var(--pl-btn-dark);
  outline-offset: var(--s-0);
}

.purchase-card__resolved[open] .purchase-card__summary {
  border-bottom: var(--line-hairline) solid var(--pl-line);
}

.purchase-card__choice,
.purchase-card__footer-link,
.payment-card__not-now {
  width: 100%;
  display: flex;
  align-items: center;
  gap: var(--s-2);
  padding: var(--s-3);
  border: var(--s-0);
  background: var(--pl-card);
  color: var(--pl-ink);
  cursor: pointer;
  font: inherit;
  font-size: var(--pl-fs-card-text);
  font-weight: var(--fw-semibold);
  line-height: var(--pl-lh-body);
  text-align: left;
  transition: opacity var(--transition-fast), background var(--transition-fast), transform var(--transition-fast);
}

.purchase-card__choice {
  border-bottom: var(--line-hairline) solid var(--pl-line);
}

.purchase-card__footer-link {
  color: var(--pl-ink-soft);
  font-weight: var(--fw-regular);
}

.purchase-card__choice:hover,
.purchase-card__footer-link:hover,
.payment-card__not-now:hover { background: var(--pl-btn-light); }
.purchase-card__choice:active,
.purchase-card__footer-link:active,
.payment-card__not-now:active { transform: scale(var(--press-scale)); }
.purchase-card__choice:disabled { cursor: default; opacity: var(--opacity-disabled); }
.purchase-card__choice:disabled:hover { background: var(--pl-card); }
.purchase-card__footer-link:disabled,
.payment-card__not-now:disabled { cursor: not-allowed; opacity: var(--opacity-disabled); }
.purchase-card__choice:focus-visible,
.purchase-card__footer-link:focus-visible,
.payment-card__not-now:focus-visible {
  outline: var(--focus-ring) solid var(--pl-btn-dark);
  outline-offset: var(--s-0);
}

.purchase-card__actions {
  border-top: var(--line-hairline) solid var(--pl-line);
}

.purchase-card__verified {
  display: inline-flex;
  align-items: center;
  gap: var(--s-1);
}

.payment-card__top {
  border-bottom: var(--line-hairline) solid var(--pl-line);
}

.payment-option {
  display: grid;
  grid-template-columns: var(--icon-md) minmax(var(--s-0), 1fr) auto;
  align-items: center;
  gap: var(--s-3);
  padding: var(--s-3);
  border-bottom: var(--line-hairline) solid var(--pl-line);
}

.payment-option__logo-slot {
  width: var(--icon-md);
  height: var(--icon-md);
  display: grid;
  place-items: center;
}

.payment-option__logo {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}

.payment-option__copy { min-width: var(--s-0); }
.payment-option__name {
  color: var(--pl-ink);
  font-size: var(--pl-fs-card-title);
  font-weight: var(--fw-semibold);
  line-height: var(--pl-lh-body);
}
.payment-option__description {
  color: var(--pl-ink-faint);
  font-size: var(--pl-fs-card-text);
  line-height: var(--pl-lh-body);
}
.payment-option__button {
  padding: var(--s-2) var(--s-3);
  border-radius: var(--pl-r-pill);
  font-size: var(--pl-fs-card-text);
  white-space: nowrap;
}
.btn--primary.payment-option__button.btn--usado,
.btn--primary.payment-option__button.btn--usado:hover,
.btn--primary.payment-option__button.btn--usado:active {
  border-color: var(--pl-ink-faint);
  background: var(--pl-ink-faint);
  color: var(--pl-on-dark);
  cursor: not-allowed;
  opacity: 1;
  pointer-events: auto;
  transform: none;
}
.payment-card__not-now {
  justify-content: center;
  color: var(--pl-ink-soft);
  font-weight: var(--fw-regular);
}

/* Secuencia escalonada tras aprobar el purchase request. */
.confirmed-payment-sequence {
  display: flex;
  flex-direction: column;
  gap: var(--s-4);
}

.confirmed-payment-screen .conversation-history {
  padding-bottom: var(--s-2);
}

/* Sheets del flujo de conexión bancaria. */
.bank-flow .device { height: min(var(--device-h), var(--viewport-height)); }
.bank-flow .conversation-scroll { overflow: hidden; }
.bank-flow .sheet-overlay { z-index: var(--mb-backdrop-layer); }
.bank-flow .sheet { z-index: var(--mb-sheet-layer); max-height: var(--mb-sheet-max-height); }
.bank-flow .sheet-nav { flex: 0 0 auto; }
.bank-flow .sheet-nav h2 { color: var(--pl-ink); font-size: var(--pl-fs-card-title); font-weight: var(--fw-semibold); text-align: center; }
.bank-flow .btn-bank { border-color: var(--pl-btn-dark); background: var(--pl-btn-dark); color: var(--pl-on-dark); }
.bank-flow .btn-bank:hover { opacity: var(--opacity-pressed); }
.bank-flow .btn-bank:active { transform: scale(var(--press-scale)); }
.bank-flow .btn-bank:focus-visible { outline: var(--focus-ring) solid var(--pl-btn-dark); outline-offset: var(--s-1); }
.sheet-nav__close { text-decoration: none; }
.bank-flow .sheet-nav__close .sheet-nav__icon {
  width: var(--ui-lg);
  height: var(--ui-lg);
}
.bank-search__icon { width: var(--mb-inline-icon); height: var(--mb-inline-icon); }
.bank-sheet-copy { padding: var(--s-2) var(--s-0) var(--s-3); color: var(--pl-ink-soft); font-size: var(--mb-fs-body); line-height: var(--pl-lh-body); text-align: center; }
.bank-search { height: var(--mb-search-height); display: flex; align-items: center; gap: var(--s-2); padding: var(--s-0) var(--s-3); border: var(--line-hairline) solid var(--pl-line); border-radius: var(--mb-r-card); color: var(--pl-ink-faint); }
.bank-search input { min-width: var(--s-0); flex: 1; border: var(--s-0); outline: var(--s-0); background: transparent; color: var(--pl-ink); }
.bank-search:focus-within { outline: var(--focus-ring) solid var(--mb-primary); outline-offset: var(--s-1); }
.bank-list { display: flex; flex-direction: column; gap: var(--s-2); padding: var(--s-3) var(--s-0); border: var(--s-0); }
.bank-list__option { min-height: var(--mb-bank-row-min-height); display: grid; grid-template-columns: var(--icon-md) minmax(var(--s-0), 1fr) auto; align-items: center; gap: var(--s-3); padding: var(--s-2) var(--s-3); border: var(--line-hairline) solid var(--pl-line); border-radius: var(--mb-r-card); background: var(--mb-sheet-bg); cursor: pointer; transition: border-color var(--transition-fast), background var(--transition-fast), opacity var(--transition-fast), transform var(--transition-fast); }
.bank-list__option img { width: var(--icon-md); height: var(--icon-md); border-radius: var(--r-sm); }
.bank-list__copy { min-width: var(--s-0); }
.bank-list__name,
.bank-list__status { display: block; }
.bank-list__name { color: var(--pl-ink); font-size: var(--pl-fs-card-title); font-weight: var(--fw-semibold); }
.bank-list__status { color: var(--pl-ink-soft); font-size: var(--pl-fs-card-text); }
.bank-list__radio { width: var(--mb-radio-size); height: var(--mb-radio-size); border: var(--line-hairline) solid var(--pl-line); border-radius: var(--r-pill); appearance: none; }
.bank-list__option:has(input:checked) { border-color: var(--mb-primary); background: var(--mb-card); }
.bank-list__radio:checked { border: var(--s-2) solid var(--mb-primary); background: var(--mb-on-color); }
.bank-list__option:hover { border-color: var(--pl-ink-faint); }
.bank-list__option:active { transform: scale(var(--press-scale)); }
.bank-list__option:focus-within { outline: var(--focus-ring) solid var(--mb-primary); outline-offset: var(--s-1); }
.bank-connect-button:disabled { cursor: not-allowed; opacity: var(--opacity-disabled); }
.sheet-body--redirect,
.sheet-body--connected { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--s-4); padding: var(--s-4) var(--pad-content); text-align: center; }
.bank-lockup { display: inline-flex; align-items: center; gap: var(--s-2); color: var(--pl-ink); font-size: var(--mb-fs-btn); font-weight: var(--fw-bold); }
.bank-lockup img { width: var(--mb-brand-logo); height: var(--mb-brand-logo); }
.sheet-hero-title { color: var(--pl-ink); font-size: var(--mb-fs-title); line-height: var(--pl-lh-body); }
.sheet-hero-copy { color: var(--pl-ink-soft); font-size: var(--mb-fs-body); line-height: var(--pl-lh-body); }
.redirect-status { width: 100%; display: flex; align-items: center; gap: var(--s-2); padding: var(--s-3); border-radius: var(--mb-r-card); background: var(--mb-card); color: var(--pl-ink-soft); font-size: var(--mb-fs-body); text-align: left; }
.redirect-status__dot { width: var(--mb-status-dot-size); height: var(--mb-status-dot-size); border-radius: var(--r-pill); background: var(--pl-btn-dark); animation: redirect-pulse var(--pl-thinking-reveal-duration) ease-in-out infinite alternate; }
@keyframes redirect-pulse { to { opacity: var(--opacity-disabled); } }
.sheet-body--connected { align-items: stretch; }
.sheet-body--connected .bank-lockup,
.sheet-body--connected .sheet-hero-title { align-self: center; }
.sheet-body--connected .bank-box,
.sheet-body--connected .sheet-hero-copy { text-align: left; }

@media (prefers-reduced-motion: reduce) { .redirect-status__dot { animation: none; } }

/* Resumen de pedido compartido por las continuaciones Visa y Mastercard. */
.order-summary-card { overflow: hidden; }
.order-summary-card__header { min-height: 51px; display: flex; align-items: center; gap: var(--s-2); padding: var(--s-3); border-bottom: var(--line-hairline) solid var(--pl-line); }
.order-summary-card__header svg { width: 20px; height: 20px; color: var(--pl-ink-soft); }
.order-summary-card__header strong { font-size: var(--pl-fs-card-title); }
.order-summary-card__row { position: relative; min-height: 68px; display: grid; grid-template-columns: var(--content-label-w) 1fr auto; align-items: center; gap: var(--s-2); padding: var(--s-3); border-bottom: var(--line-hairline) solid var(--pl-line); }
.order-summary-card__row > span { color: var(--pl-ink-soft); font-size: var(--pl-fs-card-text); }
.order-summary-card__row p { margin: 0; font-size: var(--pl-fs-card-text); line-height: var(--pl-lh-body); }
.order-summary-card__row small { display: block; color: var(--pl-ink-faint); }
.order-summary-card__row .purchase-card__edit { width: 18px; height: 18px; color: var(--pl-ink-faint); }
.order-summary-card__edit { width: 36px; height: 36px; display: grid; place-items: center; border-radius: var(--pl-r-pill); transition: background var(--transition-fast), transform var(--transition-fast); }
.order-summary-card__edit:hover { background: var(--pl-btn-light); }
.order-summary-card__edit:active { transform: scale(var(--press-scale)); }
.order-summary-card__edit:focus-visible { outline: var(--focus-ring) solid var(--pl-btn-dark); outline-offset: var(--s-1); }
.order-summary-card__totals { padding: var(--s-3); }
.order-summary-card__totals > div { min-height: 35px; display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); }
.order-summary-card__totals dt { color: var(--pl-ink-soft); font-size: var(--pl-fs-card-text); }
.order-summary-card__totals dd { margin: 0; font-size: var(--pl-fs-card-text); font-weight: var(--fw-semibold); }
.order-summary-card__totals .order-summary-card__total { margin-top: var(--s-1); padding-top: var(--s-3); border-top: var(--line-hairline) solid var(--pl-line); }
.order-summary-card__total dt, .order-summary-card__total dd { color: var(--pl-ink); font-size: var(--pl-fs-card-title); font-weight: var(--fw-bold); }
.order-summary-card__actions { display: grid; grid-template-columns: 1fr 1.55fr; gap: var(--s-2); padding: 0 var(--s-3) var(--s-3); }
.order-summary-card__actions .btn { min-width: 0; padding-right: var(--s-2); padding-left: var(--s-2); }

/* Compra de la alternativa elegida: espera, resumen y recibo. */
.order-summary-card__header .badge { margin-left: auto; }

.purchase-card--compact .purchase-card__row {
  min-height: var(--pl-cover-chip-height);
  display: grid;
  grid-template-columns: 1fr 2fr;
  padding-top: var(--s-2);
  padding-bottom: var(--s-2);
}

.purchase-card--compact .card-row__label { width: auto; }
.purchase-card--compact .purchase-card__section { padding-top: var(--s-2); }

.purchase-card--compact .purchase-card__actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(var(--s-0), 1fr));
}

.purchase-card--compact .purchase-card__actions .btn,
.order-summary-card--compact .order-summary-card__actions .btn {
  min-height: var(--control-lg);
}

.order-summary-card--compact .order-summary-card__row {
  min-height: var(--s-6);
  grid-template-columns: 1fr 2fr;
  padding-top: var(--s-2);
  padding-bottom: var(--s-2);
}

.order-summary-card--compact .order-summary-card__actions {
  grid-template-columns: repeat(2, minmax(var(--s-0), 1fr));
}

.purchase-confirm-spinner {
  width: var(--icon-xs);
  height: var(--icon-xs);
  border: var(--mb-faceid-line) solid color-mix(in srgb, var(--pl-on-dark) 30%, transparent);
  border-top-color: var(--pl-on-dark);
  border-radius: var(--pl-r-pill);
  animation: purchase-confirm-spin var(--pl-thinking-reveal-duration) linear infinite;
}

.purchase-confirm-spinner[hidden] { display: none; }

.payment-timeline { flex: 0 0 auto; }

.purchase-final-sequence {
  display: flex;
  flex-direction: column;
  gap: var(--s-4);
  padding-bottom: var(--s-4);
}

.purchase-final-sequence > [hidden] { display: none; }

.bank-push__header img {
  width: var(--icon-sm);
  height: var(--icon-sm);
}

.purchase-receipt-card__details .sub {
  display: block;
  margin-top: var(--s-1);
  color: var(--pl-ink-soft);
  font-size: var(--pl-fs-card-text);
  line-height: var(--pl-lh-body);
}

@keyframes purchase-confirm-spin {
  to { transform: rotate(1turn); }
}

@media (prefers-reduced-motion: reduce) {
  .purchase-confirm-spinner { animation: none; }
}




/* Estado de compra completada compartido por Visa y Mastercard. */
.purchase-complete-screen { position: relative; }
.mybank-payment-notification { position: absolute; z-index: calc(var(--layer-modal) - 1); top: 62px; right: var(--s-3); left: var(--s-3); padding: var(--s-3); border-radius: var(--pl-r-card); background: rgb(255 255 255 / 96%); box-shadow: var(--el-3); opacity: var(--s-0); pointer-events: none; transform: translateY(calc(var(--s-6) * -1)); }
.mybank-payment-notification[hidden] { display: none; }
.mybank-payment-notification.bank-push--enter { animation: mybank-notification-in 400ms ease both; }
.mybank-payment-notification.bank-push--leaving { animation: mybank-notification-out 400ms ease both; }
.mybank-payment-notification header { display: grid; grid-template-columns: 24px 1fr auto; align-items: center; gap: var(--s-2); }
.mybank-payment-notification header img { width: 24px; height: 24px; }
.mybank-payment-notification header strong { font-size: var(--pl-fs-badge); letter-spacing: .04em; }
.mybank-payment-notification header time { color: var(--pl-ink-faint); font-size: var(--pl-fs-card-text); }
.mybank-payment-notification > strong { display: block; margin-top: var(--s-2); font-size: var(--pl-fs-card-title); }
.mybank-payment-notification > p { margin-top: var(--s-1); color: var(--pl-ink-soft); font-size: var(--pl-fs-card-text); line-height: var(--pl-lh-body); }

.purchase-completed-flow { display: flex; flex-direction: column; gap: var(--s-3); padding-top: 0; }
.purchase-receipt-card { overflow: hidden; }
.purchase-receipt-card__header { min-height: 56px; display: grid; grid-template-columns: 24px 1fr auto; align-items: center; gap: var(--s-2); padding: var(--s-3); border-bottom: var(--line-hairline) solid var(--pl-line); }
.purchase-receipt-card__header .purchase-card__icon { width: 24px; height: 24px; }
.purchase-receipt-card__header strong { font-size: var(--pl-fs-card-title); }
.purchase-receipt-card__header > span { padding: var(--s-1) var(--s-2); border-radius: var(--pl-r-btn); color: var(--pl-verified); background: var(--pl-tint-ok); font-size: var(--pl-fs-card-text); }
.purchase-receipt-card__details > div { min-height: 44px; display: grid; grid-template-columns: var(--content-label-w) 1fr; align-items: start; gap: var(--s-2); padding: var(--s-3); border-bottom: var(--line-hairline) solid var(--pl-line); }
.purchase-receipt-card__details dt { color: var(--pl-ink-soft); font-size: var(--pl-fs-card-text); }
.purchase-receipt-card__details dd { margin: 0; font-size: var(--pl-fs-card-text); line-height: var(--pl-lh-body); }
.purchase-receipt-card__verified { display: inline-flex; align-items: center; gap: 3px; color: var(--pl-verified); font-weight: var(--fw-semibold); white-space: nowrap; }
.purchase-receipt-card__verified svg { width: 16px; height: 16px; }
.purchase-receipt-card__protection { min-height: 66px; display: grid; grid-template-columns: 20px 1fr; align-items: center; gap: var(--s-2); padding: var(--s-3) var(--s-4); color: var(--pl-verified); background: color-mix(in srgb, var(--pl-tint-ok) 60%, var(--pl-card)); font-size: var(--pl-fs-card-text); line-height: var(--pl-lh-body); }
.purchase-receipt-card__protection > span { width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; color: var(--pl-on-dark); background: var(--pl-verified); font-size: 12px; }
.purchase-receipt-card__actions { min-height: 58px; display: flex; align-items: center; gap: var(--s-3); padding: var(--s-3); }
.purchase-receipt-card__actions .btn { min-height: 36px; padding: var(--s-2) var(--s-3); border-radius: var(--pl-r-pill); font-size: var(--pl-fs-card-text); }
.purchase-receipt-card__actions > strong { font-size: var(--pl-fs-card-text); }
.purchase-receipt-card__action-group { display: flex; flex-direction: column; align-items: center; gap: 6px; width: 100%; box-sizing: border-box; }
.purchase-receipt-card__action-group .btn { width: 100%; box-sizing: border-box; }
.purchase-receipt-card__note { font-size: 12px; color: var(--pl-ink-soft); line-height: 1; text-align: center; display: inline-flex; align-items: center; gap: 8px; }
.purchase-receipt-card__note-icon { width: 14px; height: 14px; flex: 0 0 14px; color: var(--pl-ink-soft); }
.purchase-receipt-card__note-icon circle { fill: none; }
.purchase-receipt-card__note-icon path { stroke: currentColor; }
.purchase-completed-note { padding-bottom: var(--s-4); }

@keyframes mybank-notification-in { from { opacity: 0; transform: translateY(calc(var(--s-6) * -1)); } to { opacity: 1; transform: translateY(0); } }
@keyframes mybank-notification-out { from { opacity: 1; transform: translateY(0); } to { opacity: 0; transform: translateY(calc(var(--s-6) * -1)); } }

@media (prefers-reduced-motion: reduce) {
  .mybank-payment-notification.bank-push--enter { animation: none; opacity: 1; transform: none; }
  .mybank-payment-notification.bank-push--leaving { animation: none; opacity: var(--s-0); }
}

/* Modal de salida con identidad Sopra. */
.exit-modal-frame {
  position: absolute;
  inset: var(--s-0);
  z-index: var(--layer-modal);
  width: 100%;
  height: 100%;
  border: var(--s-0);
}

.exit-modal-frame[hidden] { display: none; }

.exit-modal-document { background: transparent; }

.exit-modal-document .modal-overlay {
  padding-right: var(--exit-overlay-inline-padding);
  padding-left: var(--exit-overlay-inline-padding);
  background: var(--exit-overlay);
}

.exit-modal {
  max-width: var(--exit-modal-max-width);
  gap: var(--exit-modal-gap);
  padding: var(--exit-modal-padding);
  border-radius: var(--r-card-lg);
  font-family: var(--pl-font);
}

.exit-modal .modal__title {
  color: var(--ink-900);
  font-size: var(--mk-title-xs);
  line-height: var(--mk-title-xs-lh);
  font-weight: var(--fw-bold);
  text-align: center;
}

.exit-modal .modal__title:focus { outline: none; }

.exit-modal__actions {
  flex-direction: column;
  gap: var(--exit-option-gap);
}

.exit-modal__option {
  width: 100%;
  min-height: var(--exit-option-height);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--s-1);
  padding: var(--s-2) var(--s-3);
  border: var(--line-hairline) solid transparent;
  border-radius: var(--r-lg);
  font-family: var(--pl-font);
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: opacity var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast);
}

.exit-modal__option[hidden] { display: none; }

.exit-modal__option strong {
  font-size: var(--ui-md);
  line-height: var(--ui-md-lh);
  font-weight: var(--fw-bold);
}

.exit-modal__option span {
  font-size: var(--ui-sm);
  line-height: var(--ui-sm-lh);
  font-weight: var(--fw-regular);
}

.exit-modal__option--outline {
  border: var(--line-hairline) solid var(--line);
  background: var(--white);
  color: var(--ink-900);
}

.exit-modal__option--dark {
  background: var(--pl-btn-dark);
  color: var(--pl-on-dark);
}

.exit-modal__option--gradient {
  background: var(--sfs-gradient);
  color: var(--white);
}

.exit-modal__option:hover {
  box-shadow: var(--el-2);
}

.exit-modal__option:active {
  opacity: var(--opacity-pressed);
  transform: scale(var(--press-scale));
}

.exit-modal__option:focus-visible {
  outline: var(--focus-ring) solid var(--ink-900);
  outline-offset: var(--focus-ring);
}

.exit-modal__option--dark:focus-visible,
.exit-modal__option--gradient:focus-visible {
  outline-color: var(--white);
}