/* ========================= CHECKOUT PAGE ========================= */

/* Body override */
.page-checkout {
  font-family:Arial,Helvetica,sans-serif;
}

/* Hide nav & footer on checkout */
.page-checkout #navbar,
.page-checkout footer {
  display:none;
}

/* Override dark theme base styles */
#checkout .container {
  padding:0;
}
@media (max-width:1290px) {
  #checkout .container {
    padding-right:15px;
    padding-left:15px;
  }
}
@media (max-width:768px) {
  #checkout .container {
    padding-left:16px;
    padding-right:16px;
  }
}
#checkout input[type="text"],
#checkout input[type="email"],
#checkout input[type="tel"] {
  background-color:#FFF;
  color:#636363;
  border:1px solid #B5B5B5;
  border-radius:11px;
  padding:19px 35px;
  font-size:19px;
  line-height:28px;
  width:100%;
  box-sizing:border-box;
  font-family:Arial,Helvetica,sans-serif;
}
#checkout input::placeholder {
  color:#C4C4C4;
  font-family:Arial,Helvetica,sans-serif;
}
#checkout input:focus {
  border-color:#313131;
  outline:none;
}
#checkout .btn {
  font-family:'Open Sans Bold',Helvetica,Arial,sans-serif;
  display:inline-block;
  position:relative;
  padding:20px 75px;
  border-radius:42px;
  font-weight:700;
  cursor:pointer;
  transition:padding .3s;
  border:none;
  font-size:18px;
  line-height:25px;
  text-align:center;
  text-decoration:none;
  white-space:nowrap;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
#checkout .btn::before {
  display:none;
}
#checkout .btn:hover {
  transform:none;
}
#checkout .btn:disabled {
  background-color:#CACACA;
  border-color:#CACACA;
  cursor:not-allowed;
  opacity:.6;
}
#checkout .btn-primary {
  background-color:#14B8A6;
  color:#FFF;
  border-color:#14B8A6;
}
#checkout .btn-wide {
  width:100%;
}
#checkout .btn-square {
  border-radius:11px;
}
#checkout .phone-group {
  display:flex;
}
#checkout .phone-group .code {
  font-size:19px;
  padding:19px 35px;
  background-color:#FFF;
  color:#636363;
  border:1px solid #B5B5B5;
  border-radius:11px 0 0 11px;
  width:155px;
  border-right:none;
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  background-image:url('data:image/svg+xml;utf8,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6 9L12 15L18 9" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor"/></svg>');
  background-repeat:no-repeat;
  background-position:right 10px center;
  background-size:20px;
  cursor:pointer;
}
#checkout .phone-group .code:focus {
  border-color:#313131;
  outline:none;
}
#checkout .phone-group .phone {
  border-radius:0 11px 11px 0;
}

#checkout {
  background:#FFF;
  padding-top:32px;
  padding-bottom:32px;
}
#checkout .content {
  max-width:670px;
}
#checkout .content h1 {
  font-size:23px;
  color:#1A1E25;
  font-family:"Georgia Bold",Arial,sans-serif;
  font-weight:normal;
}
@media (max-width:768px) {
  #checkout .content h1 {
    text-align:center;
    font-size:22px;
  }
}

/* Logo */
#checkout .logo {
  margin:0 auto 24px;
}

/* Included items */
#checkout .included-items {
  padding:0;
  margin:42px 0;
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  list-style:none;
}
@media (max-width:768px) {
  #checkout .included-items {
    flex-direction:column;
    gap:8px;
    align-content:center;
  }
}
#checkout .included-items .item {
  display:flex;
  align-items:center;
  gap:5px;
}
#checkout .included-items .item i {
  background:url('../images/tick.svg?v=2') center/contain no-repeat;
  width:16px;
  height:16px;
  display:inline-block;
}
#checkout .included-items .item span {
  color:#636363;
  font-size:14px;
}

/* Payment summary */
#checkout .payment-summary {
  padding:30px;
  border:1px solid #E9E9E9;
  background-color:#F0F8FF;
}
@media (max-width:768px) {
  #checkout .payment-summary {
    padding:10px;
  }
}
#checkout .payment-summary .item {
  margin-bottom:20px;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
}
#checkout .payment-summary .item .name {
  font-weight:700;
  font-size:24px;
}
@media (max-width:768px) {
  #checkout .payment-summary .item .name {
    font-size:16px;
  }
}
#checkout .payment-summary .item .name.with-present {
  display:flex;
}
#checkout .payment-summary .item .name.with-present img {
  padding-right:10px;
}
#checkout .payment-summary .item .description {
  font-weight:400;
  font-size:14px;
  color:#636363;
}
@media (max-width:768px) {
  #checkout .payment-summary .item .description {
    font-size:10px;
  }
}
#checkout .payment-summary .item .price .price-old {
  font-weight:400;
  font-size:17px;
  color:#4B5159;
  text-decoration-line:line-through;
  white-space:nowrap;
}
@media (max-width:768px) {
  #checkout .payment-summary .item .price .price-old {
    font-size:16px;
  }
}
#checkout .payment-summary .item .price .price-new {
  font-weight:700;
  font-size:23px;
  margin-left:5px;
  white-space:nowrap;
}
@media (max-width:768px) {
  .hero-note{font-size:11px}
  .lp-cta-note{font-size:11px}
  .footer-cta-note{font-size:11px}
  .cta-note{font-size:11px}
  #checkout .payment-summary .item .price .price-new {
    font-size:16px;
  }
}
#checkout .payment-summary .item.todays-charge {
  margin-bottom:0;
  padding-top:20px;
  color:#4FA93C;
  border-top:1px solid #E9E9E9;
}
#checkout .payment-summary .item.amazon-package {
  color:#E9B839;
}

/* Form */
#checkout .purchase-form {
  margin:40px 0 0;
}
#checkout .purchase-form .client-info {
  margin-bottom:40px;
}
#checkout .purchase-form .client-info .title {
  margin-bottom:20px;
  font-size:14px;
  color:#636363;
}
#checkout .purchase-form .client-info .email {
  margin-bottom:20px;
}
#checkout .purchase-form .payment-info {
  margin-bottom:50px;
}
#checkout .purchase-form .payment-info .title {
  font-size:14px;
  color:#636363;
}
#checkout .purchase-form .payment-info .googlepay-bar {
  margin:20px 0;
  width:100%;
  background-color:#000;
  border-radius:11px;
  height:60px;
  padding:12px 48px;
  color:#FFF;
  font-size:16px;
  line-height:20px;
  display:flex;
  align-items:center;
  justify-content:center;
}
#checkout .purchase-form .payment-info .googlepay-bar span {
  padding:0 4px;
}
#checkout .purchase-form .payment-info .pay-card {
  margin:20px 0;
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
}
#checkout .purchase-form .payment-info .pay-card .title {
  font-size:14px;
  color:#636363;
}
#checkout .purchase-form .payment-info .card-info .card-number,
#checkout .purchase-form .payment-info .card-info .holder {
  margin-bottom:20px;
}
#checkout .purchase-form .payment-info .card-info .card-number {
  position:relative;
}
#checkout .purchase-form .payment-info .card-info .card-number input {
  padding-right:45px;
}
#checkout .purchase-form .payment-info .card-info .card-number .lock {
  background:url('../images/lock.svg') center/contain no-repeat;
  width:16px;
  height:20px;
  position:absolute;
  right:20px;
  top:50%;
  transform:translateY(-50%);
}
#checkout .purchase-form .payment-info .card-info .card-group {
  display:flex;
  gap:20px;
}
#checkout .purchase-form .payment-info .card-info .card-group .expired,
#checkout .purchase-form .payment-info .card-info .card-group .cvc {
  flex:1;
}
#checkout .purchase-form .payment-info .safe {
  display:flex;
  gap:8px;
  align-items:center;
  color:#636363;
  font-size:14px;
  line-height:24px;
  margin-top:40px;
}

/* Agree */
#checkout .agree-note {
  font-size:12px;
  line-height:24px;
  color:#F80000;
  margin:12px 0;
}
#checkout .agree {
  font-size:12px;
  line-height:24px;
  color:#636363;
  margin-top:0;
  margin-bottom:50px;
  padding-left:35px;
  position:relative;
  cursor:pointer;
}
#checkout .agree #agree_chk {
  position:absolute;
  left:0;
  width:20px;
  height:20px;
  cursor:pointer;
  accent-color:#14B8A6;
}
#checkout .agree a {
  color:#14B8A6;
}

/* Badges & address */
#checkout .badges {
  margin:50px 0;
  text-align:center;
}
#checkout .address {
  font-size:12px;
  line-height:18px;
  color:#636363;
  text-align:center;
}