@font-face {
  font-family: 'FZ Poppins';
  src: url('../fonts/FZ Poppins-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'FZ Poppins';
  src: url('../fonts/FZ Poppins-Bold.ttf') format('truetype');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'FZ Poppins';
  src: url('../fonts/FZ Poppins-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'DFVN ED Lavonia';
  src: url('../fonts/DFVN-EDLavonia-Regular.woff2') format('woff2'),
    url('../fonts/DFVN-EDLavonia-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}


* {
  outline: none;
  -webkit-tap-highlight-color: transparent;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.count_image {
  font-size: 14px;
  color: #fff;
  padding: 15px;
}

body.post-type-archive-tour .ju_filter_combo .diem_di {
  display: none;
}

.tm-header-mobile .uk-sticky-fixed .uk-navbar-left .uk-navbar-toggle-icon svg {
  /* color: #000; */
}

/* filter */
.tour-filter {
  padding: 24px 16px 8px 16px;
  border-radius: 24px;
  box-shadow: 0px 0px 32px 0px #00000014;
}

.tour-filter-box-title {
  position: relative;
  margin-bottom: 20px;
}

.tour-filter-item {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s ease-in-out;
}

.tour-filter-item.active {
  max-height: 2500px;
}


.tour-filter-item.hidden {
  height: 0;
}

.mobile-open,
.mobile-close {
  position: absolute;
  right: 0;
  top: 0;
  opacity: 0;
  visibility: hidden;
}

.tour-filter-title {
  margin-bottom: 0;
  font-size: 20px;
  font-weight: 600;
  line-height: 30px;
  text-align: left;
}

.select-box {
  padding-top: 16px;
  border-top: 1px solid #F3F3F3;
  border-bottom: 1px solid #F3F3F3;
}

.icon-form {
  width: 20px;
  height: 20px;
  margin-right: 8px;
}

.custom-input {
  height: 24px;
  background-color: transparent;
  border: none;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.custom-input::placeholder {
  color: #000000;
  opacity: 1;
}

.custom-input:focus {
  background-color: transparent;
}

.tour-select {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
  padding: 12px 16px 12px 14px;
  border-radius: 8px;
  background-color: #F3F3F3;
}

.tour-select select {
  padding: 12px 16px 12px 14px;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  text-align: left;
}

.text-selected {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  text-align: left;
}

.pick-box {
  padding-top: 20px;
}

.pick-box-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.pick-box-title-text {
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  text-align: left;
  margin-bottom: 0;
}

.pick-box-drop-down {
  transition: transform 0.3s ease-in-out;
}

.pick-box-drop-down.rotage {
  transform: rotate(-180deg);
  transition: transform 0.3s ease-in-out;
}

.pick-box-item {
  display: flex;
  flex-direction: column;
  gap: 8px;
  height: auto;
  /* Chiều cao tự động khi phần tử hiển thị */
  overflow: hidden;
  /* Ẩn nội dung khi trượt lên */
  transition: height 0.5s ease-in-out;
  /* Chuyển đổi chiều cao */
}

.pick-box-item.hidden {
  height: 0;
  /* Thu gọn chiều cao khi ẩn */
}

/* The container */
.container-checkbox {
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  text-align: left;


  display: block;
  position: relative;
  padding-left: 24px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.container-checkbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  height: 16px;
  width: 16px;
  border-radius: 5px;
  background-color: #FFFFFF;
  border: 1px solid #C4C4C4;
}

/* When the checkbox is checked, add a blue background */
.container-checkbox input:checked~.checkmark {
  background-color: #00A879;

}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.container-checkbox input:checked~.checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.container-checkbox .checkmark:after {
  background-image: url(../images/checked.svg);
  width: 10px;
  height: 10px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-size: contain;
  background-repeat: no-repeat;
}

.checkbox-label {
  transition: color 0.3s;
}

.container-checkbox:hover .checkbox-label {
  color: #00A879;
  /* Màu khi hover */
}

.container-checkbox input:checked~.checkmark+.checkbox-label {
  color: #00A879;
}


.text-box-title-text {
  margin-top: 12px;
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  text-align: left;
  margin-bottom: 0;
  margin-bottom: 12px;
}

.text-box-item {
  display: flex;
  align-items: center;
  gap: 7px;
}

.text-box-input {
  flex: 1;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  text-align: left;
  color: #666666;
  height: 34px;
  padding: 6px 8px;
  border: 1px solid #e4e4e4;
  border-radius: 6px;
}

.text-box-input:disabled {
  background-color: #ffffff;
}

.text-box-input:focus {
  color: #666666;
  border-color: unset !important;
}

.range-price-image {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  width: 10px;
  height: 20px;
}

.slider {
  position: relative;
  -webkit-appearance: none;
  width: 100%;
  height: 2px;
  border-radius: 5px;
  background: #d3d3d3;
  outline: none;
  opacity: 0.7;
  -webkit-transition: .2s;
  transition: opacity .2s;
  background: #00A879;

}

.slider:hover {
  opacity: 1;
}

.slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #00A879;
  cursor: pointer;
}

.slider::-moz-range-thumb {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #00A879;
  cursor: pointer;
}


.slider::before {
  position: absolute;
  content: "";
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #00A879;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

/*  */

.booking .uk-button {
  border-radius: 8px;
  text-transform: none;
  font-size: 16px;
  padding: 12px 22px;
  line-height: 24px;
  min-width: 123px;
}

#thoigian {
  padding: 0;
  margin: 0;
  width: fit-content;
  display: none;
  position: absolute;
  /* min-width: 100px !important; */
  min-width: 150px;
  width: 90px;
  background-color: #8A93A6;
  color: #FFF;
  border-radius: 8px;
  overflow: hidden;
}


.ju-sale::after {
  content: var(--calculated-discount);
  display: inline-block;

}

label {
  cursor: pointer;
}

.percen {
  border-radius: 120px 100px 100px 0px;
  border: 1px solid var(--color-secondary-color-green, #38C671);
  padding: 0 5px;
  text-decoration: unset;
  margin-left: 5px;
  width: 38px;
  color: #38C671;
  font-weight: 600;
}

#thoigian.uk-open {
  display: inline-block;
}

#thoigian .uk-panel {
  border-bottom: 1px solid #FFF;
  margin-top: 0;
  padding: 2px 15px;
  cursor: pointer;
}

.ju-sale {
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
}

#thoigian .uk-panel:hover,
#thoigian .item-ngay.active {
  background-color: #A4A6BB;
}

#thoigian>li:hover a {
  color: #FFF !important;
}

#thoigian .el-image {
  display: none;
}

.location {
  cursor: pointer;
  background-color: #FFF;
  padding: 16px 15px;
  border-radius: 8px;
}

.location+.uk-dropdown {
  border-radius: 4px;
  padding: 18px;
}

.location+.uk-dropdown::before {
  content: "";
  position: absolute;
  border-top: 10px solid transparent;
  border-bottom: 10px solid #FFF;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  top: 0;
  -webkit-transform: translateY(-19px);
  transform: translateY(-19px);
}

.location+.uk-dropdown .uk-text-bold {
  margin-bottom: 15px;
  display: inline-block;
}



.location+.uk-dropdown ul {
  margin: 0;
  margin-top: 15px;
}

.location+.uk-dropdown ul li {
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  cursor: pointer;
}

.location+.uk-dropdown ul li:nth-child(n+2) {
  margin-top: 7px;
}

.location+.uk-dropdown ul li.uk-active,
.location+.uk-dropdown ul li:hover {
  color: #2069dd;
}

.location .diem-di,
.location .diem-den {
  width: 150px;
  text-align: center;
  border-left: 1px solid #A4A6BB;
  display: inline-block;
}



.location+#dropdiemden {
  width: 583px !important;
}

.location span {
  line-height: 20px;
  height: 20px;
}

.choise-person {
  cursor: pointer;
}

.person {
  width: 152px;
  background: #8A93A6;
  color: #FFF;
  border-radius: 8px;
  padding: 0;
}

.person li {
  padding: 3px 10px;
  cursor: pointer;
}

.person li.active,
.person li:hover {
  background: #A4A6BB;
}

.ju-location {
  font-size: 17px;
  font-weight: 500;
  line-height: 24px;
  margin-bottom: 20px;
}

.ju-location .uk-icon {
  color: #2069DD;
}

.ju-location+ul li {
  font-size: 16px;
  line-height: 24px;
}

.sale {
  font-weight: 600;
  font-size: 24px;
  line-height: 1.5;
  color: #FF3D3D;
}

.jusale {
  background-color: #38C671;
  border-radius: 120px 100px 100px 0px;
  padding: 0px 5px;
  font-weight: 500;
  font-size: 14px;
  line-height: 24px;
  color: #FFF;
  -webkit-transform: translateY(-10px) translateX(5px);
  transform: translateY(-10px) translateX(5px);
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

/* #thoigian {
  width: 150px;
  padding-left: 10px;
  padding-right: 50px;
  text-align: left;
} */

#thoigian span.uk-icon {
  margin-right: 5px;
}

.juperson {
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
}

.jutamtinh {
  font-weight: 500;
  font-size: 17px;
  line-height: 24px;
}

.jutotal {
  font-weight: 600;
  font-size: 32px;
  line-height: 38px;
}

.jutitle {
  font-weight: 600;
  font-size: 20px;
  line-height: 28px;
  color: #124479;
}

p.uk-text-primary {
  font-weight: 500;
  font-size: 17px;
  line-height: 24px;
  color: #272850 !important;
}

#sl_tinhtoan {
  border: 1px solid #FFF;
  background-color: #8A93A6;
  border-radius: 4px;
  padding: 20px;
  width: 558px;
  color: #FFF;
}

#sl_tinhtoan::before {
  content: "";
  position: absolute;
  border: solid transparent;
  border-color: rgba(255, 255, 255, 0);
  border-bottom-color: #8A93A6;
  border-width: 15px;
  top: -15px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

#sl_tinhtoan input {
  background: none;
  border: none;
  text-align: center;
  width: 70px;
  color: #FFF;
}

#sl_tinhtoan span.uk-icon {
  cursor: pointer;
  width: 24px;
  height: 24px;
  background: #FFF;
  color: #A4A6BB;
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border: 1px solid #E4E5F2;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#sl_tinhtoan span.uk-icon:hover {
  border: 1px solid #FF3D3D;
  color: #FF3D3D;
}

#sl_tinhtoan input[type=number]::-webkit-inner-spin-button,
#sl_tinhtoan input[type=number]::-webkit-outer-spin-button {
  opacity: 0;
  display: none;
}

@media(min-width:960px) {
  #soluongnguoi {
    width: 420px;
  }
}

#soluongnguoi {
  max-width: 100%;
  padding-left: 20px;
  text-align: left;
}

#soluongnguoi .uk-icon {
  margin-right: 5px;
}

#soluongnguoi span {
  font-size: 16px;
}

.judiscount {
  font-weight: 500;
  font-size: 18px;
  line-height: 24px;
  text-decoration-line: line-through;
  color: #5F5D81;
}

.juprice {
  font-weight: 600;
  font-size: 32px;
  line-height: 38px;
  color: #ee3902;
}

.price {
  font-weight: 400;
  font-size: 16px;
  line-height: 19px;
  text-decoration-line: line-through;
}

.ju-combo a[rel=tag] {
  color: #FFF !important;
}

.ju-combo .el-item:hover .el-title {
  color: #2069DD;
}

.single-price span.ju-price {
  font-weight: 600;
  font-size: 28px;
  color: #FF3D3D;
}

.single-price span {
  font-size: 16px;
  color: #272850;
  font-weight: 400;
}

.thongtin {
  cursor: pointer;
  /* border:1px solid #333; */
  /* padding:10px; */
  font-weight: bold;
}

.thongtin::after {
  content: "";
  background-image: url('../images/bot.png');
  display: inline-block;
  width: 8px;
  height: 8px;
  background-size: contain;
  background-repeat: no-repeat;
  margin-left: 5px;
}

@media(max-width:960px) {
  #ju_dat_ve>form>.uk-grid {
    flex-direction: column-reverse;
  }

  .uk-navbar {
    min-height: 80px;
    font-size: 20px;
    font-weight: 600;
  }

  .ju_filter_combo {
    padding: 10px 15px;
  }

  .ju_filter_combo .uk-text-center {
    font-size: 20px;
    color: #2069DD;
    font-weight: 600;
    margin-bottom: 25px;
  }

  .ju_filter_combo .uk-list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;

  }

  .ju_filter_combo .uk-list>* {
    margin: 0;
    border-radius: 8px;
    border: 1px solid #A4A6BB;
    padding: 8px 24px;
  }

  .ju_filter_combo .uk-list>*:has(input:checked) {
    border-color: #FF3D3D;
  }

  .ju_filter_combo .uk-list input {
    display: none;
  }

  .ju_filter_combo .uk-list label {
    font-weight: 500;
  }

  .ju_filter_combo .uk-list label:has(input:checked) {
    color: #FF3D3D;
  }

  #tm-dialog-mobile {

    background: linear-gradient(180deg, rgba(0, 168, 121, 0.16) 0%, rgba(0, 168, 121, 0.00) 20%), #FFF;
  }
}

@media(min-width:640px) {

  #dropdiemden .uk-grid-divider>:not(.uk-first-column)::before {
    display: none;
  }
}

@media only screen and (max-width: 640px) {
	h3{
		font-size:28px;
	}
	h4{
		font-size:24px;
	}
	html{
		font-size:16px;
	}

  .mobile-slider {
    height: 150px;
    overflow: hidden;
  }

  s .uk-navbar-toggle-icon svg {
    width: 24px;
    color: #FFF;
  }

  .location+.uk-dropdown ul {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
  }

  .location+.uk-dropdown ul li:nth-child(n+2) {
    margin-top: 0px;
  }


  .single-price span.ju-price {
    font-size: 20px;
  }

  .single-price span {
    font-size: 14px;
    color: #272850;
    font-weight: 400;
  }

  .percen {
    font-size: 14px;
  }

  #ju_dat_ve .uk-h3 {
    font-size: 20px;
  }

  #sl_tinhtoan .uk-grid {
    margin-left: -20px;
  }

  #sl_tinhtoan .uk-grid>* {
    padding-left: 20px;
  }

  #sl_tinhtoan span.uk-icon {
    width: 20px;
    height: 20px;
  }

  #sl_tinhtoan input {
    width: 35px;
    padding: 0;
  }

  #coupon .uk-button {
    padding: 0 15px;
  }

  .uk-grid>:first-child {
    max-width: unset !important;
  }

  .mobile-open.active,
  .mobile-close.active {
    opacity: 1;
    visibility: visible;
  }
}