/* US Bank Smartly Checking bank-bonus Offer Detail override.
   Source of truth: Offer Detail Page 介绍 -> Bank Bonus Offer Detail. */

.bank-bonus-usbank .v4-decision-panel{
  padding:18px 18px 16px;
  display:flex;
  flex-direction:column;
  min-height:760px;
}

.bank-bonus-usbank .v4-generic-poster{
  min-height:760px;
}

.nb-bank-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin:2px 0 14px;
  padding-right:2px;
}
.nb-bank-brand{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.nb-bank-mark{
  width:42px;
  height:42px;
  border-radius:10px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  color:#fff;
  font-size:15px;
  font-weight:850;
  letter-spacing:-.4px;
  background:linear-gradient(145deg,#d81938,#b40f2b);
  box-shadow:0 4px 12px rgba(175,14,42,.18);
}
.nb-bank-brand strong{
  display:block;
  font-size:16px;
  line-height:1.2;
  color:#132b54;
}
.nb-bank-brand small{
  display:block;
  margin-top:2px;
  color:#68758a;
  font-size:11px;
}
.nb-bank-save{
  height:34px;
  padding:0 11px;
  border:1px solid #dfe6ef;
  border-radius:9px;
  background:#fff;
  color:#40516e;
  font-size:11px;
  font-weight:680;
}
.nb-bank-save.saved{
  color:#0f67dd;
  border-color:#bad8ff;
  background:#edf6ff;
}

.nb-bank-reward{
  border:1px solid #e2e9f2;
  border-radius:13px;
  overflow:hidden;
  background:#fff;
}
.nb-bank-reward-top{
  padding:14px 15px 12px;
  background:linear-gradient(135deg,#eef5ff,#f7fbff);
}
.nb-bank-reward-label{
  color:#23395e;
  font-size:11px;
  font-weight:730;
}
.nb-bank-reward-value{
  display:flex;
  align-items:baseline;
  gap:8px;
  margin-top:2px;
  color:#12284d;
  font-size:17px;
  font-weight:790;
}
.nb-bank-reward-value b{
  color:#176fe8;
  font-size:34px;
  line-height:1;
  letter-spacing:-1.2px;
}
.nb-bank-tier-head,
.nb-bank-tier{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(88px,.75fr);
  align-items:center;
}
.nb-bank-tier-head{
  background:#f4f6f8;
  color:#637087;
  font-size:10px;
  font-weight:700;
  border-top:1px solid #e5eaf0;
}
.nb-bank-tier-head span,
.nb-bank-tier span{
  padding:8px 11px;
}
.nb-bank-tier-head span+span,
.nb-bank-tier span+span{
  border-left:1px solid #e7ebf0;
}
.nb-bank-tier{
  color:#273750;
  font-size:11px;
  border-top:1px solid #edf0f4;
}
.nb-bank-tier strong{
  font-size:12px;
  color:#132746;
}
.nb-bank-tier.best{
  background:linear-gradient(90deg,#fffdf6,#fff8e7);
}
.nb-bank-tier.best strong{
  color:#a97006;
}
.nb-best-pill{
  float:right;
  margin-left:6px;
  padding:2px 6px;
  border-radius:999px;
  color:#fff;
  background:#d9a72a;
  font-size:9px;
  font-weight:750;
}

.nb-bank-flow{
  margin-top:15px;
}
.nb-bank-flow h2{
  margin:0 0 10px;
  color:#172845;
  font-size:16px;
  line-height:1.25;
}
.nb-bank-timeline{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.nb-bank-timeline:before{
  content:"";
  position:absolute;
  left:14px;
  top:19px;
  bottom:19px;
  width:2px;
  background:#d9e8fb;
}
.nb-bank-step{
  position:relative;
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  gap:9px;
}
.nb-bank-step-num{
  position:relative;
  z-index:1;
  width:29px;
  height:29px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#fff;
  background:#2879e8;
  border:3px solid #fff;
  box-shadow:0 0 0 1px #cfe3ff;
  font-size:10px;
  font-weight:800;
}
.nb-bank-step-card{
  border:1px solid #e6ebf2;
  border-radius:11px;
  padding:9px 10px;
  background:#fbfcfe;
}
.nb-bank-step-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  color:#1a2c4b;
  font-size:12px;
  font-weight:760;
}
.nb-bank-step-time{
  flex:0 0 auto;
  padding:2px 7px;
  border-radius:999px;
  color:#1b70dc;
  background:#edf5ff;
  font-size:9px;
  font-weight:700;
}
.nb-bank-step-card ul{
  margin:5px 0 0;
  padding-left:16px;
  color:#5f6d81;
  font-size:10.5px;
  line-height:1.45;
}
.nb-bank-step-card li+li{margin-top:2px}

.nb-bank-cta{
  margin-top:13px;
  width:100%;
  min-height:45px;
  border-radius:9px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:#fff;
  background:linear-gradient(180deg,#2580f2,#126ae0);
  box-shadow:0 7px 18px rgba(19,105,224,.16);
  font-size:14px;
  font-weight:780;
}
.nb-bank-cta:hover{background:linear-gradient(180deg,#1c76e7,#0d60d2)}
.nb-bank-deadline{
  margin-top:6px;
  text-align:center;
  color:#8a94a4;
  font-size:9.5px;
}
.nb-bank-eligibility{
  margin-top:11px;
  border:1px solid #e7ebf0;
  border-radius:11px;
  background:#fafbfc;
  overflow:hidden;
}
.nb-bank-eligibility summary{
  list-style:none;
  cursor:pointer;
  padding:10px 11px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  color:#263750;
  font-size:11px;
  font-weight:730;
}
.nb-bank-eligibility summary::-webkit-details-marker{display:none}
.nb-bank-eligibility summary:after{
  content:"⌄";
  color:#76839a;
  font-size:14px;
}
.nb-bank-eligibility[open] summary:after{content:"⌃"}
.nb-bank-eligibility-copy{
  padding:0 11px 10px;
  color:#687589;
  font-size:10px;
  line-height:1.5;
}
.nb-bank-eligibility-copy div+div{margin-top:4px}

@media(max-width:1100px){
  .bank-bonus-usbank .v4-decision-panel{min-height:auto}
  .bank-bonus-usbank .v4-generic-poster{min-height:680px}
}