/* Yellow Offer Card */
.yellow-card-container {
  background-color: #fbd95e;
  width: 900px;
  height: 350px;
  border-radius: 50px;
  padding: 20px;
  /* box-shadow:
    0 0 20px #00ffff,
    0 0 30px #00ffff,
    0 0 35px #00ffff,
    0 0 40px #00ffff,
    inset 0 0 10px rgba(0, 255, 255, 0.5); */
  /*  */
  margin: 400px auto;
}

.yellow-card-container .offering-card {
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, #fbd95e 0%, #fff8dd 50%, #fbd95e 100%);
  border-radius: 30px;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  position: relative;
}

.yellow-card-container .offering-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background: linear-gradient(180deg, rgba(250, 217, 94, 0.4) 0%, transparent 10%, transparent 90%, rgba(250, 217, 94, 0.4) 100%);
  width: 100%;
  height: 100%;
  filter: blur(1px);
  z-index: 1;
}

.price-content {
  font-size: 95px;
  font-weight: bold;
  height: 100%;
  width: 45%;
  display: flex;
  align-items: center;
  padding: 0 10px;
  overflow: hidden;
  justify-content: center;
  color: #3f2b6e;
}

.price-content .rb-text {
  font-size: 50px;
}

.tizo-content {
  padding: 0px;
  width: 55%;
  height: 100%;
  /*  */
  border-radius: 0 0 30px;
}

.tizo-content .main-content {
  width: 100%;
  height: 100%;
  background-color: #000;
  border-radius: 0 0 30px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-top: 15px;
  gap: 10px;
}

.offering-card .main-content .get-text,
.offering-card .main-content .tizo-text-before,
.offering-card .main-content .tizo-text-after {
  color: #00ffff;
}

.offering-card .main-content .get-text {
  font-size: 45px;
  font-weight: bold;
}

.offering-card .main-content .tizo-text-before {
  font-size: 50px;
  color: #00ffff83;
  position: relative;
  font-weight: bold;
}

.offering-card .main-content .tizo-text-before span {
  font-size: 35px;
}

.offering-card .main-content .tizo-text-before::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%) rotate(-4deg);
  left: 0;
  width: 100%;
  height: 7px;
  background-color: red;
}

/* For amounts < 100 RB - no bonus, hide strikethrough and show only one tizo value */
.offering-card.no-bonus .main-content .tizo-text-before {
  display: none;
}

.offering-card.no-bonus .main-content .tizo-text-after {
  font-size: 95px;
  margin-top: 5px;
}

.offering-card .main-content .tizo-text-after {
  font-size: 95px;
  font-weight: bold;
}

.offering-card .main-content .tizo-text-after span {
  font-size: 50px;
}

/* Magenta Offer Card */
.magenta-card-container {
  background-color: #f100dd;
  width: 900px;
  height: 320px;
  border-radius: 50px;
  /* box-shadow:
    0 8px 10px 0 #f100dd80,
    0 6px 50px 10px #f100dd80; */
}

.magenta-card-container .offering-card {
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, #f100dd 0%, #ffb588 30%, #ffb588 70%, #f100dd 100%);
  border-radius: 50px;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  position: relative;
  padding: 10px;
}

/* Yellow Offer Card */
.yellow-2-card-container {
  background-color: #fbd95e;
  width: 900px;
  height: 320px;
  border-radius: 50px;
  /* box-shadow:
    0 8px 10px 0 #fbd95e85,
    0 6px 50px 10px #fbd95e85; */
}

.yellow-2-card-container .offering-card {
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, #ffd73f 0%, #fff8dd 30%, #fff8dd 70%, #ffd73f 100%);
  border-radius: 50px;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  position: relative;
  padding: 10px;
}

/* Orange Offer Card */
.orange-card-container {
  background-color: #fb5d64;
  width: 900px;
  height: 320px;
  border-radius: 50px;
  /* box-shadow:
    0 8px 10px 0 #fb5d6485,
    0 6px 50px 10px #fb5d6485; */
}

.orange-card-container .offering-card {
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, #fb5d64 0%, #ffe79a 30%, #ffe79a 70%, #fb5d64 100%);
  border-radius: 50px;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  position: relative;
  padding: 10px;
}

/* Blue Offer Card */
.blue-card-container {
  background-color: #2bd1ed;
  width: 900px;
  height: 320px;
  border-radius: 50px;
  /* box-shadow:
    0 8px 10px 0 #2bd1ed85,
    0 6px 50px 10px #2bd1ed85; */
}

.blue-card-container .offering-card {
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, #2bd1ed 0%, #fce9a5 30%, #fce9a5 70%, #2bd1ed 100%);
  border-radius: 50px;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  position: relative;
  padding: 10px;
}

/* Pink Offer Card */
.pink-card-container {
  background-color: #ee51a2;
  width: 900px;
  height: 320px;
  border-radius: 50px;
  /* box-shadow:
    0 8px 10px 0 #ee51a285,
    0 6px 50px 10px #ee51a285; */
}

.pink-card-container .offering-card {
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, #ee51a2 0%, #f6bed5 30%, #f6bed5 70%, #ee51a2 100%);
  border-radius: 50px;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  position: relative;
  padding: 10px;
}

/* .offer-card-container.selected {
  border: 15px solid #fff;
  box-shadow:
    20px 20px 20px #fff,
    0px 0 30px #fff,
    0 0 35px #fff,
    0 0 40px #fff,
    inset 0 0 10px rgba(255, 255, 255, 0.5);
} */

.offering-card.selected {
  border: 5px solid #fff;
  box-shadow:
    0 0 20px #fff,
    0 0 30px #fff,
    0 0 35px #fff,
    0 0 40px #fff,
    inset 0 0 10px rgba(255, 255, 255, 0.5);
}

/* Vertical Card */
.vertical-magenta-card-container {
  width: 700px;
  height: 350px;
  border-radius: 50px;
  /* padding: 20px; */
  /* box-shadow:
    0 0 20px #00ffff,
    0 0 30px #00ffff,
    0 0 35px #00ffff,
    0 0 40px #00ffff,
    inset 0 0 10px rgba(0, 255, 255, 0.5); */
  /*  */
  margin-top: 250px;
  margin-left: -40px;
}

.vertical-magenta-card-container .offering-vertical-card {
  width: 100%;
  height: 100%;
  padding: 20px;
  background: linear-gradient(90deg, #f100dd 0%, #fb8692 50%, #f100dd 100%);
  border-radius: 50px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
  /* box-shadow:
    0 0 20px #00ffff,
    0 0 30px #00ffff,
    0 0 35px #00ffff,
    0 0 40px #00ffff,
    inset 0 0 10px rgba(0, 255, 255, 0.5); */
}

.vertical-magenta-card-container .offering-vertical-card .offering-vertical-card-heading {
  height: 180px;
  font-size: 90px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-self: center;
  width: 100%;
}

.offering-vertical-card-heading .text {
  width: 100%;
  text-align: center;
  font-weight: bold;
}

.vertical-magenta-card-container .vertical-tizo-content {
  width: 100%;
  height: 100%;
  background-color: #000;
  border-radius: 0 0 30px 30px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-top: 15px;
  color: #00ffff;
  font-weight: bold;
}

.vertical-magenta-card-container .vertical-tizo-content .gift-name {
  font-size: 66px;
}

.vertical-magenta-card-container .vertical-tizo-content .gift-details {
  font-size: 66px;
}

.dwell-time-body .dwell-time-end-text {
  font-size: 50px;
  color: #fff;
  margin-top: 80px;
}