/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/
:root {
  --cl-main: #E25D05;
  --cl-primary: #056A3A;
}

/* fix khung img */
.c-img {
  position: relative;
  display: block;
}

.c-img img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

/* hover img scale */
.scale-img {
  overflow: hidden;
}

.scale-img img {
  transition: all 0.5s;
}

.scale-img:hover img {
  scale: 1.1;
  transition: all 0.5s;
}

/* hover img flash */
.img__ {
  position: relative;
  overflow: hidden;
}

.img__:hover::after {
  -webkit-animation: shine 0.75s;
  animation: shine 0.75s;
}

.img__::after {
  position: absolute;
  top: 0;
  left: -75%;
  z-index: 2;
  display: block;
  content: "";
  width: 50%;
  height: 100%;
  background: linear-gradient(to right,
      rgba(255, 255, 255, 0) 0%,
      rgba(255, 255, 255, 0.3) 100%);
  transform: skewX(-25deg);
}

@keyframes shine {
  100% {
    left: 125%;
  }
}

/* css modal */
.modal {
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
}

.overlay.active,
.modal.active {
  opacity: 1;
  visibility: visible;
}

.modal {
  transform: translateY(-20px);
}

.modal.active {
  transform: translateY(0);
}

/* end css modal */

.custom-footer .bullet-arrow::before {
  color: #e25d05;
}

.custom-footer .bullet-arrow:hover {
  color: #e25d05;
}

.custom-footer .bullet-arrow a {
  text-decoration: none;
  color: inherit;
  transition: color 0.3s ease;
}

.bg_title {
  background-image: linear-gradient(198.39018889872deg,
      #686864 0%,
      #242222 100%);
}

.txt_white .woocommerce-Price-amount.amount {
  color: #fff !important;
}

.list_tour_home .product-title a:hover {
  color: #ff8b38;
  transition: all 0.3s ease;
}

.css_form_billing {
  display: flex;
  flex-wrap: wrap;
  margin: -1rem;
}

.css_form_billing>p {
  width: 50%;
  padding: 1rem;
}

.css_txt_note label {
  color: #fff;
}

.css_form_billing>p label {
  color: #fff;
}

#reviews {
  display: none;
}

.product .product-footer #reviews {
  display: flex;
}

.img_gift .product-small .box-image img {
  border-radius: 3%;
  overflow: hidden;
}

.single_add_to_cart_button {
  background-color: #216834 !important;
}

.css_color_price {
  color: #fff !important;
}

.woocommerce-order-details .woocommerce-Price-amount.amount {
  color: #fff !important;
}

.item_rent_bike img {
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 3%;
}

.flickity-page-dots .dot.is-selected {
  background: #216834;
}

.flickity-page-dots .dot {
  height: 8px !important;
  width: 8px !important;
}

html,
body {
  scroll-behavior: smooth;
}

.container {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-right: 1rem;
  padding-left: 1rem;
}

.list_social_new {
  position: fixed;
  bottom: 4rem;
  right: 1.25rem;
  z-index: 10;
  width: 50px !important;
}

#footer a:hover {
  color: #e25d05 !important;
  transition: all 0.3s ease;
}

.icon_whatsapp img {
  width: 3rem;
  height: 3rem;
}

.section_home_pro .content_tour,
.section_home_bike .content_bike {
  display: block !important;
  visibility: visible !important;
}

.home_faqs .accordion-item a {
  border: none;
  padding: 1rem 2rem;
}

.home_faqs .accordion-item a button {
  right: 0;
  left: unset;
}

.menu_footer .ux-menu-link a {
  border: none;
}

.menu_footer .ux-menu-link--active a {
  color: unset;
}

.menu_footer .ux-menu-link:hover a {
  color: #878787;
}

.home_news .post-item .post-title {
  font-weight: bold;
  margin-bottom: 0.5rem;
}

.section-title-container .section-title {
  font-weight: bold;
}

.rent_bike_page_list_bike .badge-container {
  right: 1rem;
  left: unset;
}

.rent_bike_page_list_bike .badge-container .badge-inner {
  padding: 0.5rem 1rem;
  border-radius: unset;
  background: #f59422;
}

.rent_bike_page_list_bike .title_bike_page {
  display: inline-flex;
}

.rent_bike_page_list_bike .content_bike_by {
  display: block !important;
  visibility: visible !important;
  border-bottom: 1px solid #333;
}

.rent_bike_page_list_bike .content_bike_price {
  display: block !important;
  visibility: visible !important;
}

.rent_bike_page_list_bike .content_bike_price .btn_book_now,
.content_bike .btn_book_now {
  border: 1px solid #333;
  padding: 0.5rem 1rem;
  border-radius: 2rem;
  color: #fff;
  background: #333;
}

.rent_bike_page_list_bike .content_bike_by .content_text_bike_by {
  background: #808080;
  padding: 0.5rem 0.625rem;
  color: #fff;
}

.rent_bike_page_list_bike .title_bike_page::before {
  content: "";
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  background-image: url(../wp-content/themes/flatsome/assets/img/motorcycle.svg);
  background-repeat: no-repeat;
  background-size: contain;
  margin-right: 0.25rem;
}

.home_news .post-item .is-divider {
  display: none;
}

.section_home_bike .content_bike hr {
  border-bottom: 3px solid #056a3a;
  opacity: 1;
}

.section_home_pro .product-title a,
.section_home_bike .product-title a {
  font-weight: 600;
  color: #056a3a;
  text-align: center;
}

.section_home_pro .product-small {
  /* 		    border: 1px solid #056a3a; */
  border-radius: 5px;
  overflow: hidden;
}

.list_tour_home .box-text {
  padding: 1rem;
}

.content_tour .btn_view_tour {
  border: 2px solid #056a3a;
  padding: 0.5rem 1rem;
  border-radius: 2rem;
  transition: all 0.3s ease;
}

.content_tour .btn_view_tour:hover {
  background: #056a3a;
  color: #fff;
  transition: all 0.3s ease;
}

.content_tour .btn_book_tour_now {
  border: 2px solid #056a3a;
  padding: 0.5rem 1rem;
  border-radius: 2rem;
  background: #056a3a;
  color: #fff;
  transition: all 0.3s ease;
}

.content_tour .btn_book_tour_now:hover {
  background: #fff;
  color: #056a3a;
  transition: all 0.3s ease;
}

.mx-auto {
  margin-left: auto !important;
  margin-right: auto !important;
}

.mt-4 {
  margin-top: 1rem;
}

.block {
  display: block;
}

.btn_send {
  margin: 0 auto !important;
  display: block;
  background: #E25D05 !important;
  border-radius: 2rem !important;
  text-transform: uppercase !important;
  border: 2px solid #fff !important;
}

.product-info .woocommerce-breadcrumb {
  display: none;
}

.btn_send:hover {
  background: #d45300 !important;
  color: #ffffff !important;
  transition: all 0.3s;
}

.w-fit {
  width: -moz-fit-content;
  width: fit-content !important;
}

.rounded-full {
  border-radius: 9999px !important;
}

.border {
  border-width: 1px;
}

.c-img {
  position: relative;

  display: block;
}

.c-img img {
  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;
}

.border-white {
  --tw-border-opacity: 1;
  border-color: rgb(255 255 255 / var(--tw-border-opacity));
}

.bg-cl-s2 {
  --tw-bg-opacity: 1;
  background-color: rgb(128 128 128 / var(--tw-bg-opacity)) !important;
}

.px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

.btn_contact {
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
}

.font-bold {
  font-weight: 700;
}

.uppercase {
  text-transform: uppercase;
}

.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.transition-all {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.duration-300 {
  transition-duration: 300ms;
}

.btn_contact:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}

.btn_contact:hover {
  --tw-text-opacity: 1;
  color: rgb(128 128 128 / var(--tw-text-opacity));
}

.faq_dark .accordion-title.active,
.faq_dark .accordion-title:hover {
  color: #fff !important;
}

.form_contact_page .form_contact {
  max-width: 100% !important;
  margin: 0;
}

.section-content p {
  margin-bottom: 0;
}

.mb-5 {
  margin-bottom: 1.25rem;
}

.bg_gradient_orange {
  background-image: linear-gradient(198.39018889872deg,
      #f6aa1c 0%,
      #c01900 100%);
}

.btn_submit p {
  display: flex;
}

.wpcf7-response-output {
  color: #fff !important;
}

.btn_submit .wpcf7-spinner {
  display: contents !important;
}

.btn_submit input {
  border: 1px solid;
}

.text-\[1\.25rem\] {
  font-size: 1.25rem;
}

.p-2 {
  padding: 0.5rem;
}

.w-full {
  width: 100%;
}

.block {
  display: block;
}

.mb-3 {
  margin-bottom: 0.75rem;
}

.text-\[\#666666\] {
  --tw-text-opacity: 1;
  color: rgb(102 102 102 / var(--tw-text-opacity));
}

.ml-auto {
  margin-left: auto;
}

.cs-mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.cs-mb-3 {
  margin-bottom: 0.75rem;
}

.cs-mr-3 {
  margin-right: 0.75rem;
}

.cs-flex {
  display: flex;
}

.cs-w-\[30\%\] {
  width: 30%;
}

.cs-w-\[70\%\] {
  width: 70%;
}

.cs-w-full {
  width: 100%;
}

.cs-flex-wrap {
  flex-wrap: wrap;
}

.cs-items-center {
  align-items: center;
}

.cs-gap-4 {
  gap: 1rem;
}

.cs-border {
  border-width: 1px;
}

.cs-border-r {
  border-right-width: 1px;
}

.cs-border-b {
  border-bottom-width: 1px;
}

.cs-border-\[\#b1aeae\] {
  --tw-border-opacity: 1;
  border-color: rgb(177 174 174 / var(--tw-border-opacity, 1));
}

.cs-border-r-\[\#b1aeae\] {
  --tw-border-opacity: 1;
  border-right-color: rgb(177 174 174 / var(--tw-border-opacity, 1));
}

.cs-bg-black {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
}

.cs-bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.cs-px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.cs-py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.cs-text-center {
  text-align: center;
}

.cs-text-right {
  text-align: right;
}

.cs-text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}

.cs-font-bold {
  font-weight: 700;
}

.cs-text-black {
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.cs-text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.cs-text-\[\#ffd8a9\] {
  --tw-text-opacity: 1;
  color: rgb(255 216 169 / var(--tw-text-opacity, 1));
}

.woocommerce-order-details table.order_details td,
.woocommerce-order-details table.order_details th {
  border: 3px solid #fff !important;
  padding: 0.5rem !important;
}

header .header-main {
  background-color: #fff;
}

.single-page .post-categories {
  display: flex;
  align-items: center;
}

.ui-datepicker-title {
  display: flex;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
  top: 50%;
  transform: translateY(-50%);
}


#tour_date {
  padding-right: 2.5rem;
  margin-bottom: 0;
}

.cus_data .icon_calendar {
  width: 20px;
  height: 20px;
  top: 50%;
  right: 1.5rem;
  transform: translateY(-50%);
}

.custom_error_message {
  padding: .5rem !important;
  border: 1px solid #333 !important;
  border-radius: 5px !important;
  background: #fff !important;
  z-index: 1 !important;
}

.custom_error_message::before {
  content: '';
  position: absolute;
  top: -6px;
  /* Đặt mũi tên ngay trên khối error */
  left: 10px;
  /* Căn chỉnh mũi tên */
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #d32f2f;
  /* Màu viền mũi tên khớp với border */
}

.custom_error_message::after {
  content: '';
  position: absolute;
  top: -5px;
  /* Lớp nền trắng để che viền đỏ, tạo mũi tên đẹp hơn */
  left: 10px;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #fff;
}

.item_price_motorbike_rental {
  background-color: rgb(231, 222, 221);
  padding: 20px;
  border-radius: 7px;
}

.text-red-500 {
  color: #c01900;
}

.m-0 {
  margin: 0 !important;
}

.bg-\[\#E25D05\] {
  background-color: #E25D05;
}

.btn_popup_booking {
  width: 50px;
  height: 50px;
  padding: 0;
}

.text-green-500 {
  color: #15803d;
}

.mr-2 {
  margin-right: 0.5rem;
}

.SwiperTour-pagination .swiper-pagination-bullet-active {
  background: var(--cl-main) !important;
}

.content-itinerary h1,
.content-itinerary h2,
.content-itinerary h3,
.content-itinerary h4,
.content-itinerary h5,
.content-itinerary h6 {
  color: var(--cl-main);
}

/* Icon cho content_include và content_not_include */
.content_include ul li {
  position: relative;
  padding-left: 2rem;
  list-style: none;
}

.content_include ul li::before {
  content: "\f058";
  /* Font Awesome check-circle icon */
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  left: 0;
  top: 0;
  color: #28a745;
  /* Màu xanh cho check */
  font-size: 1.2rem;
}

.content_not_include ul li {
  position: relative;
  padding-left: 2rem;
  list-style: none;
}

.content_not_include ul li::before {
  content: "\f057";
  /* Font Awesome times-circle icon */
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  left: 0;
  top: 0;
  color: #dc3545;
  /* Màu đỏ cho times */
  font-size: 1.2rem;
}

section:has(.modal_learn_more) {
  z-index: 1200;
}

.flatpickr-current-month {
  display: flex !important;
}

.header-block {
  width: fit-content !important;
}

.gt_float_switcher {
  box-shadow: none !important;
}

.tab-content {
  display: none;
}

.tab-content.active {
  display: block;
}

.mbp-0 p {
  margin-bottom: 0 !important;
}

.box_info_bus {
  border: 1px solid #E7E7E7;
  border-radius: 1.25rem;
  margin-bottom: 1rem;
  ;
}

@media (min-width: 1024px) {
  .lg\:cs-mb-6 {
    margin-bottom: 1.5rem;
  }

  .lg\:cs-w-1\/2 {
    width: 50%;
  }

  .lg\:cs-max-w-\[60\%\] {
    max-width: 60%;
  }
}

@media (min-width: 576px) {
  .sm\:mt-8 {
    margin-top: 2rem;
  }

  .sm\:mb-6 {
    margin-bottom: 1.5rem;
  }
}

@media (max-width: 767px) {
  .small-columns-1 .flickity-slider .col {
    width: 85% !important;
  }

  /* .custom_gallery .gallery-col.col{
    padding: 0 1.5rem!important;
  } */
}

@media (min-width: 768px) {
  .form_contact {
    max-width: 60%;
  }

  .md\:max-w-\[60\%\] {
    max-width: 60%;
  }

  .md\:mb-8 {
    margin-bottom: 2rem;
  }

  .md\:text-\[2\.5rem\] {
    font-size: 2.5rem;
  }

  .md\:ml-auto {
    margin-left: auto;
  }
}