.bank-logo-tile {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  border: 1px solid color-mix(in srgb, var(--bank-color, #64748b) 42%, transparent);
  border-radius: 10px;
  background:
    linear-gradient(
      145deg,
      color-mix(in srgb, var(--bank-color, #64748b) 38%, #0b1220),
      #0b1220 82%
    );
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
  overflow: hidden;
}

.bank-logo-tile img {
  display: block;
  width: 66%;
  height: 66%;
  object-fit: contain;
}

.bank-logo-tile.is-colored {
  border-color: color-mix(in srgb, var(--bank-color, #64748b) 38%, transparent);
  background: #fff;
}

.bank-logo-tile.is-colored img {
  width: 88%;
  height: 88%;
}

.bank-logo-tile.is-wordmark {
  width: 46px;
}

.bank-logo-tile.is-xs.is-wordmark {
  width: 50px;
}

.bank-logo-tile.is-sm.is-wordmark {
  width: 58px;
}

.bank-logo-tile.is-md.is-wordmark {
  width: 70px;
}

.bank-logo-tile.is-wordmark img {
  width: 94%;
  height: auto;
}

.bank-logo-tile > svg {
  width: 58%;
  height: 58%;
  color: rgba(255, 255, 255, 0.82);
}

.bank-logo-tile.is-xs {
  width: 24px;
  height: 24px;
  border-radius: 8px;
}

.bank-logo-tile.is-sm {
  width: 32px;
  height: 32px;
  border-radius: 9px;
}

.bank-logo-tile.is-md {
  width: 40px;
  height: 40px;
  border-radius: 11px;
}

.bank-logo-tile.is-lg {
  width: 52px;
  height: 52px;
  border-radius: 14px;
}

.bank-inline {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.bank-cell {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  min-width: 0;
}

.bank-cell-text {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.bank-cell-text b,
.bank-cell-text span {
  overflow-wrap: anywhere;
}

.bank-select-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.bank-select-row select {
  flex: 1 1 auto;
  min-width: 0;
}