/* Step Wizard Form */
.bs-wizard {
  padding: 20px 0 20px 0;
}
.bs-wizard > .bs-wizard-step {
  padding: 0;
  position: relative;
}
.bs-wizard > .bs-wizard-step .bs-wizard-stepnum {
  color: #ddd;
  margin-bottom: 20px;
  font: normal 500 16px 'Kanit';
  padding-right: 10px;
}
.bs-wizard > .bs-wizard-step.active .bs-wizard-stepnum,
.bs-wizard > .bs-wizard-step.complete .bs-wizard-stepnum {
  color: #222;
}
.bs-wizard > .bs-wizard-step .bs-wizard-stepnum > i {
  font-size: 1.5em;
}
.bs-wizard > .bs-wizard-step .bs-wizard-info {
  color: #999;
  font-size: 12px;
}
.bs-wizard > .bs-wizard-step > .bs-wizard-dot {
  position: absolute;
  width: 20px;
  height: 20px;
  display: block;
  background: #4caf50;
  top: 27px;
  left: 50%;
  margin-top: -15px;
  margin-left: -15px;
  border-radius: 50%;
}
.bs-wizard > .bs-wizard-step > .bs-wizard-dot:after {
  content: '\f00c';
  font-family: 'FontAwesome';
  font-size: 1em;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  text-align: center;
  color: #fff;
}
.bs-wizard > .bs-wizard-step > .progress {
  position: relative;
  border-radius: 0;
  height: 2px;
  box-shadow: none;
  margin: 21px 0;
}
.bs-wizard > .bs-wizard-step > .progress > .progress-bar {
  width: 0;
  box-shadow: none;
  background: #4caf50;
}
.bs-wizard > .bs-wizard-step.complete > .progress > .progress-bar {
  width: 100%;
}
.bs-wizard > .bs-wizard-step.active > .progress > .progress-bar {
  width: 50%;
}
.bs-wizard > .bs-wizard-step:first-child.active > .progress > .progress-bar {
  width: 0%;
}
.bs-wizard > .bs-wizard-step:last-child.active > .progress > .progress-bar {
  width: 100%;
}
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot {
  background-color: #f5f5f5;
}
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot:after {
  opacity: 0;
}
.bs-wizard > .bs-wizard-step:first-child > .progress {
  left: 50%;
  width: 50%;
}
.bs-wizard > .bs-wizard-step:last-child > .progress {
  width: 50%;
}
.bs-wizard > .bs-wizard-step.disabled .bs-wizard-dot {
  pointer-events: none;
}

/* Cart Checkout */
.cart-checkout {
  padding-bottom: 30px;
}
.cart-checkout .box {
  padding: 15px 10px;
  border: 1px solid #ddd;
  background-color: #f6f8fa;
}
.cart-checkout .box + .box {
  border-top: 0;
  display: flex;
}
.cart-checkout .form-control:focus {
  border-color: #16b4fc;
  box-shadow: none;
}
.cart-checkout .product-image {
  float: left;
  max-width: 70px;
}
.cart-checkout > .page-header {
  margin: 20px 0;
  text-align: center;
  clear: both;
}
.cart-checkout .page-header:after {
  content: none;
}
.cart-checkout .page-header .title {
  font: normal 500 16px 'Kanit';
  color: #37474f;
  border: 0;
  margin: 20px 0 0;
  padding: 0;
  clear: both;
}
.cart-checkout > .page-header .material-icons {
  vertical-align: middle;
  font-size: 36px;
}
.cart-checkout .cart-product .product-name {
  font-weight: 500;
}
.cart-checkout .cart-product .product-name p.product-title {
  margin: 0 0 5px 80px;
}
.cart-checkout .cart-product .product-name p.variant-detail {
  margin: 0 0 0 80px;
  font-size: 0.9em;
}
.cart-checkout .js-cart-item-delete .material-icons {
  color: #f44336;
  font-size: 18px;
}
.cart-checkout .js-cart-item-delete:hover .material-icons {
  color: #e53935;
}
.cart-checkout .qty .input-group-btn:first-child > .btn {
  margin-left: -2px;
}
.cart-checkout .qty .btn {
  background-color: #fff;
  border-radius: 0;
  border-color: #d8e2e7;
  width: 34px;
  height: 34px;
  line-height: 33px;
  padding: 0;
  font-size: 24px;
  font-weight: 500;
  color: #263238;
}
.cart-checkout .cart-product .qty .btn:hover {
  background-color: #455a64;
  color: #fff;
  border-color: #455a64;
}
.cart-checkout .cart-product .qty .btn:focus {
  outline: none;
  box-shadow: none;
  background-color: #37474f;
  border-color: #37474f;
  color: #fff;
}
.cart-checkout .cart-product .qty .form-control {
  background-color: #fff;
  border-color: #d8e2e7;
  box-shadow: none;
}
.cart-checkout .cart-product .cart-table .input-group .form-control {
  width: 50px;
  height: auto;
}

.modal-checkout .guest .btn {
  border: 2px solid #f8f8f8;
  color: #fff;
}
.modal-checkout .guest .btn:hover {
  border-color: #ff9800;
  color: #ff9800;
}

.cart-checkout .table-striped > tbody > tr:nth-of-type(odd),
.cart-checkout .table tr:hover {
  background-color: #fbfcfd;
}
.cart-checkout .table > thead > tr > th,
.cart-checkout .table > thead:first-child > tr:first-child > th {
  border-bottom-width: 1px;
  border-color: #d8e2e7;
  background-color: #f6f8fa;
  border-top: 1px solid #d8e2e7;
  padding: 10px 8px;
}

.cart-checkout .btn-continue-shop {
  background-color: #607d8b;
  color: #fff;
}
.cart-checkout .btn-continue-shop:hover {
  background-color: #78909c;
}
.cart-checkout .btn-continue-shop:focus {
  text-decoration: none;
  outline: none;
  background-color: #546e7a;
  color: #fff;
}

.cart-checkout .btn-confirm-order,
.cart-checkout .btn-confirm-order:hover,
.cart-checkout .btn-confirm-order:focus {
  color: #fff;
}
.cart-checkout .btn-confirm-order {
  background-color: #4caf50;
}
.cart-checkout .btn-confirm-order:hover {
  background-color: #66bb6a;
}
.cart-checkout .btn-confirm-order:focus {
  background-color: #43a047;
}

/* Cart Table */
.cart-checkout .table tbody > tr > td {
  vertical-align: middle;
}

/* Summary */
.cart-checkout .summary .table {
  margin-bottom: 0;
}
.cart-checkout .summary .table td {
  border: 0;
}
.cart-checkout .title {
  font: normal 500 16px 'Kanit';
  margin-top: 0;
  border-bottom: 1px solid #ddd;
  padding-bottom: 5px;
  margin-bottom: 20px;
  display: block;
  color: #455a64;
}
.cart-checkout .big-total .price {
  color: #e53935;
  font-weight: 500;
  font-size: 16px;
}
.cart-checkout .order-status .title {
  border: 0;
  margin: 0;
  padding: 0;
  font-size: 16px;
}
.cart-checkout .order-status .item {
  border: 1px solid #d8e2e7;
  background-color: #f6f8fa;
}
.cart-checkout .order-status .waiting {
  color: #e53935;
}
.cart-checkout .order-status .price {
  color: #e53935;
}

/*----------  coupon  ----------*/
.btn-coupon {
  background-color: #4caf50;
  color: #fff;
}
.btn-coupon:hover {
  background-color: #66bb6a;
  color: #fff;
}
.btn-coupon:focus {
  background-color: #43a047;
  color: #fff;
}
.coupon-code .title {
  margin-bottom: 10px;
}
.coupon-code .title small {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 75%;
}
.coupon-code .btn {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

/*----------  modal checkout  ----------*/
.modal-checkout .guest .title {
  margin-bottom: 25px;
  color: #fff;
  font-size: 21px;
}
.modal-checkout .guest .list {
  padding: 0;
  margin-bottom: 35px;
}
.modal-checkout .guest .list > li {
  line-height: 2;
  color: #fff;
  font-size: 13px;
}
.modal-checkout .guest .list > li .material-icons {
  font-size: 18px;
  vertical-align: top;
}

.modal-checkout .modal-body {
  display: table;
  width: 100%;
  table-layout: fixed;
  padding: 0;
}
.modal-checkout .member-form {
  display: table-cell;
  width: 50%;
  vertical-align: top;
  background-color: #f2f4f6;
  padding: 15px;
}
.modal-checkout .guest .info {
  position: relative;
  z-index: 1;
}
.modal-checkout .guest {
  display: table-cell;
  width: 40%;
  vertical-align: middle;
  background: url('../templates/default/assets/img/guest.jpg') no-repeat center
    center;
  background-size: cover;
  position: relative;
  text-align: center;
}
.modal-checkout .guest:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: rgba(55, 71, 79, 0.9);
}

/* address & billing */
.item-address-box {
  position: relative;
  margin-bottom: 20px;
}
.item-address-box input[type='radio'] {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  margin: 0;
}
.item-address-box .item-address-info {
  display: block;
  padding: 10px;
  background-color: #f9f9f9;
  border-radius: 4px;
  border: 1px solid #ddd;
  transition: all 0.4s ease;
}
.item-address-box .item-address-info .material-icons {
  display: none;
  color: #4caf50;
  font-size: 32px;
  position: absolute;
  top: 0;
  right: 0;
}
.item-address-box input[type='radio']:hover {
  cursor: pointer;
}
.item-address-box input[type='radio']:hover + .item-address-info {
  border-color: #4caf50;
}
.item-address-box
  input[type='radio']:hover
  + .item-address-info
  .material-icons {
  display: block;
}
.item-address-box input[type='radio']:hover + .item-address-info,
.item-address-box input[type='radio']:checked + .item-address-info {
  border-color: #d6e9c6;
  background-color: #dff0d8;
}
.item-address-box
  input[type='radio']:checked
  + .item-address-info
  .material-icons {
  display: block;
}
.item-address-box .item-address-info .item-name {
  margin-bottom: 5px;
  font-weight: 600;
}
.cart-address-form .page-header a {
  color: #222;
}
.cart-address-form .page-header a:hover {
  color: #23527c;
}

/* Note */
.cart-note {
  margin-bottom: 10px;
}

/* Payment */
.payment .panel {
  border-color: #dbe4ea;
}
.payment .panel-heading img {
  max-width: 32px;
}
.payment .panel-heading a {
  font: normal 500 16px 'Kanit';
  display: block;
}
.payment .panel-heading > a:before {
  content: 'radio_button_unchecked';
  font-family: 'Material Icons';
  font-size: 24px;
  display: inline-block;
  vertical-align: middle;
}

@media (min-width: 768px) {
  .modal-checkout .modal-dialog {
    width: 700px;
  }
}
@media (max-width: 650px) {
  .modal-checkout .modal-body,
  .modal-checkout .member-form {
    display: block;
    width: 100%;
  }
  .modal-checkout .guest {
    padding: 15px;
  }
  .payment-gbprimepay .modal-dialog {
    margin: 0;
    width: 100% !important;
    height: 100%;
  }
  .payment-gbprimepay.modal .modal-content {
    height: 100%;
    border-radius: 0 !important;
  }
  .payment-gbprimepay .modal-body {
    padding: 15px 35px 0 !important;
  }
  .payment-gbprimepay #expirationMonth {
    width: 47% !important;
    float: left;
    margin-bottom: 20px;
  }
  .payment-gbprimepay #expirationYear {
    width: 47% !important;
    float: right;
    margin-bottom: 20px;
  }
  .payment-wechatpay .modal-dialog {
    margin: 0;
    width: 100% !important;
    height: 100%;
  }
  .payment-wechatpay.modal .modal-content {
    height: 100%;
    border-radius: 0 !important;
  }
  .payment-wechatpay .modal-body {
    padding: 15px 35px 0 !important;
  }
  .payment-wechatpay #expirationMonth {
    width: 47% !important;
    float: left;
    margin-bottom: 20px;
  }
  .payment-wechatpay #expirationYear {
    width: 47% !important;
    float: right;
    margin-bottom: 20px;
  }
}
.modal {
  background: rgba(0, 0, 0, 0.5);
}
.modal-backdrop {
  display: none;
}
.payment-gbprimepay i,
.payment-gbprimepay p {
  color: #333 !important;
  margin-bottom: 3px;
}
.payment-gbprimepay .modal-dialog {
  font-family: 'kanit';
  width: 370px;
}
.payment-gbprimepay.modal .modal-content {
  border: 0.5px solid #d0d6e2;
  border-radius: 10px;
  box-shadow: rgba(40, 41, 44, 0.1) 0px 7px 25px 0px;
}
.payment-gbprimepay .modal-header {
  text-align: center;
  padding: 37px 15px 15px;
}
.payment-gbprimepay .modal-header p {
  font-size: 16px;
}
.payment-gbprimepay .modal-body {
  padding: 15px 45px 0;
}
.payment-gbprimepay .close {
  background: transparent !important;
}
.payment-gbprimepay .form {
  margin-bottom: 20px;
}
.payment-gbprimepay .form-control {
  width: 100%;
}
.payment-gbprimepay #expirationMonth {
  width: 40%;
  margin-right: 7px;
}
.payment-gbprimepay #expirationYear {
  width: 45%;
}
.payment-gbprimepay .btn-primary.btn-payment {
  width: 100%;
  margin-top: 15px;
  padding: 10px 0;
  background: #4caf50;
  border-color: #4caf50;
}
.payment-gbprimepay .btn-primary.btn-payment:hover {
  background: #3ba63f;
  border-color: #3ba63f;
}
.payment-gbprimepay .modal-footer {
  padding: 20px 15px 30px;
  text-align: center;
  border-top: none;
  color: #999;
}
.payment-gbprimepay .modal-footer span {
  color: #333;
  font-weight: 500;
}
.payment-wechatpay i,
.payment-wechatpay p {
  color: #333 !important;
  margin-bottom: 3px;
}
.payment-wechatpay .modal-dialog {
  font-family: 'kanit';
  width: 370px;
}
.payment-wechatpay.modal .modal-content {
  border: 0.5px solid #d0d6e2;
  border-radius: 10px;
  box-shadow: rgba(40, 41, 44, 0.1) 0px 7px 25px 0px;
}
.payment-wechatpay .modal-header {
  text-align: center;
  padding: 37px 15px 15px;
}
.payment-wechatpay .modal-header p {
  font-size: 16px;
}
.payment-wechatpay .modal-body {
  padding: 15px 45px 0;
}
.payment-wechatpay .close {
  background: transparent !important;
}
.payment-wechatpay .form {
  margin-bottom: 20px;
}
.payment-wechatpay .form-control {
  width: 100%;
}
.payment-wechatpay #expirationMonth {
  width: 40%;
  margin-right: 7px;
}
.payment-wechatpay #expirationYear {
  width: 45%;
}
.payment-wechatpay .btn-primary.btn-payment {
  width: 100%;
  margin-top: 15px;
  padding: 10px 0;
  background: #4caf50;
  border-color: #4caf50;
}
.payment-wechatpay .btn-primary.btn-payment:hover {
  background: #3ba63f;
  border-color: #3ba63f;
}
.payment-wechatpay .modal-footer {
  padding: 20px 15px 30px;
  text-align: center;
  border-top: none;
  color: #999;
}
.payment-wechatpay .modal-footer span {
  color: #333;
  font-weight: 500;
}